Aakash Pal (AKKI)

Open Source Documentation

How this portfolio is built: architecture, routes, technology stack, environment variables, content model and the local development workflow.

Overview

The AKKI portfolio is a personal cinematic website for Aakash Pal (AKKI) — a creative developer building websites, AI and automation systems, monitoring tooling and production infrastructure.

It is built as a Next.js App Router application with server-rendered pages, static optimisation for public routes, a hidden admin dashboard backed by Supabase, and motion work built on GSAP. The same design system — dark canvas, editorial typography and the warm accent colour — runs across every public route.

Tech Stack

  • Next.js 15 (App Router, React Server Components)
  • React 19 with Tailwind CSS 4
  • GSAP + ScrollTrigger for scroll and page transitions
  • Lenis for smooth scrolling
  • three.js / React Three Fiber for WebGL moments
  • Supabase for CMS, analytics and reviews
  • Resend for transactional e-mail
  • jose for signed admin sessions
  • sharp + AVIF/WebP image optimisation
  • Hosted on Vercel

Routes

/Cinematic home: hero, about, services, selected work and contact.
/aboutBiography, capabilities, what I build and technology list.
/projectsWork archive. Reads the CMS and falls back to built-in editorial content when the database is unavailable.
/project/[id]Individual project detail page with breadcrumb structured data.
/contactProject enquiry form, email and WhatsApp contact points.
/open-sourceOpen Source showcase with the live GitHub profile and repositories.
/open-source/docsThis documentation page.
/coming-soonPassword/notice landing page. Marked noindex.
/adminPrivate admin dashboard for content, media and settings. Marked noindex and disallowed in robots.txt.
/sitemap.xmlGenerated sitemap of every public page.
/robots.txtCrawl rules, including admin, API and coming-soon disallows.

Server routes live under /api/* and cover content (works, services, content/[key], navigation, settings, media, tech-stack), communication (contact, inquiries, subscribe, reviews), analytics (analytics/*) and administration (admin/*). Private routes are excluded from sitemap, robots and search indexing.

Project Structure

src/appRoutes, page metadata, JSON-LD, sitemap, robots and manifest.
src/viewsPage bodies (home, about, projects, contact, open source).
src/componentsReusable UI: navigation, hero, work, services, transitions, cursor.
src/libContent access, built-in defaults, Supabase client, auth, rate limiting.
publicStatic media: images, optimised videos, llms.txt, icons.

Local Development

npm installInstall dependencies.
npm run devStart the development server on port 3000.
npm run buildCreate a production build.
npm startServe the production build.

The site renders correctly with no environment variables at all: database-backed features simply report themselves as disabled and built-in content defaults are used instead. Environment variables are only required for live CMS data, e-mail delivery and admin access.

Environment Variables

Configure these in .env.local for local work and in the hosting provider's environment settings for deployments. Values are never committed to the repository.

NEXT_PUBLIC_SUPABASE_URLSupabase project URL. Enables the CMS, analytics and reviews.
NEXT_PUBLIC_SUPABASE_ANON_KEYSupabase anon (public) key used for client-side reads.
SUPABASE_SERVICE_ROLE_KEYServer-only service role key. API routes refuse database writes without it.
RESEND_API_KEYTransactional email delivery through Resend (contact form, subscriptions).
RESEND_WEBHOOK_SECRETSignature verification for Resend webhooks.
ADMIN_EMAILAdministrator account e-mail used by the admin login route.
ADMIN_PASSWORDAdministrator password used by the admin login route.
JWT_SECRETSecret used to sign and verify the admin session cookie.
COMING_SOON_PASSWORDBypass password for the coming-soon page.
NEXT_PUBLIC_WHATSAPP_NUMBERWhatsApp number rendered in the contact links.
NEXT_PUBLIC_GOOGLE_VERIFICATIONGoogle Search Console site verification token.
NEXT_PUBLIC_BING_VERIFICATIONBing Webmaster Tools verification token.

Content & Admin

Content is stored in Supabase and edited from the private admin dashboard at /admin. Without Supabase environment variables the admin writes and CMS-backed lists are unavailable; the public site keeps rendering from the built-in defaults in src/lib/content-defaults.js.

  • content (per-page SEO, section copy, footer, navigation labels)
  • works (project entries)
  • services (service list shown in the Services section)
  • navigation (navbar and CTA links)
  • tech-stack (technology chips)
  • settings (site settings, coming-soon state)
  • reviews, inquiries, subscribers (social proof and mail list)
  • visits, ad_clicks, searches (analytics)

Admin sessions are signed with JWT_SECRET and stored in an admin_token cookie; admin, API and coming-soon routes are excluded from search indexing.

SEO & Discoverability

  • Canonical production domain: https://aakashpal.com
  • Per-page title, description, Open Graph and Twitter metadata
  • Structured data: Person, WebSite, ItemList, WebPage and breadcrumbs
  • /sitemap.xml with every public route
  • /robots.txt blocking admin, API and coming-soon paths
  • /llms.txt and /llms-full.txt site summaries for AI crawlers
  • Exactly one h1 per public page and descriptive alt text on images

Performance & Media

  • AVIF/WebP image formats with long-lived caching
  • Optimised MP4 videos served with immutable cache headers
  • Video elements use preload="none" and load on interaction
  • CSS optimisation and console removal in production builds
  • Security headers (CSP, HSTS, frame and content-type protections) on every route

License & Links

Released under the MIT License — see the LICENSE file in the repository for the full text.

Back to Open SourceGitHub ProfilePortfolio Home