[Sugestão] Otimizando os estudos: Como criei o meu próprio boilerplate para nunca mais perder tempo configurando um projeto React

Olá, comunidade dev!

Como muitos de vós, estou na jornada de aprendizagem em desenvolvimento front-end, mergulhando em cursos e construindo pequenos projetos para praticar.

Uma coisa que comecei a notar é que uma parte considerável do meu tempo era gasta repetindo as mesmas tarefas vez após vez:

• Criar um projeto com Vite.

• Limpar os ficheiros de exemplo.

• Instalar e configurar uma biblioteca de CSS-in-JS (no meu caso, o Emotion).

• Definir estilos globais, resets e o meu padrão de 1rem = 10px.

Apesar de ainda não ter experiência profissional, pensei: "Se o meu objetivo é aprender a lógica do React, porque é que continuo a perder tempo com uma configuração que já sei fazer?"

Foi aí que decidi investir umas horas para poupar muitas outras no futuro e criei o meu próprio Boilerplate Pessoal.

O resultado é um template que me permite começar um novo projeto em segundos, com tudo o que preciso já pronto.
A stack que escolhi foi:

• Vite + React: Para um ambiente de desenvolvimento super rápido.

• Emotion: Para estilização com CSS-in-JS, já com GlobalStyles configurado.

• Otimizado para GitHub Codespaces: O ambiente é 100% configurado na nuvem, com a versão certa do Node.js, extensões do VS Code e dependências instaladas automaticamente.

Porque é que isto é um divisor de águas para quem está aprendendo?

Foco no que importa: Agora, quando começo um novo projeto de estudo, vou direto ao que interessa: construir componentes e aplicar a lógica do React.

Aprendizagem de ferramentas (Tooling): O processo de criar o boilerplate forçou-me a aprender mais a fundo sobre o devcontainer, scripts de inicialização e a estrutura do Vite.

Consistência: Todos os meus projetos de estudo partem da mesma base sólida e organizada.

Para quem também sente que gasta demasiado tempo em setups repetitivos, recomendo vivamente a criação de um boilerplate pessoal. É um projeto que ensina muito e otimiza imenso o fluxo de estudo.

Deixei o meu repositório público e configurado como um template no GitHub. Fiquem à vontade para o usar nos vossos estudos ou para dar feedback!

Link para o Repositório Template:

Como é que vocês lidam com a configuração de novos projetos? Acham que vale a pena um estudante investir tempo neste tipo de automação? Adoraria saber a vossa opinião!

#ReactJS #Vite #Emotion #FrontEnd #DesenvolvimentoWeb #GitHub #Codespaces #LearningInPublic #DevJunior #Alura