# singhaakashdeep/softwarestacked architecture

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

- Interactive diagram: https://gitdiagram.com/singhaakashdeep/softwarestacked
- Repository: https://github.com/singhaakashdeep/softwarestacked

## Overview

1. **Repository shape**
   - This is a **single Next.js 16 frontend application** (`softwarestackedfrontend`) that acts as a **static portfolio site**.
   - The repo does **not** contain the AI, backend, or infrastructure systems described in the content; those are presented as portfolio case studies.

2. **Primary runtime boundary**
   - The application is built with **React + TypeScript + Next.js App Router** and is intended to be **statically exported** for deployment on static hosting/cPanel.
   - That means the architecture is mostly **client-side presentation plus build-time rendering**, not a server-driven app.

3. **Route structure / page subsystem**
   - The `src/app` directory defines the site’s top-level routes:
     - `/` home page
     - `/about`
     - `/resume`
     - `/work/[slug]` dynamic project detail pages
   - `src/app/layout.tsx` is the global shell for shared site structure, metadata, and layout-wide providers/styles.

4. **Content flow**
   - The core content flow is **data-driven** rather than fetched from an API.
   - `src/data/projects.ts` is the key content source for featured projects and likely feeds both the homepage project section and the dynamic work pages.

5. **Dynamic project details**
   - `src/app/work/[slug]/page.tsx` is the main dynamic boundary in the app.
   - It likely resolves a project slug against the local projects dataset, which keeps the portfolio fully static while still supporting per-project detail pages.

6. **Shared layout and navigation**
   - `src/components/layout/Navbar.tsx` provides the persistent navigation layer across pages.
   - `src/components/PageTransition.tsx` adds route transition polish, indicating the app emphasizes presentation and motion rather than complex state management.

7. **Homepage composition**
   - The homepage is assembled from reusable section components:
     - `Hero.tsx`
     - `FeaturedProjects.tsx`
     - `ArchitectureDiagram.tsx`
   - This suggests the landing page is a **section-based narrative**: introduce the author, surface key work, then reinforce systems-thinking visually.

8. **UI component layer**
   - `src/components/ui/*` contains reusable primitives such as button, card, badge, dialog, and sheet.
   - These are a design-system layer used to keep the portfolio consistent and reduce page-specific markup duplication.

9. **Styling and presentation**
   - Styling is handled with **Tailwind CSS** plus global stylesheet entry points in `src/app/globals.css` and `src/styles/globals.css`.
   - `tailwind.config.ts`, `postcss.config.js`, and `components.json` indicate a componentized Tailwind setup, likely influenced by shadcn-style conventions.

10. **Assets and downloadable content**
   - `public/Aakash_S_resume.pdf` is a static asset exposed directly by the site.
   - The `/resume` route likely wraps this asset in a presentation page, separating the **downloadable document** from the **browser-rendered resume view**.

11. **External systems shown in the portfolio**
   - The site describes external technologies and deployments such as **FastAPI, PostgreSQL/pgvector, MCP, LangChain, Docker, AWS, and Kubernetes**.
   - These are **reference architectures in the content**, not runtime dependencies of the frontend itself.

12. **Operational posture**
   - The repo is optimized for **fast static delivery** and portability: no database, no app server, and no runtime API dependency inside this codebase.
   - The deployment model is therefore “build once, host as static files,” which fits the cPanel/public_html workflow described in the README.

