TheLazy.Dev
Portfolio GitHub

Blog

linux |node |mysql |braziliandevs

Preparando um ambiente Linux para aplicações com NodeJS, MySQL e ReactJS.

cassiogamarra

Cássio Gamarra

Posted on November 5, 2020

Preparando um ambiente Linux para aplicações com NodeJS, MySQL e ReactJS.

Recentemente tive a necessidade de subir uma aplicação com o seguinte stack: NodeJS e Mysql no backend e ReactJS no frontend. Como não tinha conhecimento prévio dessas tecnologias, foi um grande desafio desenvolver a aplicação e ainda mais desafiador montar um ambiente para receber tudo isso. Depois de diversas tentativas, fiz um mini-tutorial para facilitar a vida de quem precisa de um ambiente Linux com essas características.

Uma dica antes de iniciar, é verificar se o fuso horário do ambiente está como desejado, é possível utilizar o seguinte comando para resolver isso:

$ sudo dpkg-reconfigure tzdata
Enter fullscreen mode Exit fullscreen mode

1 - Instalando o MySQL:

Primeiramente, vamos realizar a instalação e configuração do MySQL, que vai ser nosso SGBD.

$ sudo apt update
$ sudo apt install mysql-server
Enter fullscreen mode Exit fullscreen mode

Após executar esses dois comandos, inicia a configuração inicial do MySQL:

$ sudo mysql_secure_installation
Enter fullscreen mode Exit fullscreen mode

2 - Configuração do MySQL:

Após a instalação, vamos configurar o MySQL, acessando o mesmo através do seguinte comando:

$ sudo mysql -u root -p
Enter fullscreen mode Exit fullscreen mode

Obs.: no primeiro acesso, não é necessário digitar nenhuma senha
Definimos a senha para o usuário:

mysql> ALTER USER root@'localhost' IDENTIFIED WITH mysql_native_password BY 'SUA_SENHA';
Enter fullscreen mode Exit fullscreen mode

Importante: o uso do mysql_native_password é necessário para evitar que drivers de conexão mais antigos tenham incompatibilidade na hora de realizar acesso a base de dados
Criamos um usuário para acesso:

mysql> CREATE USER 'SEU_USUARIO'@'localhost' IDENTIFIED WITH mysql_native_password BY 'SUA_SENHA';
Enter fullscreen mode Exit fullscreen mode

Definimos os privilégios de acesso para o usuário criado:

mysql> GRANT ALL PRIVILEGES ON *.* TO 'database_user'@'localhost';
Enter fullscreen mode Exit fullscreen mode

Podemos definir uma base específica para o usuário, nesse caso ele terá acesso a todas as bases no MySQL.

mysql> FLUSH PRIVILEGES;
mysql> EXIT;

Atualiza os privilégios de acesso dos usuários e saímos do console do MySQL.
Enter fullscreen mode Exit fullscreen mode

Para não ocorrer erros em algumas consultas em formato "antigo", é necessário configurar o modo SQL que o MySQL trabalha, alterando o arquivo mysqld.cnf:

$ sudo nano /etc/mysql/mysql.conf.d/mysqld.cnf
Enter fullscreen mode Exit fullscreen mode

Adicionamos no final do arquivo a linha:

sql_mode="TRADITIONAL"
Enter fullscreen mode Exit fullscreen mode

Após todas as alterações, é necessário reiniciar o serviço do MySQL:

$ sudo service mysql restart
Enter fullscreen mode Exit fullscreen mode

Acessamos novamente o MySQL e criamos a base de dados desejada:

$ mysql -u root -p
mysql> CREATE DATABASE NOME_DESEJADO
mysql> EXIT;
Enter fullscreen mode Exit fullscreen mode

Caso necessário, podemos restaurar uma base já existente:

$ mysql -u usuario -p 'nomebase' < NOMEBACKUP.sql
Enter fullscreen mode Exit fullscreen mode

Pronto, temos o MySQL instalado e configurado, agora vamos para a configuração do nosso proxy reverso, o Nginx.

