# arunpradhan-dev/portfolio architecture

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

- Interactive diagram: https://gitdiagram.com/arunpradhan-dev/portfolio
- Repository: https://github.com/arunpradhan-dev/portfolio

## Overview

This is a static personal developer portfolio: visitors browse the profile, skills, education and project showcase, and can send a contact message. The page’s JavaScript provides the interactive behavior, including navigation, animations, project-image previews and contact submission; the stylesheet supplies the visual presentation. The README also documents a custom 404 page and resume assets. The HTML and CSS were not sampled, so their specific markup and layout wiring are represented only at the page level.

Main entry points: [`index.html`](https://github.com/arunpradhan-dev/portfolio/blob/main/index.html) (Portfolio page), [`index.js`](https://github.com/arunpradhan-dev/portfolio/blob/main/index.js) (Interactive behavior), [`style.css`](https://github.com/arunpradhan-dev/portfolio/blob/main/style.css) (Page styling), [`error.html`](https://github.com/arunpradhan-dev/portfolio/blob/main/error.html) (404 page)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_site["Portfolio site"]
  node_page["Portfolio page<br/>[index.html]"]
  node_styles["Page styling<br/>[style.css]"]
  node_notfound["404 page<br/>[error.html]"]
end

subgraph group_interaction["Page interactions"]
  node_behavior["Interactive behavior<br/>[index.js]"]
end

subgraph group_resources["Local resources"]
  node_images["Portfolio images"]
  node_resume1["Resume PDF"]
  node_resume2["Resume PDF<br/>[pradhan_resume.pdf]"]
end

node_visitor(("Visitor"))
node_emailjs["EmailJS"]

node_visitor -->|"opens"| node_page
node_visitor -.->|"opens"| node_notfound
node_behavior -->|"updates"| node_page
node_page -->|"styled by"| node_styles
node_page -->|"showcases"| node_images
node_page -->|"links to"| node_resume1
node_page -.->|"links to"| node_resume2
node_behavior -->|"sends form"| node_emailjs

click node_page "https://github.com/arunpradhan-dev/portfolio/blob/main/index.html"
click node_styles "https://github.com/arunpradhan-dev/portfolio/blob/main/style.css"
click node_notfound "https://github.com/arunpradhan-dev/portfolio/blob/main/error.html"
click node_behavior "https://github.com/arunpradhan-dev/portfolio/blob/main/index.js"
click node_images "https://github.com/arunpradhan-dev/portfolio/tree/main/images"
click node_resume1 "https://github.com/arunpradhan-dev/portfolio/blob/main/assets/Arun_Pradhan_resume.pdf"
click node_resume2 "https://github.com/arunpradhan-dev/portfolio/blob/main/assets/pradhan_resume.pdf"

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_page,node_styles,node_notfound toneBlue
class node_behavior toneAmber
class node_images,node_resume1,node_resume2 toneMint
class node_visitor,node_emailjs toneIndigo
```

## Components

### Portfolio site

- [Portfolio page](https://github.com/arunpradhan-dev/portfolio/blob/main/index.html): `index.html`
- [Page styling](https://github.com/arunpradhan-dev/portfolio/blob/main/style.css): `style.css`
- [404 page](https://github.com/arunpradhan-dev/portfolio/blob/main/error.html): `error.html`

### Page interactions

- [Interactive behavior](https://github.com/arunpradhan-dev/portfolio/blob/main/index.js): `index.js`

### Local resources

- [Portfolio images](https://github.com/arunpradhan-dev/portfolio/tree/main/images): `images`
- [Resume PDF](https://github.com/arunpradhan-dev/portfolio/blob/main/assets/Arun_Pradhan_resume.pdf): `assets/Arun_Pradhan_resume.pdf`
- [Resume PDF](https://github.com/arunpradhan-dev/portfolio/blob/main/assets/pradhan_resume.pdf): `assets/pradhan_resume.pdf`

### Other components

- **Visitor**
- **EmailJS**

## Connections

- Visitor → Portfolio page: opens
- Visitor → 404 page: opens
- Interactive behavior → Portfolio page: updates
- Portfolio page → Page styling: styled by
- Portfolio page → Portfolio images: showcases
- Portfolio page → Resume PDF: links to
- Portfolio page → Resume PDF: links to
- Interactive behavior → EmailJS: sends form