# muneeshkumarm/muneeshkumar_m_portfolio architecture

> Architecture diagram of the GitHub repository muneeshkumarm/muneeshkumar_m_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/muneeshkumarm/muneeshkumar_m_portfolio
- Repository: https://github.com/muneeshkumarm/muneeshkumar_m_portfolio

## Overview

This repository is a personal portfolio website with an interactive contact form. Visitors browse profile, skills, education, internship, project and certification content; someone submitting the contact form triggers a browser request to the contact API, which validates the message and attempts configured notification and logging integrations. The UI is largely implemented in one React file, so several distinct portfolio areas share that source path. The contact API excerpt shows its integration calls; other portfolio details are based on the README and sampled App.jsx excerpt.

Main entry points: [`api/contact.js`](https://github.com/muneeshkumarm/muneeshkumar_m_portfolio/blob/master/api/contact.js) (Contact API), [`src/main.jsx`](https://github.com/muneeshkumarm/muneeshkumar_m_portfolio/blob/master/src/main.jsx) (React Entry), [`src/App.jsx`](https://github.com/muneeshkumarm/muneeshkumar_m_portfolio/blob/master/src/App.jsx) (Portfolio UI), [`src/components/SkillIcons.jsx`](https://github.com/muneeshkumarm/muneeshkumar_m_portfolio/blob/master/src/components/SkillIcons.jsx) (Skills Matrix)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_runtime["Portfolio Runtime"]
  node_app_entry["React Entry<br/>[main.jsx]"]
  node_portfolio["Portfolio UI<br/>[App.jsx]"]
end

subgraph group_content["Portfolio Content"]
  node_profile["Profile &amp; About<br/>[App.jsx]"]
  node_skills["Skills Matrix<br/>[SkillIcons.jsx]"]
  node_education["Education Timeline<br/>[App.jsx]"]
  node_internships["Internship Pipeline<br/>[App.jsx]"]
  node_projects["Project Dashboards<br/>[App.jsx]"]
  node_certifications["Certifications<br/>[App.jsx]"]
end

subgraph group_contact["Contact Workflow"]
  node_contact_form["Contact Form<br/>[App.jsx]"]
  node_contact_api["Contact API<br/>[contact.js]"]
end

subgraph group_integrations["External Services"]
  node_resend["Resend Email"]
  node_sheets[("Google Sheets")]
  node_telegram["Telegram Alerts"]
end

node_visitor(("Visitor"))

node_visitor -->|"opens"| node_app_entry
node_app_entry -->|"renders"| node_portfolio
node_portfolio -->|"imports skill data"| node_skills
node_visitor -->|"views"| node_profile
node_visitor -->|"browses"| node_skills
node_visitor -->|"views"| node_education
node_visitor -->|"views"| node_internships
node_visitor -->|"views"| node_projects
node_visitor -->|"previews"| node_certifications
node_visitor -->|"submits"| node_contact_form
node_contact_form -->|"POSTs message"| node_contact_api
node_contact_api -->|"sends email"| node_resend
node_contact_api -->|"posts submission"| node_sheets
node_contact_api -->|"sends alert"| node_telegram

click node_app_entry "https://github.com/muneeshkumarm/muneeshkumar_m_portfolio/blob/master/src/main.jsx"
click node_portfolio "https://github.com/muneeshkumarm/muneeshkumar_m_portfolio/blob/master/src/App.jsx"
click node_profile "https://github.com/muneeshkumarm/muneeshkumar_m_portfolio/blob/master/src/App.jsx"
click node_skills "https://github.com/muneeshkumarm/muneeshkumar_m_portfolio/blob/master/src/components/SkillIcons.jsx"
click node_education "https://github.com/muneeshkumarm/muneeshkumar_m_portfolio/blob/master/src/App.jsx"
click node_internships "https://github.com/muneeshkumarm/muneeshkumar_m_portfolio/blob/master/src/App.jsx"
click node_projects "https://github.com/muneeshkumarm/muneeshkumar_m_portfolio/blob/master/src/App.jsx"
click node_certifications "https://github.com/muneeshkumarm/muneeshkumar_m_portfolio/blob/master/src/App.jsx"
click node_contact_form "https://github.com/muneeshkumarm/muneeshkumar_m_portfolio/blob/master/src/App.jsx"
click node_contact_api "https://github.com/muneeshkumarm/muneeshkumar_m_portfolio/blob/master/api/contact.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_entry,node_portfolio toneBlue
class node_profile,node_skills,node_education,node_internships,node_projects,node_certifications toneAmber
class node_contact_form,node_contact_api toneMint
class node_resend,node_sheets,node_telegram toneRose
class node_visitor toneIndigo
```

## Components

### Portfolio Runtime

- [React Entry](https://github.com/muneeshkumarm/muneeshkumar_m_portfolio/blob/master/src/main.jsx): `src/main.jsx`
- [Portfolio UI](https://github.com/muneeshkumarm/muneeshkumar_m_portfolio/blob/master/src/App.jsx): `src/App.jsx`

### Portfolio Content

- [Profile & About](https://github.com/muneeshkumarm/muneeshkumar_m_portfolio/blob/master/src/App.jsx): `src/App.jsx`
- [Skills Matrix](https://github.com/muneeshkumarm/muneeshkumar_m_portfolio/blob/master/src/components/SkillIcons.jsx): `src/components/SkillIcons.jsx`
- [Education Timeline](https://github.com/muneeshkumarm/muneeshkumar_m_portfolio/blob/master/src/App.jsx): `src/App.jsx`
- [Internship Pipeline](https://github.com/muneeshkumarm/muneeshkumar_m_portfolio/blob/master/src/App.jsx): `src/App.jsx`
- [Project Dashboards](https://github.com/muneeshkumarm/muneeshkumar_m_portfolio/blob/master/src/App.jsx): `src/App.jsx`
- [Certifications](https://github.com/muneeshkumarm/muneeshkumar_m_portfolio/blob/master/src/App.jsx): `src/App.jsx`

### Contact Workflow

- [Contact Form](https://github.com/muneeshkumarm/muneeshkumar_m_portfolio/blob/master/src/App.jsx): `src/App.jsx`
- [Contact API](https://github.com/muneeshkumarm/muneeshkumar_m_portfolio/blob/master/api/contact.js): `api/contact.js`

### External Services

- **Resend Email**
- **Google Sheets**
- **Telegram Alerts**

### Other components

- **Visitor**

## Connections

- Visitor → React Entry: opens (evidence: `README.md`)
- React Entry → Portfolio UI: renders (evidence: `src/main.jsx`)
- Portfolio UI → Skills Matrix: imports skill data (evidence: `src/App.jsx`)
- Visitor → Profile & About: views (evidence: `README.md`)
- Visitor → Skills Matrix: browses (evidence: `README.md`)
- Visitor → Education Timeline: views (evidence: `README.md`)
- Visitor → Internship Pipeline: views (evidence: `README.md`)
- Visitor → Project Dashboards: views (evidence: `README.md`)
- Visitor → Certifications: previews (evidence: `README.md`)
- Visitor → Contact Form: submits (evidence: `README.md`)
- Contact Form → Contact API: POSTs message (evidence: `src/App.jsx`)
- Contact API → Resend Email: sends email (evidence: `api/contact.js`)
- Contact API → Google Sheets: posts submission (evidence: `api/contact.js`)
- Contact API → Telegram Alerts: sends alert (evidence: `api/contact.js`)