Para começar a desenvolver você vai precisar configurar algumas coisas no seu computador.
Antes de seguir nesse artigo, recomendo que você configure seu editor para tirar o máximo proveito das ferramentas que embutimos no repositório.
Todo o ambiente de desenvolvimento existe dentro de containers do Docker. Isso garante que vc nunca vai precisar se preocupar em instalar versões específicas das coisas ou com as diferenças entre o seu computador e o servidor onde o site vai rodar.
Nossas configurações também permitem que suas alterações no código em desenvolvimento sejam vistas instantâneamente, não precisando que você fique desligando e ligando o ambiente de desenvolvimento sempre que fizer uma alteração
Como dito antes, nosso ambiente de desenvolvimento funciona usando containers do Docker. Por causa disso, você precisará instalar Docker e Docker Compose no seu computador. Essas são as únicas dependências obrigatórias para desenvolver o site do ALES.
| Software | Versão |
|---|---|
| Docker | >18.06.0 |
| Docker Compose | >1.25.0 |
Precisamos dessas versões (ou mais recentes), pois usamos o BuildKit que só está disponível a partir delas.
Agora você precisa configurar algumas variáveis de ambiente com suas informações.
Existem 8 arquivos que fornecem variáveis que os site do ALES usa para funcionar corretamente e se comunicar com outros serviços. Você não precisará alterar a maioria deles, mas é bom saber que eles existem e o que tem neles. Leia sobre cada um desses arquivos no artigo sobre Variáveis de ambiente
Em produção diferentes serviços são disponibilizados em diferentes subdomínios. Para reproduzir esse comportamento durante o desenvolvimento, você precisará garantir que seu computador sabe reconhecer esses subdominios em localhost. Se você está usando Google Chrome então provavelmente já está tudo ok pra você, mas ainda assim é recomendado seguir esse tutorial pra garantir que será acessível em qualquer navegador.
Vamos editar um arquivo chamado /etc/hosts, que diz pro seu computador como mapear domínios. Esse arquivo existe em diferentes formatos dependendo do seu sistema operacional, então siga esse tutorial para descobrir como alterá-lo.
Você vai precisar adicionar as seguintes entradas:
# Mapeamentos genéricos pro localhost
127.0.0.1 traefik.localhost
127.0.0.1 api.localhost
# End of section
Isso vai permitir que você acesse o backend em api.localhost e o Traefik em traefik.localhost
Finalmente podemos iniciar os containers e ver o site localmente. Para fazer isso você tem duas opções:
- Caso você não esteja usando vscode, basta executar o script de desenvolvimento:
./scripts/dev.sh - Caso esteja usando vscode, você pode abrir a paleta de commandos (
control+shit+Pou⇧⌘P) e digitarRun Task. Isso vai abrir a seleção de comandos e você pode escolher Dev up.
Espere alguns minutos enquanto Docker faz o download e inicia todos os seus containers. Essa demora só vai acontecer na primeira vez. Nas vezes seguintes os containers carregarão instantâneamente.
Atenção: Na primeira vez que você rodar, Django pode ser rápido demais e tentar migrar antes de o Postgres estar pronto. Se isso acontecer, simplesmente pare o ambiente de desenvolvimento e tente novamente.
Quando seus containers estiverem prontos e rodando, você vai poder acessar os serviços por 3 urls:
| URL | Serviço | Descrição |
|---|---|---|
| http://localhost | Frontend | Página inicial do site |
| http://api.localhost/admin | Backend | Página de administração do backend |
| http://traefik.localhost | Traefik | Dashboard do traefik |
Agora você já deve conseguir editar os arquivos do frontend e do backend e ver eles serem atualizados em tempo real na sua frente! Não precisa ficar derrubando e subindo o Docker sempre que você fizer uma alteração.
Para parar os containers de desenvolvimento você pode fazer 1 de 3 coisas:
- Na tela com os logs dos containers, digite
control+C - Em qualquer terminal que esteja na pasta principal do projeto, digite
docker-compose down - Se estiver usando vscode, rode a task
Dev down
Se por algum motivo você quiser reiniciar um container específico de desenvolvimento, você pode rodar o seguinte comando da pasta principal do projeto:
docker-compose restart <nome-do-serviço>Por exemplo, para reiniciar o frontend:
docker-compose restart frontendPara usuários do vscode, você pode rodar a task Restart frontend e Restart backend
Às vezes você pode precisar entrar por SSH dentro de um container pra debugar alguma coisa. Para fazer isso, tenha em mãos o nome do projeto no Compose e rode:
docker exec -it <nome-do-projeto>_<nome-do-serviço>_1 shPor exemplo, para entrar no frontend:
docker exec -it ales_backend_1 shSe você estiver usando vscode, pode fazer isso pelas tasks SSH into frontend e SSH into backend.
Você também pode executar a shell do Django que está dentro do container do backend. Para fazer isso, tenha em mãos o nome do projeto no Compose e rode:
docker exec -it <nome-do-projeto>_backend_1 python manage.py shell_plusExemplo para os valores padrões:
docker exec -it ales_backend_1 python manage.py shell_plusSe você estiver usando vscode também tem uma task pra isso: Open backend shell.
Para aprender a debugar seu código, vá para o próximo artigo.