3 - Instalando o Nginx:

NGINX, pronunciado "engine-ex", é um dos servidores web mais populares no mundo e é responsável por hospedar alguns dos maiores e mais acessados sites na internet. Pode ser utilizado como servidor web ou proxy reverso.

$ sudo apt update
$ sudo apt install nginx
Enter fullscreen mode Exit fullscreen mode

4 - Ajustando o firewall

O Nginx se registra como um serviço com o ufw após a instalação, tornando bem fácil permitir o acesso ao Nginx.
Podemos listar as configurações das aplicações com as quais o ufw sabe como trabalhar digitando:

$ sudo ufw app list
Enter fullscreen mode Exit fullscreen mode

Você deve obter uma listagem dos perfis de aplicativo:

Available applications:
  Nginx Full
  Nginx HTTP
  Nginx HTTPS
  OpenSSH
Enter fullscreen mode Exit fullscreen mode

Agora vamos permitir algumas aplicações:

$ sudo ufw allow 'Nginx HTTP' //Permite o Nginx
$ sudo ufw allow 'OpenSSH' //Permite o OpenSSH
Enter fullscreen mode Exit fullscreen mode

Caso deseje adicionar mais de uma aplicação na mesma máquina, utilize o comando:

$ sudo ufw allow [porta/protocolo]
$ sudo ufw enable //Ativa o firewall
$ sudo ufw status //Verifica o status
Enter fullscreen mode Exit fullscreen mode

Para verificar se o Nginx está rodando, basta digitar:

$ systemctl status nginx
Enter fullscreen mode Exit fullscreen mode

5 - Instalar o NodeJS

Para facilitar o gerenciamento de pacotes, vamos utilizar o Yarn, que é um gerenciador de pacotes Javascript da empresa Facebook

Instalando o NodeJS

$ sudo apt install nodejs
Enter fullscreen mode Exit fullscreen mode

Instalando o gerenciador de pacotes, NPM

$ sudo apt install npm
Enter fullscreen mode Exit fullscreen mode

Instalando o Yarn:

$ sudo npm install yarn -g
Enter fullscreen mode Exit fullscreen mode

Caso ocorram problemas ao instalar o Yarn dessa forma, a possível solução é:

sudo apt remove cmdtest
sudo apt remove yarn
curl -sS https://dl.yarnpkg.com/debian/pubkey.gpg | sudo apt-key add -
echo "deb https://dl.yarnpkg.com/debian/ stable main" | sudo tee /etc/apt/sources.list.d/yarn.list
sudo apt-get update
sudo apt-get install yarn
Enter fullscreen mode Exit fullscreen mode

Antes de realizar a cópia dos arquivos para o servidor, recomendo realizar a build da aplicação frontend, diminuindo o trabalho do servidor para instalar e compilar todos os arquivos necessários:
Na sua pasta do frontend, rode o comando:

$ yarn run build
Enter fullscreen mode Exit fullscreen mode

Para realizar a cópia dos arquivos, recomendo uma visita no link:
https://viniciussousa88.wordpress.com/2012/07/31/enviar-e-receber-arquivos-via-ssh/

Após copiar os arquivos do backend e do frontend para o servidor, acessamos a pasta do backend e realizamos a instalação das dependências:

$ yarn install
Enter fullscreen mode Exit fullscreen mode

Os arquivos do frontend para a pasta var/www/NOME_APP:

$ cd pasta_app
$ sudo cp -r * /var/www/NOME_APP
Enter fullscreen mode Exit fullscreen mode

6 - Configurar o Nginx

Para configurar o Nginx, vamos começar alterando o arquivo default, que fica na pasta /etc/nginx/sites-available:

$ sudo nano /etc/nginx/sites-available/default
Enter fullscreen mode Exit fullscreen mode

Essa é uma configuração bem enxuta, caso necessário, você pode complementar da maneira que lhe atender:

