A ideia da aplicação é ser uma página de avalição simples.
- Criado com npm create vite@latest
- CSS puro
- Array criado utilizando o usestate. Cada estrela tem um número e um boolean (verdadeiro ou falso), iniciando com false.
- Quando o usuário clica em uma estrela a função handleSelected é chamada.
- Dentro da função handleSelected, pegamos a lista de estrelas/notas atual e a armazenamos na variável prevStarItem.
- Depois é utilizado o método map para percorrer cada estrela da lista e verificar se o número da estrela é igual ao número da estrela clicada. Se o número da estrela clicada for igual ao número de uma das estrelas da lista, a selecionada é alterada de false (estado inicial) para true.
- Após isso, setStarItem é usado para atualizar o array de acordo com a ação do usuário e componente é renderizado novamente mostrando as estrelas com a informação de selecionado correta.
Clone o respositório com:
git clone https://github.com/flavialbraz/rating-react-app.git
Para a aplicação funcionar entre na pasta avalie-tutor e utilize o comando abaixo para instalar as dependencias
npm install
Após isso rode a aplicação com o comando:
npm run dev
Para rodar o servidor entre na pasta server e instale as dependecias com:
npm install
Após isso rode o servidor com o seguinte comando:
nodemon server.js
A aplicação deve funcionar normalmente na em: http://127.0.0.1:5173/
Flavia Braz |