Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Aprenda Organizando a Estrutura de Pastas do Projeto | Estruturando Projetos React do Mundo Real
Domínio do React

bookOrganizando a Estrutura de Pastas do Projeto

Etapa 3: Criar a pasta do projeto

Agora que temos todas as ferramentas externas necessárias, podemos começar a criar o projeto. A tarefa é criar uma nova pasta vazia especificamente para o projeto, onde nada mais será armazenado.

Passos a seguir:

  1. Escolher um local: Selecione um local em sua máquina onde deseja criar a pasta do projeto. Pode ser em qualquer lugar de sua preferência, como sua área de trabalho ou um diretório específico;
  2. Criar uma nova pasta: Clique com o botão direito no local escolhido e selecione "Nova Pasta" no menu de contexto;
  3. Nomear a pasta: Dê um nome significativo à pasta. Esta será a pasta raiz do seu projeto React, portanto, escolha um nome informativo e relevante para o propósito do seu projeto. Por exemplo, você pode nomeá-la como movies-app, store-app, posts-app, learning-system-app, etc.

Por exemplo, vamos criar a pasta vazia com o nome movies-app.

Etapa 4: Abrir a pasta no seu editor de código

Para começar a trabalhar no projeto, é necessário abrir a pasta movies-app no seu editor de código, seja o Visual Studio Code ou outro editor de sua escolha.

Siga estes passos:

  • Abra seu editor de código. No nosso exemplo, usaremos o Visual Studio Code (VS Code);
  • Clique no ícone do explorador localizado no canto superior esquerdo da interface do VS Code;
  • Clique no botão "Abrir Pasta" no painel do explorador;
  • Procure pela pasta movies-app na máquina e selecione-a. Após concluir estas etapas, o nome da pasta, movies-app, deve ser exibido na interface do editor de código.

Agora que a pasta do projeto está configurada e aberta no editor de código, o ambiente está pronto para iniciar o desenvolvimento da aplicação React.

Tudo estava claro?

Como podemos melhorá-lo?

Obrigado pelo seu feedback!

Seção 4. Capítulo 3

Pergunte à IA

expand

Pergunte à IA

ChatGPT

Pergunte o que quiser ou experimente uma das perguntas sugeridas para iniciar nosso bate-papo

Awesome!

Completion rate improved to 2.17

bookOrganizando a Estrutura de Pastas do Projeto

Deslize para mostrar o menu

Etapa 3: Criar a pasta do projeto

Agora que temos todas as ferramentas externas necessárias, podemos começar a criar o projeto. A tarefa é criar uma nova pasta vazia especificamente para o projeto, onde nada mais será armazenado.

Passos a seguir:

  1. Escolher um local: Selecione um local em sua máquina onde deseja criar a pasta do projeto. Pode ser em qualquer lugar de sua preferência, como sua área de trabalho ou um diretório específico;
  2. Criar uma nova pasta: Clique com o botão direito no local escolhido e selecione "Nova Pasta" no menu de contexto;
  3. Nomear a pasta: Dê um nome significativo à pasta. Esta será a pasta raiz do seu projeto React, portanto, escolha um nome informativo e relevante para o propósito do seu projeto. Por exemplo, você pode nomeá-la como movies-app, store-app, posts-app, learning-system-app, etc.

Por exemplo, vamos criar a pasta vazia com o nome movies-app.

Etapa 4: Abrir a pasta no seu editor de código

Para começar a trabalhar no projeto, é necessário abrir a pasta movies-app no seu editor de código, seja o Visual Studio Code ou outro editor de sua escolha.

Siga estes passos:

  • Abra seu editor de código. No nosso exemplo, usaremos o Visual Studio Code (VS Code);
  • Clique no ícone do explorador localizado no canto superior esquerdo da interface do VS Code;
  • Clique no botão "Abrir Pasta" no painel do explorador;
  • Procure pela pasta movies-app na máquina e selecione-a. Após concluir estas etapas, o nome da pasta, movies-app, deve ser exibido na interface do editor de código.

Agora que a pasta do projeto está configurada e aberta no editor de código, o ambiente está pronto para iniciar o desenvolvimento da aplicação React.

Tudo estava claro?

Como podemos melhorá-lo?

Obrigado pelo seu feedback!

Seção 4. Capítulo 3
some-alt