feat: refactoring, preload video and website improvements

.github/workflows/ci.yml

@@ -77,12 +77,3 @@ jobs:
 
       - name: Build production artifact
         run: pnpm build
-
-      - name: Upload build artifact
-        uses: actions/upload-artifact@v4
-        with:
-          name: build-output-node-22-linux-x64
-          path: .output
-          if-no-files-found: error
-          include-hidden-files: true
-          retention-days: 1

.github/workflows/deploy.yml

@@ -0,0 +1,40 @@
+name: Deploy
+
+on:
+  push:
+    branches:
+      - main
+
+jobs:
+  deploy:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Install pnpm
+        uses: pnpm/action-setup@v4
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: 22
+          cache: 'pnpm'
+
+      - name: Install dependencies
+        run: pnpm install --frozen-lockfile
+
+      - name: Build
+        run: pnpm build
+
+      - name: Deploy via FTPS
+        uses: SamKirkland/FTP-Deploy-Action@v4.4.0
+        with:
+          server: ${{ secrets.FTP_HOST }}
+          username: ${{ secrets.FTP_USERNAME }}
+          password: ${{ secrets.FTP_PASSWORD }}
+          protocol: ftps
+          port: ${{ secrets.FTP_PORT }}
+          local-dir: ./.output/
+          server-dir: ./

.nuxtrc

@@ -1 +1 @@
-setups.@nuxt/test-utils="4.3.2"
+setups.@nuxt/test-utils="4.3.4"

content/blog/1-hello-world.md

@@ -1,27 +1,28 @@
 ---
-title: Welcome to My Blog
+title: Bienvenido a Mi Blog
 date: 2026-02-02
-description: This is the first post on my new blog built with Nuxt Content.
-image: /images/blog/hello-world.png
-alt: Welcome to My Blog
+description: Este es el primer post en mi nuevo blog.
+image: /images/blog/hello-world.jpg
+alt: Bienvenido a Mi Blog
 duration: 2 min read
 tags: ['blog']
 published: true
 ---
 
 # Hello World
 
-Welcome to my blog! I'm Anthuan Vásquez, a Full Stack Engineer.
+En este blog estaré compartiendo mis pensamientos, ideas y experiencias sobre desarrollo web, arquitectura de software y otras áreas relacionadas. Cuando no estoy trabajando en proyectos de software privado (mi trabajo), me gusta experimentar con proyectos personales, aprender nuevas tecnologías, mejorar mis habilidades, explorar nuevas herramientas.
 
-I created this blog using **Nuxt 4**, **Tailwind CSS 4**, and **Nuxt Content**.
+Así que espero compartir mis conocimientos y descubrimientos con ustedes. Pareciera algo tonto, que cuando todo se resuelve preguntandole a un modelo de IA, todavía haya espacio para la curiosidad y el aprendizaje. Pero aquí estamos, hay que seguir fortaleciendo nuestra curiosidad, ganas de aprender y experimentar constantemente.
 
-## What to expect?
+## ¿Qué esperar?
 
-I will be sharing my thoughts on:
+Bueno, compartiré mis pensamientos sobre:
 
-- Web Development
-- Software Architecture
-- User Interface Design
-- And much more...
+- Desarrollo Web
+- Arquitectura de Software
+- Inteligencia Artificial
+- Proyectos Personales
+- Y lo que surja
 
-Stay tuned!
+Espero que encuentres útil y entretenido el contenido que compartiré aquí.

content/blog/2-git-commands.md

