Saltar al contenido
Entrar
Plano del curso

Misión 22 de 23

  1. Prepara el proyecto
  2. Especifica
  3. Decide la tecnología y planea
  4. Construye por fases
  5. Revisa antes de publicar
  6. Publica en Cloudflare Pages
  7. Opcional: tu dominio
  8. Lista final

Proyecto — tu web publicada en internet

Proyecto final: de la idea a una web publicada gratis en Cloudflare Pages, usando todo el flujo del curso — especificar, planear, construir y revisar.

  • Proyecto final
  • 45 min
  • 8 pasos
  • Revisada el

Al terminar sabrás

  • Aplicar el flujo completo del curso a un proyecto real
  • Construir por partes, con commits y revisiones en cada una
  • Publicar tu web gratis en Cloudflare Pages con una URL que puedes compartir

Toca juntarlo todo. Vas a convertir la frase que apuntaste en la lección 1 en una web publicada. Calcula una tarde; puedes repartirlo en varios días, porque cada paso queda guardado.

Prepara el proyecto

En la terminal:

Terminal
cd ~/proyectos
mkdir mi-web
cd mi-web
claude

Y dentro de Claude Code:

Pídeselo a Claude
Inicia un repositorio Git con un .gitignore adecuado y haz el primer commit.

Especifica

Usa la skill que creaste en la lección 14:

Pídeselo a Claude
/especificar <pega aquí la frase de la lección 1>

Responde la entrevista con calma. Si algo no lo sabes (fotos, precios, textos legales), dilo: debe quedar en pendientes, no inventado.

Al terminar tendrás docs/especificacion.md. Léelo entero. Es tu contrato.

Decide la tecnología y planea

Entra en modo plan (Shift + Tab) y usa el modelo más potente:

Pídeselo a Claude
Lee @docs/especificacion.md. Propón la tecnología más sencilla que cumpla todo
(una web estática es suficiente para la mayoría de negocios: por ejemplo Astro o
HTML y CSS), justifica la elección y haz un plan por fases pequeñas, cada una
con una forma de comprobar que funciona. La publicación será en Cloudflare Pages.
Guarda el plan en docs/plan.md con una casilla por paso.

Revísalo con las cuatro preguntas de la lección 13 antes de aprobarlo.

Luego:

Pídeselo a Claude
/init

Y añade al CLAUDE.md tus reglas: tono, colores, «no inventes datos», «haz commit al terminar cada fase», «comprueba en móvil antes de dar algo por terminado».

Construye por fases

Pasa a modo auto o aceptar ediciones y ve fase a fase:

Pídeselo a Claude
Haz la fase 1 de @docs/plan.md. Cuando termine, arranca la web en local en
segundo plano, compruébala en móvil y escritorio, márcala en el plan y haz commit.

Después de cada fase:

  1. Ábrela tú en el navegador y en tamaño móvil.
  2. Pide los cambios que veas, de uno en uno y concretos.
  3. /clear antes de la siguiente fase, para empezar con el contexto limpio. El plan en el archivo hace de memoria.

Revisa antes de publicar

Pídeselo a Claude
/revisar-textos
Pídeselo a Claude
/code-review

Y tu propia revisión, como cliente: rellena el formulario, pulsa cada botón, mírala en tu móvil real. Pide también:

Pídeselo a Claude
Comprueba que la web tiene título y descripción para Google en cada página,
textos alternativos en las imágenes, favicon y que carga rápido. Dime qué falta.

Publica en Cloudflare Pages

Cloudflare Pages publica webs estáticas gratis, con HTTPS y en servidores rápidos de todo el mundo. Necesitas:

  • Una cuenta gratuita en cloudflare.com (la creas tú).
  • Node.js en su versión LTS, desde nodejs.org, si tu proyecto no lo tenía ya.

Pídeselo así:

Pídeselo a Claude
Quiero publicar esta web en Cloudflare Pages con wrangler, en un proyecto
llamado mi-web. Genera la versión de producción y publícala. Si tengo que
instalar algo o iniciar sesión, para y dime exactamente qué hago yo.
Al terminar, dame la URL.

Cuando haga falta, se abrirá el navegador para que tú inicies sesión en Cloudflare y autorices a wrangler. Claude no necesita tu contraseña y no debe pedírtela.

Al final tendrás una dirección del tipo https://mi-web.pages.dev. Ábrela en el móvil y compártela.

Y guarda cómo se publica, para la próxima vez:

Pídeselo a Claude
Añade al CLAUDE.md cómo se publica esta web y crea la skill /publicar
de la lección 17 adaptada a este proyecto.

Opcional: tu dominio

Si tienes un dominio (tunegocio.es), puedes conectarlo al proyecto desde el panel de Cloudflare, en tu proyecto de Pages, en Dominios personalizados. Pide a Claude que te guíe paso a paso según dónde lo tengas comprado.

Lista final

  • La especificación y el plan están en docs/.
  • Cada fase tiene su commit.
  • Nada inventado: los pendientes están marcados como pendientes.
  • Revisada en un móvil de verdad.
  • Publicada, con una URL que funciona.
  • El CLAUDE.md explica cómo arrancarla y publicarla.

Si has marcado todo, ya no «estás aprendiendo Claude Code»: lo estás usando.

Documentación oficial