# ashita-abraham/portfolio architecture

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

- Interactive diagram: https://gitdiagram.com/ashita-abraham/portfolio
- Repository: https://github.com/ashita-abraham/portfolio

## Overview

This is a personal portfolio site: visitors browse the owner’s introduction, background, experience, selected work, skills, and contact options, with dedicated case-study pages for Clover and FinTellect and a résumé link. The home page composes the narrative sections; project cards lead to the case studies. Supporting UI includes navigation, theme selection, and reveal animations. The sampled code supports these page and component relationships, but the case-study excerpts are partial, so their described product workflows are not expanded into implementation architecture.

Main entry points: [`app/page.tsx`](https://github.com/ashita-abraham/portfolio/blob/main/app/page.tsx) (Home Page), [`components/Projects.tsx`](https://github.com/ashita-abraham/portfolio/blob/main/components/Projects.tsx) (Selected Work), [`components/Reveal.tsx`](https://github.com/ashita-abraham/portfolio/blob/main/components/Reveal.tsx) (Reveal Animation), [`components/Navbar.tsx`](https://github.com/ashita-abraham/portfolio/blob/main/components/Navbar.tsx) (Navigation)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_pages["Page Routes"]
  node_home["Home Page<br/>[page.tsx]"]
  node_clover["Clover Case Study<br/>[page.tsx]"]
  node_fintellect["FinTellect Case Study<br/>[page.tsx]"]
end

subgraph group_narrative["Portfolio Sections"]
  node_hero["Introduction<br/>[Hero.tsx]"]
  node_about["About<br/>[About.tsx]"]
  node_experience["Experience<br/>[Experience.tsx]"]
  node_projects["Selected Work<br/>[Projects.tsx]"]
  node_skills["Skills<br/>[Skills.tsx]"]
  node_contact["Contact<br/>[Contact.tsx]"]
end

subgraph group_interaction["Shared Interface"]
  node_navbar["Navigation<br/>[Navbar.tsx]"]
  node_theme["Theme Toggle<br/>[ThemeToggle.tsx]"]
  node_reveal["Reveal Animation<br/>[Reveal.tsx]"]
  node_layout["Root Layout<br/>[layout.tsx]"]
  node_styles["Global Styles<br/>[globals.css]"]
end

subgraph group_assets["Portfolio Assets"]
  node_resume["Résumé PDF"]
end

node_visitor(("Visitor"))

node_visitor -->|"opens"| node_home
node_visitor -->|"opens"| node_clover
node_visitor -->|"opens"| node_fintellect
node_home -->|"uses"| node_layout
node_layout -->|"imports"| node_styles
node_home -->|"renders"| node_navbar
node_home -->|"renders"| node_hero
node_home -->|"renders"| node_about
node_home -->|"renders"| node_experience
node_home -->|"renders"| node_projects
node_home -->|"renders"| node_skills
node_home -->|"renders"| node_contact
node_navbar -->|"renders"| node_theme
node_navbar -->|"links to"| node_resume
node_hero -->|"links to"| node_resume
node_projects -->|"links to"| node_clover
node_projects -->|"links to"| node_fintellect
node_clover -->|"links back"| node_home
node_fintellect -->|"links back"| node_home
node_experience -->|"uses"| node_reveal
node_projects -->|"uses"| node_reveal
node_skills -->|"uses"| node_reveal
node_contact -->|"uses"| node_reveal

click node_home "https://github.com/ashita-abraham/portfolio/blob/main/app/page.tsx"
click node_clover "https://github.com/ashita-abraham/portfolio/blob/main/app/projects/clover/page.tsx"
click node_fintellect "https://github.com/ashita-abraham/portfolio/blob/main/app/projects/fintellect/page.tsx"
click node_hero "https://github.com/ashita-abraham/portfolio/blob/main/components/Hero.tsx"
click node_about "https://github.com/ashita-abraham/portfolio/blob/main/components/About.tsx"
click node_experience "https://github.com/ashita-abraham/portfolio/blob/main/components/Experience.tsx"
click node_projects "https://github.com/ashita-abraham/portfolio/blob/main/components/Projects.tsx"
click node_skills "https://github.com/ashita-abraham/portfolio/blob/main/components/Skills.tsx"
click node_contact "https://github.com/ashita-abraham/portfolio/blob/main/components/Contact.tsx"
click node_navbar "https://github.com/ashita-abraham/portfolio/blob/main/components/Navbar.tsx"
click node_theme "https://github.com/ashita-abraham/portfolio/blob/main/components/ThemeToggle.tsx"
click node_reveal "https://github.com/ashita-abraham/portfolio/blob/main/components/Reveal.tsx"
click node_layout "https://github.com/ashita-abraham/portfolio/blob/main/app/layout.tsx"
click node_styles "https://github.com/ashita-abraham/portfolio/blob/main/app/globals.css"
click node_resume "https://github.com/ashita-abraham/portfolio/blob/main/public/Ashita_Abraham_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_home,node_clover,node_fintellect toneBlue
class node_hero,node_about,node_experience,node_projects,node_skills,node_contact toneAmber
class node_navbar,node_theme,node_reveal,node_layout,node_styles toneMint
class node_resume toneRose
class node_visitor toneIndigo
```

## Components

### Page Routes

- [Home Page](https://github.com/ashita-abraham/portfolio/blob/main/app/page.tsx): `app/page.tsx`
- [Clover Case Study](https://github.com/ashita-abraham/portfolio/blob/main/app/projects/clover/page.tsx): `app/projects/clover/page.tsx`
- [FinTellect Case Study](https://github.com/ashita-abraham/portfolio/blob/main/app/projects/fintellect/page.tsx): `app/projects/fintellect/page.tsx`

### Portfolio Sections

- [Introduction](https://github.com/ashita-abraham/portfolio/blob/main/components/Hero.tsx): `components/Hero.tsx`
- [About](https://github.com/ashita-abraham/portfolio/blob/main/components/About.tsx): `components/About.tsx`
- [Experience](https://github.com/ashita-abraham/portfolio/blob/main/components/Experience.tsx): `components/Experience.tsx`
- [Selected Work](https://github.com/ashita-abraham/portfolio/blob/main/components/Projects.tsx): `components/Projects.tsx`
- [Skills](https://github.com/ashita-abraham/portfolio/blob/main/components/Skills.tsx): `components/Skills.tsx`
- [Contact](https://github.com/ashita-abraham/portfolio/blob/main/components/Contact.tsx): `components/Contact.tsx`

### Shared Interface

- [Navigation](https://github.com/ashita-abraham/portfolio/blob/main/components/Navbar.tsx): `components/Navbar.tsx`
- [Theme Toggle](https://github.com/ashita-abraham/portfolio/blob/main/components/ThemeToggle.tsx): `components/ThemeToggle.tsx`
- [Reveal Animation](https://github.com/ashita-abraham/portfolio/blob/main/components/Reveal.tsx): `components/Reveal.tsx`
- [Root Layout](https://github.com/ashita-abraham/portfolio/blob/main/app/layout.tsx): `app/layout.tsx`
- [Global Styles](https://github.com/ashita-abraham/portfolio/blob/main/app/globals.css): `app/globals.css`

### Portfolio Assets

- [Résumé PDF](https://github.com/ashita-abraham/portfolio/blob/main/public/Ashita_Abraham_Resume.pdf): `public/Ashita_Abraham_Resume.pdf`

### Other components

- **Visitor**

## Connections

- Visitor → Home Page: opens
- Visitor → Clover Case Study: opens
- Visitor → FinTellect Case Study: opens
- Home Page → Root Layout: uses
- Root Layout → Global Styles: imports
- Home Page → Navigation: renders
- Home Page → Introduction: renders
- Home Page → About: renders
- Home Page → Experience: renders
- Home Page → Selected Work: renders
- Home Page → Skills: renders
- Home Page → Contact: renders
- Navigation → Theme Toggle: renders
- Navigation → Résumé PDF: links to
- Introduction → Résumé PDF: links to
- Selected Work → Clover Case Study: links to
- Selected Work → FinTellect Case Study: links to
- Clover Case Study → Home Page: links back
- FinTellect Case Study → Home Page: links back
- Experience → Reveal Animation: uses
- Selected Work → Reveal Animation: uses
- Skills → Reveal Animation: uses
- Contact → Reveal Animation: uses