How vikkrantxx7/my-portfolio works
Portfolio is a server-rendered, content-driven site: visitors browse the home experience, filter projects, and open shareable case studies or blog posts; they can also view and download a resume. Typed local content drives the presentation, with supporting discovery, preferences, audio, and offline features. Edges follow shown route/component imports, excerpted calls, or README-documented behavior; some route and feature internals were not sampled, so those links rely on README evidence.
Main entry points: index.tsx Home page · data.ts Portfolio data · __root.tsx Root shell · project-gallery.tsx Project gallery
Components 27
Pages and routing
- Application router
src/router.tsx - Home page
src/routes/index.tsx - Project route
src/routes/projects.$slug.tsx - Blog routes
src/routes/blog.index.tsx - Blog article route
src/routes/blog.$slug.tsx - Sitemap route
src/routes/sitemap[.]xml.ts - Root shell
src/routes/__root.tsx
Local content
- Portfolio data
src/content/data.ts - Case study content
src/content/case-studies.ts - Blog content
src/content/blog.ts - Site identity
src/content/site.ts
Portfolio experiences
- Home sections
src/widgets/hero/hero.tsx - Project gallery
src/widgets/gallery/project-gallery.tsx - Career timeline
src/widgets/timeline/timeline.tsx - Case study view
src/widgets/project-detail/project-detail.tsx - Blog presentation
src/widgets/blog/blog-ledger.tsx - Resume viewer
src/features/resume-viewer/resume-viewer.tsx
Discovery and preferences
- Command palette
src/features/command-palette/command-palette.tsx - Project filtering
src/features/filter-projects/filter-projects.ts - Achievement links
src/features/expand-achievement/achievement-disclosure.tsx - Theme preferences
src/features/theme-toggle/theme.ts - Floating audio player
src/widgets/audio-player/floating-audio-player.tsx - Audio engine hook
src/features/audio-player/use-audio-engine.ts - Audio engine
src/features/audio-player/audio-engine.ts
Shared platform
- Offline service worker
src/features/pwa/register-sw.ts - SEO utilities
src/shared/lib/seo.ts
Other components
- Visitor
Connections 32
- Visitor → Application router: opens pages
README.md - Application router → Root shell: renders shell
src/router.tsx - Root shell → Command palette: renders
src/routes/__root.tsx - Root shell → Floating audio player: renders
src/routes/__root.tsx - Root shell → Offline service worker: registers
src/routes/__root.tsx - Home page → Portfolio data: reads
src/routes/index.tsx - Home page → Site identity: reads
src/routes/index.tsx - Home page → Home sections: renders sections
src/routes/index.tsx - Home page → Project gallery: renders
src/routes/index.tsx - Home page → Career timeline: renders
src/routes/index.tsx - Home page → SEO utilities: builds metadata
src/routes/index.tsx - Project gallery → Portfolio data: reads projects
src/widgets/gallery/project-gallery.tsx - Project gallery → Project filtering: filters projects
src/widgets/gallery/project-gallery.tsx - Project gallery → Project route: opens case study
src/widgets/gallery/project-gallery.tsx - Project route → Case study view: presents study
README.md - Case study view → Case study content: uses case content
src/widgets/project-detail/project-detail.tsx - Blog routes → Blog content: lists articles
README.md - Blog routes → Blog presentation: presents articles
README.md - Blog article route → Blog content: loads article
README.md - Blog article route → Blog presentation: presents article
README.md - Sitemap route → SEO utilities: serves sitemap
- Career timeline → Portfolio data: reads experience
src/widgets/timeline/timeline.tsx - Career timeline → Achievement links: renders disclosures
src/widgets/timeline/timeline.tsx - Achievement links → Portfolio data: reads achievements
src/features/expand-achievement/achievement-disclosure.tsx - Command palette → Blog content: searches articles
src/features/command-palette/command-palette.tsx - Command palette → Portfolio data: searches portfolio
src/features/command-palette/command-palette.tsx - Command palette → Achievement links: links achievements
src/features/command-palette/command-palette.tsx - Root shell → Theme preferences: applies theme
src/routes/__root.tsx - Floating audio player → Audio engine hook: uses hook
src/widgets/audio-player/floating-audio-player.tsx - Audio engine hook → Audio engine: creates engine
src/features/audio-player/use-audio-engine.ts - Visitor → Resume viewer: opens resume
README.md - Project route → Portfolio data: uses project data