Saltar al contenido
Cursos/Crea webs profesionales con IA desde cero/Organiza componentes, páginas y rutas

Organiza componentes, páginas y rutas

Crea una estructura comprensible para que tú y Codex podáis modificar la web sin romper otras páginas.

Lección 14 de 4775 min Construcción profesional Codex + GPT-5.6 Sol

Resultado visible

La estructura del proyecto reflejará responsabilidades: páginas, componentes, contenido, servicios y validaciones. Una modificación local no obligará a copiar y pegar en todas las rutas.

Ejemplo de estructura

app/
  page.tsx
  servicios/page.tsx
  contacto/page.tsx
components/
  SiteHeader.tsx
  ServiceCard.tsx
lib/
  content.ts
  validation.ts
public/
tests/

Extrae un componente cuando existe repetición real o una responsabilidad clara. Evita un componente universal con veinte propiedades. Mantén textos editables separados de lógica cuando el equipo no técnico deba revisarlos.

Prompt

Explica la estructura actual y detecta duplicación, acoplamiento y nombres
ambiguos. Propón una reorganización mínima con un mapa antes/después.
Hazla en pasos pequeños, ejecutando las pruebas tras cada paso. No cambies
el aspecto ni el comportamiento. Señala cualquier archivo que no entiendas.

Verificación

Busca contenido duplicado y enlaces escritos a mano. Cambia temporalmente un dato compartido en su fuente y confirma que se actualiza donde corresponde. Revierte la prueba.

Fuentes oficiales