Criando projetos React de forma rápida com create-react-app

Criar projetos e configurar tudo do zero é cada vez mais parte do passado. Exemplos famosos como o Ruby on Rails já vem mostrando ao mercado que a abstração da camada inicial de configuração e estruturação de um projeto, podem e talvez até devam fazer parte (ao menos em muitos casos) das atribuições de uma CLI (Command Line Interface) ou um programa que crie toda a estrutura básica através de comandos, dessa forma otimizando tempo e até melhorando a padronização de projetos.

Um ótimo exemplo, é o create-react-app, que cria projetos utilizando o framework front-end ReactJS. Ao criar um projeto com o create-react-app, um conjunto de ferramentas e configurações já são disponibilizadas automaticamente como suporte ao ES6 e Typescript, um servidor de desenvolvimento com autoreload e etc.

Para instalar o create-react-app e sair criando seus projetos utilizando o React, basta utilizar o NPX, NPM ou Yarn.

# Utilizando NPX
npx create-react-app meu-projeto

# Utilizando NPM
npm create-react-app meu-projeto

# Utilizando YARN
yarn create-react-app meu-projeto

Esta é a estrutura inicial provida pelo create-react-app.

Para executar o servidor de desenvolvimento basta executar npm start ou yarn start.

Automaticamente uma nova aba do browser é aberta com o projeto sendo executado. Caso queira modificar algo e ter a certeza de que o servidor está fazendo o autoreload, alterando o arquivo App.js dentro da pasta src:

E o resultado no browser:

Conclusão

Seja na fase de aprendizagem, criação de projetos pequenos ou até mesmo de grande porte, toda a fase de configuração inicial de ferramentas como o Babel, Webpack, ESlint e etc, pode tomar um tempo precioso de quem está desenvolvendo (e até cair no ostracismo), mas com a ajuda de uma CLI como o create-react-app, toda esse processo pode ser abstraído e o esforço redirecionado para as regras de negócio, interface ou outros pontos que trazem maior impacto ao projeto, principalmente no início.

Lembrando que depende muito do projeto e de sua complexidade.