# kannan-a7801/landingpage architecture

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

- Interactive diagram: https://gitdiagram.com/kannan-a7801/landingpage
- Repository: https://github.com/kannan-a7801/landingpage

## Overview

#### Purpose and deployment shape
This is a marketing/contact site with a React single-page frontend and a separate Java backend for processing contact submissions by email. The frontend is configured for Firebase Hosting; the backend is Maven-packaged and containerizable.
- `src/index.js`
- `firebase.json`
- `backend/dockerfile`

#### Frontend entry and composition
Create React App initializes the React tree in `src/index.js`, with `src/App.jsx` acting as the application-level composition point. The UI is organized as page/section components rather than a visible routing layer, suggesting navigation may be anchor- or state-driven within the SPA.
- `src/index.js`
- `src/App.jsx`
- `public/index.html`

#### Marketing and informational UI
The primary presentation flow is assembled from reusable site sections: navigation, home/hero, feature/exploration content, company/about content, and footer. These components own paired CSS, keeping visual behavior colocated with each section.
- `src/components/Navbar/Navbar.jsx`
- `src/components/home/Home.jsx`
- `src/components/Features/Features.jsx`
- `src/components/Footer/Footer.jsx`

#### Page-level contact and connection flows
Dedicated contact and connect page components provide the frontend boundary for lead capture or outreach. A separate contact-navigation component likely links users into this flow; the frontend should treat backend submission failures as user-facing errors.
- `src/components/ContactPage/ContactPage.jsx`
- `src/components/ConnectPage/ConnectPage.jsx`
- `src/components/contactnav/ContactNav.jsx`

#### Backend HTTP API boundary
Spring Boot starts from `ContactBackendApplication` and exposes the contact API through `ContactController`. Request and response DTOs define the stable payload boundary between the React client and server, isolating UI models from email-delivery implementation.
- `backend/src/main/java/com/engloray/contact/ContactBackendApplication.java`
- `backend/src/main/java/com/engloray/contact/controller/ContactController.java`
- `backend/src/main/java/com/engloray/contact/dto/ContactRequest.java`

#### Contact processing and email delivery
The controller delegates contact handling to `EmailService`, which is the core integration boundary for outbound email. Centralized exception handling converts backend failures into consistent HTTP responses rather than exposing service exceptions directly.
- `backend/src/main/java/com/engloray/contact/service/EmailService.java`
- `backend/src/main/java/com/engloray/contact/exception/GlobalExceptionHandler.java`
- `backend/src/main/java/com/engloray/contact/dto/ContactResponse.java`

#### Runtime and infrastructure boundaries
The client runs on Node/React during development and builds static assets for Firebase Hosting. The API runs on the JVM via Spring Boot, uses Maven for packaging, and has environment-backed application settings likely including mail/server configuration. Email infrastructure is an external dependency configured behind the backend service.
- `package.json`
- `backend/pom.xml`
- `backend/src/main/resources/application.properties`
- `.firebaserc`

