Tutorial sobre a configuração do ambiente de desenvolvimento
Olá, alunos! No módulo anterior, aprendemos sobre a visão geral do React, Importância e uso no desenvolvimento web e os principais conceitos e terminologia do React.
Nesse tópico, vamos aprender como configurar o ambiente de desenvolvimento para criar aplicações React.
Requisitos
Para configurar o ambiente de desenvolvimento para o React, você precisará do seguinte:
- Um computador com sistema operacional Windows, macOS ou Linux
- Um editor de texto ou IDE (Integrated Development Environment)
- Um gerenciador de pacotes, como o npm ou o yarn
Instalando o Node.js e o npm
O Node.js é uma plataforma JavaScript de código aberto que permite executar JavaScript fora do navegador.
O npm é um gerenciador de pacotes para o Node.js.
Para instalar o Node.js e o npm, siga estas etapas:
- Acesse o site do Node.js e baixe o instalador para o seu sistema operacional.
- Execute o instalador e siga as instruções na tela.
Após a instalação, você poderá verificar se o Node.js e o npm estão instalados executando os seguintes comandos no terminal:
node -v
Este comando deve retornar a versão do Node.js instalada.
npm -v
Este comando deve retornar a versão do npm instalada.
Instalando o React
O React pode ser instalado usando o npm ou o yarn.
Para instalar o React usando o npm, execute o seguinte comando no terminal:
npm install react
Para instalar o React usando o yarn, execute o seguinte comando no terminal:
yarn add react
Após a instalação, você poderá verificar se o React está instalado executando o seguinte comando no terminal:
npm list --depth 0 | grep react
Este comando deve retornar o pacote react
.
Criando um projeto React
Para criar um projeto React, você pode usar o comando create-react-app
.
Este comando criará um novo projeto React com todos os arquivos e dependências necessários.
Para criar um projeto React usando o create-react-app
, execute o seguinte comando no terminal:**
npx create-react-app my-app
Este comando criará um novo diretório chamado my-app
com todos os arquivos e dependências necessários.
Para iniciar o projeto, navegue até o diretório my-app
e execute o seguinte comando:
npm start
Este comando iniciará o servidor de desenvolvimento do React e abrirá o aplicativo no navegador.
Conclusão
Neste aula, você aprendeu como configurar o ambiente de desenvolvimento para criar aplicações React.
Agora, você pode começar a criar seus próprios aplicativos React.