# sipemnyaka/ngcuka_transportation architecture

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

- Interactive diagram: https://gitdiagram.com/sipemnyaka/ngcuka_transportation
- Repository: https://github.com/sipemnyaka/ngcuka_transportation

## Overview

Ngcuka Transportation is a static, multi-page transport-company website. Visitors browse company, service, fleet and careers information, then can submit an enquiry or application; the shared front-end handler posts form data to a Netlify Function, which forwards it through Resend to the company inbox. The README documents the major pages and form types; sampled source confirms the form-submission path and shared browser behavior, but not the pages’ individual navigation links.

Main entry points: [`js/main.js`](https://github.com/sipemnyaka/ngcuka_transportation/blob/main/js/main.js) (Shared Interactions), [`css/styles.css`](https://github.com/sipemnyaka/ngcuka_transportation/blob/main/css/styles.css) (Shared Styling), [`index.html`](https://github.com/sipemnyaka/ngcuka_transportation/blob/main/index.html) (Home), [`about.html`](https://github.com/sipemnyaka/ngcuka_transportation/blob/main/about.html) (About)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_site["Company Website"]
  node_home["Home<br/>[index.html]"]
  node_about["About<br/>[about.html]"]
  node_freight["Freight Logistics"]
  node_passenger["Passenger Transport"]
  node_moves["Ngcuka Moves<br/>[ngcuka-moves.html]"]
  node_fleet["Fleet<br/>[fleet.html]"]
  node_careers["Careers<br/>[careers.html]"]
  node_contact["Contact<br/>[contact.html]"]
end

subgraph group_browser["Browser Behavior"]
  node_styles["Shared Styling<br/>[styles.css]"]
  node_frontend["Shared Interactions<br/>[main.js]"]
end

subgraph group_email["Form Email Delivery"]
  node_netlifyfn["Form Handler<br/>[send-quote.js]"]
  node_resend["Resend Email API"]
  node_inbox(("Company Inbox"))
end

node_visitor(("Visitor"))

node_visitor -->|"opens"| node_home
node_visitor -->|"browses"| node_about
node_visitor -->|"browses"| node_freight
node_visitor -->|"browses"| node_passenger
node_visitor -->|"browses"| node_moves
node_visitor -->|"browses"| node_fleet
node_visitor -->|"browses"| node_careers
node_visitor -->|"browses"| node_contact
node_home -->|"uses"| node_styles
node_about -->|"uses"| node_styles
node_freight -->|"uses"| node_styles
node_passenger -->|"uses"| node_styles
node_moves -->|"uses"| node_styles
node_fleet -->|"uses"| node_styles
node_careers -->|"uses"| node_styles
node_contact -->|"uses"| node_styles
node_home -->|"loads"| node_frontend
node_about -->|"loads"| node_frontend
node_freight -->|"loads"| node_frontend
node_passenger -->|"loads"| node_frontend
node_moves -->|"loads"| node_frontend
node_fleet -->|"loads"| node_frontend
node_careers -->|"loads"| node_frontend
node_contact -->|"loads"| node_frontend
node_visitor -->|"submits form"| node_frontend
node_frontend -->|"POSTs form data"| node_netlifyfn
node_netlifyfn -->|"sends email"| node_resend
node_resend -->|"delivers email"| node_inbox

click node_home "https://github.com/sipemnyaka/ngcuka_transportation/blob/main/index.html"
click node_about "https://github.com/sipemnyaka/ngcuka_transportation/blob/main/about.html"
click node_freight "https://github.com/sipemnyaka/ngcuka_transportation/blob/main/freight-logistics.html"
click node_passenger "https://github.com/sipemnyaka/ngcuka_transportation/blob/main/passenger-transport.html"
click node_moves "https://github.com/sipemnyaka/ngcuka_transportation/blob/main/ngcuka-moves.html"
click node_fleet "https://github.com/sipemnyaka/ngcuka_transportation/blob/main/fleet.html"
click node_careers "https://github.com/sipemnyaka/ngcuka_transportation/blob/main/careers.html"
click node_contact "https://github.com/sipemnyaka/ngcuka_transportation/blob/main/contact.html"
click node_styles "https://github.com/sipemnyaka/ngcuka_transportation/blob/main/css/styles.css"
click node_frontend "https://github.com/sipemnyaka/ngcuka_transportation/blob/main/js/main.js"
click node_netlifyfn "https://github.com/sipemnyaka/ngcuka_transportation/blob/main/netlify/functions/send-quote.js"

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_about,node_freight,node_passenger,node_moves,node_fleet,node_careers,node_contact toneBlue
class node_styles,node_frontend toneAmber
class node_netlifyfn,node_resend,node_inbox toneMint
class node_visitor toneIndigo
```

## Components

### Company Website

- [Home](https://github.com/sipemnyaka/ngcuka_transportation/blob/main/index.html): `index.html`
- [About](https://github.com/sipemnyaka/ngcuka_transportation/blob/main/about.html): `about.html`
- [Freight Logistics](https://github.com/sipemnyaka/ngcuka_transportation/blob/main/freight-logistics.html): `freight-logistics.html`
- [Passenger Transport](https://github.com/sipemnyaka/ngcuka_transportation/blob/main/passenger-transport.html): `passenger-transport.html`
- [Ngcuka Moves](https://github.com/sipemnyaka/ngcuka_transportation/blob/main/ngcuka-moves.html): `ngcuka-moves.html`
- [Fleet](https://github.com/sipemnyaka/ngcuka_transportation/blob/main/fleet.html): `fleet.html`
- [Careers](https://github.com/sipemnyaka/ngcuka_transportation/blob/main/careers.html): `careers.html`
- [Contact](https://github.com/sipemnyaka/ngcuka_transportation/blob/main/contact.html): `contact.html`

### Browser Behavior

- [Shared Styling](https://github.com/sipemnyaka/ngcuka_transportation/blob/main/css/styles.css): `css/styles.css`
- [Shared Interactions](https://github.com/sipemnyaka/ngcuka_transportation/blob/main/js/main.js): `js/main.js`

### Form Email Delivery

- [Form Handler](https://github.com/sipemnyaka/ngcuka_transportation/blob/main/netlify/functions/send-quote.js): `netlify/functions/send-quote.js`
- **Resend Email API**
- **Company Inbox**

### Other components

- **Visitor**

## Connections

- Visitor → Home: opens
- Visitor → About: browses
- Visitor → Freight Logistics: browses
- Visitor → Passenger Transport: browses
- Visitor → Ngcuka Moves: browses
- Visitor → Fleet: browses
- Visitor → Careers: browses
- Visitor → Contact: browses
- Home → Shared Styling: uses
- About → Shared Styling: uses
- Freight Logistics → Shared Styling: uses
- Passenger Transport → Shared Styling: uses
- Ngcuka Moves → Shared Styling: uses
- Fleet → Shared Styling: uses
- Careers → Shared Styling: uses
- Contact → Shared Styling: uses
- Home → Shared Interactions: loads
- About → Shared Interactions: loads
- Freight Logistics → Shared Interactions: loads
- Passenger Transport → Shared Interactions: loads
- Ngcuka Moves → Shared Interactions: loads
- Fleet → Shared Interactions: loads
- Careers → Shared Interactions: loads
- Contact → Shared Interactions: loads
- Visitor → Shared Interactions: submits form
- Shared Interactions → Form Handler: POSTs form data
- Form Handler → Resend Email API: sends email
- Resend Email API → Company Inbox: delivers email