# srushti1722/srushtiportfolio architecture

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

- Interactive diagram: https://gitdiagram.com/srushti1722/srushtiportfolio
- Repository: https://github.com/srushti1722/srushtiportfolio

## Overview

SrushtiPortfolio is a personal portfolio site presenting biography, experience, skills, projects, education, and a contact option. A visitor enters through the client app, views the home page’s portfolio sections, and can submit a contact message for email delivery. The sampled server route validates contact input and delegates sending to the mailer; Netlify provides a separate contact-function entry point. The README is minimal and several component implementations were not sampled, so links from the contact UI and unsampled mailer details are limited to documented or source-supported relationships.

Main entry points: [`client/src/pages/home.tsx`](https://github.com/srushti1722/srushtiportfolio/blob/main/client/src/pages/home.tsx) (Home page), [`server/mailer.ts`](https://github.com/srushti1722/srushtiportfolio/blob/main/server/mailer.ts) (Mail delivery), [`server/routes.ts`](https://github.com/srushti1722/srushtiportfolio/blob/main/server/routes.ts) (Contact route), [`client/src/main.tsx`](https://github.com/srushti1722/srushtiportfolio/blob/main/client/src/main.tsx) (Client entry)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_portfolio["Portfolio experience"]
  node_home["Home page<br/>[home.tsx]"]
  node_navigation["Navigation<br/>[navigation.tsx]"]
  node_hero["Hero<br/>[hero-section.tsx]"]
  node_about["About<br/>[about-section.tsx]"]
  node_experience["Experience"]
  node_skills["Skills<br/>[skills-section.tsx]"]
  node_projects["Projects"]
  node_education["Education"]
  node_contact_ui["Contact form"]
  node_footer["Footer<br/>[footer.tsx]"]
end

subgraph group_contact["Contact delivery"]
  node_routes["Contact route<br/>[routes.ts]"]
  node_mailer["Mail delivery<br/>[mailer.ts]"]
  node_netlify_contact["Netlify contact function<br/>[contact.ts]"]
end

subgraph group_runtime["Application runtime"]
  node_client_entry["Client entry<br/>[main.tsx]"]
  node_app["App router<br/>[App.tsx]"]
  node_server["HTTP server<br/>[index.ts]"]
end

node_visitor(("Visitor"))
node_email(("Email service"))

node_visitor -->|"opens site"| node_client_entry
node_client_entry -->|"renders"| node_app
node_app -->|"routes to"| node_home
node_home -->|"renders"| node_navigation
node_home -->|"renders"| node_hero
node_home -->|"renders"| node_about
node_home -->|"renders"| node_experience
node_home -->|"renders"| node_skills
node_home -->|"renders"| node_projects
node_home -->|"renders"| node_education
node_home -->|"renders"| node_contact_ui
node_home -->|"renders"| node_footer
node_server -->|"registers routes"| node_routes
node_routes -->|"sends validated message"| node_mailer
node_mailer -->|"delivers email"| node_email
node_netlify_contact -.->|"sends validated message"| node_mailer

click node_client_entry "https://github.com/srushti1722/srushtiportfolio/blob/main/client/src/main.tsx"
click node_app "https://github.com/srushti1722/srushtiportfolio/blob/main/client/src/App.tsx"
click node_home "https://github.com/srushti1722/srushtiportfolio/blob/main/client/src/pages/home.tsx"
click node_navigation "https://github.com/srushti1722/srushtiportfolio/blob/main/client/src/components/navigation.tsx"
click node_hero "https://github.com/srushti1722/srushtiportfolio/blob/main/client/src/components/hero-section.tsx"
click node_about "https://github.com/srushti1722/srushtiportfolio/blob/main/client/src/components/about-section.tsx"
click node_experience "https://github.com/srushti1722/srushtiportfolio/blob/main/client/src/components/experience-section.tsx"
click node_skills "https://github.com/srushti1722/srushtiportfolio/blob/main/client/src/components/skills-section.tsx"
click node_projects "https://github.com/srushti1722/srushtiportfolio/blob/main/client/src/components/projects-section.tsx"
click node_education "https://github.com/srushti1722/srushtiportfolio/blob/main/client/src/components/education-section.tsx"
click node_contact_ui "https://github.com/srushti1722/srushtiportfolio/blob/main/client/src/components/contact-section.tsx"
click node_footer "https://github.com/srushti1722/srushtiportfolio/blob/main/client/src/components/footer.tsx"
click node_server "https://github.com/srushti1722/srushtiportfolio/blob/main/server/index.ts"
click node_routes "https://github.com/srushti1722/srushtiportfolio/blob/main/server/routes.ts"
click node_mailer "https://github.com/srushti1722/srushtiportfolio/blob/main/server/mailer.ts"
click node_netlify_contact "https://github.com/srushti1722/srushtiportfolio/blob/main/netlify/functions/contact.ts"

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_home,node_navigation,node_hero,node_about,node_experience,node_skills,node_projects,node_education,node_contact_ui,node_footer toneBlue
class node_routes,node_mailer,node_netlify_contact toneAmber
class node_client_entry,node_app,node_server toneMint
class node_visitor,node_email toneIndigo
```

## Components

### Portfolio experience

- [Home page](https://github.com/srushti1722/srushtiportfolio/blob/main/client/src/pages/home.tsx): `client/src/pages/home.tsx`
- [Navigation](https://github.com/srushti1722/srushtiportfolio/blob/main/client/src/components/navigation.tsx): `client/src/components/navigation.tsx`
- [Hero](https://github.com/srushti1722/srushtiportfolio/blob/main/client/src/components/hero-section.tsx): `client/src/components/hero-section.tsx`
- [About](https://github.com/srushti1722/srushtiportfolio/blob/main/client/src/components/about-section.tsx): `client/src/components/about-section.tsx`
- [Experience](https://github.com/srushti1722/srushtiportfolio/blob/main/client/src/components/experience-section.tsx): `client/src/components/experience-section.tsx`
- [Skills](https://github.com/srushti1722/srushtiportfolio/blob/main/client/src/components/skills-section.tsx): `client/src/components/skills-section.tsx`
- [Projects](https://github.com/srushti1722/srushtiportfolio/blob/main/client/src/components/projects-section.tsx): `client/src/components/projects-section.tsx`
- [Education](https://github.com/srushti1722/srushtiportfolio/blob/main/client/src/components/education-section.tsx): `client/src/components/education-section.tsx`
- [Contact form](https://github.com/srushti1722/srushtiportfolio/blob/main/client/src/components/contact-section.tsx): `client/src/components/contact-section.tsx`
- [Footer](https://github.com/srushti1722/srushtiportfolio/blob/main/client/src/components/footer.tsx): `client/src/components/footer.tsx`

### Contact delivery

- [Contact route](https://github.com/srushti1722/srushtiportfolio/blob/main/server/routes.ts): `server/routes.ts`
- [Mail delivery](https://github.com/srushti1722/srushtiportfolio/blob/main/server/mailer.ts): `server/mailer.ts`
- [Netlify contact function](https://github.com/srushti1722/srushtiportfolio/blob/main/netlify/functions/contact.ts): `netlify/functions/contact.ts`

### Application runtime

- [Client entry](https://github.com/srushti1722/srushtiportfolio/blob/main/client/src/main.tsx): `client/src/main.tsx`
- [App router](https://github.com/srushti1722/srushtiportfolio/blob/main/client/src/App.tsx): `client/src/App.tsx`
- [HTTP server](https://github.com/srushti1722/srushtiportfolio/blob/main/server/index.ts): `server/index.ts`

### Other components

- **Visitor**
- **Email service**

## Connections

- Visitor → Client entry: opens site
- Client entry → App router: renders
- App router → Home page: routes to
- Home page → Navigation: renders
- Home page → Hero: renders
- Home page → About: renders
- Home page → Experience: renders
- Home page → Skills: renders
- Home page → Projects: renders
- Home page → Education: renders
- Home page → Contact form: renders
- Home page → Footer: renders
- HTTP server → Contact route: registers routes
- Contact route → Mail delivery: sends validated message
- Mail delivery → Email service: delivers email
- Netlify contact function → Mail delivery: sends validated message