Colophon

How this portfolio was built. A peek behind the curtain at the technologies, tools, and decisions that shaped this site.

Tech Stack

Framework

  • Next.js 14React framework with App Router
  • React 18UI library
  • TypeScriptType-safe JavaScript

Styling

  • Tailwind CSSUtility-first CSS framework
  • CSS VariablesDark/light theme support
  • Framer MotionAnimation library

AI Integration

  • Groq APIAI chatbot backend
  • Llama 3Large language model

Tools & Deployment

  • VS CodeCode editor
  • GitVersion control
  • GitHubRepository hosting
  • VercelDeployment platform

Design Principles

Performance First

Targeting 95+ Lighthouse scores across all categories. Bundle size under 200KB.

Accessibility

WCAG 2.1 AA compliant. Keyboard navigable. Screen reader friendly.

Semantic HTML

Proper heading hierarchy, landmarks, and meaningful markup.

Privacy

No tracking cookies. Minimal analytics. Respect for user privacy.

Key Decisions

DecisionRationale
Static Site GenerationContent rarely changes. SSG provides best performance and security.
No External FontsSystem font stack for instant rendering. No layout shift.
Dark Mode DefaultMost developers prefer dark mode. Respects system preference.
Minimal JavaScriptProgressive enhancement. Core content works without JS.
Single Source of TruthAll data in resume.ts. No content duplication or drift.

Credits & Inspiration

This portfolio was inspired by the belief that portfolios should demonstrate how you think, not just list what you know.

Special thanks to the open-source community for the amazing tools that made this possible.

Built with by Kumlesh Kumar