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

#backend #devops #docker #php

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/entrypoint.sh   
│   └── docker/nginx.conf   
│   ├── docker-compose.yml   
│   ├── Dockerfile          
└── justproject_front/
    └── Dockerfile

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:

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"]

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"]

justproject_api\docker\entrypoint.sh

#!/bin/sh
set -e

mkdir -p var/cache var/log
chown -R www-data:www-data var/cache var/log
chmod -R 775 var/cache var/log

exec "$@"

justproject_api\docker\nginx.conf

server {
    listen 80;
    root /var/www/html/public;

    location / {
        try_files $uri /index.php$is_args$args;
    }

    location ~ ^/index\.php(/|$) {
        fastcgi_pass app:9000;
        fastcgi_split_path_info ^(.+\.php)(/.*)$;
        include fastcgi_params;
        fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
        fastcgi_param DOCUMENT_ROOT $document_root;
    }
}

up
docker compose up -d --build

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

This only for local environment

DEV Community

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

Top comments (0)