Nik Faraday

Вместо AddPolicy(...) используйте AddDefaultPolicy, а так же просто app.UseCors()

Попробуйте вот так:

import { useState, useRef, forwardRef } from "react";
import "./ScrollToNextSection.css";

const ScrollToNextSection = forwardRef(({ visibleSection }, ref) => {
  const scrollToSection = () => {
    const currentIndex = ref.current.findIndex(
      (sectionRef) => sectionRef && sectionRef.id === visibleSection
    );
    const nextSection = ref.current[currentIndex + 1];

    if (nextSection) {
      nextSection.scrollIntoView({ behavior: "smooth" });
    } else if (ref.current[0]) {
      ref.current[0].scrollIntoView({ behavior: "smooth" });
    }
  };

  return (
    <button onClick={scrollToSection} className="scroll-btn">
      Вниз
    </button>
  );
});

export default ScrollToNextSection;

Вот сюда копайте

Для генерации можете использовать этот QR Code Generator (Я его не пробовал, по этому не знаю что там к чему).
Для UI по QR кодам можете использовать QRCode от Ant Design

Лично я, когда учил это, просто задавал интересующие меня вопросы ChatGPT. Сначала прошёл по теории, дале по примерам кода, далее сам сделал.

Ну вообще, я уже знаю наверняка, какой вопрос сам может интересовать.

Во-первых, токены можно храниться в localStorage.
Во-вторых, токены отправляются в header'е Bearer {Token}

Это не то что бы нормальная практика, это стандарт. Почему? Потому что (Согласно документации) элементы, которые доступны в папке public являются общедоступными, а тут я что-то сомневаюсь, что фотографии у вас являются часть бизнес-логики)

ЕСЛИ я не ошибаюсь, знак тильды используется в стеке asp.net, где этот знак указывает на корневую папку в проекте. Я не уверен, что в вашем случае так можно сделать, по крайней мере, в реакте.