Main entry points: [`backend/src/main/java/com/engloray/contact/controller/ContactController.java`](https://github.com/kannan-a7801/landingpage/blob/main/backend/src/main/java/com/engloray/contact/controller/ContactController.java) (Contact controller), [`src/App.jsx`](https://github.com/kannan-a7801/landingpage/blob/main/src/App.jsx) (App composition), [`backend/src/main/java/com/engloray/contact/ContactBackendApplication.java`](https://github.com/kannan-a7801/landingpage/blob/main/backend/src/main/java/com/engloray/contact/ContactBackendApplication.java) (Spring Boot application), [`src/components/ContactPage/ContactPage.jsx`](https://github.com/kannan-a7801/landingpage/blob/main/src/components/ContactPage/ContactPage.jsx) (Contact page)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_frontend["React frontend"]
  node_html["HTML shell<br/>browser document<br/>[index.html]"]
  node_react_entry["React entry<br/>CRA bootstrap<br/>[index.js]"]
  node_app["App composition<br/>React application<br/>[App.jsx]"]
  node_marketing_sections["Marketing sections<br/>React sections<br/>[Home.jsx]"]
  node_contact_nav["Contact navigation<br/>React component<br/>[ContactNav.jsx]"]
  node_contact_page["Contact page<br/>lead capture UI<br/>[ContactPage.jsx]"]
  node_connect_page["Connect page<br/>outreach UI<br/>[ConnectPage.jsx]"]
end

subgraph group_backend["Contact API"]
  node_spring_boot["Spring Boot application<br/>JVM runtime"]
  node_contact_controller["Contact controller<br/>HTTP API"]
  node_contact_dtos["Contact DTOs<br/>API payloads"]
  node_email_service["Email service<br/>application service<br/>[EmailService.java]"]
  node_exception_handler["Exception handler<br/>HTTP error mapping"]
  node_app_settings["Application settings<br/>environment configuration"]
end

subgraph group_delivery["Deployment"]
  node_firebase_hosting{{"Firebase Hosting<br/>static hosting<br/>[firebase.json]"}}
  node_maven_package["Maven package<br/>backend build<br/>[pom.xml]"]
  node_container_image{{"Backend container<br/>container image"}}
end

node_mail_provider{{"Email infrastructure<br/>external mail service"}}

node_html -->|"loads"| node_react_entry
node_react_entry -->|"mounts"| node_app
node_app -->|"composes"| node_marketing_sections
node_app -->|"composes"| node_contact_nav
node_app -->|"presents"| node_contact_page
node_app -->|"presents"| node_connect_page
node_contact_nav -->|"links to"| node_contact_page
node_contact_page -->|"submits contact request"| node_contact_controller
node_connect_page -->|"submits outreach"| node_contact_controller
node_firebase_hosting -->|"serves static app"| node_html
node_spring_boot -->|"starts"| node_contact_controller
node_contact_controller -->|"uses"| node_contact_dtos
node_contact_controller -->|"delegates to"| node_email_service
node_exception_handler -.->|"maps failures from"| node_contact_controller
node_email_service -->|"delivers email"| node_mail_provider
node_app_settings -.->|"configures"| node_spring_boot
node_maven_package -->|"packages"| node_spring_boot
node_container_image -->|"containerizes"| node_spring_boot

click node_html "https://github.com/kannan-a7801/landingpage/blob/main/public/index.html"
click node_react_entry "https://github.com/kannan-a7801/landingpage/blob/main/src/index.js"
click node_app "https://github.com/kannan-a7801/landingpage/blob/main/src/App.jsx"
click node_marketing_sections "https://github.com/kannan-a7801/landingpage/blob/main/src/components/home/Home.jsx"
click node_contact_nav "https://github.com/kannan-a7801/landingpage/blob/main/src/components/contactnav/ContactNav.jsx"
click node_contact_page "https://github.com/kannan-a7801/landingpage/blob/main/src/components/ContactPage/ContactPage.jsx"
click node_connect_page "https://github.com/kannan-a7801/landingpage/blob/main/src/components/ConnectPage/ConnectPage.jsx"
click node_firebase_hosting "https://github.com/kannan-a7801/landingpage/blob/main/firebase.json"
click node_spring_boot "https://github.com/kannan-a7801/landingpage/blob/main/backend/src/main/java/com/engloray/contact/ContactBackendApplication.java"
click node_contact_controller "https://github.com/kannan-a7801/landingpage/blob/main/backend/src/main/java/com/engloray/contact/controller/ContactController.java"
click node_contact_dtos "https://github.com/kannan-a7801/landingpage/blob/main/backend/src/main/java/com/engloray/contact/dto/ContactRequest.java"
click node_email_service "https://github.com/kannan-a7801/landingpage/blob/main/backend/src/main/java/com/engloray/contact/service/EmailService.java"
click node_exception_handler "https://github.com/kannan-a7801/landingpage/blob/main/backend/src/main/java/com/engloray/contact/exception/GlobalExceptionHandler.java"
click node_maven_package "https://github.com/kannan-a7801/landingpage/blob/main/backend/pom.xml"
click node_container_image "https://github.com/kannan-a7801/landingpage/blob/main/backend/dockerfile"
click node_app_settings "https://github.com/kannan-a7801/landingpage/blob/main/backend/src/main/resources/application.properties"

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_html,node_react_entry,node_app,node_marketing_sections,node_contact_nav,node_contact_page,node_connect_page toneBlue
class node_spring_boot,node_contact_controller,node_contact_dtos,node_email_service,node_exception_handler,node_app_settings toneAmber
class node_firebase_hosting,node_maven_package,node_container_image toneMint
class node_mail_provider toneNeutral
```

## Components

### React frontend

Single-page marketing and contact experience.

- [HTML shell](https://github.com/kannan-a7801/landingpage/blob/main/public/index.html): browser document · `public/index.html`
- [React entry](https://github.com/kannan-a7801/landingpage/blob/main/src/index.js): CRA bootstrap · `src/index.js`
- [App composition](https://github.com/kannan-a7801/landingpage/blob/main/src/App.jsx): React application · `src/App.jsx`
- [Marketing sections](https://github.com/kannan-a7801/landingpage/blob/main/src/components/home/Home.jsx): React sections · Navigation, home, features, and footer presentation. · `src/components/home/Home.jsx`
- [Contact navigation](https://github.com/kannan-a7801/landingpage/blob/main/src/components/contactnav/ContactNav.jsx): React component · `src/components/contactnav/ContactNav.jsx`
- [Contact page](https://github.com/kannan-a7801/landingpage/blob/main/src/components/ContactPage/ContactPage.jsx): lead capture UI · Shows submission failures to users. · `src/components/ContactPage/ContactPage.jsx`
- [Connect page](https://github.com/kannan-a7801/landingpage/blob/main/src/components/ConnectPage/ConnectPage.jsx): outreach UI · `src/components/ConnectPage/ConnectPage.jsx`

### Contact API

Spring Boot service that processes submissions.

- [Spring Boot application](https://github.com/kannan-a7801/landingpage/blob/main/backend/src/main/java/com/engloray/contact/ContactBackendApplication.java): JVM runtime · `backend/src/main/java/com/engloray/contact/ContactBackendApplication.java`
- [Contact controller](https://github.com/kannan-a7801/landingpage/blob/main/backend/src/main/java/com/engloray/contact/controller/ContactController.java): HTTP API · `backend/src/main/java/com/engloray/contact/controller/ContactController.java`
- [Contact DTOs](https://github.com/kannan-a7801/landingpage/blob/main/backend/src/main/java/com/engloray/contact/dto/ContactRequest.java): API payloads · Request and response contract for the client. · `backend/src/main/java/com/engloray/contact/dto/ContactRequest.java`
- [Email service](https://github.com/kannan-a7801/landingpage/blob/main/backend/src/main/java/com/engloray/contact/service/EmailService.java): application service · Outbound email integration boundary. · `backend/src/main/java/com/engloray/contact/service/EmailService.java`
- [Exception handler](https://github.com/kannan-a7801/landingpage/blob/main/backend/src/main/java/com/engloray/contact/exception/GlobalExceptionHandler.java): HTTP error mapping · `backend/src/main/java/com/engloray/contact/exception/GlobalExceptionHandler.java`
- [Application settings](https://github.com/kannan-a7801/landingpage/blob/main/backend/src/main/resources/application.properties): environment configuration · Provides server and mail settings. · `backend/src/main/resources/application.properties`

### Deployment

Static hosting and container/package boundaries.

- [Firebase Hosting](https://github.com/kannan-a7801/landingpage/blob/main/firebase.json): static hosting · `firebase.json`
- [Maven package](https://github.com/kannan-a7801/landingpage/blob/main/backend/pom.xml): backend build · `backend/pom.xml`
- [Backend container](https://github.com/kannan-a7801/landingpage/blob/main/backend/dockerfile): container image · `backend/dockerfile`

### Other components

- **Email infrastructure**: external mail service

## Connections

- HTML shell → React entry: loads
- React entry → App composition: mounts
- App composition → Marketing sections: composes
- App composition → Contact navigation: composes
- App composition → Contact page: presents
- App composition → Connect page: presents
- Contact navigation → Contact page: links to
- Contact page → Contact controller: submits contact request
- Connect page → Contact controller: submits outreach
- Firebase Hosting → HTML shell: serves static app
- Spring Boot application → Contact controller: starts
- Contact controller → Contact DTOs: uses
- Contact controller → Email service: delegates to
- Exception handler → Contact controller: maps failures from
- Email service → Email infrastructure: delivers email
- Application settings → Spring Boot application: configures
- Maven package → Spring Boot application: packages
- Backend container → Spring Boot application: containerizes