Aprenda NextJS, GraphQL/GraphCMS e Leaflet na prática!

Newerton Vargas de Araujo
3 min readOct 6, 2022

--

Aprenda NextJS, GraphQL/GraphCMS e Leaflet na prática!

Crie um mapa totalmente interativo com um CMS integrado em poucas horas!

No dia 05/10/2022 o Willian Justen publicou no Linkedin que esse curso da Udemy “Aprenda NextJS, GraphQL/GraphCMS e Leaflet na prática!”, está totalmente gratuito no canal dele no Youtube.

Está todos os vídeos e link do repositório, totalmente grátis.

Quem é Willian Justen de Vasconcellos?

Ele é Software Engineer e um grande influenciador do Brasil com Github Star, é um programa de reconhecimento do GitHub, onde você pode indicar até três pessoas devs que você considera que impactam o mundo compartilhando conhecimento, trazendo soluções, inspirando e ajudando outras pessoas a aprimorarem suas habilidades, que fomentam e apoiam as comunidades e projetos

O que você aprenderá

  • Boas práticas com ReactJS
  • Criação de um Boilerplate do zero
  • Configurar Eslint
  • Configurar Prettier
  • Conceitos do NextJS
  • Funcionamento do _app
  • Funcionamento do _document
  • Rotas simples e dinâmicas
  • Link e useRouter
  • Usando dynamic import do NextJS
  • Novo componente do Next Image
  • Funcionamento do GraphQL
  • Criação de Schema
  • Criar APIs rapidamente
  • Geração de Types para GraphQL
  • Como criar mapas com Leaflet
  • Customizar mapas com MapBox
  • Server Side Rendering (SSR)
  • Static Site Generation (SSG)
  • Incremental Static Generation (ISR)
  • Deploy automatizado na Vercel

Sobre o curso

Iremos construir um mapa totalmente interativo utilizando a fantástica biblioteca do Leaflet.

Cada ponto no mapa será gerenciado através de um CMS na cloud chamado GraphCMS e iremos utilizar o NextJS para criar a melhor experiência para o usuário e também para você, desenvolvedor!

Para fazer tudo isso, nós iremos ensinar todos os fundamentos das ferramentas da teoria à prática, sem deixar nenhum detalhe para trás.

Propósito do curso

Esse é um curso mais rápido e mais focado com o objetivo de que você aprenda as principais características e funcionalidades do NextJS e GraphQL para que já possa criar diversos projetos já ao final do curso.

Todo o curso será lançado em sua totalidade já no primeiro dia, assim você já pode sair aprendendo tudo que precisa. Por ser um curso menor, também terá um custo bem menor, com objetivo de facilitar o acesso a todos.

NextJS, GraphCMS e Leaflet

Já com nosso boilerplate pronto, iremos aprender a usar soluções third-party como o Leaflet. Criaremos nossos dados no GraphCMS e iremos integrar o GraphQL no projeto do Next. Aprenderemos a criar rotas simples, rotas dinâmicas, utilizar tanto Link quanto useRouter para mudar rotas. Também vamos aprender a gerar estáticos da melhor e mais eficaz maneira no NextJS, além de aprender todos os conceitos mais importantes desse incrível framework.

Ao final, ainda vamos aprender mais sobre o revalidate e também como fazer o deploy para produção utilizando a Vercel.

Playlist

ATENÇÃO: por se tratar de um conteúdo mais antigo alguns links podem estar desatualizados, assim como algumas bibliotecas necessitem de mudanças. Tome isso como uma oportunidade para aprender ainda mais e também ajudar a comunidade, se achar algo que precisa mudar, deixe nos comentários!

--

--

Newerton Vargas de Araujo

Software Enginner | Next.js | NestJs | React Native | Flutter | DevOps