@@ -0,0 +1,132 @@
+---
+title: 12 Comandos de Git que Debes Conocer
+date: 2026-10-18
+description: Doce comandos de Git que todo desarrollador debería conocer para trabajar de manera eficiente.
+image: /images/blog/git-commands.jpg
+alt: 12 Comandos de Git que Debes Conocer
+duration: 5 min read
+tags: ['git', 'terminal']
+published: true
+---
+
+# 12 Comandos de Git que Debes Conocer
+
+Cualquier desarrollador que trabaje en equipo o en proyectos personales se da cuenta rápido de que, aunque ==Git==^[entiendo que la mayoría de la gente solo usa un subconjunto de comandos] tiene cientos de comandos, en el día a día terminas usando siempre los mismos doce. No necesitas aprenderte el manual completo para sobrevivir a un lunes de despliegues. Con dominar este grupo básico puedes resolver el noventa por ciento de las situaciones reales.
+
+## 1. `git cherry-pick`
+
+A que no te lo esperabas, [git cherry-pick](https://git-scm.com/docs/git-cherry-pick) es el comando que te permite aplicar cambios de un commit específico en tu rama actual. Es útil cuando quieres traer una corrección puntual sin fusionar toda la rama de origen.
+
+Creeme, en un entorno de producción serio, este es por mucho uno de los comandos más usado por los desarrolladores experimentados. Y es que no siempre un feature se mezcla de inmediato y siempre hay que aplicar correcciones puntuales de manera selectiva.
+
+## 2. `git status`
+
+[git status](https://git-scm.com/docs/git-status) es el comando que más vas a teclear durante el día, de hecho los agentes de IA también lo usan para entender el estado del proyecto. Te muestra exactamente en qué estado está tu directorio de trabajo. Qué archivos has modificado, cuáles están listos para entrar al próximo commit y cuáles ni se han tocado. Lo ideal es usarlo antes de hacer cualquier movimiento para no llevarnos sorpresas.
+
+```bash
+git status
+
+```
+
+## 3. `git add`
+
+Una vez que modificas o creas archivos, necesitas preparar esos cambios para guardarlos. Con [git add](https://git-scm.com/docs/git-add) le dices a Git qué archivos específicos quieres incluir en la próxima foto del proyecto. Puedes agregar un archivo en concreto o usar un punto para llevártelo todo de golpe.
+
+```bash
+git add archivo.txt
+git add .
+```
+
+## 4. `git commit`
+
+[git commit](https://git-scm.com/docs/git-commit) guarda formalmente los cambios preparados en el historial local. La clave aquí es escribir mensajes claros y directos que expliquen qué hiciste y por qué. Un buen mensaje de commit le ahorra dolores de cabeza a quien revise el código después, incluido tu futuro yo.
+
+Escribir buenos commits es todo un arte y una práctica que mejora la colaboración y el mantenimiento del código a largo plazo.
+
+Actualmente los agentes de IA son los que están escribiendo gran parte de los mensajes de commit, ayudando a los desarrolladores a mantener un historial claro y consistente.
+
+```bash
+git commit -m "feat(scope): descripción del cambio"
+git commit -m "feat(scope): descripción del cambio" -m "Descripción más detallada"
+```
+
+## 5. `git push`
+
+Sirve para subir tus commits locales al repositorio remoto, ya sea GitHub, GitLab o cualquier otro servidor. [git push](https://git-scm.com/docs/git-push) es la forma de compartir tu trabajo con el resto del equipo o simplemente dejar una copia de seguridad en la nube.
+
+```bash
+git push origin main
+```
+
+## 6. `git pull`
+
+El proceso inverso al anterior [git pull](https://git-scm.com/docs/git-pull). Antes de empezar a picar código o cuando vas a mandar tus cambios, necesitas traerte lo que otros, incluido agentes de IA, hayan subido al repositorio remoto. Este comando descarga y fusiona esas novedades en tu rama actual de un solo golpe.
+
+```bash
+git pull # en tu rama actual
+git pull origin main
+```
+
+## 7. `git clone`
+
+Lo usas una sola vez por cada proyecto nuevo. [git clone](https://git-scm.com/docs/git-clone) te permite descargar una copia completa de un repositorio existente en tu máquina para empezar a trabajar de inmediato. Copia todo el historial y todas las ramas.
+
+```bash
+git clone <URL_DEL_REPOSITORIO>
+git clone <URL_DEL_REPOSITORIO> --depth 1 # clona solo el historial más reciente
+```
+
+## 8. `git branch`
+
+Las ramas son la base para trabajar en paralelo sin romper el código principal. [git branch](https://git-scm.com/docs/git-branch) te permite listar las ramas que existen, crear una nueva para tu próxima tarea o borrar las que ya no sirven. Saber en qué rama estás parado evita que metas código experimental donde no debe ir.
+
+```bash
+git branch
+git branch nueva-rama
+git branch -d rama-antigua
+```
+
+## 9. `git checkout` o `git switch`
+
+Con [git checkout](https://git-scm.com/docs/git-checkout) y [git switch](https://git-scm.com/docs/git-switch) te mueves entre ramas o regresas a versiones anteriores de un archivo. Si quieres empezar a trabajar en una nueva funcionalidad, saltas a su rama correspondiente con este comando. Es el puente para cambiar de contexto dentro del repositorio.
+
+```bash
+git checkout rama-existente
+git checkout -b nueva-rama # crear y cambiar a la nueva rama
+git switch nueva-rama
+```
+
+## 10. `git merge`
+
+Cuando terminas una tarea en tu rama y quieres integrar esos cambios al tronco principal o a otra rama, usas este comando [git merge](https://git-scm.com/docs/git-merge). Junta los historiales y une el trabajo que hiciste por tu cuenta con el del resto del equipo. Si hay conflictos porque dos personas tocaron la misma línea, aquí es donde toca revisar y decidir qué se queda.
+
+```bash
+git merge rama-a-unir
+```
+
+## 11. `git log`
+
+El diario de vida del proyecto. [git status](https://git-scm.com/docs/git-status) te muestra la lista cronológica de todos los commits que se han hecho, quién los hizo, cuándo y con qué mensaje. Es indispensable cuando necesitas buscar en qué momento exacto se introdujo un error o simplemente quieres entender la evolución del código.
+
+```bash
+git log
+git log --oneline
+```
+
+## 12. `git worktree`
+
+Los [worktrees](https://git-scm.com/docs/git-worktree) permiten tener múltiples directorios de trabajo asociados a un mismo repositorio. Esto es útil cuando quieres trabajar en varias ramas al mismo tiempo sin tener que hacer constantes cambios de contexto en un solo directorio.
+
+Actualmente muy usando en el contexto de agentes de IA. Pero es algo de lo que me gustaría tocar y profundizar más en otra publicación.
+
+```bash
+git worktree add ../ruta-a-nuevo-worktree rama-existente
+git worktree list
+git worktree remove ../ruta-a-nuevo-worktree
+```
+
+### Conclusión
+
+Aunque la Inteligencia Artificial y las herramientas modernas pueden facilitar muchas tareas, entender estos comandos básicos te da un control total sobre tu flujo de trabajo y te prepara para cualquier situación que pueda surgir en un proyecto de desarrollo.
+
+Pero en realidad, no hace falta complicarse la vida memorizando parámetros raros desde el primer día. Si dominas estos diez comandos, ya tienes lo necesario para moverte con soltura y resolver cualquier flujo de trabajo común.

nuxt.config.ts

@@ -1,4 +1,6 @@
 // https://nuxt.com/docs/api/configuration/nuxt-config
+import fs from 'node:fs';
+import path from 'node:path';
 import tailwindcss from '@tailwindcss/vite';
 
 const isProduction = process.env.NODE_ENV === 'production';
@@ -33,12 +35,17 @@ export default defineNuxtConfig({
   ],
 
   /**
-   * Nuxt UI
+   * Nuxt UI & Color Mode
    */
   ui: {
     prefix: 'U',
   },
 
+  colorMode: {
+    preference: 'dark',
+    fallback: 'dark',
+  },
+
   /**
    * TypeScript
    */
@@ -67,7 +74,27 @@ export default defineNuxtConfig({
         { charset: 'utf-8' },
         { name: 'viewport', content: 'width=device-width, initial-scale=1' },
       ],
-      link: [{ rel: 'icon', type: 'image/*', href: '/favicon.ico' }],
+      link: [
+        { rel: 'icon', type: 'image/*', href: '/favicon.ico' },
+        {
+          rel: 'apple-touch-icon',
+          sizes: '180x180',
+          href: '/apple-touch-icon.png',
+        },
+        {
+          rel: 'icon',
+          type: 'image/png',
+          sizes: '32x32',
+          href: '/favicon-32x32.png',
+        },
+        {
+          rel: 'icon',
+          type: 'image/png',
+          sizes: '16x16',
+          href: '/favicon-16x16.png',
+        },
+        { rel: 'manifest', href: '/site.webmanifest' },
+      ],
     },
   },
 
@@ -83,6 +110,27 @@ export default defineNuxtConfig({
     },
   },
 
+  hooks: {
+    'nitro:build:public-assets'(nitro) {
+      const rootDir = nitro.options.rootDir;
+      const outDir = nitro.options.output.dir;
+      const contentSrc = path.resolve(rootDir, 'content');
+
+      if (fs.existsSync(contentSrc)) {
+        fs.cpSync(contentSrc, path.join(outDir, 'content'), {
+          recursive: true,
+        });
+      }
+
+      for (const file of ['CHANGELOG.md', 'package.json']) {
+        const fileSrc = path.resolve(rootDir, file);
+        if (fs.existsSync(fileSrc)) {
+          fs.copyFileSync(fileSrc, path.join(outDir, file));
+        }
+      }
+    },
+  },
+
   /**
    * Route Rules
    */

package.json

@@ -23,44 +23,45 @@
     "docker:up": "docker-compose up -d app"
   },
   "dependencies": {
-    "@iconify-json/lucide": "^1.2.130",
-    "@iconify-json/simple-icons": "^1.2.95",
+    "@iconify-json/lucide": "^1.2.145",
+    "@iconify-json/simple-icons": "^1.2.100",
     "@iconify-json/skill-icons": "^1.2.4",
-    "@langchain/core": "^1.2.10",
+    "@langchain/core": "^1.2.18",
     "@langchain/groq": "^1.3.1",
     "@nuxt/image": "2.1.0",
-    "@nuxt/ui": "^4.11.1",
+    "@nuxt/ui": "^4.12.0",
     "gray-matter": "^4.0.3",
-    "langchain": "^1.5.11",
-    "mapbox-gl": "^3.30.0",
-    "marked": "^18.0.12",
-    "nuxt": "^4.5.2",
+    "highlight.js": "^11.12.0",
+    "langchain": "^1.5.18",
+    "mapbox-gl": "^3.33.0",
+    "marked": "^18.1.1",
+    "nuxt": "^4.6.2",
     "tailwindcss": "^4.3.3",
-    "vue": "^3.5.43",
-    "vue-router": "^5.3.1",
-    "zod": "^4.5.4"
+    "vue": "^3.5.44",
+    "vue-router": "^5.4.0",
+    "zod": "^4.6.7"
   },
   "devDependencies": {
     "@eslint/js": "^10.0.1",
     "@nuxt/eslint-config": "^1.17.0",
-    "@nuxt/test-utils": "^4.3.2",
+    "@nuxt/test-utils": "^4.3.4",
     "@tailwindcss/vite": "^4.3.3",
-    "@types/node": "^26.5.1",
-    "@vitest/coverage-v8": "5.0.0",
+    "@types/node": "^26.6.5",
+    "@vitest/coverage-v8": "5.0.5",
     "@vitest/eslint-plugin": "^1.6.27",
-    "@vitest/ui": "^5.0.0",
-    "@vue/test-utils": "^2.5.0",
-    "eslint": "^10.10.0",
+    "@vitest/ui": "^5.0.5",
+    "@vue/test-utils": "^2.5.1",
+    "eslint": "^10.13.0",
     "eslint-config-prettier": "^10.1.8",
-    "eslint-plugin-prettier": "^5.5.6",
-    "happy-dom": "^20.14.3",
-    "prettier": "^3.9.6",
+    "eslint-plugin-prettier": "^5.5.7",
+    "happy-dom": "^21.0.3",
+    "prettier": "^3.9.10",
     "prettier-plugin-tailwindcss": "^0.8.1",
-    "sass": "^1.104.0",
+    "sass": "^1.105.2",
     "typescript": "^6.0.3",
-    "typescript-eslint": "^8.70.0",
-    "vitest": "^5.0.0",
-    "vue-tsc": "^3.3.11"
+    "typescript-eslint": "^8.71.2",
+    "vitest": "^5.0.5",
+    "vue-tsc": "^3.3.13"
   },
   "packageManager": "pnpm@12.4.0+sha512.37536c26ed40ab4134b6511e09f6b27f3ebb45687468f2406ca3805279a4e5ca158c1931350ad9774d6ab2108d71b3dbaeb39943159294375e4d053e8e05685c"
 }