# kunalkhandekar/sahilkhandekar.dev architecture

> Architecture diagram of the GitHub repository kunalkhandekar/sahilkhandekar.dev, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-11-14). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/kunalkhandekar/sahilkhandekar.dev
- Repository: https://github.com/kunalkhandekar/sahilkhandekar.dev

## Overview

This is a Next.js personal portfolio. Visitors browse an overview and dedicated sections for projects, blogs, achievements, experience, consistency, and contact; project listings and site search fetch data from a backend, while contact submission is documented as sending email alerts. The graph combines documented capabilities with relationships visible in the supplied page and component excerpts. Most section implementations were not sampled, so their internal wiring is omitted rather than inferred.

Main entry points: [`src/app/projects/page.jsx`](https://github.com/kunalkhandekar/sahilkhandekar.dev/blob/main/src/app/projects/page.jsx) (Project listing route), [`src/components/SearchBarWrapper.jsx`](https://github.com/kunalkhandekar/sahilkhandekar.dev/blob/main/src/components/SearchBarWrapper.jsx) (Search data loader), [`src/components/Header.jsx`](https://github.com/kunalkhandekar/sahilkhandekar.dev/blob/main/src/components/Header.jsx) (Header), [`src/app/projects/_components/ProjectSection.jsx`](https://github.com/kunalkhandekar/sahilkhandekar.dev/blob/main/src/app/projects/_components/ProjectSection.jsx) (Project browser)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_site["Site shell"]
  node_layout["App layout<br/>[layout.js]"]
  node_header["Header<br/>[Header.jsx]"]
  node_navbar["Navigation<br/>[Navbar.jsx]"]
  node_profile["Profile panel<br/>[ProfileBar.jsx]"]
end

subgraph group_projects["Project discovery"]
  node_projects_page["Project listing route<br/>[page.jsx]"]
  node_project_section["Project browser<br/>[ProjectSection.jsx]"]
  node_project_filters["Search and filters"]
  node_language_select["Language selector<br/>[LanguageSelect.jsx]"]
  node_project_detail["Project detail<br/>[page.jsx]"]
  node_backend["Portfolio backend"]
end

subgraph group_portfolio["Portfolio sections"]
  node_overview["Overview"]
  node_contributions["Contribution chart"]
  node_achievements["Achievements"]
  node_gallery["Image gallery"]
  node_experience["Experience timeline"]
  node_blogs["Blogs<br/>[BlogContent.jsx]"]
  node_consistency["Consistency page<br/>[AnimatedHeader.jsx]"]
  node_tweets["Embedded tweets<br/>[Tweets.jsx]"]
end

subgraph group_interaction["Visitor interactions"]
  node_contact["Contact form<br/>[ContactForm.jsx]"]
  node_search_wrapper["Search data loader"]
  node_search["Site search<br/>[SearchBar.jsx]"]
  node_social["Social links<br/>[SocialLinks.jsx]"]
end

node_visitor(("Visitor"))
node_email["Email alerts"]

node_layout -->|"renders"| node_header
node_header -.->|"renders"| node_navbar
node_visitor -.->|"opens"| node_projects_page
node_projects_page -->|"fetches listings"| node_backend
node_projects_page -->|"renders"| node_project_section
node_project_section -.->|"uses"| node_project_filters
node_project_filters -->|"renders"| node_language_select
node_visitor -.->|"opens"| node_project_detail
node_visitor -.->|"opens"| node_achievements
node_achievements -->|"uses"| node_gallery
node_visitor -.->|"opens"| node_experience
node_visitor -.->|"opens"| node_blogs
node_visitor -.->|"opens"| node_consistency
node_consistency -->|"renders"| node_tweets
node_visitor -.->|"submits"| node_contact
node_contact -.->|"sends alerts"| node_email
node_search_wrapper -->|"fetches search data"| node_backend
node_search_wrapper -->|"provides data"| node_search
node_visitor -.->|"searches"| node_search
node_visitor -.->|"follows links"| node_social
node_visitor -.->|"opens"| node_overview
node_overview -.->|"shows"| node_contributions
node_visitor -.->|"views"| node_profile

click node_layout "https://github.com/kunalkhandekar/sahilkhandekar.dev/blob/main/src/app/layout.js"
click node_header "https://github.com/kunalkhandekar/sahilkhandekar.dev/blob/main/src/components/Header.jsx"
click node_navbar "https://github.com/kunalkhandekar/sahilkhandekar.dev/blob/main/src/components/Navbar.jsx"
click node_profile "https://github.com/kunalkhandekar/sahilkhandekar.dev/blob/main/src/components/ProfileBar.jsx"
click node_overview "https://github.com/kunalkhandekar/sahilkhandekar.dev/blob/main/src/app/_components/OverviewContent.jsx"
click node_contributions "https://github.com/kunalkhandekar/sahilkhandekar.dev/blob/main/src/app/_components/ContributionChart.jsx"
click node_projects_page "https://github.com/kunalkhandekar/sahilkhandekar.dev/blob/main/src/app/projects/page.jsx"
click node_project_section "https://github.com/kunalkhandekar/sahilkhandekar.dev/blob/main/src/app/projects/_components/ProjectSection.jsx"
click node_project_filters "https://github.com/kunalkhandekar/sahilkhandekar.dev/blob/main/src/app/projects/_components/SearchAndFilters.jsx"
click node_language_select "https://github.com/kunalkhandekar/sahilkhandekar.dev/blob/main/src/app/projects/_components/LanguageSelect.jsx"
click node_project_detail "https://github.com/kunalkhandekar/sahilkhandekar.dev/blob/main/src/app/projects/%5Bslug%5D/page.jsx"
click node_achievements "https://github.com/kunalkhandekar/sahilkhandekar.dev/blob/main/src/app/achievements/_components/AchievementContent.jsx"
click node_gallery "https://github.com/kunalkhandekar/sahilkhandekar.dev/blob/main/src/app/achievements/_components/ImageGalleryModal.jsx"
click node_experience "https://github.com/kunalkhandekar/sahilkhandekar.dev/blob/main/src/app/experience/_components/ExperienceContent.jsx"
click node_blogs "https://github.com/kunalkhandekar/sahilkhandekar.dev/blob/main/src/app/blogs/_components/BlogContent.jsx"
click node_consistency "https://github.com/kunalkhandekar/sahilkhandekar.dev/blob/main/src/app/consistency/_components/AnimatedHeader.jsx"
click node_tweets "https://github.com/kunalkhandekar/sahilkhandekar.dev/blob/main/src/app/consistency/_components/Tweets.jsx"
click node_contact "https://github.com/kunalkhandekar/sahilkhandekar.dev/blob/main/src/app/contact/_components/ContactForm.jsx"
click node_search_wrapper "https://github.com/kunalkhandekar/sahilkhandekar.dev/blob/main/src/components/SearchBarWrapper.jsx"
click node_search "https://github.com/kunalkhandekar/sahilkhandekar.dev/blob/main/src/components/SearchBar.jsx"
click node_social "https://github.com/kunalkhandekar/sahilkhandekar.dev/blob/main/src/components/SocialLinks.jsx"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_layout,node_header,node_navbar,node_profile toneBlue
class node_projects_page,node_project_section,node_project_filters,node_language_select,node_project_detail,node_backend toneAmber
class node_overview,node_contributions,node_achievements,node_gallery,node_experience,node_blogs,node_consistency,node_tweets toneMint
class node_contact,node_search_wrapper,node_search,node_social toneRose
class node_visitor,node_email toneIndigo
```

## Components

### Site shell

- [App layout](https://github.com/kunalkhandekar/sahilkhandekar.dev/blob/main/src/app/layout.js): `src/app/layout.js`
- [Header](https://github.com/kunalkhandekar/sahilkhandekar.dev/blob/main/src/components/Header.jsx): `src/components/Header.jsx`
- [Navigation](https://github.com/kunalkhandekar/sahilkhandekar.dev/blob/main/src/components/Navbar.jsx): `src/components/Navbar.jsx`
- [Profile panel](https://github.com/kunalkhandekar/sahilkhandekar.dev/blob/main/src/components/ProfileBar.jsx): `src/components/ProfileBar.jsx`

### Project discovery

- [Project listing route](https://github.com/kunalkhandekar/sahilkhandekar.dev/blob/main/src/app/projects/page.jsx): `src/app/projects/page.jsx`
- [Project browser](https://github.com/kunalkhandekar/sahilkhandekar.dev/blob/main/src/app/projects/_components/ProjectSection.jsx): `src/app/projects/_components/ProjectSection.jsx`
- [Search and filters](https://github.com/kunalkhandekar/sahilkhandekar.dev/blob/main/src/app/projects/_components/SearchAndFilters.jsx): `src/app/projects/_components/SearchAndFilters.jsx`
- [Language selector](https://github.com/kunalkhandekar/sahilkhandekar.dev/blob/main/src/app/projects/_components/LanguageSelect.jsx): `src/app/projects/_components/LanguageSelect.jsx`
- [Project detail](https://github.com/kunalkhandekar/sahilkhandekar.dev/blob/main/src/app/projects/%5Bslug%5D/page.jsx): `src/app/projects/[slug]/page.jsx`
- **Portfolio backend**

### Portfolio sections

- [Overview](https://github.com/kunalkhandekar/sahilkhandekar.dev/blob/main/src/app/_components/OverviewContent.jsx): `src/app/_components/OverviewContent.jsx`
- [Contribution chart](https://github.com/kunalkhandekar/sahilkhandekar.dev/blob/main/src/app/_components/ContributionChart.jsx): `src/app/_components/ContributionChart.jsx`
- [Achievements](https://github.com/kunalkhandekar/sahilkhandekar.dev/blob/main/src/app/achievements/_components/AchievementContent.jsx): `src/app/achievements/_components/AchievementContent.jsx`
- [Image gallery](https://github.com/kunalkhandekar/sahilkhandekar.dev/blob/main/src/app/achievements/_components/ImageGalleryModal.jsx): `src/app/achievements/_components/ImageGalleryModal.jsx`
- [Experience timeline](https://github.com/kunalkhandekar/sahilkhandekar.dev/blob/main/src/app/experience/_components/ExperienceContent.jsx): `src/app/experience/_components/ExperienceContent.jsx`
- [Blogs](https://github.com/kunalkhandekar/sahilkhandekar.dev/blob/main/src/app/blogs/_components/BlogContent.jsx): `src/app/blogs/_components/BlogContent.jsx`
- [Consistency page](https://github.com/kunalkhandekar/sahilkhandekar.dev/blob/main/src/app/consistency/_components/AnimatedHeader.jsx): `src/app/consistency/_components/AnimatedHeader.jsx`
- [Embedded tweets](https://github.com/kunalkhandekar/sahilkhandekar.dev/blob/main/src/app/consistency/_components/Tweets.jsx): `src/app/consistency/_components/Tweets.jsx`

### Visitor interactions

- [Contact form](https://github.com/kunalkhandekar/sahilkhandekar.dev/blob/main/src/app/contact/_components/ContactForm.jsx): `src/app/contact/_components/ContactForm.jsx`
- [Search data loader](https://github.com/kunalkhandekar/sahilkhandekar.dev/blob/main/src/components/SearchBarWrapper.jsx): `src/components/SearchBarWrapper.jsx`
- [Site search](https://github.com/kunalkhandekar/sahilkhandekar.dev/blob/main/src/components/SearchBar.jsx): `src/components/SearchBar.jsx`
- [Social links](https://github.com/kunalkhandekar/sahilkhandekar.dev/blob/main/src/components/SocialLinks.jsx): `src/components/SocialLinks.jsx`

### Other components

- **Visitor**
- **Email alerts**

## Connections

- App layout → Header: renders (evidence: `src/app/layout.js`)
- Header → Navigation: renders
- Visitor → Project listing route: opens
- Project listing route → Portfolio backend: fetches listings (evidence: `src/app/projects/page.jsx`)
- Project listing route → Project browser: renders (evidence: `src/app/projects/page.jsx`)
- Project browser → Search and filters: uses
- Search and filters → Language selector: renders (evidence: `src/app/projects/_components/SearchAndFilters.jsx`)
- Visitor → Project detail: opens
- Visitor → Achievements: opens
- Achievements → Image gallery: uses
- Visitor → Experience timeline: opens
- Visitor → Blogs: opens
- Visitor → Consistency page: opens
- Consistency page → Embedded tweets: renders (evidence: `src/app/consistency/page.jsx`)
- Visitor → Contact form: submits
- Contact form → Email alerts: sends alerts
- Search data loader → Portfolio backend: fetches search data (evidence: `src/components/SearchBarWrapper.jsx`)
- Search data loader → Site search: provides data (evidence: `src/components/SearchBarWrapper.jsx`)
- Visitor → Site search: searches
- Visitor → Social links: follows links
- Visitor → Overview: opens
- Overview → Contribution chart: shows
- Visitor → Profile panel: views