Este proyecto es una página web informativa desarrollada con Next.js, enfocada en cremas corporales hidratantes y reafirmantes. La idea detrás del proyecto es aplicar buenas prácticas de SEO, usar etiquetas semánticas de HTML, optimizar la estructura de URLs, y aplicar investigación de palabras clave (keyword research) para mejorar el posicionamiento en buscadores.
Aunque el proyecto no está finalizado, ya cuenta con una interfaz bonita, responsiva, y bien organizada a nivel de componentes en React.
Puedes ver una versión en línea aquí: Demo en Netlify
✅ Página principal informativa sobre cremas corporales
✅ Dos páginas dedicadas a reseñas y comparativas de cremas hidratantes y reafirmantes
✅ Contenido con palabras clave investigadas e incluidas
✅ Diseño responsivo adaptable a dispositivos móviles
✅ Arquitectura modular de componentes en React
✅ Uso básico de prácticas SEO: etiquetas semánticas, estructura de encabezados, etc.
- Next.js
- React
- CSS Modules / Styled Components (según implementación)
- Netlify para el despliegue
- Uso de etiquetas HTML semánticas (
<main>,<article>,<section>,<header>,<footer>) - Inclusión de palabras clave relevantes como mejor crema hidratante, crema reafirmante, hidratación piel seca
- Preparación para optimización de estructura de URLs amigables
- Preparación para implementar metas (
title,description), Open Graph y JSON-LD
- Terminar redacción de los textos en todas las páginas
- Añadir más páginas de productos y categorías
- Optimizar las imágenes (peso,
alt,title) - Implementar
next-seoo configuración personalizada para metas y Open Graph - Añadir sitemap.xml y robots.txt
- Mejorar la accesibilidad (a11y)
- Escribir pruebas unitarias (opcional)
# Clonar el repositorio
git clone https://github.com/PepeBeto-code/cremas.git
# Entrar al directorio del proyecto
cd cremas
# Instalar dependencias
npm install
# Ejecutar en modo desarrollo
npm run dev