Main entry points: [`softwarestackedfrontend/src/app/layout.tsx`](https://github.com/singhaakashdeep/softwarestacked/blob/main/softwarestackedfrontend/src/app/layout.tsx) (App shell), [`softwarestackedfrontend/src/app/page.tsx`](https://github.com/singhaakashdeep/softwarestacked/blob/main/softwarestackedfrontend/src/app/page.tsx) (Home page), [`softwarestackedfrontend/src/components/ui`](https://github.com/singhaakashdeep/softwarestacked/tree/main/softwarestackedfrontend/src/components/ui) (UI primitives), [`softwarestackedfrontend`](https://github.com/singhaakashdeep/softwarestacked/tree/main/softwarestackedfrontend) (Portfolio site)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_runtime["Runtime"]
  node_site["Portfolio site<br/>Next.js static frontend"]
  node_layout["App shell<br/>Next layout<br/>[layout.tsx]"]
  node_home["Home page<br/>Route page<br/>[page.tsx]"]
  node_about["About page<br/>Route page<br/>[page.tsx]"]
  node_resume["Resume page<br/>Route page<br/>[page.tsx]"]
  node_work["Work detail<br/>Dynamic route<br/>[page.tsx]"]
end

subgraph group_components["Components"]
  node_navbar["Navbar<br/>Navigation component<br/>[Navbar.tsx]"]
  node_transition["Page transition<br/>Motion component<br/>[PageTransition.tsx]"]
  node_hero["Hero<br/>Section component<br/>[Hero.tsx]"]
  node_featured["Featured work<br/>Section component"]
  node_diagram["Architecture diagram<br/>Section component"]
  node_ui["UI primitives<br/>Design system"]
end

subgraph group_content["Content"]
  node_projects[("Projects data<br/>Content dataset<br/>[projects.ts]")]
  node_resumeasset["Resume PDF<br/>Static asset"]
end

subgraph group_styling["Styling"]
  node_styles["Global styles<br/>Tailwind CSS<br/>[globals.css]"]
  node_config["Build config<br/>Next/Tailwind config<br/>[next.config.ts]"]
end

node_site -->|"uses shell"| node_layout
node_layout -->|"includes"| node_navbar
node_layout -->|"wraps"| node_transition
node_layout -->|"applies"| node_styles
node_layout -->|"builds with"| node_config
node_home -->|"composes"| node_hero
node_home -->|"composes"| node_featured
node_home -->|"composes"| node_diagram
node_featured -->|"reads"| node_projects
node_work -->|"resolves"| node_projects
node_resume -->|"links to"| node_resumeasset
node_about -->|"renders with"| node_ui
node_home -->|"renders with"| node_ui
node_featured -->|"renders with"| node_ui
node_navbar -->|"uses"| node_ui
node_site -->|"configured by"| node_config
node_site -->|"content driven"| node_projects

click node_site "https://github.com/singhaakashdeep/softwarestacked/tree/main/softwarestackedfrontend"
click node_layout "https://github.com/singhaakashdeep/softwarestacked/blob/main/softwarestackedfrontend/src/app/layout.tsx"
click node_home "https://github.com/singhaakashdeep/softwarestacked/blob/main/softwarestackedfrontend/src/app/page.tsx"
click node_about "https://github.com/singhaakashdeep/softwarestacked/blob/main/softwarestackedfrontend/src/app/about/page.tsx"
click node_resume "https://github.com/singhaakashdeep/softwarestacked/blob/main/softwarestackedfrontend/src/app/resume/page.tsx"
click node_work "https://github.com/singhaakashdeep/softwarestacked/blob/main/softwarestackedfrontend/src/app/work/[slug]/page.tsx"
click node_navbar "https://github.com/singhaakashdeep/softwarestacked/blob/main/softwarestackedfrontend/src/components/layout/Navbar.tsx"
click node_transition "https://github.com/singhaakashdeep/softwarestacked/blob/main/softwarestackedfrontend/src/components/PageTransition.tsx"
click node_hero "https://github.com/singhaakashdeep/softwarestacked/blob/main/softwarestackedfrontend/src/components/sections/Hero.tsx"
click node_featured "https://github.com/singhaakashdeep/softwarestacked/blob/main/softwarestackedfrontend/src/components/sections/FeaturedProjects.tsx"
click node_diagram "https://github.com/singhaakashdeep/softwarestacked/blob/main/softwarestackedfrontend/src/components/ArchitectureDiagram.tsx"
click node_ui "https://github.com/singhaakashdeep/softwarestacked/tree/main/softwarestackedfrontend/src/components/ui"
click node_projects "https://github.com/singhaakashdeep/softwarestacked/blob/main/softwarestackedfrontend/src/data/projects.ts"
click node_resumeasset "https://github.com/singhaakashdeep/softwarestacked/blob/main/softwarestackedfrontend/public/Aakash_S_resume.pdf"
click node_styles "https://github.com/singhaakashdeep/softwarestacked/blob/main/softwarestackedfrontend/src/app/globals.css"
click node_config "https://github.com/singhaakashdeep/softwarestacked/blob/main/softwarestackedfrontend/next.config.ts"

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_site,node_layout,node_home,node_about,node_resume,node_work toneBlue
class node_navbar,node_transition,node_hero,node_featured,node_diagram,node_ui toneAmber
class node_projects,node_resumeasset toneMint
class node_styles,node_config toneRose
```

## Components

### Runtime

Next.js App Router frontend and route boundaries

- [Portfolio site](https://github.com/singhaakashdeep/softwarestacked/tree/main/softwarestackedfrontend): Next.js static frontend · Single-page portfolio application built for static export and hosted as files · `softwarestackedfrontend`
- [App shell](https://github.com/singhaakashdeep/softwarestacked/blob/main/softwarestackedfrontend/src/app/layout.tsx): Next layout · Global shell, metadata, and site-wide providers/styles · `softwarestackedfrontend/src/app/layout.tsx`
- [Home page](https://github.com/singhaakashdeep/softwarestacked/blob/main/softwarestackedfrontend/src/app/page.tsx): Route page · Landing page assembled from hero, projects, and architecture sections · `softwarestackedfrontend/src/app/page.tsx`
- [About page](https://github.com/singhaakashdeep/softwarestacked/blob/main/softwarestackedfrontend/src/app/about/page.tsx): Route page · Static about route for background and profile context · `softwarestackedfrontend/src/app/about/page.tsx`
- [Resume page](https://github.com/singhaakashdeep/softwarestacked/blob/main/softwarestackedfrontend/src/app/resume/page.tsx): Route page · Browser-rendered resume route wrapping the downloadable PDF asset · `softwarestackedfrontend/src/app/resume/page.tsx`
- [Work detail](https://github.com/singhaakashdeep/softwarestacked/blob/main/softwarestackedfrontend/src/app/work/[slug]/page.tsx): Dynamic route · Dynamic project detail boundary resolved from local slugs · `softwarestackedfrontend/src/app/work/[slug]/page.tsx`

### Components

Reusable layout, section, and UI components

- [Navbar](https://github.com/singhaakashdeep/softwarestacked/blob/main/softwarestackedfrontend/src/components/layout/Navbar.tsx): Navigation component · Persistent top-level navigation shared across the site · `softwarestackedfrontend/src/components/layout/Navbar.tsx`
- [Page transition](https://github.com/singhaakashdeep/softwarestacked/blob/main/softwarestackedfrontend/src/components/PageTransition.tsx): Motion component · Route transition polish for presentation-focused navigation · `softwarestackedfrontend/src/components/PageTransition.tsx`
- [Hero](https://github.com/singhaakashdeep/softwarestacked/blob/main/softwarestackedfrontend/src/components/sections/Hero.tsx): Section component · Introductory homepage section establishing the portfolio narrative · `softwarestackedfrontend/src/components/sections/Hero.tsx`
- [Featured work](https://github.com/singhaakashdeep/softwarestacked/blob/main/softwarestackedfrontend/src/components/sections/FeaturedProjects.tsx): Section component · Homepage section that surfaces selected projects from local data · `softwarestackedfrontend/src/components/sections/FeaturedProjects.tsx`
- [Architecture diagram](https://github.com/singhaakashdeep/softwarestacked/blob/main/softwarestackedfrontend/src/components/ArchitectureDiagram.tsx): Section component · Homepage visual section reinforcing systems-thinking and project framing · `softwarestackedfrontend/src/components/ArchitectureDiagram.tsx`
- [UI primitives](https://github.com/singhaakashdeep/softwarestacked/tree/main/softwarestackedfrontend/src/components/ui): Design system · Reusable shadcn-style primitives such as button, card, badge, dialog, and sheet · `softwarestackedfrontend/src/components/ui`

### Content

Static data and downloadable portfolio assets

- [Projects data](https://github.com/singhaakashdeep/softwarestacked/blob/main/softwarestackedfrontend/src/data/projects.ts): Content dataset · Local source of featured project content and work-page lookups · `softwarestackedfrontend/src/data/projects.ts`
- [Resume PDF](https://github.com/singhaakashdeep/softwarestacked/blob/main/softwarestackedfrontend/public/Aakash_S_resume.pdf): Static asset · Downloadable resume document served directly from public files · `softwarestackedfrontend/public/Aakash_S_resume.pdf`

### Styling

Global styles and build-time presentation setup

- [Global styles](https://github.com/singhaakashdeep/softwarestacked/blob/main/softwarestackedfrontend/src/app/globals.css): Tailwind CSS · Global stylesheet entry points and site-wide visual styling · `softwarestackedfrontend/src/app/globals.css`
- [Build config](https://github.com/singhaakashdeep/softwarestacked/blob/main/softwarestackedfrontend/next.config.ts): Next/Tailwind config · Static-export-oriented app and styling configuration surface · `softwarestackedfrontend/next.config.ts`

## Connections

- Portfolio site → App shell: uses shell · The application is wrapped by the global layout
- App shell → Navbar: includes · Shared navigation is rendered from the app shell
- App shell → Page transition: wraps · Route changes are polished with transition behavior
- App shell → Global styles: applies · Global styling is loaded at the layout level
- App shell → Build config: builds with · Layout and export behavior follow the site configuration
- Home page → Hero: composes · Homepage begins with the hero section
- Home page → Featured work: composes · Homepage highlights selected work through project cards
- Home page → Architecture diagram: composes · Homepage includes the architecture diagram section
- Featured work → Projects data: reads · Featured projects are sourced from local content data
- Work detail → Projects data: resolves · Dynamic work pages look up the project entry by slug
- Resume page → Resume PDF: links to · Resume page exposes the static PDF download
- About page → UI primitives: renders with · About page uses shared UI primitives for consistent presentation
- Home page → UI primitives: renders with · Homepage sections build on shared design-system components
- Featured work → UI primitives: renders with · Project cards and related elements are composed from primitives
- Navbar → UI primitives: uses · Navigation controls use reusable UI primitives
- Portfolio site → Build config: configured by · The repo is tuned for static export and frontend-only deployment
- Portfolio site → Projects data: content driven · The site’s narrative and work pages are powered by local data