This content originally appeared on DEV Community and was authored by Hosana Barcelos
Oi! Nesse guia, vou te mostrar como é bem simples e rápido dockerizar uma aplicação Nuxt. Bora lá?
Nuxt
O objetivo e foco desse guia é entender como podemos adicionar um projeto Nuxt dentro de um container Docker. Inicialmente, para criar e rodar o seu projeto Nuxt, consulte a documentação oficial do Nuxt.
Docker
O arquivo YAML
Na raiz do seu projeto Nuxt, precisamos criar um arquivo YAML chamado docker-compose.yml.
Dentro desse arquivo, iremos adicionar nossa configuração para dockerizar a nossa aplicação. Abaixo, você consegue visualizar como ficou o meu arquivo de configuração:
version: '3'
services:
app:
image: node:14.18.2-buster-slim
container_name: docnux
volumes:
- .:/var/www/html
working_dir: /var/www/html
stdin_open: true
tty: true
ports:
- 3007:3000
Você pode usar essa configuração para o seu projeto também, mas é importante entender o que cada carinha presente nesse arquivo faz:
version→ Versão do docker-compose que você quer utilizar;
services→ Instanciar os serviços (containers) que você quer subir;
app→ Nome do serviço;
image→ Declara a imagem que vai ser utilizada para subir o container em questão (é possível pegar essa imagem em https://hub.docker.com/search?image_filter=official&type=image&q=);
container_name → Declara o nome do container (para não gerar um aleatório);
volumes → Atrelar diretórios de fora do container (ou seja, na sua máquina) para algum diretório dentro do container (diretório de fora : diretório de dentro)
working_dir → Diretório de entrada a partir do momento em que o container é inicializado;
stdin_open → Quando true, permite que a entrada padrão de dados (standard input ou stdin) esteja "aberta". Isso serve para poder rodar o container interativo, ou seja, você poderá acessar o seu shell, executar comandos e etc;
tty → (TeleTypeWriter);
ports → Expor portas para uso posterior. Nesse contexto, podemos atrelar portas de fora do container à portas de dentro do container (porta de fora : porta de dentro).
Subindo nosso container Docker
Após definir as configurações do seu container, basta executar o seguinte comando:
docker-compose up -d
Se a mensagem no terminal retornar …done significa que seu container foi upado e está pronto!
Usando nosso projeto Nuxt com Docker
Agora, para rodar comandos dentro do container, é necessário seguir o padrão de comando:
docker-compose exec <nome do serviço> <comando>
Para a nossa aplicação Nuxt, podemos rodar dois comandos iniciais:
docker-compose exec app npm i
docker-compose exec app npm run dev
Repare, o docker-compose executa os comandos do Nuxt dentro do meu serviço nomeado como
app, assim como vimos na criação do YAML.
Pronto! Você pode visualizar a aplicação no navegador em http://localhost:3007 e agora seu projeto Nuxt está dockerizado. Massa, né? 🚀
Lembre-se: Esse guia é produzido de maneira rápida e objetiva. Para saber mais sobre imagens e qual escolher ou usar no seu container, consulte a documentação oficial do Docker Hub.
Curtiu? Se conecte comigo onde preferir acessando minhas redes em: https://www.hosana.me.
This content originally appeared on DEV Community and was authored by Hosana Barcelos
Hosana Barcelos | Sciencx (2024-08-31T16:09:00+00:00) Como rodar seu projeto Nuxt em um container Docker? 🐳. Retrieved from https://www.scien.cx/2024/08/31/como-rodar-seu-projeto-nuxt-em-um-container-docker-%f0%9f%90%b3/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.