# branstile/personalwebsite architecture

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

- Interactive diagram: https://gitdiagram.com/branstile/personalwebsite
- Repository: https://github.com/branstile/personalwebsite

## Overview

This is a personal portfolio site. Visitors browse a home page with a biography, resume download, experience and project summaries, then open dedicated detail pages; the pages obtain experience and project records through shared Prisma result helpers. API routes also expose those records. The source excerpts show route-to-helper and page-to-component calls, but not the helper’s database implementation, so the database connection is left unverified. The README provides no further capability details.

Main entry points: [`app/prisma/prismaResults.ts`](https://github.com/branstile/personalwebsite/blob/main/app/prisma/prismaResults.ts) (Prisma Results), [`app/app/components/NavBar.tsx`](https://github.com/branstile/personalwebsite/blob/main/app/app/components/NavBar.tsx) (Navigation), [`app/app/page.tsx`](https://github.com/branstile/personalwebsite/blob/main/app/app/page.tsx) (Home Page), [`app/app/experience/page.tsx`](https://github.com/branstile/personalwebsite/blob/main/app/app/experience/page.tsx) (Experience Page)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_site["Site Shell"]
  node_layout["Root Layout<br/>[layout.tsx]"]
  node_navigation["Navigation<br/>[NavBar.tsx]"]
end

subgraph group_content["Portfolio Content"]
  node_home["Home Page<br/>[page.tsx]"]
  node_about["About Profile<br/>[AboutMe.tsx]"]
  node_resume["Resume PDF<br/>[resume.pdf]"]
  node_summarycards["Summary Cards<br/>[InfoCard.tsx]"]
  node_experiencepage["Experience Page<br/>[page.tsx]"]
  node_experiencedetail["Experience Details<br/>[ExExtended.tsx]"]
  node_projectspage["Projects Page<br/>[page.tsx]"]
  node_projectdetail["Project Details"]
end

subgraph group_data["Content Access"]
  node_experienceapi["Experience API<br/>[route.ts]"]
  node_projectsapi["Projects API<br/>[route.ts]"]
  node_results["Prisma Results<br/>[prismaResults.ts]"]
  node_database[("Portfolio Database<br/>[schema.prisma]")]
end

node_visitor(("Visitor"))

node_visitor -->|"opens site"| node_navigation
node_navigation -->|"links to"| node_home
node_navigation -->|"links to"| node_experiencepage
node_navigation -->|"links to"| node_projectspage
node_layout -->|"renders"| node_navigation
node_visitor -.->|"views pages"| node_layout
node_home -->|"renders"| node_about
node_home -->|"renders"| node_summarycards
node_about -->|"links to"| node_resume
node_home -->|"fetches records"| node_results
node_experiencepage -->|"fetches records"| node_results
node_experiencepage -->|"renders"| node_experiencedetail
node_projectspage -->|"fetches records"| node_results
node_projectspage -->|"renders"| node_projectdetail
node_experienceapi -->|"fetches records"| node_results
node_projectsapi -->|"fetches records"| node_results
node_results -.->|"reads records"| node_database
node_visitor -.->|"requests data"| node_experienceapi
node_visitor -.->|"requests data"| node_projectsapi

click node_layout "https://github.com/branstile/personalwebsite/blob/main/app/app/layout.tsx"
click node_navigation "https://github.com/branstile/personalwebsite/blob/main/app/app/components/NavBar.tsx"
click node_home "https://github.com/branstile/personalwebsite/blob/main/app/app/page.tsx"
click node_about "https://github.com/branstile/personalwebsite/blob/main/app/app/components/AboutMe.tsx"
click node_resume "https://github.com/branstile/personalwebsite/blob/main/app/public/resume.pdf"
click node_summarycards "https://github.com/branstile/personalwebsite/blob/main/app/app/components/InfoCard.tsx"
click node_experiencepage "https://github.com/branstile/personalwebsite/blob/main/app/app/experience/page.tsx"
click node_experiencedetail "https://github.com/branstile/personalwebsite/blob/main/app/app/components/ExExtended.tsx"
click node_projectspage "https://github.com/branstile/personalwebsite/blob/main/app/app/projects/page.tsx"
click node_projectdetail "https://github.com/branstile/personalwebsite/blob/main/app/app/components/ProjectsExtended.tsx"
click node_experienceapi "https://github.com/branstile/personalwebsite/blob/main/app/app/api/experience/route.ts"
click node_projectsapi "https://github.com/branstile/personalwebsite/blob/main/app/app/api/projects/route.ts"
click node_results "https://github.com/branstile/personalwebsite/blob/main/app/prisma/prismaResults.ts"
click node_database "https://github.com/branstile/personalwebsite/blob/main/app/prisma/schema.prisma"

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_layout,node_navigation toneBlue
class node_home,node_about,node_resume,node_summarycards,node_experiencepage,node_experiencedetail,node_projectspage,node_projectdetail toneAmber
class node_experienceapi,node_projectsapi,node_results,node_database toneMint
class node_visitor toneIndigo
```

## Components

### Site Shell

- [Root Layout](https://github.com/branstile/personalwebsite/blob/main/app/app/layout.tsx): `app/app/layout.tsx`
- [Navigation](https://github.com/branstile/personalwebsite/blob/main/app/app/components/NavBar.tsx): `app/app/components/NavBar.tsx`

### Portfolio Content

- [Home Page](https://github.com/branstile/personalwebsite/blob/main/app/app/page.tsx): `app/app/page.tsx`
- [About Profile](https://github.com/branstile/personalwebsite/blob/main/app/app/components/AboutMe.tsx): `app/app/components/AboutMe.tsx`
- [Resume PDF](https://github.com/branstile/personalwebsite/blob/main/app/public/resume.pdf): `app/public/resume.pdf`
- [Summary Cards](https://github.com/branstile/personalwebsite/blob/main/app/app/components/InfoCard.tsx): `app/app/components/InfoCard.tsx`
- [Experience Page](https://github.com/branstile/personalwebsite/blob/main/app/app/experience/page.tsx): `app/app/experience/page.tsx`
- [Experience Details](https://github.com/branstile/personalwebsite/blob/main/app/app/components/ExExtended.tsx): `app/app/components/ExExtended.tsx`
- [Projects Page](https://github.com/branstile/personalwebsite/blob/main/app/app/projects/page.tsx): `app/app/projects/page.tsx`
- [Project Details](https://github.com/branstile/personalwebsite/blob/main/app/app/components/ProjectsExtended.tsx): `app/app/components/ProjectsExtended.tsx`

### Content Access

- [Experience API](https://github.com/branstile/personalwebsite/blob/main/app/app/api/experience/route.ts): `app/app/api/experience/route.ts`
- [Projects API](https://github.com/branstile/personalwebsite/blob/main/app/app/api/projects/route.ts): `app/app/api/projects/route.ts`
- [Prisma Results](https://github.com/branstile/personalwebsite/blob/main/app/prisma/prismaResults.ts): `app/prisma/prismaResults.ts`
- [Portfolio Database](https://github.com/branstile/personalwebsite/blob/main/app/prisma/schema.prisma): `app/prisma/schema.prisma`

### Other components

- **Visitor**

## Connections

- Visitor → Navigation: opens site (evidence: `app/app/components/NavBar.tsx`)
- Navigation → Home Page: links to (evidence: `app/app/components/NavBar.tsx`)
- Navigation → Experience Page: links to (evidence: `app/app/components/NavBar.tsx`)
- Navigation → Projects Page: links to (evidence: `app/app/components/NavBar.tsx`)
- Root Layout → Navigation: renders (evidence: `app/app/layout.tsx`)
- Visitor → Root Layout: views pages
- Home Page → About Profile: renders (evidence: `app/app/page.tsx`)
- Home Page → Summary Cards: renders (evidence: `app/app/page.tsx`)
- About Profile → Resume PDF: links to (evidence: `app/app/components/AboutMe.tsx`)
- Home Page → Prisma Results: fetches records (evidence: `app/app/page.tsx`)
- Experience Page → Prisma Results: fetches records (evidence: `app/app/experience/page.tsx`)
- Experience Page → Experience Details: renders (evidence: `app/app/experience/page.tsx`)
- Projects Page → Prisma Results: fetches records (evidence: `app/app/projects/page.tsx`)
- Projects Page → Project Details: renders (evidence: `app/app/projects/page.tsx`)
- Experience API → Prisma Results: fetches records (evidence: `app/app/api/experience/route.ts`)
- Projects API → Prisma Results: fetches records (evidence: `app/app/api/projects/route.ts`)
- Prisma Results → Portfolio Database: reads records
- Visitor → Experience API: requests data
- Visitor → Projects API: requests data