Introdução ao Next.js 15

Com esse workshop você irá aprender Next.js mesmo se não conhecer nada do framework! Vamos em todo o workshop utilizar uma única aplicação de *job board* (que se chamará CodanteVagas) e que será completamente feita com `Next.Js`. Se você não consegue esperar, já pode ir olhando no nosso Figma para ver a aplicação que será construída. O [link é esse](https://www.figma.com/proto/bzOxaC7cA5Y69VnWYAqApP/Next-Intro?node-id=0-1&t=slBzPJ9qdsYMwiyh-1). Os principais tópicos que iremos ver são: ## 01. Setup de um Projeto `Next.js` - O que é o `Next.js` - Por que `Next.js` - Apresentando o CodanteVagas - Criando o projeto `Next.js` - A estrutura de pastas de um projeto `Next.js` - Como importar um script JS puro no `Next.js`? - O que é o `turbopack`? ## 02. Roteamento no `Next.js` - Roteamento com a pasta `app`. - Como era antes? - Os nomes *reservados* do roteamento no `Next.js`. - Criando as páginas do *CodanteVagas* - Home Page - Página de About/Sobre - Página de Vagas - Página de Vaga Individual - Página de Cadastro de Vagas ## 03. Estilização - TailwindCSS - Usando uma biblioteca de componentes: `shadcn/ui`. - E CSS Puro? ## 04. Componentes do `Next.js` - next/image - next/font - next/script - next/meta ## 05. A teoria dos Server Components do React - `use client` vs `use server` - Componente Cliente vs Componente de Servidor - Fetch de dados - *cliente* vs *servidor* - Server Actions - Hooks auxiliares ## 06. Fetch de Dados - Página de vagas - Listando as vagas conectando com a API ## 07. Formulário e Server Actions - Criando o Formulário - Server Actions para enviar o formulário - Erros e validação ## 08. Responsividade da nossa aplicação - Vamos ajustar tudo para ficar responsivo. ## 09. Finalização