solo Project
Personal Portfolio Website v2 (Velascode)
Modern developer portfolio and engineering showcase built with Nuxt 3, Sanity CMS, Tailwind CSS, and PWA capabilities for offline accessibility.
Architecture & Technology Stack
Sanity.ioTailwind CSSTypeScriptJavaScriptNetlifyNuxt 3Git
Architectural Overview & Case Study
Velascode (Portfolio v2) is a modern, decoupled web application serving as the central engineering hub and project portfolio for Luisito B. Velasco Jr.. Built with a headless architecture powered by Nuxt 3 and Sanity.io CMS, it presents interactive case studies, dynamic project filters, and detailed tech stack taxonomies with optimal performance and SEO.
Key Features & Architecture
- Headless Content Management: Integrates Sanity Content Lake via GROQ queries to dynamically manage project case studies, technology references, and site metadata in real time.
- Progressive Web App (PWA) Support: Features offline caching, service workers, and a native install prompt (
Install App), allowing users to launch the portfolio directly from desktop or mobile devices. - Responsive Dark Theme Layout: Designed with custom Tailwind CSS components, featuring dark mode support, custom availability badges, and interactive project cards.
- Clean Routing & Navigation: Utilizes Nuxt file-based routing for clean URL slugs (
/projects,/experience,/contact) and optimized page load transitions.
Technical Stack & Infrastructure
- Engineering Paradigm: Decoupled Headless Single Page Application (SPA / SSG).
- Frontend Framework: Nuxt 3 (Vue 3, TypeScript).
- Content Layer: Sanity.io Studio & Content Lake.
- Styling & Web Standards: Tailwind CSS, Progressive Web App (PWA).