diff --git a/Dockerfile.backend b/Dockerfile.backend
index 2198ce9980..a5b73b04f5 100644
--- a/Dockerfile.backend
+++ b/Dockerfile.backend
@@ -1,16 +1,15 @@
-FROM python:3.9-slim-buster
+FROM python:3.11-slim-bookworm
 
 WORKDIR /app
 
-RUN apt-get update && apt-get install -y --no-install-recommends
-build-essential
+RUN apt-get update && apt-get install -y --no-install-recommends \
+build-essential \
 libpq-dev
 
 COPY requirements.txt .
 RUN pip install --no-cache-dir -r requirements.txt
 
 COPY src/ /app/src
-COPY wsgi.py .
 
 EXPOSE 8000
 
diff --git a/Dockerfile.frontend b/Dockerfile.frontend
index 3333403726..d496240de6 100644
--- a/Dockerfile.frontend
+++ b/Dockerfile.frontend
@@ -3,6 +3,8 @@ FROM node:20-alpine AS builder
 WORKDIR /app
 
 COPY package.json package-lock.json vite.config.js ./
+COPY index.html .
+
 RUN npm install
 
 COPY src/front/ ./src/front/
diff --git a/docker-compose.yml b/docker-compose.yml
index e795eb49aa..b556fe1518 100644
--- a/docker-compose.yml
+++ b/docker-compose.yml
@@ -1,10 +1,8 @@
-version: '3.8'
-
 services:
   # Servicio del Backend (Python/Flask API)
   server:
     build:
-      context: .  # El contexto es la raíz, donde están todos los archivos
+      context: . # El contexto es la raíz, donde están todos los archivos
       dockerfile: Dockerfile.backend # Especifica qué Dockerfile usar
     restart: always
     env_file: ./.env
@@ -54,4 +52,4 @@ networks:
 
 volumes:
   postgres-data:
