Desplegar una aplicacion de Nuxt 3 a un VPS con Nginx, Docker, SSL y GitHub Actions



Desplegar una aplicacion de Nuxt 3 a un VPS con Nginx, Docker, SSL y GitHub Actions

Desplegar una aplicacion de Nuxt 3 a un VPS con Nginx, Docker, SSL y GitHub Actions

En este video les muestro cómo desplegar fácilmente un proyecto de Nuxt a un servidor con Ubuntu, ya sea Oracle Cloud, Amazon EC2, DigitalOcean, UpCloud, etc utilizando Docker, Nginx y un bot para generar certificados SSL de forma automática y tener HTTPS en el sitio. Además configuramos un workflow de GitHub Actions para tener Continuous Deployment.

Desde ya, una disculpa por el audio que no es escucha muy bien, tuve algunos problemas a la hora de grabar que no noté hasta que me puse a editar el video. Aún así, espero que sea útil y si hay algo que no entienden pueden consultarlo en los comentarios.

Dockerfile:
FROM node:18-alpine

WORKDIR /app

COPY package*.json .

RUN npm ci

COPY . .

RUN npm run build

CMD [“node”, “.output/server/index.mjs”]
EXPOSE 3000

.dockerignore:
node_modules
*.log*
.nuxt
.nitro
.cache
.output
dist
.git
README.md
.gitignore
Dockerfile
npm-debug.log

docker-compose.yml:
version: ‘2’

services:
nginx-proxy:
image: nginxproxy/nginx-proxy
container_name: nginx-proxy
ports:
– ’80:80′
– ‘443:443’
volumes:
– certs:/etc/nginx/certs
– vhost:/etc/nginx/vhost.d
– html:/usr/share/nginx/html
– /var/run/docker.sock:/tmp/docker.sock:ro
restart: always

acme-companion:
image: nginxproxy/acme-companion
container_name: nginx-proxy-acme
environment:
– DEFAULT_EMAIL=
volumes_from:
– nginx-proxy
volumes:
– acme:/etc/acme.sh
– /var/run/docker.sock:/var/run/docker.sock:ro
restart: always

nuxt-app:
image: nuxt-app
build: .
restart: always
expose:
– ‘3000’
environment:
– VIRTUAL_HOST=
– LETSENCRYPT_HOST=

volumes:
conf:
vhost:
html:
certs:
acme:

build-and-deploy.yml:
name: Build and Deploy
on: [push]
jobs:
build-and-deploy:
name: Build and Deploy
runs-on: ubuntu-latest
steps:
– name: download changes, build and run containers
uses: appleboy/[email protected]
with:
host: ${{ secrets.HOST }}
username: ${{ secrets.USERNAME }}
key: ${{ secrets.KEY }}
passphrase: ${{ secrets.PASSPHRASE }}
script: |
cd nuxt-app
git pull
docker compose up -d –build

🌐 Canal y grupo de Telegram:
https://t.me/+WNosLZEU3ZsxZDUx

🧩 Extensiones de VS Code que uso:
– GitHub Theme (GitHub Dark) by GitHub
– Iconify IntelliSense by Anthony Fu
– MDC by Nuxt
– Prettier by Prettier
– Simple Icons by Shane Liesegang
– Volar by Vue
– WindiCSS IntelliSense by voorjaar

Comments are closed.