Despliegue de Aplicación Web Multi-Contenedor con Docker

Descripción del Proyecto

Este proyecto consiste en el despliegue de una aplicación web de "Blog Sencillo" utilizando una arquitectura de microservicios contenerizada con Docker. La aplicación está compuesta por tres servicios principales que se ejecutan en contenedores Docker independientes y se orquestan mediante docker-compose:

1. Frontend (Cliente Web): Una interfaz de usuario desarrollada en React que permite a los usuarios ver las entradas del blog y crear nuevas.

2. Backend (API de Servicio): Un servicio API RESTful desarrollado en Node.js con Express, que gestiona la lógica de negocio (crear y obtener posts) y se comunica con la base de datos.

3. Base de Datos: Un sistema gestor de base de datos MongoDB donde se almacenan todas las entradas del blog.

El objetivo principal de esta práctica es demostrar la capacidad de crear, gestionar y orquestar contenedores Docker para desplegar una aplicación web completa.

✨ Características

• Visualización de Posts: La página de inicio muestra todos los posts almacenados en la base de datos.

• Creación de Posts: Un formulario permite a los usuarios añadir nuevos posts con título y contenido.

• Persistencia de Datos: Los datos se almacenan en un volumen de Docker para asegurar que no se pierdan al detener o reiniciar los contenedores.

• Comunicación entre Contenedores: Los servicios de frontend, backend y base de datos se comunican a través de una red Docker personalizada.

🛠️ Stack Tecnológico

• Frontend: React, Vite
• Backend: Node.js, Express.js, Mongoose
• Base de Datos: MongoDB
• Servidor Web (Frontend): Nginx
• Containerización: Docker, Docker Compose

📁 Estructura del Repositorio

.
└── docker-multi-container-blog/
    ├── BackEnd/
    │   ├── db.js
    │   ├── dockerfile
    │   ├── index.js
    │   ├── models/
    │   ├── package.json
    │   └── routers/
    ├── docker-compose.yml
    ├── FrontEnd/
    │   ├── dockerfile
    │   ├── index.html
    │   ├── package.json
    │   ├── src/
    │   └── ...
    └── README.md

🚀 Cómo Empezar

Prerrequisitos

Asegúrate de tener instalado Docker y Docker Compose en tu sistema.

• Instalar Docker Engine
• Instalar Docker Compose

Instalación y Ejecución

1. Clona el repositorio:

   git clone https://github.com/GregorioBrc/docker-multi-container-blog

2. Navega al directorio del proyecto:

   cd docker-multi-container-blog

3. Construye las imágenes y levanta los contenedores: Utiliza docker-compose para construir las imágenes del frontend y backend, y para iniciar todos los servicios definidos en el archivo docker-compose.yml.

   docker-compose up --build -d

   • --build: Fuerza la construcción de las imágenes desde los Dockerfile.
   • -d: Ejecuta los contenedores en segundo plano (detached mode).

Cuando se vea "MongoDB Conectado..." La aplicación debería estar funcionando corectamente.

🔗 Acceso a la Aplicación

Una vez que los contenedores estén en funcionamiento, puedes acceder a la aplicación a través de las siguientes URLs:

• Aplicación Web (Frontend): http://localhost (el puerto 80 es el predeterminado)
• API (Backend): http://localhost:3001/api/posts

📸 Demostración de la Aplicación (Capturas de Pantalla)

A continuación se muestran algunas capturas de la aplicación en funcionamiento.

Página de Inicio - Listado de Posts

Página de Creación de un Nuevo Post

Confirmación de Creación de Post