# boli27/itarg2 architecture

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

- Interactive diagram: https://gitdiagram.com/boli27/itarg2
- Repository: https://github.com/boli27/itarg2

## Overview

1. This repository is a single Next.js application built with the App Router and TypeScript. It combines the public website, server-rendered pages, and API endpoints in one codebase rather than splitting frontend and backend into separate services.

2. The top-level user-facing routes live under `src/app/` and map to the main business areas of the site: `diplomados`, `tecnicos`, `sedes`, `preinscripcion`, `transparencia`, plus the home page. There are also dynamic detail pages for items identified by `[id]`, which suggests list/detail navigation for programs, locations, and news-like content.

3. The backend/API boundary is implemented with route handlers under `src/app/api/`. Each domain has its own REST-style endpoints, typically a collection route and an item route: `diplomados`, `faqs`, `noticias`, `sedes`, and `tecnicos`. `preinscripcion` appears to be a write-oriented endpoint for form submissions rather than content retrieval.

4. Data access is organized separately from the route handlers in `src/lib/consults/`. There is one consult module per domain (`Diplomados`, `Faqs`, `Noticias`, `Sedes`, `Tecnicos`), which likely encapsulates fetching, querying, or shaping data before it reaches either API responses or server-rendered pages. This is the main internal boundary between transport/UI and domain data.

5. `src/lib/db.ts` indicates a shared database or external data source connection layer. Even without the implementation, its presence means the API and consult modules likely depend on a common persistence abstraction instead of each route talking directly to storage.

6. `src/lib/validateApiKey.ts` is a cross-cutting security control. It suggests at least some API endpoints are protected by an API key check, which is important for distinguishing public content endpoints from internal or privileged operations.

7. The UI is split into reusable components under `src/components/`. Domain-specific views live alongside shared presentation pieces: `noticias`, `preinscripcion`, `sedes`, `tecnicos`, and `transparencia`, plus generic UI such as `NavbarMT`, `Footer`, `PageHeader`, `FaqAccordion`, `NewSlider`, and `WhatsappFloat`. This shows the app is assembled from reusable page sections rather than monolithic page files.

8. The most important data flow is: request enters a page or API route, the route uses consult modules and possibly `db.ts`, data is validated or filtered, and then the result is rendered into a page component or returned as JSON. The preinscription flow is the clearest write path: form component → `/api/preinscripcion` → validation/persistence layer.

9. Static assets and site-wide metadata support the public site experience. `public/` holds images and other assets, while `manifest.ts`, `robots.ts`, and `sitemap.ts` indicate SEO and PWA-oriented metadata generation are part of the architecture.

10. Styling and build tooling are standard Next.js/Tailwind choices: `tailwind.config.js`, `postcss.config.cjs`, and `src/app/globals.css` drive the visual system. `next.config.mjs`, `eslint.config.mjs`, and the TypeScript config files define the framework/runtime boundaries for how the app is built and checked.

11. In architectural terms, this is best drawn as a modular monolith: one Next.js deployment with three clear layers—presentation pages/components, API route handlers, and shared data-access/validation utilities—backed by a common persistence layer and static public assets.

