Kavatana Portfolio

Problem

I needed a place to show who I am, what I'm building, and what I'm learning — without overstating my experience or understating my ambition.

My role

I designed and built this site myself, making decisions about stack, content structure, design tokens, accessibility, and SEO.

What I built

• — A Nuxt 4 portfolio with a design token CSS system.
• — JSON-driven content model so text is separate from code.
• — Mobile-responsive layout with accessible navigation.
• — SEO metadata, Open Graph tags, sitemap, and structured data.

Architecture

The site is a Nuxt 4 SSR app where content is fully decoupled from presentation: all copy is authored in content/*.json and surfaced through small typed composables that map slugs to data, validated against interfaces in types/content.ts. Routing is file-based with a dynamic /projects/[slug] page, and selected routes are prerendered for fast first paint. Cross-cutting concerns — SEO metadata, JSON-LD, sitemap, a CSS design-token system, and accessibility primitives (skip link, focus handling, reduced-motion) — are implemented as shared building blocks rather than duplicated per page.

Backend / deployment

What I learned

• — How to structure a real Nuxt 4 project with composables.
• — CSS design tokens and how to maintain a consistent design system.
• — Accessibility foundations: skip links, focus traps, reduced-motion.
• — The importance of honest personal branding over impressive-sounding copy.

Next backend step

Move the contact form behind a small hosted API (server actions or an Express/Postgres service) so submissions are dynamic rather than static — a good place to apply the backend hosting I am studying.