Dicas para uma aplicação web React+Node.js usando Docker

Trabalhar com aplicações web nem sempre é tarefa fácil, especialmente quando falamos de desenvolvimento e deployment. Mas e quando adicionamos React e Node.js na equação? E de que forma o Docker pode ajudar a construir, empacotar e implantar a aplicação em um ambiente de produção? Tudo isso exige conhecimentos técnicos, o entendimento de algumas ferramentas específicas e, claro, saber o caminho das pedras para fazer isso de forma segura. Portanto, confira algumas dicas abaixo:

Como começar a criação de uma aplicação web com React e Node.js?

Normalmente, um dos caminhos recomendados é iniciar o desenvolvimento por um servidor Node.js, seguindo a metodologia TDD (Test Driven Development). Nela, a ideia é basicamente validar as funcionalidades por meio de testes. Depois disso, é hora de trabalhar com a aplicação React e existe uma dica bem interessante sobre isso: faça com que toda a comunicação com o servidor seja simulada. Inclusive, devs já devem estar familiarizados com isso, mas costumam usar outra nomenclatura: mock. Com isso você acaba conseguindo simular objetos reais de forma controlada. E, por fim, você pode fazer a integração com a aplicação Node.js.

Tutorial de etapas do Docker

Quando inserimos o Docker na equação, existe uma série de etapas importantes a serem seguidas. A primeira delas inclui a definição de qual será a distribuição base do seu Dockerfile. Além disso, uma outra opção possível é usar a imagem do próprio Node como base, por exemplo: {noformat}FROM node:18{noformat}. Em seguida, é necessário definir o diretório de trabalho: {noformat}WORKDIR /app{noformat}. Com isso definido, você vai precisar copiar os arquivos de gerenciamento de pacotes para dentro do diretório e instalar as dependências na imagem: {noformat}COPY package*.json ./ RUN npm install{noformat}.

Depois, é preciso copiar todos os arquivos do projeto para dentro da imagem do Docker: {noformat}COPY . .{noformat}. Por fim, é necessário executar o build da aplicação e definir o comando do Dockerfile: {noformat}RUN npm run build CMD [ “npm”, “run”, “start” ]{noformat}. Isso fará com que o arquivo fique com a seguinte configuração (que deve ficar na raiz do projeto): {noformat}FROM node:18 WORKDIR /app COPY package*.json ./ COPY . . RUN npm install RUN npm run build CMD [ “npm”, “run”, “start” ]{noformat}.

Tudo isso complementaria para o básico de uma simples aplicação Node.js. E vale lembrar que, tendo o dockerfile criado, é necessário fazer a construção da imagem por meio do comando “docker build” e então publicar a imagem em algum repositório conhecido como “registry”. Depois disso, com a imagem em um repositório, basta baixá-la em um servidor e executá-la.

As vantagens do uso do Docker

Mas, afinal, por que você deve usar o Docker? Bom, o grande conceito por trás da utilização é a facilidade que você tem para migrar sua aplicação entre diferentes infraestruturas. E, claro, você pode fazer isso sem precisar instalar todas as dependências manualmente sempre que isso for necessário. Além disso, você também tem uma garantia de que o mesmo ambiente em que a aplicação foi desenvolvida vai ser usado em produção. E ainda vale citar a escalabilidade que o Docker proporciona quando é utilizado em conjunto com a orquestração de containers, como o Kubernetes, por exemplo.

Dicas para quem está começando

Muito bem, o primeiro passo é buscar entender o conceito de uma aplicação do lado do servidor e uma aplicação do lado do cliente. A partir disso, você vai precisar aprender como elas funcionam e como se comunicam. E uma coisa importante: antes do React, é bem importante que você aprenda a desenvolver páginas web sem o uso de nenhum framework, ou seja, somente utilizando HTML, CSS e Javascript. Isso vai te ajudar muito eventualmente e vai evitar que você tenha problemas no seu cotidiano. E para fechar com chave de ouro, dedique um tempo para entender os conceitos de uma API Restful e o protocolo HTTP. Além disso, pode seguir o tutorial que mencionei acima para trabalhar nas suas aplicações básicas.

Juntando todas essas dicas e se dedicando ao longo de todo o processo, não tem como você não cuidar de uma aplicação web React+Node.js ao usar o Docker. E se precisar de ajuda ao longo do caminho, eu recomendo muito a própria Comunidade da Impulso no Discord. Por lá, você consegue entrar em contato com outros e outras devs, tirar suas dúvidas e até mesmo responder uns Challenges sobre o assunto. Até a próxima, hein?