# teddvv/portfolio architecture

> Architecture diagram of the GitHub repository teddvv/portfolio, 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/teddvv/portfolio
- Repository: https://github.com/teddvv/portfolio

## Overview

This is a personal portfolio website presenting Teddy Pategou’s profile, projects, background, interests, and contact information. The user-facing workflow is to open the site and browse its portfolio content; the sampled source shows the React entry point and project-layout dispatch. Most of the interface is implemented in the single core file, `src/App.jsx`. The excerpts do not show the complete page composition or contact-submission behavior, so those internal connections are not inferred.

Main entry points: [`src/main.jsx`](https://github.com/teddvv/portfolio/blob/main/src/main.jsx) (React entry), [`src/App.jsx`](https://github.com/teddvv/portfolio/blob/main/src/App.jsx) (Project showcase), [`src/index.css`](https://github.com/teddvv/portfolio/blob/main/src/index.css) (Global styles)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_runtime["Site runtime"]
  node_entry["React entry<br/>[main.jsx]"]
  node_styles["Global styles<br/>[index.css]"]
end

subgraph group_content["Portfolio content"]
  node_app["Portfolio app<br/>[App.jsx]"]
  node_navigation["Section navigation<br/>[App.jsx]"]
  node_projects["Project showcase<br/>[App.jsx]"]
  node_layouts["Project layouts<br/>[App.jsx]"]
  node_contact["Contact section<br/>[App.jsx]"]
end

node_visitor(("Site visitor"))

node_entry -->|"renders"| node_app
node_entry -->|"loads"| node_styles
node_visitor -.->|"opens site"| node_entry
node_projects -->|"dispatches layouts"| node_layouts

click node_entry "https://github.com/teddvv/portfolio/blob/main/src/main.jsx"
click node_styles "https://github.com/teddvv/portfolio/blob/main/src/index.css"
click node_app "https://github.com/teddvv/portfolio/blob/main/src/App.jsx"
click node_navigation "https://github.com/teddvv/portfolio/blob/main/src/App.jsx"
click node_projects "https://github.com/teddvv/portfolio/blob/main/src/App.jsx"
click node_layouts "https://github.com/teddvv/portfolio/blob/main/src/App.jsx"
click node_contact "https://github.com/teddvv/portfolio/blob/main/src/App.jsx"

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_entry,node_styles toneBlue
class node_app,node_navigation,node_projects,node_layouts,node_contact toneAmber
class node_visitor toneIndigo
```

## Components

### Site runtime

- [React entry](https://github.com/teddvv/portfolio/blob/main/src/main.jsx): `src/main.jsx`
- [Global styles](https://github.com/teddvv/portfolio/blob/main/src/index.css): `src/index.css`

### Portfolio content

- [Portfolio app](https://github.com/teddvv/portfolio/blob/main/src/App.jsx): `src/App.jsx`
- [Section navigation](https://github.com/teddvv/portfolio/blob/main/src/App.jsx): `src/App.jsx`
- [Project showcase](https://github.com/teddvv/portfolio/blob/main/src/App.jsx): `src/App.jsx`
- [Project layouts](https://github.com/teddvv/portfolio/blob/main/src/App.jsx): `src/App.jsx`
- [Contact section](https://github.com/teddvv/portfolio/blob/main/src/App.jsx): `src/App.jsx`

### Other components

- **Site visitor**

## Connections

- React entry → Portfolio app: renders (evidence: `src/main.jsx`)
- React entry → Global styles: loads (evidence: `src/main.jsx`)
- Site visitor → React entry: opens site
- Project showcase → Project layouts: dispatches layouts (evidence: `src/App.jsx`)