Gympoint

Desafio Final Rocketseat GoStack ReactJS

Características do software

Funcionalidades

• Login.
• Logout.
• Registro de administrador.
• CRUD de Alunos, Planos e Matrículas.
• Listagem e Resposta de Perguntas à Alunos.
• Paginação.
• Header com navegação.
• Feedback com toasts.
• Botão Sanduíche para telas pequenas.

Tecnologias principais

• Redux.
• Redux-saga.
• Somente Functional Components.
• Utilização de React Hooks.
• Componente de Modal.
• Axios para requisições.
• Integrado ao backend Gympoint em Node.js.
• Prettier, EditorConfig e Prettier para estilizações de código.
• Utilização de bibliotecas de datas, date-fns, react-datepicker.
• Redux persist.
• Yup para validação de schemas.
• Unform para criação de formulários.

Execução

Clone e execute em um terminal o backend da aplicação.

Crie um arquivo .env.

cp .env-example .env

Adicione o seu ip no arquivo criado.

Local

Instale as dependências do projeto.

yarn

Execute a aplicação.

yarn start

Em outro terminal, execute o cypress para executar os testes. É necessário que tenham sido executadas as seeds no backend para o login na aplicação.

yarn cypress

Isto irá abrir uma janela, clique em seguida em Run all specs e veja a mágica acontecer.

Docker

Instale a extensão do VSCode Remote - Containers.

No VSCode use o atalho CMD/CTRL + Shift + P e selecione a opção Remote-Container: Reopen in Container.

Isto irá abir uma nova janela do Visual Studio Code e vai demorar alguns minutos para configurar o container.

Após isso, abra o terminal no Visual Studio Code com CMD/CTRL + Shift + `

Execute a aplicação.

yarn start

Abra o navegador em localhost:3000

Execute os testes com cypress no Electron, um navegador headless.

yarn cypresscontainer

Caso necessário instale o cypress no container.

./node_modules/.bin/cypress install

Tutorial de apoio

Imagens

Login e logout

Listagem

Editar

Respostas a alunos

Sanduíche