Saabbir's Personal Website (Nuxt 3)

Live demo: https://saabbir.github.io/

---

Tech stack

• Nuxt 3 (Vue 3) with static preset for GitHub Pages
• @nuxt/content v2 – file-based content (articles, snippets, work) from content/
• Prism.js – code highlighting in markdown (custom ProseCode component, theme: prism-material-oceanic)
• SCSS – global styles; content typography scoped under .nuxt-content

---

Prerequisites

• Node.js: v18 or later (v20 LTS recommended)
• npm: v9 or later

node -v   # should be 18+
npm -v

---

Getting Started

1. Clone the repository:

   git clone https://github.com/Saabbir/saabbir.github.io.git
   cd saabbir.github.io

2. Install dependencies:

   npm install

3. Run the development server:

   npm run dev

   The site will be available at http://localhost:3000

---

Build & Deployment

• Generate static site (for GitHub Pages):

  npm run generate

  This copies assets/images to public/images and outputs the site to .output/public.

• Preview the generated site:

  npm run preview

• Deploy to GitHub Pages:

  npm run deploy

  Builds the static site and pushes .output/public to the gh-pages branch.

---

Troubleshooting

• Dependency or build errors?
  Delete node_modules and package-lock.json, then run npm install again.

• Images missing on generated site?
  Run npm run copy:assets once to copy assets/images into public/images, or run npm run generate (it runs the copy step automatically).

---

References

• Nuxt 3 Documentation
• Nuxt Content v2
• PROJECT_GUIDE.md – project structure and content workflow
• MIGRATION.md – Nuxt 2 → 3 migration notes