DEV Community

JohnDivam
JohnDivam

Posted on

Containerized Full-Stack Application using Docker, Nuxt 4, and Symfony 7.4

To run a multi-container full-stack application, the best practice is to separate your frontend and backend into isolated containers and orchestrate them using Docker Compose. This keeps your development environment clean, handles internal networking automatically, and allows services to scale independently.

Structure:

justproject/
├── justproject_api/
│   ├── docker-compose.yml   
│   ├── Dockerfile          
│   └── docker/nginx.conf   
└── justproject_front/
    └── Dockerfile           

Enter fullscreen mode Exit fullscreen mode

justproject_api\docker-compose.yml

services:
  database:
    image: mariadb:11
    ports:
      - "3307:3306"
    environment:
      MYSQL_DATABASE: ${MYSQL_DATABASE:-justproject}
      MYSQL_ROOT_PASSWORD: ${MYSQL_ROOT_PASSWORD:-root}
    healthcheck:
      test: ["CMD", "healthcheck.sh", "--connect", "--innodb_initialized"]
      timeout: 5s
      retries: 5
      start_period: 30s
    volumes:
      - database_data:/var/lib/mysql:rw

  app:
    build: .
    volumes:
      - .:/var/www/html
      - app_cache:/var/www/html/var/cache
      - app_log:/var/www/html/var/log
    depends_on:
      database:
        condition: service_healthy

  nginx:
    image: nginx:alpine
    ports:
      - "8000:80"
    volumes:
      - .:/var/www/html
      - ./docker/nginx.conf:/etc/nginx/conf.d/default.conf
    depends_on:
      - app

  frontend:
    build: ../justproject_front
    ports:
      - "3000:3000"
    environment:
      NUXT_PUBLIC_API_BASE: "http://localhost:8000"
    volumes:
      - ../justproject_front:/app
      - /app/node_modules

volumes:
  database_data:
  app_cache:
  app_log:

Enter fullscreen mode Exit fullscreen mode

justproject_api\Dockerfile

FROM php:8.4-fpm

RUN apt-get update && apt-get install -y \
    git unzip libicu-dev libzip-dev \
    && docker-php-ext-install pdo_mysql intl zip

COPY --from=composer:2 /usr/bin/composer /usr/bin/composer

WORKDIR /var/www/html
COPY . .
RUN composer install --no-interaction --optimize-autoloader

COPY docker/entrypoint.sh /usr/local/bin/entrypoint.sh
RUN chmod +x /usr/local/bin/entrypoint.sh

ENTRYPOINT ["entrypoint.sh"]
CMD ["php-fpm"]
Enter fullscreen mode Exit fullscreen mode

justproject_front\Dockerfile

FROM node:20-alpine

WORKDIR /app
COPY package*.json ./
RUN npm install

COPY . .
EXPOSE 3000
CMD ["npm", "run", "dev", "--", "--host", "0.0.0.0"]
Enter fullscreen mode Exit fullscreen mode

up
docker compose up -d --build

to check mgirations list :
docker compose exec app php bin/console doctrine:migrations:list

Top comments (0)