Herramientas que usamos y recomendamos
Una selección honesta de herramientas que facilitan el desarrollo web. Solo recomendamos lo que realmente usamos o hemos probado a fondo. Cada herramienta incluye para qué sirve, cuándo usarla y por qué la elegimos.
🎯 Cómo usar esta página
Hemos organizado las herramientas por categoría para que encuentres rápidamente lo que necesitas según la fase en la que estés. Si estás empezando desde cero, te recomendamos empezar por los editores de código y el hosting gratuito. Si ya tienes tu web publicada, pasa directamente a SEO y analítica. ¿No sabes por dónde empezar? Lee nuestra guía completa para principiantes.
🌐 Hosting y despliegue
Servicios para alojar y publicar tus webs en internet. Si estás empezando, las opciones gratuitas son más que suficientes. Aprende cómo usarlas en nuestra guía: Cómo subir una web gratis a Netlify o Vercel.
Hosting gratuito para webs estáticas con HTTPS, formularios integrados y despliegue automático desde Git. La opción más fácil: arrastra tu carpeta y tu web está online en segundos. Ideal para portafolios, blogs y proyectos personales.
Gratis · Estático · RecomendadoPlataforma optimizada para frameworks modernos (Next.js, Vite) con despliegue instantáneo, CDN global y tier gratuito generoso. Perfecta si usas Vite o React. Requiere Git para subir proyectos.
Gratis · ModernoHosting compartido económico con buen rendimiento. Buena opción si necesitas PHP, bases de datos o WordPress con un presupuesto ajustado. Incluye certificado SSL y dominio gratis el primer año.
Desde ~3€/mes🔗 Dominios
Tu dominio es la dirección de tu web. Elegir el registrador correcto te ahorra dinero y problemas a largo plazo. Más detalles sobre costes en: Cuánto cuesta mantener una web al año.
Registrador de dominios con precios transparentes y bajos. Incluye WHOIS privacy gratis, SSL gratis y un panel de control sencillo. Ideal para principiantes.
Desde ~9€/año · RecomendadoVende dominios al precio de coste (sin margen). Además ofrece CDN y protección DDoS gratuitos. Ideal si quieres el mejor precio posible y ya usas Cloudflare como CDN.
Precio coste · CDN incluidoUno de los registradores más populares. Buenos precios, WHOIS privacy incluido y DNS propios. Interfaz intuitiva y soporte por chat en vivo.
Desde ~10€/año📝 Editores de código
El editor de código es tu herramienta principal como desarrollador. Elige uno que te resulte cómodo y extensible. Si no sabes cuál elegir, empieza con VS Code: es el estándar del sector.
El editor más popular del mundo. Gratuito, open source, con miles de extensiones. Soporte nativo para HTML, CSS, JavaScript, Git y terminal integrado. Es el que usamos para todo en DevDesdeCero.
Gratis · ImprescindibleEditor ultra rápido y ligero. Excelente para quienes prefieren un editor minimalista sin configuración excesiva. Licencia de pago, pero uso gratuito ilimitado para evaluación.
Ligero · RápidoEditor online para experimentar con HTML, CSS y JavaScript. Perfecto para prototipar ideas rápidas, compartir snippets y aprender viendo código de otros desarrolladores.
Online · Gratis📚 Aprender Frontend
Recursos imprescindibles para aprender a programar, consultar dudas rápidas y entender cómo funciona el HTML, CSS y JS sin depender de inteligencia artificial. Perfectos para acompañar tu ruta de aprendizaje.
El sitio legendario donde millones aprendimos a programar. Tutoriales directos, referencias completas y un editor integrado "Try it Yourself" para probar código al instante. La mejor documentación para principiantes.
Visitar W3SchoolsUna "chuleta" interactiva espectacular. Tienes a mano todas las etiquetas HTML, selectores CSS y métodos de JavaScript en una sola pantalla. Ideal para cuando te atascas y quieres ver la sintaxis rápidamente.
Visitar CheatSheetPlataforma gratuita y sin ánimo de lucro donde puedes conseguir certificaciones en Responsive Web Design aprendiendo con proyectos reales. Es el complemento perfecto para tu formación.
Visitar FreeCodeCamp📊 Analítica y SEO
Mide el rendimiento de tu web y entiende cómo llegan tus visitantes. Estas herramientas son esenciales si quieres preparar tu web para AdSense o mejorar tu posicionamiento en Google.
La herramienta de analítica web más completa y utilizada. Gratis, potente y con informes detallados sobre tráfico, comportamiento y conversiones. Imprescindible para cualquier web seria.
Gratis · EsencialMonitoriza cómo indexa Google tu web, envía tu sitemap, descubre qué búsquedas te traen tráfico y detecta errores de rastreo. El primer paso para cualquier estrategia SEO.
Gratis · SEOHerramienta de Google que analiza la velocidad y rendimiento de tu web. Muestra Core Web Vitals y sugerencias concretas de mejora. Úsala antes de publicar. Más sobre esto en: Cómo hacer una web rápida.
Gratis · GoogleHerramienta de investigación de palabras clave, análisis de competencia y auditorías SEO básicas. El tier gratuito permite algunas búsquedas diarias, suficiente para empezar.
FreemiumCrawler SEO que analiza tu web como lo haría un buscador. Detecta errores 404, titles duplicados, meta tags incompletos y problemas de estructura. Gratis hasta 500 URLs.
Gratis hasta 500 URLsAlternativa ligera y respetuosa con la privacidad a Google Analytics. Sin cookies, GDPR-friendly y con un dashboard limpio y fácil de entender. Ideal si la privacidad es prioridad.
Desde 9€/mes⚡ Productividad
Herramientas que aceleran tu flujo de trabajo como desarrollador y te ayudan a mantener tus proyectos organizados.
Plataforma de control de versiones y colaboración. Almacena tu código, trabaja en equipo y aprende de proyectos open source. Además, conecta directamente con Netlify y Vercel para despliegue automático.
Gratis · EsencialHerramienta todo-en-uno para organizar notas, proyectos, tareas y documentación. Perfecto para planificar tus webs y llevar control de tu aprendizaje.
Gratis · OrganizaciónHerramienta de diseño colaborativo en el navegador. Ideal para crear wireframes, prototipos y diseños de interfaz antes de escribir código. El plan gratuito es más que suficiente para empezar.
Gratis · Diseño🤖 IA para desarrollo
La inteligencia artificial puede multiplicar tu productividad como desarrollador si la usas con cabeza. No sustituye aprender las bases, pero acelera el trabajo repetitivo.
Asistente de IA que sugiere código mientras escribes en tu editor. Acelera la escritura de código repetitivo y te ayuda a explorar nuevas APIs. Gratis para estudiantes con GitHub Education.
Desde 10$/mes · Gratis estudiantesLLMs que puedes usar para explicar conceptos, depurar errores, generar snippets y aprender a tu ritmo. Úsalos como complemento de tu aprendizaje, nunca como sustituto de entender el código.
Gratis / PremiumAlternativa gratuita a Copilot con autocompletado inteligente para VS Code. Funciona bien para HTML, CSS y JavaScript básico. Buena opción si no quieres pagar por Copilot.
Gratis🛠️ Frameworks y herramientas de build
Cuando domines las bases de HTML, CSS y JavaScript, estas herramientas acelerarán tu flujo de trabajo. Si eres principiante, primero lee sobre WordPress vs código puro para decidir tu camino.
Herramienta de build ultrarrápida para proyectos web modernos. Hot reload instantáneo, soporte para módulos ES y configuración mínima. Te contamos todo en: Qué es Vite y cuándo merece la pena usarlo.
Gratis · Open Source · RecomendadoFramework para webs de contenido ultrarrápidas. Genera HTML estático por defecto con opción de hidratación parcial. Perfecto para blogs y sitios de nicho que priorizan la velocidad.
Gratis · RápidoEl CMS más popular del mundo. Gestiona contenido sin tocar código. Ideal para blogs, tiendas y sitios que necesitan actualizaciones frecuentes. Lee nuestra comparativa WordPress vs código puro.
Gratis · CMS🏎️ Rendimiento y optimización
La velocidad de tu web afecta directamente al SEO, la experiencia del usuario y la aprobación de AdSense. Aprende más en: Cómo hacer una web rápida que cargue bien en móvil.
Herramienta de Google para comprimir imágenes en el navegador. Convierte a WebP, AVIF y otros formatos modernos. Reduce el peso de tus imágenes hasta un 80% sin perder calidad visible.
Gratis · OnlineIntegrado en Chrome DevTools (F12 → Lighthouse). Audita rendimiento, accesibilidad, SEO y buenas prácticas de tu web. Genera un informe con puntuación y recomendaciones concretas.
Gratis · Integrado en ChromeAnaliza la velocidad de tu web desde diferentes ubicaciones geográficas. Muestra tiempos de carga, tamaño de página y waterfall detallado de recursos. Complementa bien a PageSpeed Insights.
Gratis · Detallado