Main entry points: [`src/lib/consults/Diplomados.ts`](https://github.com/boli27/itarg2/blob/main/src/lib/consults/Diplomados.ts) (Consults), [`src/components/noticias/NewsCard.tsx`](https://github.com/boli27/itarg2/blob/main/src/components/noticias/NewsCard.tsx) (Domain views), [`src/app/layout.tsx`](https://github.com/boli27/itarg2/blob/main/src/app/layout.tsx) (App shell), [`src/app/api/preinscripcion/route.ts`](https://github.com/boli27/itarg2/blob/main/src/app/api/preinscripcion/route.ts) (Preinscripción API)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_presentation["Presentation"]
  node_src_app_layout["App shell<br/>next layout<br/>[layout.tsx]"]
  node_src_app_page["Home<br/>landing page<br/>[page.tsx]"]
  node_src_app_diplomados_page["Diplomados<br/>program listing<br/>[page.tsx]"]
  node_src_app_diplomados_id_page["Diploma detail<br/>program detail<br/>[page.tsx]"]
  node_src_app_tecnicos_page["Técnicos<br/>program listing<br/>[page.tsx]"]
  node_src_app_tecnicos_id_page["Técnico detail<br/>program detail<br/>[page.tsx]"]
  node_src_app_sedes_id_page["Sede detail<br/>location detail<br/>[page.tsx]"]
  node_src_app_preinscripcion_page["Preinscripción<br/>form page<br/>[page.tsx]"]
  node_src_app_transparencia_page["Transparencia<br/>info page<br/>[page.tsx]"]
  node_src_components_ui["Shared UI<br/>ui components<br/>[NavbarMT.tsx]"]
  node_src_components_domain["Domain views<br/>feature components<br/>[NewsCard.tsx]"]
end

subgraph group_api["API"]
  node_src_app_api_diplomados_route["Diplomados API<br/>route handler<br/>[route.ts]"]
  node_src_app_api_diplomados_id_route["Diploma API<br/>route handler<br/>[route.ts]"]
  node_src_app_api_tecnicos_route["Técnicos API<br/>route handler<br/>[route.ts]"]
  node_src_app_api_tecnicos_id_route["Técnico API<br/>route handler<br/>[route.ts]"]
  node_src_app_api_sedes_route["Sedes API<br/>route handler<br/>[route.ts]"]
  node_src_app_api_sedes_id_route["Sede API<br/>route handler<br/>[route.ts]"]
  node_src_app_api_faqs_route["FAQ API<br/>route handler<br/>[route.ts]"]
  node_src_app_api_faqs_id_route["FAQ item<br/>route handler<br/>[route.ts]"]
  node_src_app_api_noticias_route["Noticias API<br/>route handler<br/>[route.ts]"]
  node_src_app_api_noticias_id_route["News item<br/>route handler<br/>[route.ts]"]
  node_src_app_api_preinscripcion_route["Preinscripción API<br/>submission endpoint<br/>[route.ts]"]
end

subgraph group_data["Data"]
  node_src_lib_consults["Consults<br/>data access<br/>[Diplomados.ts]"]
  node_src_lib_db[("DB layer<br/>persistence<br/>[db.ts]")]
  node_src_lib_validate_api_key{{"API key check<br/>security<br/>[validateApiKey.ts]"}}
end

subgraph group_infra["Infrastructure"]
  node_src_app_globals["Global styles<br/>styling<br/>[globals.css]"]
  node_src_app_metadata["Metadata<br/>seo/pwa<br/>[manifest.ts]"]
  node_src_public["Public assets<br/>static assets"]
end

node_src_app_layout -->|"renders"| node_src_app_page
node_src_app_layout -->|"uses"| node_src_components_ui
node_src_app_page -->|"uses"| node_src_components_domain
node_src_app_diplomados_page -->|"loads"| node_src_lib_consults
node_src_app_diplomados_id_page -->|"loads"| node_src_lib_consults
node_src_app_tecnicos_page -->|"loads"| node_src_lib_consults
node_src_app_tecnicos_id_page -->|"loads"| node_src_lib_consults
node_src_app_sedes_id_page -->|"loads"| node_src_lib_consults
node_src_app_preinscripcion_page -->|"uses"| node_src_components_domain
node_src_app_transparencia_page -->|"uses"| node_src_components_domain
node_src_components_domain -.->|"shows"| node_src_public
node_src_app_api_diplomados_route -->|"queries"| node_src_lib_consults
node_src_app_api_diplomados_id_route -->|"queries"| node_src_lib_consults
node_src_app_api_tecnicos_route -->|"queries"| node_src_lib_consults
node_src_app_api_tecnicos_id_route -->|"queries"| node_src_lib_consults
node_src_app_api_sedes_route -->|"queries"| node_src_lib_consults
node_src_app_api_sedes_id_route -->|"queries"| node_src_lib_consults
node_src_app_api_faqs_route -->|"queries"| node_src_lib_consults
node_src_app_api_faqs_id_route -->|"queries"| node_src_lib_consults
node_src_app_api_noticias_route -->|"queries"| node_src_lib_consults
node_src_app_api_noticias_id_route -->|"queries"| node_src_lib_consults
node_src_app_api_preinscripcion_route -->|"protects"| node_src_lib_validate_api_key
node_src_lib_consults -->|"reads"| node_src_lib_db
node_src_app_api_preinscripcion_route -->|"writes"| node_src_lib_db
node_src_app_metadata -.->|"references"| node_src_public
node_src_app_globals -.->|"styles"| node_src_components_ui

click node_src_app_layout "https://github.com/boli27/itarg2/blob/main/src/app/layout.tsx"
click node_src_app_page "https://github.com/boli27/itarg2/blob/main/src/app/page.tsx"
click node_src_app_diplomados_page "https://github.com/boli27/itarg2/blob/main/src/app/diplomados/page.tsx"
click node_src_app_diplomados_id_page "https://github.com/boli27/itarg2/blob/main/src/app/diplomados/[id]/page.tsx"
click node_src_app_tecnicos_page "https://github.com/boli27/itarg2/blob/main/src/app/tecnicos/page.tsx"
click node_src_app_tecnicos_id_page "https://github.com/boli27/itarg2/blob/main/src/app/tecnicos/[id]/page.tsx"
click node_src_app_sedes_id_page "https://github.com/boli27/itarg2/blob/main/src/app/sedes/[id]/page.tsx"
click node_src_app_preinscripcion_page "https://github.com/boli27/itarg2/blob/main/src/app/preinscripcion/page.tsx"
click node_src_app_transparencia_page "https://github.com/boli27/itarg2/blob/main/src/app/transparencia/page.tsx"
click node_src_components_ui "https://github.com/boli27/itarg2/blob/main/src/components/ui/NavbarMT.tsx"
click node_src_components_domain "https://github.com/boli27/itarg2/blob/main/src/components/noticias/NewsCard.tsx"
click node_src_app_api_diplomados_route "https://github.com/boli27/itarg2/blob/main/src/app/api/diplomados/route.ts"
click node_src_app_api_diplomados_id_route "https://github.com/boli27/itarg2/blob/main/src/app/api/diplomados/[id]/route.ts"
click node_src_app_api_tecnicos_route "https://github.com/boli27/itarg2/blob/main/src/app/api/tecnicos/route.ts"
click node_src_app_api_tecnicos_id_route "https://github.com/boli27/itarg2/blob/main/src/app/api/tecnicos/[id]/route.ts"
click node_src_app_api_sedes_route "https://github.com/boli27/itarg2/blob/main/src/app/api/sedes/route.ts"
click node_src_app_api_sedes_id_route "https://github.com/boli27/itarg2/blob/main/src/app/api/sedes/[id]/route.ts"
click node_src_app_api_faqs_route "https://github.com/boli27/itarg2/blob/main/src/app/api/faqs/route.ts"
click node_src_app_api_faqs_id_route "https://github.com/boli27/itarg2/blob/main/src/app/api/faqs/[id]/route.ts"
click node_src_app_api_noticias_route "https://github.com/boli27/itarg2/blob/main/src/app/api/noticias/route.ts"
click node_src_app_api_noticias_id_route "https://github.com/boli27/itarg2/blob/main/src/app/api/noticias/[id]/route.ts"
click node_src_app_api_preinscripcion_route "https://github.com/boli27/itarg2/blob/main/src/app/api/preinscripcion/route.ts"
click node_src_lib_consults "https://github.com/boli27/itarg2/blob/main/src/lib/consults/Diplomados.ts"
click node_src_lib_db "https://github.com/boli27/itarg2/blob/main/src/lib/db.ts"
click node_src_lib_validate_api_key "https://github.com/boli27/itarg2/blob/main/src/lib/validateApiKey.ts"
click node_src_app_globals "https://github.com/boli27/itarg2/blob/main/src/app/globals.css"
click node_src_app_metadata "https://github.com/boli27/itarg2/blob/main/src/app/manifest.ts"
click node_src_public "https://github.com/boli27/itarg2/tree/main/public/images"

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_src_app_layout,node_src_app_page,node_src_app_diplomados_page,node_src_app_diplomados_id_page,node_src_app_tecnicos_page,node_src_app_tecnicos_id_page,node_src_app_sedes_id_page,node_src_app_preinscripcion_page,node_src_app_transparencia_page,node_src_components_ui,node_src_components_domain toneBlue
class node_src_app_api_diplomados_route,node_src_app_api_diplomados_id_route,node_src_app_api_tecnicos_route,node_src_app_api_tecnicos_id_route,node_src_app_api_sedes_route,node_src_app_api_sedes_id_route,node_src_app_api_faqs_route,node_src_app_api_faqs_id_route,node_src_app_api_noticias_route,node_src_app_api_noticias_id_route,node_src_app_api_preinscripcion_route toneAmber
class node_src_lib_consults,node_src_lib_db,node_src_lib_validate_api_key toneMint
class node_src_app_globals,node_src_app_metadata,node_src_public toneRose
```

## Components

### Presentation

App Router pages and reusable UI components

- [App shell](https://github.com/boli27/itarg2/blob/main/src/app/layout.tsx): next layout · Root layout and providers for the Next.js app · `src/app/layout.tsx`
- [Home](https://github.com/boli27/itarg2/blob/main/src/app/page.tsx): landing page · Top-level public entry page · `src/app/page.tsx`
- [Diplomados](https://github.com/boli27/itarg2/blob/main/src/app/diplomados/page.tsx): program listing · Program listing page for diplomas · `src/app/diplomados/page.tsx`
- [Diploma detail](https://github.com/boli27/itarg2/blob/main/src/app/diplomados/[id]/page.tsx): program detail · Dynamic detail page for a diploma · `src/app/diplomados/[id]/page.tsx`
- [Técnicos](https://github.com/boli27/itarg2/blob/main/src/app/tecnicos/page.tsx): program listing · Technical programs listing page · `src/app/tecnicos/page.tsx`
- [Técnico detail](https://github.com/boli27/itarg2/blob/main/src/app/tecnicos/[id]/page.tsx): program detail · Dynamic detail page for a technical program · `src/app/tecnicos/[id]/page.tsx`
- [Sede detail](https://github.com/boli27/itarg2/blob/main/src/app/sedes/[id]/page.tsx): location detail · Dynamic detail page for a campus or site · `src/app/sedes/[id]/page.tsx`
- [Preinscripción](https://github.com/boli27/itarg2/blob/main/src/app/preinscripcion/page.tsx): form page · Public enrollment/pre-registration page · `src/app/preinscripcion/page.tsx`
- [Transparencia](https://github.com/boli27/itarg2/blob/main/src/app/transparencia/page.tsx): info page · Public transparency and institutional documents page · `src/app/transparencia/page.tsx`
- [Shared UI](https://github.com/boli27/itarg2/blob/main/src/components/ui/NavbarMT.tsx): ui components · Navbar, footer, headers, slider, FAQ, and floating actions · `src/components/ui/NavbarMT.tsx`
- [Domain views](https://github.com/boli27/itarg2/blob/main/src/components/noticias/NewsCard.tsx): feature components · Reusable view components for news, preinscription, sedes, tecnicos, and transparency · `src/components/noticias/NewsCard.tsx`

### API

Route handlers for domain endpoints

- [Diplomados API](https://github.com/boli27/itarg2/blob/main/src/app/api/diplomados/route.ts): route handler · Collection endpoint for diplomas · `src/app/api/diplomados/route.ts`
- [Diploma API](https://github.com/boli27/itarg2/blob/main/src/app/api/diplomados/[id]/route.ts): route handler · Item endpoint for a single diploma · `src/app/api/diplomados/[id]/route.ts`
- [Técnicos API](https://github.com/boli27/itarg2/blob/main/src/app/api/tecnicos/route.ts): route handler · Collection endpoint for technical programs · `src/app/api/tecnicos/route.ts`
- [Técnico API](https://github.com/boli27/itarg2/blob/main/src/app/api/tecnicos/[id]/route.ts): route handler · Item endpoint for a single technical program · `src/app/api/tecnicos/[id]/route.ts`
- [Sedes API](https://github.com/boli27/itarg2/blob/main/src/app/api/sedes/route.ts): route handler · Collection endpoint for locations · `src/app/api/sedes/route.ts`
- [Sede API](https://github.com/boli27/itarg2/blob/main/src/app/api/sedes/[id]/route.ts): route handler · Item endpoint for a single location · `src/app/api/sedes/[id]/route.ts`
- [FAQ API](https://github.com/boli27/itarg2/blob/main/src/app/api/faqs/route.ts): route handler · FAQ collection endpoint · `src/app/api/faqs/route.ts`
- [FAQ item](https://github.com/boli27/itarg2/blob/main/src/app/api/faqs/[id]/route.ts): route handler · FAQ item endpoint · `src/app/api/faqs/[id]/route.ts`
- [Noticias API](https://github.com/boli27/itarg2/blob/main/src/app/api/noticias/route.ts): route handler · News collection endpoint · `src/app/api/noticias/route.ts`
- [News item](https://github.com/boli27/itarg2/blob/main/src/app/api/noticias/[id]/route.ts): route handler · News item endpoint · `src/app/api/noticias/[id]/route.ts`
- [Preinscripción API](https://github.com/boli27/itarg2/blob/main/src/app/api/preinscripcion/route.ts): submission endpoint · Write-oriented endpoint for form submissions · `src/app/api/preinscripcion/route.ts`

### Data

Shared consult modules and persistence helpers

- [Consults](https://github.com/boli27/itarg2/blob/main/src/lib/consults/Diplomados.ts): data access · Domain query and shaping modules for API and pages · `src/lib/consults/Diplomados.ts`
- [DB layer](https://github.com/boli27/itarg2/blob/main/src/lib/db.ts): persistence · Shared database or external data source connection · `src/lib/db.ts`
- [API key check](https://github.com/boli27/itarg2/blob/main/src/lib/validateApiKey.ts): security · Cross-cutting API key validation helper · `src/lib/validateApiKey.ts`

### Infrastructure

Global styles, metadata, and build/runtime config

- [Global styles](https://github.com/boli27/itarg2/blob/main/src/app/globals.css): styling · App-wide CSS entrypoint · `src/app/globals.css`
- [Metadata](https://github.com/boli27/itarg2/blob/main/src/app/manifest.ts): seo/pwa · Manifest, robots, and sitemap generation · `src/app/manifest.ts`
- [Public assets](https://github.com/boli27/itarg2/tree/main/public/images): static assets · Images and other site assets · `public/images`

## Connections

- App shell → Home: renders · Root shell wraps the public site
- App shell → Shared UI: uses · Global navigation and footer are shared across pages
- Home → Domain views: uses · Home page composes reusable feature blocks
- Diplomados → Consults: loads · Program listing is backed by shared consults
- Diploma detail → Consults: loads · Detail page fetches program data through consults
- Técnicos → Consults: loads · Technical program listing uses shared consults
- Técnico detail → Consults: loads · Technical detail page fetches through consults
- Sede detail → Consults: loads · Location detail page uses shared consults
- Preinscripción → Domain views: uses · Form page renders the preinscription component
- Transparencia → Domain views: uses · Transparency page renders institutional documents UI
- Domain views → Public assets: shows · Feature components present site assets and media
- Diplomados API → Consults: queries · Collection endpoint reads through consult layer
- Diploma API → Consults: queries · Item endpoint reads through consult layer
- Técnicos API → Consults: queries · Collection endpoint reads through consult layer
- Técnico API → Consults: queries · Item endpoint reads through consult layer
- Sedes API → Consults: queries · Collection endpoint reads through consult layer
- Sede API → Consults: queries · Item endpoint reads through consult layer
- FAQ API → Consults: queries · FAQ collection endpoint reads through consult layer
- FAQ item → Consults: queries · FAQ item endpoint reads through consult layer
- Noticias API → Consults: queries · News collection endpoint reads through consult layer
- News item → Consults: queries · News item endpoint reads through consult layer
- Preinscripción API → API key check: protects · Submission endpoint may enforce API key validation
- Consults → DB layer: reads · Consult modules depend on the shared persistence layer
- Preinscripción API → DB layer: writes · Form submissions persist through the shared data layer
- Metadata → Public assets: references · Metadata and sitemap support public assets and site indexing
- Global styles → Shared UI: styles · Global CSS supports shared UI components