Licorería Santo Pecado es un sitio completamente estático — solo contiene HTML, CSS e imágenes, sin código del lado del servidor ni base de datos. Esto significa que puede publicarse de forma gratuita en cualquier servicio de hosting estático en cuestión de minutos, sin configuración de servidor ni variables de entorno.Documentation Index
Fetch the complete documentation index at: https://mintlify.com/marvinalban30/CSS3-avanzado-y-Bootstrap-5/llms.txt
Use this file to discover all available pages before exploring further.
Opciones de hosting
GitHub Pages
Gratuito para repositorios públicos. Se activa directamente desde la configuración del repositorio en github.com/pages y sirve el sitio desde la misma rama donde vive el código.
Netlify
Soporta deploy mediante arrastrar y soltar la carpeta del proyecto, o conexión continua a GitHub para publicar automáticamente en cada push a la rama principal.
Vercel
Deploy automático desde GitHub con generación de URL de previsualización por cada rama o pull request, ideal para revisar cambios antes de publicar en producción.
GitHub Pages
GitHub Pages es la opción más directa si el proyecto ya se encuentra en un repositorio público de GitHub.Asegúrate de que el repositorio es público
En GitHub, abre el repositorio y verifica que su visibilidad sea Public. GitHub Pages no está disponible para repositorios privados en el plan gratuito.
Accede a la configuración de Pages
En la página principal del repositorio, haz clic en la pestaña Settings y luego en Pages en el menú lateral izquierdo.
Configura la rama de publicación
En la sección Branch, selecciona
main como rama fuente y la carpeta / (root) como directorio de publicación. Haz clic en Save.Guarda los cambios
Haz clic en el botón Save para confirmar la configuración. GitHub iniciará el proceso de publicación automáticamente.
El archivo
index.html del proyecto se encuentra dentro del subdirectorio CSS3 avanzado y Bootstrap 5/, no en la raíz del repositorio. Para que GitHub Pages lo sirva correctamente con la opción / (root), considera mover los archivos (index.html, styles.css y la carpeta assets/) a la raíz del repositorio, o utilizar la carpeta /docs como directorio de publicación si reorganizas el proyecto de esa forma.Netlify (Drag & Drop)
Netlify ofrece la forma más rápida de publicar el sitio sin necesidad de línea de comandos ni configuración adicional.Crea una cuenta en Netlify
Visita https://netlify.com y regístrate con tu cuenta de GitHub, GitLab o correo electrónico. El plan gratuito es suficiente para este proyecto.
Arrastra la carpeta del proyecto al dashboard
En el dashboard de Netlify, localiza el área que indica “Drag and drop your site output folder here”. Arrastra la carpeta
CSS3 avanzado y Bootstrap 5/ (la que contiene index.html) directamente a esa zona desde tu explorador de archivos.Obtén tu URL pública
Netlify desplegará el sitio en segundos y generará automáticamente una URL pública con un nombre aleatorio, por ejemplo:Puedes renombrar el sitio desde Site settings > Site details > Change site name.
Conecta GitHub para deploys automáticos (opcional)
Para que Netlify publique una nueva versión del sitio automáticamente cada vez que hagas push al repositorio, ve a Site settings > Build & deploy > Continuous deployment y conecta el repositorio de GitHub. A partir de ese momento, cada push a
main desencadenará un nuevo deploy sin intervención manual.Consideraciones antes del deploy
Antes de subir los archivos a cualquier plataforma, verifica los siguientes puntos para asegurarte de que el sitio funcione correctamente en producción:- Imágenes incluidas: Asegúrate de que todos los archivos de
assets/img/— incluyendoimagen1.jpgy cualquier imagen que hayas añadido — estén presentes en la carpeta que subirás al hosting. - Rutas relativas: Las rutas de imágenes en
index.htmlusan la forma relativaassets/img/imagen1.jpg, lo que las hace compatibles con hosting estático sin necesidad de configurar ninguna URL base. - Bootstrap desde CDN: El CSS y el JS de Bootstrap 5.3.3 se cargan desde
cdn.jsdelivr.net. No necesitas incluir ningún archivo de Bootstrap en el paquete que subes al hosting — solo asegúrate de que el sitio desplegado tenga acceso a internet. - Formulario de contacto sin backend: El
<form>de la sección#contactoactualmente no envía datos a ningún servidor. Para recibir mensajes reales, considera integrar Formspree o activar Netlify Forms (ver tip a continuación).