[{"data":1,"prerenderedAt":455},["ShallowReactive",2],{"es-main-blog_es-\u002Fes\u002Fblog\u002Fhello\u002F":3,"es-alternative-blog_en-\u002Fblog\u002Fhello":229,"blog_es-related-\u002Fes\u002Fblog\u002Fhello\u002F":402},{"id":4,"title":5,"body":6,"date":212,"description":213,"extension":214,"image":215,"meta":216,"navigation":217,"path":218,"readingTime":219,"schemaOrg":215,"seo":220,"stem":221,"tags":222,"toc":217,"updatedAt":215,"__hash__":228},"blog_es\u002Fes\u002Fblog\u002F0001.hello.md","De Svelte a Nuxt: Reconstruyendo mi portfolio en 2025",{"type":7,"value":8,"toc":201},"minimark",[9,39,44,47,50,54,57,60,63,99,102,106,109,113,133,137,155,167,171,191,195,198],[10,11,12,13,20,21,26,27,32,33,38],"p",{},"Estamos en 2025 y acabo de publicar una versión completamente nueva de mi web personal. He migrado de un stack basado en ",[14,15,19],"a",{"href":16,"rel":17},"https:\u002F\u002Fsvelte.dev\u002F",[18],"nofollow","Svelte y Sapper"," a ",[14,22,25],{"href":23,"rel":24},"https:\u002F\u002Fnuxt.com\u002F",[18],"Nuxt",", ",[14,28,31],{"href":29,"rel":30},"https:\u002F\u002Ftailwindcss.com\u002F",[18],"Tailwind CSS"," y un monorepo con ",[14,34,37],{"href":35,"rel":36},"https:\u002F\u002Fturborepo.dev\u002F",[18],"Turborepo",". No ha sido un cambio estético, sino una reescritura completa, fruto de cinco años de evolución en el frontend y de las ganas de usar en casa las mismas herramientas que en el trabajo.",[40,41,43],"h2",{"id":42},"la-decisión-de-2020-por-qué-svelte","La decisión de 2020: ¿Por qué Svelte?",[10,45,46],{},"En 2020, cuando construí la primera versión de esta web, el ecosistema de Vue estaba en plena transición. Vue 3 estaba en pruebas, y se lanzó justo cuando yo ya había acabado mi página web. Los primeros dos años de Vue 3 fueron un dolor y Nuxt 3 no fue estable hasta noviembre de 2022. El camino de migración desde Vue 2 era incierto y, francamente, el futuro parecía algo inestable.",[10,48,49],{},"En aquel momento, Svelte y Sapper, su framework de aplicaciones, eran una alternativa muy atractiva: rápida, sencilla y estable. Fue la decisión acertada para su momento.",[40,51,53],{"id":52},"el-punto-de-inflexión-ecosistema-vs-diy","El punto de inflexión: Ecosistema vs. DIY",[10,55,56],{},"Cinco años después, la situación ha cambiado. Svelte sigue siendo un gran framework, pero el ecosistema de Nuxt ha crecido hasta cubrir casi todo lo que necesita una web como esta.",[10,58,59],{},"Con mi antigua web en Sapper, tuve que construir desde cero muchas funcionalidades: metaetiquetas para SEO, gestión de contenido para el blog y optimización de imágenes. Aprendí mucho, pero mantener ese código a medida se convirtió en un engorro. Además, migrar de Sapper a SvelteKit era un proyecto grande para el que, simplemente, no tenía tiempo.",[10,61,62],{},"Nuxt, en cambio, tiene módulos que resuelven todo eso sin configuración:",[64,65,66,75,83,91],"ul",{},[67,68,69,74],"li",{},[14,70,73],{"href":71,"rel":72},"https:\u002F\u002Fcontent.nuxt.com\u002F",[18],"@nuxt\u002Fcontent"," para gestionar el contenido desde archivos.",[67,76,77,82],{},[14,78,81],{"href":79,"rel":80},"https:\u002F\u002Fnuxt.com\u002Fmodules\u002Fseo",[18],"@nuxtjs\u002Fseo"," para el SEO y los metadatos, con valores por defecto que sirven sin tocar nada.",[67,84,85,90],{},[14,86,89],{"href":87,"rel":88},"https:\u002F\u002Fnuxt.com\u002Fmodules\u002Fimage",[18],"@nuxt\u002Fimage"," para optimizar las imágenes.",[67,92,93,98],{},[14,94,97],{"href":95,"rel":96},"https:\u002F\u002Fnuxt.com\u002Fmodules\u002Ficon",[18],"@nuxt\u002Ficon"," para usar cualquier colección de iconos sin cargarla entera.",[10,100,101],{},"Con eso resuelto, puedo centrarme en escribir.",[40,103,105],{"id":104},"alineación-con-mi-flujo-de-trabajo-diario","Alineación con mi flujo de trabajo diario",[10,107,108],{},"En el frontend de mi trabajo usamos Vue 3 con la Composition API, TypeScript y Tailwind. Tiene sentido que mi web personal use las mismas tecnologías que uso a diario. Trabajar con Nuxt me resulta natural y sencillo, una vez entiendes su filosofía.",[40,110,112],{"id":111},"el-nuevo-stack-de-un-vistazo","El nuevo stack de un vistazo",[10,114,115,118,119,122,123,128,129,132],{},[14,116,25],{"href":23,"rel":117},[18]," es el núcleo de la aplicación. ",[14,120,31],{"href":29,"rel":121},[18]," se encarga de los estilos y ",[14,124,127],{"href":125,"rel":126},"https:\u002F\u002Fdaisyui.com\u002F",[18],"daisyUI"," añade los componentes y los temas claro y oscuro. ",[14,130,37],{"href":35,"rel":131},[18]," gestiona el monorepo, que reúne la app principal, las configuraciones compartidas y las herramientas internas en un único lugar.",[40,134,136],{"id":135},"de-bulma-a-tailwind-css-daisyui","De Bulma a Tailwind CSS & daisyUI",[10,138,139,140,145,146,150,151,154],{},"En la versión anterior de mi web usaba ",[14,141,144],{"href":142,"rel":143},"https:\u002F\u002Fbulma.io\u002F",[18],"Bulma",", que es una librería CSS estupenda. Sin embargo, mi día a día gira en torno a Tailwind CSS, y pasar del template a un fichero CSS aparte me parece el doble de trabajo, porque rara vez reutilizas las clases entre componentes ",[147,148,149],"code",{},".vue"," o ",[147,152,153],{},".svelte",".",[10,156,157,158,162,163,166],{},"Como uso Tailwind todos los días, he empezado a \"pensar\" en Tailwind a la hora de maquetar. El live reload de Vite y el enfoque ",[159,160,161],"em",{},"utility-first"," son parte de mi forma de trabajar y, una vez que piensas así, es muy difícil volver atrás. Para esta versión lo he combinado con ",[14,164,127],{"href":125,"rel":165},[18],". Me permite usar componentes ya listos cuando no me quiero complicar, y prescindir de ellos para crear algo totalmente a medida sin perder ninguna de las ventajas de Tailwind. Además, trae un sistema de temas pensado para Tailwind con el que puedes tener tantos temas como quieras.",[40,168,170],{"id":169},"el-papel-de-la-ia-en-el-desarrollo","El papel de la IA en el desarrollo",[10,172,173,174,26,179,184,185,190],{},"Esta reconstrucción también ha sido una oportunidad para probar la última generación de asistentes de código con IA. He probado (demasiadas) herramientas, como ",[14,175,178],{"href":176,"rel":177},"https:\u002F\u002Fgithub.com\u002Fgoogle-gemini\u002Fgemini-cli",[18],"Gemini CLI",[14,180,183],{"href":181,"rel":182},"https:\u002F\u002Fgithub.com\u002FAider-AI\u002Faider",[18],"Aider"," y ",[14,186,189],{"href":187,"rel":188},"https:\u002F\u002Fgithub.com\u002Ffeatures\u002Fcopilot",[18],"GitHub Copilot",". Algunos días me he sentido con superpoderes y otros, como si tuviera la gripe. Si cumplo mi objetivo de escribir más, pronto te contaré más sobre cada una.",[40,192,194],{"id":193},"y-ahora-qué","¿Y ahora qué?",[10,196,197],{},"Quiero escribir más, compartir algunas ideas que llevo mucho tiempo pensando y quizás empezar a contribuir en algún proyecto open source.",[10,199,200],{},"Gracias por leer. Nos vemos.",{"title":202,"searchDepth":203,"depth":203,"links":204},"",2,[205,206,207,208,209,210,211],{"id":42,"depth":203,"text":43},{"id":52,"depth":203,"text":53},{"id":104,"depth":203,"text":105},{"id":111,"depth":203,"text":112},{"id":135,"depth":203,"text":136},{"id":169,"depth":203,"text":170},{"id":193,"depth":203,"text":194},"2025-09-27","Estamos en 2025 y acabo de publicar una versión completamente nueva de mi web personal. He migrado de un stack basado en Svelte y Sapper a Nuxt, Tailwind CSS y un monorepo con Turborepo. No ha sido un cambio estético, sino una reescritura completa, fruto de cinco años de evolución en el frontend y de las ganas de usar en casa las mismas herramientas que en el trabajo.","md",null,{},true,"\u002Fes\u002Fblog\u002Fhello","4",{"title":5,"description":213},"es\u002Fblog\u002F0001.hello",[223,224,225,226,227],"nuxt","vue","svelte","turborepo","tailwindcss","WbdX1wcWhwLJlaWajgRNbSk58q5l_yXELpX0t2__Dy0",{"id":230,"title":231,"body":232,"date":212,"description":395,"extension":214,"image":215,"meta":396,"navigation":217,"path":397,"readingTime":219,"schemaOrg":215,"seo":398,"stem":399,"tags":400,"toc":217,"updatedAt":215,"__hash__":401},"blog_en\u002Fblog\u002F0001.hello.md","From Svelte to Nuxt: Rebuilding my portfolio in 2025",{"type":7,"value":233,"toc":386},[234,253,257,260,263,267,270,273,276,302,305,309,312,316,334,338,351,358,362,376,380,383],[10,235,236,237,241,242,26,245,248,249,252],{},"It's 2025, and I've just rolled out a complete rebuild of my personal website. I've migrated from a ",[14,238,240],{"href":16,"rel":239},[18],"Svelte and Sapper"," stack to ",[14,243,25],{"href":23,"rel":244},[18],[14,246,31],{"href":29,"rel":247},[18]," and a ",[14,250,37],{"href":35,"rel":251},[18]," monorepo. It wasn't a cosmetic update but a full rewrite, driven by five years of changes in the frontend landscape and by the wish to use the same tools at home as at work.",[40,254,256],{"id":255},"the-2020-decision-why-svelte","The 2020 decision: Why Svelte?",[10,258,259],{},"Back in 2020, when I built the first version of this site, the Vue ecosystem was in the middle of a big transition. Vue 3 was in beta, and it was released right after I had finished my website. The first two years of Vue 3 were painful, and Nuxt 3 wasn't stable until November 2022. The migration path from Vue 2 was uncertain, and frankly, the future felt a bit shaky.",[10,261,262],{},"At that time, Svelte and its companion framework, Sapper, were a compelling alternative: fast, simple and stable. It was the right choice for its time.",[40,264,266],{"id":265},"the-tipping-point-ecosystem-vs-diy","The tipping point: Ecosystem vs. DIY",[10,268,269],{},"Five years later, the tables have turned. Svelte is still a great framework, but the Nuxt ecosystem has grown to cover almost everything a site like this needs.",[10,271,272],{},"With my old Sapper site, I had to build many features from scratch: SEO meta tags, content management for the blog and image optimization. I learned a lot, but maintaining that custom code became a chore. On top of that, the migration from Sapper to SvelteKit was a big project that I simply didn't have the time for.",[10,274,275],{},"Nuxt, on the other hand, has modules that handle these concerns out of the box:",[64,277,278,284,290,296],{},[67,279,280,283],{},[14,281,73],{"href":71,"rel":282},[18]," for file-based content management.",[67,285,286,289],{},[14,287,81],{"href":79,"rel":288},[18]," for SEO and metadata, with defaults that work without any configuration.",[67,291,292,295],{},[14,293,89],{"href":87,"rel":294},[18]," for image optimization.",[67,297,298,301],{},[14,299,97],{"href":95,"rel":300},[18]," for using any icon set without shipping the whole set.",[10,303,304],{},"With that covered, I can focus on writing.",[40,306,308],{"id":307},"aligning-with-my-daily-workflow","Aligning with my daily workflow",[10,310,311],{},"The frontend side of my day job is Vue 3 with the Composition API, TypeScript and Tailwind. It makes sense for my personal site to use the same technologies I use every day. Working with Nuxt feels natural and simple, once you get its philosophy.",[40,313,315],{"id":314},"a-quick-look-at-the-new-stack","A quick look at the new stack",[10,317,318,321,322,325,326,329,330,333],{},[14,319,25],{"href":23,"rel":320},[18]," is the core of the application. ",[14,323,31],{"href":29,"rel":324},[18]," handles the styling, and ",[14,327,127],{"href":125,"rel":328},[18]," adds components and the light and dark themes. ",[14,331,37],{"href":35,"rel":332},[18]," manages the monorepo, which keeps the main app, the shared configurations and the internal tools in one place.",[40,335,337],{"id":336},"from-bulma-to-tailwind-css-daisyui","From Bulma to Tailwind CSS & daisyUI",[10,339,340,341,344,345,347,348,350],{},"In the previous version of my site, I used ",[14,342,144],{"href":142,"rel":343},[18],", and it's a great CSS library. However, my day-to-day work is rooted in Tailwind CSS. Switching between the template and a separate CSS file now feels like double the work, since you rarely reuse classes across ",[147,346,149],{}," or ",[147,349,153],{}," components.",[10,352,353,354,357],{},"Because I use Tailwind every day, I've started to \"think\" in Tailwind when it comes to styling, and once you think that way, it's hard to go back. For this rebuild, I've paired it with ",[14,355,127],{"href":125,"rel":356},[18],". It lets me opt in to pre-styled components when I don't want to overcomplicate things, and opt out to build something fully custom without losing any of Tailwind's benefits. It also comes with a theme system designed for Tailwind.",[40,359,361],{"id":360},"the-role-of-ai-in-development","The role of AI in development",[10,363,364,365,26,368,371,372,375],{},"This rebuild was also a chance to try the latest generation of AI coding assistants. I've tried (too many) tools, like the ",[14,366,178],{"href":176,"rel":367},[18],[14,369,183],{"href":181,"rel":370},[18]," and ",[14,373,189],{"href":187,"rel":374},[18],". Some days they felt like superpowers, and others like the flu. If I stick to my goal of writing more, I'll tell you more about each of them soon.",[40,377,379],{"id":378},"whats-next","What's next?",[10,381,382],{},"I want to write more, share some ideas I've been thinking about for a long time, and maybe start contributing to an open source project.",[10,384,385],{},"Thanks for reading. See you around.",{"title":202,"searchDepth":203,"depth":203,"links":387},[388,389,390,391,392,393,394],{"id":255,"depth":203,"text":256},{"id":265,"depth":203,"text":266},{"id":307,"depth":203,"text":308},{"id":314,"depth":203,"text":315},{"id":336,"depth":203,"text":337},{"id":360,"depth":203,"text":361},{"id":378,"depth":203,"text":379},"It's 2025, and I've just rolled out a complete rebuild of my personal website. I've migrated from a Svelte and Sapper stack to Nuxt, Tailwind CSS and a Turborepo monorepo. It wasn't a cosmetic update but a full rewrite, driven by five years of changes in the frontend landscape and by the wish to use the same tools at home as at work.",{},"\u002Fblog\u002Fhello",{"title":231,"description":395},"blog\u002F0001.hello",[223,224,225,226,227],"MhczjcB9w1fcXFSWQ-CArrkV-jbGF9kfVqlmgwEk5B0",[403,414,426,436,445,453],{"id":404,"path":405,"title":406,"description":407,"date":408,"readingTime":409,"tags":410},"blog_es\u002Fes\u002Fblog\u002F0006.lint-tailwind-css-v4-with-eslint.md","\u002Fes\u002Fblog\u002Flint-tailwind-css-v4-with-eslint","@angelblanco\u002Feslint-config 3.0 ya disponible, ahora con Tailwind CSS","@angelblanco\u002Feslint-config 3.0 ya está en npm: lint opcional de Tailwind CSS v4, @antfu\u002Feslint-config v10 y ESLint 10.","2026-11-07","2",[411,227,412,413],"eslint","tooling","npm",{"id":415,"path":416,"title":417,"description":418,"date":419,"readingTime":420,"tags":421},"blog_es\u002Fes\u002Fblog\u002F0005.apt-install-php-85-on-ubuntu-26.md","\u002Fes\u002Fblog\u002Fapt-install-php-85-on-ubuntu-26","Instalar PHP 8.5 con apt en Ubuntu 26.04","Instala PHP 8.5 y Composer en Ubuntu 26.04 LTS con apt desde el repositorio packages.sury.org de Ondřej Surý y mantenlos al día con apt upgrade.","2026-11-06","12",[422,423,424,425],"php","ubuntu","composer","bash",{"id":427,"path":428,"title":429,"description":430,"date":431,"readingTime":432,"tags":433},"blog_es\u002Fes\u002Fblog\u002F0004.apt-install-node-26-on-ubuntu-26.md","\u002Fes\u002Fblog\u002Fapt-install-node-26-on-ubuntu-26","Instalar Node.js 26 con apt en Ubuntu 26.04","El 21 de octubre de 2026, Node.js publicó parches de seguridad para diez vulnerabilidades que afectan a sus versiones con soporte, cuatro de ellas graves, incluida una ejecución remota de código. Las versiones sin soporte, como Node.js 20 y 25, no recibirán actualizaciones.","2026-11-05","8",[434,423,435,425],"nodejs","javascript",{"id":437,"path":438,"title":439,"description":440,"date":441,"readingTime":442,"tags":443},"blog_es\u002Fes\u002Fblog\u002F0003.create-your-eslint-config.md","\u002Fes\u002Fblog\u002Fcreate-your-eslint-config","Crea tu propia configuración de ESLint y compártela entre proyectos","Si alguna vez has trabajado en varios proyectos, conoces el aburrimiento de copiar configuraciones de ESLint de un repositorio a otro. Cada vez que empiezas un proyecto nuevo, o partes de cero o copias el archivo eslint.config.js del anterior. Hay una forma mejor: publicar tu propio paquete de configuración de ESLint.","2025-11-02","3",[411,444,224,412,413],"typescript",{"id":446,"path":447,"title":448,"description":449,"date":450,"readingTime":451,"tags":452},"blog_es\u002Fes\u002Fblog\u002F0002.install-node-24-on-ubuntu-24.md","\u002Fes\u002Fblog\u002Finstall-node-24-on-ubuntu-24","Instalar Node.js 24 en Ubuntu 24.04","Instalar Node.js 24 en Ubuntu 24 debería ser un proceso sencillo. Aunque Ubuntu incluye una versión de Node.js en sus repositorios por defecto, es posible que quieras utilizar una versión más reciente, como Node.js 24, que es LTS desde el 28 de octubre de 2025 y tiene soporte hasta abril de 2028. Si vas a instalarlo desde cero, mejor instala Node.js 26 en Ubuntu 26.04. En esta guía te enseño dos métodos para que lo tengas listo rápidamente.","2025-10-12","6",[434,423,435,425],{"id":4,"path":218,"title":5,"description":213,"date":212,"readingTime":219,"tags":454},[223,224,225,226,227],1794096652438]