Superadrian Design

22/05/2026

TEMA 43: ¿CÓMO FUNCIONA EL VERSIONADO SEMÁNTICO?

El versionado semántico es un sistema utilizado para organizar versiones de software usando el formato MAJOR.MINOR.PATCH, como por ejemplo v1.4.2. El número major cambia cuando hay modificaciones incompatibles, minor cuando se agregan nuevas funciones compatibles y patch para corregir errores pequeños. Este sistema ayuda a mantener compatibilidad y realizar actualizaciones seguras en aplicaciones y librerías modernas.

“El significado secreto de las versiones 📦”

21/05/2026

14/05/2026

🔥🔥

08/05/2026

✨ CSS can do more than you think!
Create stunning reflection effects with just one line of code using -webkit-box-reflect 🚀

💡 Small CSS tricks = Big UI impact
Perfect for:
✔️ Portfolio websites
✔️ Product cards
✔️ Hero sections
✔️ Modern UI animations

🎨 Want your designs to look premium?
Start using creative CSS effects like this today!

🔥 Frontend developers, would you use this effect in your projects?

27/04/2026

¡Google acaba de hacer DESIGN.md de código abierto!

Un formato para decirle a la IA cómo debe diseñar tu UI.

Colores, tipografías, espacios, componentes y reglas visuales...

Para que la IA genere interfaces siguiendo tu estilo:
→ github.com/google-labs-code/design.md

24/04/2026

Cómo compilar y subir un proyecto de React a producción

Existen diferentes formas de llevar una aplicación React a producción, desde métodos manuales hasta procesos automatizados. La elección depende del tipo de hosting y del nivel de control que se requiera.

1. Método básico (despliegue manual)

Este método es adecuado cuando el hosting solo permite subir archivos, como en cPanel u hosting compartido.

Paso 1
Ejecutar el comando en la raíz del proyecto:
npm run build

Paso 2
Se genera una carpeta optimizada para producción:

dist (Vite)
build (Create React App)

Paso 3
Crear un archivo .htaccess para manejar correctamente las rutas en aplicaciones SPA.

Paso 4
Comprimir los archivos generados en formato .zip.

Paso 5
Subir los archivos al servidor mediante el administrador de archivos del hosting.

Resultado
La aplicación queda disponible en producción.

2. Método intermedio (uso de control de versiones con Git)

Permite gestionar versiones del proyecto y facilitar futuras actualizaciones.

Paso 1
Crear un repositorio en GitHub.

Paso 2
Inicializar Git en el proyecto:
git init

Paso 3
Agregar el repositorio remoto:
git remote add origin

Paso 4
Subir el código:
git add .
git commit -m "Primer commit"
git push -u origin main

Paso 5
Configurar Git Version Control en el hosting.

Paso 6
Clonar el repositorio en el servidor.

Resultado
Se obtiene control de versiones y facilidad para desplegar actualizaciones.

3. Método avanzado (automatización y despliegue profesional)

Enfoque utilizado en entornos más robustos y escalables.

Opción A: CI/CD
Automatizar el build y despliegue con herramientas como GitHub Actions o GitLab CI/CD.

Opción B: Docker
Crear una imagen de la aplicación y desplegarla en contenedores.

Opción C: Servidor con proxy inverso
Configurar Nginx para servir la aplicación y gestionar rutas correctamente.

Opción D: Plataformas modernas
Utilizar servicios como Vercel, Netlify o GitHub Pages para despliegue automático.

Resultado
Despliegue automatizado, mayor escalabilidad y mejores prácticas de desarrollo.

Conclusión

Desde subir archivos manualmente hasta implementar CI/CD, existen múltiples formas de desplegar un proyecto React. Elegir el método adecuado depende del entorno, el nivel técnico y la necesidad de automatización del proyecto.

23/03/2026

¡Cuidado con usar la unidad 𝘷𝘩 en CSS en móviles!
No cuenta cuando la barra del navegador se muestra.

Mejora usa 𝘥𝘷𝘩: se ajusta dinámicamente siempre a la altura real de la ventana.