-    driver: local
\ No newline at end of file
+    driver: local
diff --git a/src/front/components/BackendURL.jsx b/src/front/components/BackendURL.jsx
deleted file mode 100644
index ae80b8e43a..0000000000
--- a/src/front/components/BackendURL.jsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import React, { Component } from "react";
-import envFile from "../../../docs/assets/env-file.png"
-
-const Dark = ({children}) => <span className="bg-dark text-white px-1 rounded">{children}</span>;
-export const BackendURL = () => (
-	<div className="mt-5 pt-5 w-50 mx-auto">
-		<h2>Missing BACKEND_URL env variable</h2>
-		<p>Here's a video tutorial on <a target="_blank" href="https://www.awesomescreenshot.com/video/16498567?key=72dbf905fe4fa6d3224783d02a8b1b9c">how to update your backend URL environment variable.</a></p>
-		<p>There's a file called <Dark>.env</Dark> that contains the environmental variables for your project.</p>
-		<p>There's one variable called <Dark>BACKEND_URL</Dark> that needs to be manually set by yourself.</p>
-		<ol>
-			<li>Make sure you backend is running on port 3001.</li>
-			<li>Open your API and copy the API host.</li>
-			<li>Open the .env file (do not open the .env.example)</li>
-			<li>Add a new variable VITE_BACKEND_URL=<Dark>your api host</Dark></li>
-			<li>Replace <Dark>your api host</Dark> with the public API URL of your flask backend sever running at port 3001</li>
-		</ol>
-		<div className="w-100">
-		<img src={envFile} className="w-100"/>
-		</div>
-		<p>Note: If you are publishing your website to Heroku, Render.com or any other hosting you probably need to follow other steps.</p>
-	</div>
-);
\ No newline at end of file
diff --git a/src/front/components/HeaderContact.jsx b/src/front/components/HeaderContact.jsx
index 36df008b2b..980f64f523 100644
--- a/src/front/components/HeaderContact.jsx
+++ b/src/front/components/HeaderContact.jsx
@@ -61,164 +61,164 @@ const HeaderContact = () => {
 
     return (
         <>
-        <section className="header w-100 h-100 position-relative ">
-            <img
-                src={HomeContact}
-                alt="CloudTech background image"
-                className="z-n1 mx-auto position-absolute w-100 h-100 object-fit-cover d-sm-block mb-5" />
-
-            <div className="position-absolute w-100 h-100 bg-dark bg-opacity-50 mx-auto"></div>
-            <div className="container w-100 h-100 py-2">
-                <div className="row align-items-center justify-content-center justify-content-lg-end mb-5">
-                    <div className="col-12 col-lg-6 z-1 align-items-center pt-5 mt-5 pt-lg-0 mt-lg-3">
-                        <h1 className="hero-title-home display-4 fw-bolder w-100 mt-2 text-lg-center text-center d-none d-lg-block">
-                            {t('contact.sectionTitle')}
-                        </h1>
-
-                        <h1 className="hero-title-home display-4 fw-bolder w-100 mt-5 text-center d-lg-none">
-                            {t('contact.sectionTitle')}
-                        </h1>
-
-                        <p className="hero-subtitle-home fs-5 text-white fw-bold w-100 mb-4 d-none d-lg-block text-lg-center">
-                            {t('contact.sectionDescription')}
-                        </p>
-
-                        <p className="hero-subtitle-home fs-5 text-white fw-bold w-100 mb-4 text-center d-lg-none">
-                            {t('contact.sectionDescription')}
-                        </p>
-
-                        <form onSubmit={handleSubmit} noValidate className="text-start">
-                            <div className="mb-3">
-                                <label htmlFor="name" className="form-label fw-bold form-label-contact">
-                                    {t('contact.labels.nameLabel')}
-                                </label>
-
-                                <input
-                                    type="text"
-                                    className={`form-control rounded-3 ${status === 'error' && error?.name ? 'is-invalid' : ''}`}
-                                    id="name" name="name" value={formData.name} onChange={handleChange}
-                                    placeholder={t('contact.placeholders.nameHolder')}
-                                    required
-                                />
-                                {status === 'error' && error?.name && <div className="invalid-feedback fw-bold">{error.name}</div>}
-                            </div>
-
-                            <div className="row mb-3">
-                                <div className="col-6">
-                                    <label
-                                        htmlFor="phone"
-                                        className="form-label fw-bold form-label-contact">
-                                        {t('contact.labels.phoneLabel')}
+            <section className="header w-100 h-100 position-relative ">
+                <img
+                    src={HomeContact}
+                    alt="CloudTech background image"
+                    className="z-n1 mx-auto position-absolute w-100 h-100 object-fit-cover d-sm-block mb-5" />
+
+                <div className="position-absolute w-100 h-100 bg-dark bg-opacity-50 mx-auto"></div>
+                <div className="container w-100 h-100 py-2">
+                    <div className="row align-items-center justify-content-center justify-content-lg-end mb-5">
+                        <div className="col-12 col-lg-6 z-1 align-items-center pt-5 mt-5 pt-lg-0 mt-lg-3">
+                            <h1 className="hero-title-home display-4 fw-bolder w-100 mt-2 text-lg-center text-center d-none d-lg-block">
+                                {t('contact.sectionTitle')}
+                            </h1>
+
+                            <h1 className="hero-title-home display-4 fw-bolder w-100 mt-5 text-center d-lg-none">
+                                {t('contact.sectionTitle')}
+                            </h1>
+
+                            <p className="hero-subtitle-home fs-5 text-white fw-bold w-100 mb-4 d-none d-lg-block text-lg-center">
+                                {t('contact.sectionDescription')}
+                            </p>
+
+                            <p className="hero-subtitle-home fs-5 text-white fw-bold w-100 mb-4 text-center d-lg-none">
+                                {t('contact.sectionDescription')}
+                            </p>
+
+                            <form onSubmit={handleSubmit} noValidate className="text-start">
+                                <div className="mb-3">
+                                    <label htmlFor="name" className="form-label fw-bold form-label-contact">
+                                        {t('contact.labels.nameLabel')}
                                     </label>
 
                                     <input
-                                        type="tel"
-                                        className={`form-control rounded-3 ${status === 'error' && error?.phone ? 'is-invalid' : ''}`}
-                                        id="phone" name="phone"
-                                        value={formData.phone}
-                                        onChange={handleChange}
-                                        placeholder={t('contact.placeholders.phoneHolder')}
+                                        type="text"
+                                        className={`form-control rounded-3 ${status === 'error' && error?.name ? 'is-invalid' : ''}`}
+                                        id="name" name="name" value={formData.name} onChange={handleChange}
+                                        placeholder={t('contact.placeholders.nameHolder')}
                                         required
                                     />
+                                    {status === 'error' && error?.name && <div className="invalid-feedback fw-bold">{error.name}</div>}
+                                </div>
 
-                                    {status === 'error' && error?.phone &&
-                                        <div className="invalid-feedback fw-bold">{error.phone}</div>}
+                                <div className="row mb-3">
+                                    <div className="col-6">
+                                        <label
+                                            htmlFor="phone"
+                                            className="form-label fw-bold form-label-contact">
+                                            {t('contact.labels.phoneLabel')}
+                                        </label>
+
+                                        <input
+                                            type="tel"
+                                            className={`form-control rounded-3 ${status === 'error' && error?.phone ? 'is-invalid' : ''}`}
+                                            id="phone" name="phone"
+                                            value={formData.phone}
+                                            onChange={handleChange}
+                                            placeholder={t('contact.placeholders.phoneHolder')}
+                                            required
+                                        />
+
+                                        {status === 'error' && error?.phone &&
+                                            <div className="invalid-feedback fw-bold">{error.phone}</div>}
+                                    </div>
+
+                                    <div className="col-6">
+                                        <label htmlFor="email" className="form-label fw-bold form-label-contact">
+                                            {t('contact.labels.emailLabel')}
+                                        </label>
+
+                                        <input
+                                            type="email"
+                                            className={`form-control rounded-3 ${status === 'error' && error?.email ? 'is-invalid' : ''}`}
+                                            id="email" name="email"
+                                            value={formData.email}
+                                            onChange={handleChange}
+                                            placeholder={t('contact.placeholders.emailHolder')}
+                                            required
+                                        />
+
+                                        {status === 'error' && error?.email &&
+                                            <div className="invalid-feedback fw-bold">{error.email}</div>}
+                                    </div>
                                 </div>
 
-                                <div className="col-6">
-                                    <label htmlFor="email" className="form-label fw-bold form-label-contact">
-                                        {t('contact.labels.emailLabel')}
+                                <div className="mb-3">
+                                    <label
+                                        htmlFor="company"
+                                        className="form-label fw-bold form-label-contact">
+                                        {t('contact.labels.projectNameLabel')}
                                     </label>
 
                                     <input
-                                        type="email"
-                                        className={`form-control rounded-3 ${status === 'error' && error?.email ? 'is-invalid' : ''}`}
-                                        id="email" name="email"
-                                        value={formData.email}
+                                        type="text"
+                                        className="form-control rounded-3"
+                                        id="company" name="company"
+                                        value={formData.company}
                                         onChange={handleChange}
-                                        placeholder={t('contact.placeholders.emailHolder')}
-                                        required
+                                        placeholder={t('contact.placeholders.projectHolder')}
                                     />
+                                </div>
+
+                                <div className="mb-4">
+                                    <label
+                                        htmlFor="message"
+                                        className="form-label fw-bold form-label-contact">
+                                        {t('contact.labels.messageLabel')}
+                                    </label>
+
+                                    <textarea
+                                        className="form-control textarea-contact rounded-3"
+                                        id="message"
+                                        name="message"
+                                        rows="4"
+                                        value={formData.message}
+                                        onChange={handleChange}
+                                        placeholder={t('contact.placeholders.messageHolder')}
+                                    >
+                                    </textarea>
+                                </div>
 
-                                    {status === 'error' && error?.email &&
-                                        <div className="invalid-feedback fw-bold">{error.email}</div>}
+                                {status === 'success' &&
+                                    <div className="alert alert-success">
+                                        {t('contact.alerts.alertSuccess')}
+                                    </div>}
+
+                                {status === 'error' && error?.general &&
+                                    <div className="alert alert-danger">
+                                        {t('contact.alerts.alertError')}
+                                    </div>}
+
+
+                                <div className="d-flex flex-column flex-lg-row gap-3">
+                                    <button
+                                        type="submit"
+                                        className="btn btn-submit-contact fw-semibold btn-lg rounded-pill px-5"
+                                        disabled={status === 'loading'}
+                                    >
+                                        {status === 'loading' ? `${t('contact.alerts.loading')}` : `${t('contact.formButton')}`}
+                                    </button>
+                                    <a
+                                        href="https://wa.me/593978879838"
+                                        target="_blank"
+                                        rel="noopener noreferrer"
+                                        className="btn btn-outline btn-lg rounded-pill px-5 w-100"
+                                    >
+                                        {t('contact.whatsAppButton')} <FontAwesomeIcon icon={faWhatsapp} />
+                                    </a>
                                 </div>
-                            </div>
-
-                            <div className="mb-3">
-                                <label
-                                    htmlFor="company"
-                                    className="form-label fw-bold form-label-contact">
-                                    {t('contact.labels.projectNameLabel')}
-                                </label>
-
-                                <input
-                                    type="text"
-                                    className="form-control rounded-3"
-                                    id="company" name="company"
-                                    value={formData.company}
-                                    onChange={handleChange}
-                                    placeholder={t('contact.placeholders.projectHolder')}
-                                />
-                            </div>
-
-                            <div className="mb-4">
-                                <label
-                                    htmlFor="message"
-                                    className="form-label fw-bold form-label-contact">
-                                    {t('contact.labels.messageLabel')}
-                                </label>
-
-                                <textarea
-                                    className="form-control textarea-contact rounded-3"
-                                    id="message"
-                                    name="message"
-                                    rows="4"
-                                    value={formData.message}
-                                    onChange={handleChange}
-                                    placeholder={t('contact.placeholders.messageHolder')}
-                                >
-                                </textarea>
-                            </div>
-
-                            {status === 'success' &&
-                                <div className="alert alert-success">
-                                    {t('contact.alerts.alertSuccess')}
-                                </div>}
-
-                            {status === 'error' && error?.general &&
-                                <div className="alert alert-danger">
-                                    {t('contact.alerts.alertError')}
-                                </div>}
-
-
-                            <div className="d-flex flex-column flex-lg-row gap-3">
-                                <button
-                                    type="submit"
-                                    className="btn btn-submit-contact fw-semibold btn-lg rounded-pill px-5"
-                                    disabled={status === 'loading'}
-                                >
-                                    {status === 'loading' ? `${t('contact.alerts.loading')}` : `${t('contact.formButton')}`}
-                                </button>
-                                <a
-                                    href="https://wa.me/593978879838"
-                                    target="_blank"
-                                    rel="noopener noreferrer"
-                                    className="btn btn-outline btn-lg rounded-pill px-5 w-100"
-                                >
-                                    {t('contact.whatsAppButton')} <FontAwesomeIcon icon={faWhatsapp} />
-                                </a>
-                            </div>
-                        </form>
+                            </form>
 
+                        </div>
                     </div>
-                </div>    
+                </div>
+            </section>
+            <div className="h-100 mb-4">
+                <br />
             </div>
-        </section>
-        <div className="h-100 mb-4">
-            <br/>
-        </div>
-    </>
+        </>
     );
 };
 
diff --git a/src/front/main.jsx b/src/front/main.jsx
index 15c01ecd4d..77aff83736 100644
--- a/src/front/main.jsx
+++ b/src/front/main.jsx
@@ -4,17 +4,11 @@ import './index.css'  // Global styles for your application
 import { RouterProvider } from "react-router-dom";  // Import RouterProvider to use the router
 import { router } from "./routes";  // Import the router configuration
 import { StoreProvider } from './hooks/useGlobalReducer';  // Import the StoreProvider for global state management
-import { BackendURL } from './components/BackendURL';
 import 'bootstrap/dist/css/bootstrap.min.css';
 import './i18n';
 
 const Main = () => {
 
-    if (! import.meta.env.VITE_BACKEND_URL || import.meta.env.VITE_BACKEND_URL == "") return (
-        <React.StrictMode>
-            <BackendURL />
-        </React.StrictMode>
-    );
     return (
         <React.StrictMode>
             <Suspense