server {
  listen 80 default_server;
  listen [::]:80 default_server;

  root /var/www/NOME_APP;
  server_name _; 

  #Aponta para a pasta onde fica o frontend
  location / {
    root /var/www/NOME_APP/;
    try_files $uri /index.html;
  }
  #Localização da aplicação backend, nesse caso nomeamos como api
  #A PORTA é a que está configurada na aplicação backend
  location /api/ {
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_set_header X-NginX-Proxy true;
    proxy_pass http://localhost:PORTA/;
    proxy_ssl_session_reuse off;
    proxy_set_header Host $http_host;
    proxy_cache_bypass $http_upgrade;
    proxy_redirect off;
  }
}
Enter fullscreen mode Exit fullscreen mode

Após configurar e salvar o arquivo, verificamos se está tudo certo e reiniciamos o serviço:

$ sudo nginx -t
$ sudo systemctl reload nginx
Enter fullscreen mode Exit fullscreen mode

7 - PM2

O PM2 é um gerenciador de processos e com ele lidar com variáveis ambientes, fazer log, saber o estado da aplicação se tornam tarefas simples. Vamos utilizar ele para manter a aplicação rodando ao invés de utilizar apenas o node.
Instalando o PM2:

$ sudo npm install pm2@latest -g
Enter fullscreen mode Exit fullscreen mode

Após instalar o PM2, acessamos a pasta onde está nossa aplicação backend e rodamos o comando:

$ pm2 start index.js --name MEUAPP
Enter fullscreen mode Exit fullscreen mode

O comando acima, executa o index.js que ficará rodando em background e nomeia o processo aberto para MEUAPP, caso deseje também é possível manipular o processo através do ID, que inicia em zero.

Podemos também configurar o PM2 para iniciar juntamente com o sistema, em caso de reinicializações:

$ pm2 startup systemd
Enter fullscreen mode Exit fullscreen mode

Para salvar a lista de processos:

$ pm2 save
Enter fullscreen mode Exit fullscreen mode

O PM2 facilita muito o gerenciamento das aplicações, eis alguns comandos úteis para o mesmo:

$ pm2 list  //Lista de aplicações rodando
$ pm2 info app_nome //Infos do app
$ pm2 stop app_name_or_id //Para o app
$ pm2 restart app_name_or_id //Restarta o app
Caso deseje visualizar os logs da aplicação, eles ficam na pasta:
/home/usuario/.pm2/logs
Enter fullscreen mode Exit fullscreen mode

Após realizar essas configurações, seu ambiente vai estar pronto para rodar sua aplicação.

Considerações finais:

Fiz esse tutorial pois encontrei muitos materiais disponíveis, porém senti falta de algum exemplo que fizesse todo o processo. Após ter feito essa configuração uma primeira vez e anotado todos os comandos, ficou bem mais rápido e prático criar uma ambiente para aplicações com NodeJS e MySQL. Espero que gostem, críticas e sugestões são muito bem-vindas.

Links úteis:

Criando uma máquina virtual na Azure (utilizei para realizar os primeiros testes): https://docs.microsoft.com/pt-br/azure/virtual-machines/linux/quick-create-portal

Copiando arquivos via SSH: https://viniciussousa88.wordpress.com/2012/07/31/enviar-e-receber-arquivos-via-ssh/

Alterando o fuso horário no Linux: https://www.vivaolinux.com.br/dica/Alterando-o-fuso-horario-no-Linux

Configurando um servidor Ubuntu, instalando o Nginx e configurando aplicações NodeJS:

https://www.digitalocean.com/community/tutorials/initial-server-setup-with-ubuntu-18-04

https://www.digitalocean.com/community/tutorials/how-to-install-nginx-on-ubuntu-18-04

💖 💪 🙅 🚩
cassiogamarra
Cássio Gamarra

Posted on November 5, 2020

Join Our Newsletter. No Spam, Only the good stuff.

Sign up to receive the latest update from our blog.

Related

Preparando um ambiente Linux para aplicações com NodeJS, MySQL e ReactJS.
linux Preparando um ambiente Linux para aplicações com NodeJS, MySQL e ReactJS.

November 5, 2020