Módulo 05: Área autenticada e gerenciador de conteúdo (CMS)

Nesse módulo, entenderemos o que é M da JAMStack e criaremos o CMS para o Instalura, usando o DatoCMS dessa forma teremos como deixar nossa aplicação consultar dados de um backend simples de configurar e utilizar. Também vamos entender como funciona buscas no GraphQL, já que o DatoCMS utiliza esse padrão de APIs para comunicação cliente-servidor.. Além disso, faremos um modo de preview do conteúdo, e como adicionar tudo isso no build do Next.

Para finalizar, iremos trabalhar na área da aplicação onde exige autenticação e entenderemos a diferença entre JWT e dos cookies.

Módulo 04: Testes com Cypress, Jest e React Testing Library

Prosseguiremos adicionando novas funcionalidades no Instalura, agora com a página de Login entenderemos mais a fundo qual a responsabilidade do front=end em manter as informações seguras e aprenderemos como utilizar Tokens JWT para garantir acesso a recursos privados do servidor. Com o crescimento da complexidade do projeto, testes manuais causam lentidão e não evitam totalmente que falhas ocorram. Portanto, vamos aprender sobre testes automatizados para garantir a qualidade das funcionalidades usando o Cypress para testar a integração, React Testing Library para os componentes e Jest para o código JS mais simples.Também adicionaremos o mecanismo de testes ao padrão de qualidade do ESLint e a integração contínua do projeto.

Módulo 03: Se aprofundando no NextJS

Nesse módulo vamos criar a página de dúvidas do Instalura o FAQ, e trabalhar com alguns ajustes essenciais de SEO (Search Engine Optimization), além de entender como funciona a navegação em uma SPA. Também utilizaremos uma API para obter dados de um servidor e entender como componentes tratam side effects com o hook useEffect. Também utilizaremos um recurso incrível do Next.js, a função getStaticProps que serve para gerar páginas estáticas, de maneira dinâmica. Finalizaremos entendendo um pouco mais como modificamos Headers de requisições, dicas de segurança e performance com Next e Vercel.

Módulo 02: State e Forms + boas práticas de Git e GitHub

Para nos aprofundarmos ainda mais nesse mar que é o React criaremos um formulário com feedbacks animados com Framer Motion e Lottie. Para isso, veremos como manipular estados de um formulário e como isso dá vida à aplicação que estamos criando. Uma prática adotada pelo mercado ao trabalhar com Git é utilizar feature branches, por isso, aqui aprenderemos como organizar nosso repositório seguindo essa prática.

Com a feature pronta, entenderemos um pouco sobre Continuous Integration (CI) e Continuous Deployment (CD) e a importância de manter consistência automatizada, mergulhando em diversas ferramentas, como o Github Actions, e detalhes para criar um projeto profissional.

Módulo 01: JAMStack e layout com React

m1

Remove duplicate use of GlobalStyle component