Este Projeto aborda tecnologias como React, Styled Components, NextJS, State, Formulários, Hooks, HTTP, GraphQL, BFF, AJAX, Login e JWT. Usando o Create Next App, você aprenderá a criar componentes com React e usar o styled-components para lidar com a camada de estilo. Além disso, você aprenderá sobre o uso do state do React, o protocolo HTTP e como consumir a API do Github. A aula de GraphQL ensina como consumir dados com queries GraphQL e protegê-los com BFF. No final do bootcamp, você aprenderá a criar uma página de login, usando rotas e autenticação com JWT.
- Conhecimento em React, framework de desenvolvimento de interfaces de usuário;
- Conhecimento em styled-components, biblioteca para estilização de componentes no React;
- Conhecimento em NextJS, framework para desenvolvimento de aplicações do tipo Single Page Application (SPA);
- Conhecimento em GraphQL, linguagem de consulta a APIs;
- Conhecimento em DatoCMS, sistema de gestão de conteúdo;
- Conhecimento em HTTP, protocolo de transferência de hipertexto;
- Conhecimento em JWT, padrão de autenticação de tokens;
- Conhecimento em Promises, conceito de programação assíncrona;
- Conhecimento em fetch, biblioteca para requisições HTTP;
- Conhecimento em uso de hooks, conceito de gerenciamento de estado em React;
- Conhecimento em roteamento, navegação entre as páginas de uma aplicação;
- Conhecimento em formulários, elementos HTML para coleta de dados do usuário.
Nesta primeira aula de React começamos a fazer o nosso perfil no Alurakut! E colocamos ele no ar!
Nesta aula já usamos Create Next App para iniciar nosso projeto e styled-components para cuidar da camada de estilo da nossa aplicação, duas ferramentas essenciais do mundo React. Também entendemos como React se tornou tão popular no mercado de tecnologia e como iniciaremos o nosso aprendizado com a tecnologia.
- Iniciando um projeto com Create Next App;
- Criamos components com React usando styled-components;
- Organizamos as pastas do nosso projeto;
- Passamos propriedades para components;
- Fizemos deploy do seu Alurakut na Vercel.
Nesta aula aprendemos a lidar com o state do React e entender melhor o que é uma SPA (Single Page Application), além de dar mais vida para nosso perfil consumindo a api do github para popular nossos amigos!
- Entender melhor o que é um SPA;
- Conhecer o hook useEffect;
- Criação do formulário para cadastrar comunidade;
- E sempre faremos deploy do seu Alurakut na Vercel.
Nesta aula usamos a API do GitHub para preencher os nossos amigos e salvamos as nossas comunidades com o DatoCMS
- Entendemos um pouco melhor sobre como funciona o protocolo HTTP;
- Consumimos a API do Github usando
fetchpara preencher os nossos amigos; - Conhecemos Promises e como lidar com o JSON;
- Usamos o hook useEffect para lidar com código assíncrono;
- Conhecemos o DatoCMS, o sistema de gestão de conteúdo que iremos utilizar na nossa aplicação;
- Criamos os modelos dos conteúdos que iremos gerenciar no DatoCMS;
- Criaamos as nossas comunidades pela interface do DatoCMS.
Nesta aula usamos GraphQL para consumir nossos dados e salvamos nossos dados no DatoCMS pela nossa interface do Alurakut.
- Entendemos o que é XML e AJAX;
- Usamos queries GraphQL para consumir os dados do DatoCMS;
- Fizemos um BFF (Back-end For Front-end) para proteger nossos dados ao enviar dados para o servidor;
- Criaamos nossas comunidades pela interface do nosso Alurakut.
Pra fechar nosso projeto, aprendemos a lógica de como trabalhar com login.
- Criaamos a nossa página de Login;
- Roteamento com Next.js;
- Como funciona o redirecionamento de páginas;
- Formulários com gerenciamento do estado do input;
- Salvamos cookies com o padrão JWT para autenticar nossa página;
- Decodificar o nosso token para mostrar a nossa Home apenas para usuários autenticados;
Esta aplicação foi hospedada no Vercel, uma plataforma de hospedagem de aplicações web altamente escalável e confiável. Com o Vercel, você pode ter a certeza de que sua aplicação estará disponível 24/7 para todos os seus usuários, oferecendo uma experiência rápida e suave. Além disso, a integração com outras ferramentas como Git, permite um processo de desenvolvimento e publicação fácil e eficiente. Nós escolhemos o Vercel para hospedar nossa aplicação porque acreditamos que oferece a melhor experiência para nossos usuários.
Acesso o Link e confira: https://alurakut-nine-eta.vercel.app/login
Obrigado por conferir meu repository! É muito gratificante saber que alguém está interessado no meu trabalho. Se você gostou do que viu, deixar um star seria uma grande ajuda no meu crescimento e me motivaria a continuar fazendo projetos. O apoio de pessoas como você é fundamental para que eu possa seguir evoluindo e produzindo conteúdos cada vez melhores. Obrigado mais uma vez e espero que você possa acompanhar meus futuros projetos!