Curso de React JS 19 e Next.js 15 (atualizado para 2025)

Ótimo, parece que você está seguindo um caminho abrangente que combina o back-end com Strapi, o front-end com Next.js e a autenticação de usuários, além de revisar conceitos fundamentais de HTML, CSS e JavaScript/TypeScript. Vou destacar alguns pontos importantes de cada seção para que você tenha uma visão clara do que está por vir e como preparar-se para cada etapa.

Seção 13: GraphQL Queries com Strapi

• Instale as dependências necessárias para usar o GraphQL com Strapi (strapi-graphql, graphql, etc.).
• Crie e teste suas queries (consultas) para recuperar dados do seu blog, como postagens, categorias, etc.

Seção 14: Projeto 2: Blog - Front-end com Next.js (e React)

• Revise os conceitos básicos de React e Next.js se necessário.
• Aprecie a criação de componentes reutilizáveis e o uso do Storybook para documentação visual dos componentes.
• Implemente as rotas do Next.js para os diferentes tipos de páginas do seu blog (lista de postagens, detalhes de uma postagem, etc.).

Seção 15: Autenticação de usuários com Strapi

• Entenda como implementar a autenticação no back-end com JWT Tokens e Cookies seguros.
• Aprecie sobre as melhores práticas para proteger contra CSRF e XSS.

Seção 16: GraphQL Mutations com Strapi

• Aprecie a criação de mutations para operações que alteram os dados, como criar, atualizar ou deletar postagens no Strapi.
• Teste essas mutations usando ferramentas como Postman ou Insomnia.

Seção 17: Autenticação de usuários com Next.js e NextAuth.js

• Aprecie a configuração do NextAuth.js para gerenciar a autenticação no front-end, sincronizando o token do usuário com o Strapi.
• Implemente a lógica de login e logout, mantendo as sessões seguras em todos os requisições do navegador.

Seções Bônus

• HTML5 e CSS3 (Para iniciantes): Se você não tem experiência anterior com HTML e CSS, esta seção é essencial para entender a base sobre as quais você construirá suas aplicações web.

• Landing Page com HTML5 e CSS3: Com o conhecimento básico de HTML e CSS, você criará uma landing page visualmente atraente e aplicará o que aprendeu sobre semântica e estilização responsiva.

• JavaScript Essencial: Esteja preparado para revisar conceitos importantes do JavaScript que serão fundamentais para o funcionamento dos seus projetos React e Next.js.

• TypeScript Essencial: Se você decidir incorporar TypeScript em seu fluxo de desenvolvimento, esta seção irá ajudá-lo a escrever código mais robusto e com menos erros de tipo.

Para cada uma dessas etapas, é importante que você mantenha um repositório de código junto à sua progressão, pratique regularmente e teste suas implementações constantemente. Lembre-se de que a prática constante e a construção de projetos reais são as melhores formas de consolidar o seu conhecimento e habilidades. Boa sorte!