Módulo Progresso
0% Concluído
Nesta aula, vamos dar o primeiro passo prático em nossa jornada com React, criando nosso primeiro projeto. Seguiremos as recomendações oficiais do React e utilizaremos o framework Next.js para facilitar nosso trabalho.
Criando o Projeto
- Abra o VSCode e Crie uma pasta com o nome do seu projeto.
- No terminal do VSCode digite o comando
npx create-next-app@latest
e pressioneEnter
. - Aguarde enquanto o Next.js cria um novo projeto para você.
Explorando o Projeto
- Uma vez criado, navegue até o diretório do seu novo projeto usando o comando
cd nome-do-projeto
. - Abra o projeto no Visual Studio Code ou no editor de código de sua escolha.
- Explore a estrutura de diretórios e observe os arquivos básicos como
pages/index.js
, que é a página principal do seu aplicativo. - Também note outros arquivos e diretórios importantes como
public
,styles
, epackage.json
, que são fundamentais para o funcionamento do seu aplicativo Next.js.
Executando o Projeto Inicial
- No terminal, enquanto estiver no diretório do projeto, execute o comando
npm run dev
. - Abra seu navegador web e digite a URL
http://localhost:3000
. - Você deverá ver a página inicial do seu projeto Next.js, confirmando que a criação e execução do projeto foram bem-sucedidas.
Com o nosso primeiro projeto React criado, estamos prontos para começar a explorar o poder do React e do Next.js nas próximas aulas. Na próxima aula, vamos começar a trabalhar com nosso projeto, criando nosso primeiro componente React!