# naresh733081/my-portfolio architecture

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

- Interactive diagram: https://gitdiagram.com/naresh733081/my-portfolio
- Repository: https://github.com/naresh733081/my-portfolio

## Overview

This is a React personal portfolio presenting its owner’s profile, résumé, skills, projects, education, experience, and contact details. A visitor enters the routed application, uses the shared navigation to select a section, and reads the corresponding portfolio page; the home page also exposes the résumé. The graph covers the app shell, navigation behavior, and portfolio content. Relationships are based on the supplied source excerpts and index; unsampled page internals and external destinations are not inferred.

Main entry points: [`src/App.js`](https://github.com/naresh733081/my-portfolio/blob/main/src/App.js) (Router and shell), [`src/components/Navbar.js`](https://github.com/naresh733081/my-portfolio/blob/main/src/components/Navbar.js) (Navigation bar), [`src/components/Home.js`](https://github.com/naresh733081/my-portfolio/blob/main/src/components/Home.js) (Home profile), [`src/index.js`](https://github.com/naresh733081/my-portfolio/blob/main/src/index.js) (React entry)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_shell["Application shell"]
  node_app["Router and shell<br/>[App.js]"]
  node_entry["React entry<br/>[index.js]"]
end

subgraph group_navigation["Navigation"]
  node_navbar["Navigation bar<br/>[Navbar.js]"]
  node_scroll["Scroll reset<br/>[ScrollToTop.js]"]
end

subgraph group_content["Portfolio content"]
  node_home["Home profile<br/>[Home.js]"]
  node_resume["Résumé PDF<br/>[resume.pdf]"]
  node_projects["Projects<br/>[Projects.js]"]
  node_education["Education<br/>[Education.js]"]
  node_experience["Experience<br/>[Experience.js]"]
  node_skills["Skills<br/>[Skills.js]"]
  node_contact["Contact details<br/>[ContactMe.js]"]
  node_footer["Footer<br/>[Footer.js]"]
end

node_visitor(("Visitor"))

node_visitor -->|"opens portfolio"| node_app
node_entry -->|"renders"| node_app
node_app -->|"renders"| node_navbar
node_app -->|"routes to"| node_home
node_app -->|"routes to"| node_projects
node_app -->|"routes to"| node_education
node_app -->|"routes to"| node_experience
node_app -->|"routes to"| node_skills
node_app -->|"routes to"| node_contact
node_app -->|"renders"| node_footer
node_navbar -->|"renders"| node_scroll
node_home -->|"links résumé"| node_resume

click node_app "https://github.com/naresh733081/my-portfolio/blob/main/src/App.js"
click node_entry "https://github.com/naresh733081/my-portfolio/blob/main/src/index.js"
click node_navbar "https://github.com/naresh733081/my-portfolio/blob/main/src/components/Navbar.js"
click node_scroll "https://github.com/naresh733081/my-portfolio/blob/main/src/components/ScrollToTop.js"
click node_home "https://github.com/naresh733081/my-portfolio/blob/main/src/components/Home.js"
click node_resume "https://github.com/naresh733081/my-portfolio/blob/main/src/assets/resume.pdf"
click node_projects "https://github.com/naresh733081/my-portfolio/blob/main/src/components/Projects.js"
click node_education "https://github.com/naresh733081/my-portfolio/blob/main/src/components/Education.js"
click node_experience "https://github.com/naresh733081/my-portfolio/blob/main/src/components/Experience.js"
click node_skills "https://github.com/naresh733081/my-portfolio/blob/main/src/components/Skills.js"
click node_contact "https://github.com/naresh733081/my-portfolio/blob/main/src/components/ContactMe.js"
click node_footer "https://github.com/naresh733081/my-portfolio/blob/main/src/components/Footer.js"

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_app,node_entry toneBlue
class node_navbar,node_scroll toneAmber
class node_home,node_resume,node_projects,node_education,node_experience,node_skills,node_contact,node_footer toneMint
class node_visitor toneIndigo
```

## Components

### Application shell

- [Router and shell](https://github.com/naresh733081/my-portfolio/blob/main/src/App.js): `src/App.js`
- [React entry](https://github.com/naresh733081/my-portfolio/blob/main/src/index.js): `src/index.js`

### Navigation

- [Navigation bar](https://github.com/naresh733081/my-portfolio/blob/main/src/components/Navbar.js): `src/components/Navbar.js`
- [Scroll reset](https://github.com/naresh733081/my-portfolio/blob/main/src/components/ScrollToTop.js): `src/components/ScrollToTop.js`

### Portfolio content

- [Home profile](https://github.com/naresh733081/my-portfolio/blob/main/src/components/Home.js): `src/components/Home.js`
- [Résumé PDF](https://github.com/naresh733081/my-portfolio/blob/main/src/assets/resume.pdf): `src/assets/resume.pdf`
- [Projects](https://github.com/naresh733081/my-portfolio/blob/main/src/components/Projects.js): `src/components/Projects.js`
- [Education](https://github.com/naresh733081/my-portfolio/blob/main/src/components/Education.js): `src/components/Education.js`
- [Experience](https://github.com/naresh733081/my-portfolio/blob/main/src/components/Experience.js): `src/components/Experience.js`
- [Skills](https://github.com/naresh733081/my-portfolio/blob/main/src/components/Skills.js): `src/components/Skills.js`
- [Contact details](https://github.com/naresh733081/my-portfolio/blob/main/src/components/ContactMe.js): `src/components/ContactMe.js`
- [Footer](https://github.com/naresh733081/my-portfolio/blob/main/src/components/Footer.js): `src/components/Footer.js`

### Other components

- **Visitor**

## Connections

- Visitor → Router and shell: opens portfolio
- React entry → Router and shell: renders (evidence: `src/index.js`)
- Router and shell → Navigation bar: renders (evidence: `src/App.js`)
- Router and shell → Home profile: routes to (evidence: `src/App.js`)
- Router and shell → Projects: routes to (evidence: `src/App.js`)
- Router and shell → Education: routes to (evidence: `src/App.js`)
- Router and shell → Experience: routes to (evidence: `src/App.js`)
- Router and shell → Skills: routes to (evidence: `src/App.js`)
- Router and shell → Contact details: routes to (evidence: `src/App.js`)
- Router and shell → Footer: renders (evidence: `src/App.js`)
- Navigation bar → Scroll reset: renders (evidence: `src/components/Navbar.js`)
- Home profile → Résumé PDF: links résumé (evidence: `src/components/Home.js`)