# englorayservice-prog/engloray-website architecture

> Architecture diagram of the GitHub repository englorayservice-prog/engloray-website, 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/englorayservice-prog/engloray-website
- Repository: https://github.com/englorayservice-prog/engloray-website

## Overview

#### Purpose and topology
Engloray is a marketing, services, training, internship, and career portal. It has two deployable concerns in one repository: a Create React App frontend and an ASP.NET Core API that receives lead/application forms and persists them. Firebase Hosting configuration exists for the frontend; the API is a separate .NET project.

#### Frontend entry and application composition
The production React entry is `src/index.js`, which mounts `src/App.js`; global styling starts in `src/index.css` and `src/App.css`. `App.js` is the routing/composition boundary for a large collection of service, learning, career, product, legal, and RayMart pages. Page-level content is primarily static React markup plus local CSS and media.

#### Primary site domains
The main information architectures are:
- Technology/services pages: `src/Pages/TechGroupSection/TechGroupPage/TechGroup.jsx`, `src/Pages/Sub Pages/DevelopmentServices/DevelopmentServices.jsx`, `src/Pages/Sub Pages/WorksCaseStudies/WorksCaseStudies.jsx`.
- Learning/courses and enrollment: `src/Pages/TechLearningSection/TechLearningPage/TechLearning.jsx`, `src/Pages/Sub Pages/MainCoursesPage/MainCoursesPage.jsx`, `src/Pages/Sub Pages/AllProgramsPage/AllProgramsPage.jsx`.
- Careers and internships: `src/Pages/Sub Pages/CareersPage/CareersPage.jsx`, `src/Pages/Sub Pages/JobSeekerPage/JobSeekerPage.jsx`, `src/Pages/Sub Pages/SoftwareDeveloperInternPage/SoftwareDeveloperInternPage.jsx`.
- Product/brand sub-sites including RayMart and portal content: `src/Pages/Sub Pages/RaymartPage/RaymartPage.jsx`, `src/Pages/Sub Pages/EnglorayPortalPage/EnglorayPortalPage.jsx`.

#### Shared presentation and UX layer
Reusable navigation, footer, animation, scrolling, chatbot, and section primitives are centralized under `src/Components`. Important shell elements include `src/Components/Navbar/Navbar.jsx`, `src/Components/Footer/Footer.jsx`, and `src/Components/Chatbot/Chatbot.jsx`. SEO metadata is handled separately by `src/seo/SEOHead.jsx`, `src/seo/SchemaMarkup.jsx`, and `src/seo/seoConfig.js`. The chatbot’s local content source is `src/data/chatbotData.json`.

#### Form submission boundary
Frontend forms converge through submission modules rather than directly accessing persistence: `src/Pages/Sub Pages/HandleSubmit/HandleSubmit.js` and `src/Pages/Sub Pages/HandleSubmit/InternshipSubmit.js`. Contact, course, program, workshop, career, and internship UI collect visitor data, then issue requests to the backend API. This is the principal frontend/backend boundary; no shared contract package is present.

#### API request-to-database pipeline
`EnglorayPortfolio.API/Program.cs` configures the ASP.NET Core host. Form-specific controllers accept HTTP requests, map request DTOs to persistence models, and use EF Core storage—for example `EnglorayPortfolio.API/Controllers/CoursesFormController.cs`, `EnglorayPortfolio.API/Controllers/InternshipFormController.cs`, and `EnglorayPortfolio.API/Controllers/CareerFormController.cs`. Request contracts reside in `EnglorayPortfolio.API/DTO's/CoursesFormRequest.cs` and peers; database entities reside in `EnglorayPortfolio.API/Models/CoursesForm.cs`, `EnglorayPortfolio.API/Models/InternshipForms.cs`, and related form models.

#### Persistence, runtime, and deployment
The API’s database boundary is `EnglorayPortfolio.API/Data/AppDbContext.cs`; schema evolution is EF Core migrations under `EnglorayPortfolio.API/Migrations/`, with an additional SQL artifact at `EnglorayBackend;.sql`. Uploaded resumes are stored on the API filesystem under `EnglorayPortfolio.API/UploadedResumes`, making API-host storage a material operational dependency. Runtime configuration is in `EnglorayPortfolio.API/appsettings.json` and its development override. The frontend uses Node/React/CRA (`package.json`), builds static assets, and is configured for Firebase Hosting through `firebase.json` and `.firebaserc`; public videos, fonts, and images are served from `public/` and `src/assets/`.

Main entry points: [`src/App.js`](https://github.com/englorayservice-prog/engloray-website/blob/main/src/App.js) (App routing), [`EnglorayPortfolio.API/Controllers/CoursesFormController.cs`](https://github.com/englorayservice-prog/engloray-website/blob/main/EnglorayPortfolio.API/Controllers/CoursesFormController.cs) (Form controllers), [`src/Pages/Sub Pages/HandleSubmit/HandleSubmit.js`](https://github.com/englorayservice-prog/engloray-website/blob/main/src/Pages/Sub%20Pages/HandleSubmit/HandleSubmit.js) (Form submission modules), [`src/index.js`](https://github.com/englorayservice-prog/engloray-website/blob/main/src/index.js) (React entry)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_frontend["React frontend"]
  node_react_entry["React entry<br/>CRA bootstrap<br/>[index.js]"]
  node_app_router["App routing<br/>composition boundary<br/>[App.js]"]
  node_site_shell["Shared site shell<br/>React components<br/>[Navbar.jsx]"]
  node_seo["SEO metadata<br/>SEO components<br/>[SEOHead.jsx]"]
  node_chatbot_content["Chatbot content<br/>local JSON data<br/>[chatbotData.json]"]
  node_services_pages["Services and case studies<br/>page domain<br/>[TechGroup.jsx]"]
  node_learning_pages["Learning and enrollment<br/>page domain<br/>[TechLearning.jsx]"]
  node_career_pages["Careers and internships<br/>page domain<br/>[CareersPage.jsx]"]
  node_product_pages["Product and portal pages<br/>page domain<br/>[RaymartPage.jsx]"]
  node_form_submitters{{"Form submission modules<br/>API client boundary<br/>[HandleSubmit.js]"}}
  node_frontend_assets["Static media<br/>public assets"]
end

subgraph group_api["ASP.NET Core API"]
  node_api_host["API host<br/>ASP.NET Core startup<br/>[Program.cs]"]
  node_form_controllers["Form controllers<br/>HTTP controllers"]
  node_request_dtos["Request DTOs<br/>request contracts"]
  node_form_entities["Form entities<br/>EF Core models<br/>[CoursesForm.cs]"]
  node_db_context{{"EF Core context<br/>persistence boundary<br/>[AppDbContext.cs]"}}
  node_migrations["Schema migrations<br/>EF Core migrations"]
end

subgraph group_delivery["Hosting and storage"]
  node_database[("Application database<br/>relational database")]
  node_resume_storage["Uploaded resumes<br/>API filesystem storage<br/>[UploadedResumes]"]
  node_firebase_hosting["Firebase Hosting<br/>static hosting<br/>[firebase.json]"]
end

node_react_entry -->|"mounts"| node_app_router
node_app_router -->|"uses"| node_site_shell
node_app_router -->|"renders metadata"| node_seo
node_site_shell -->|"loads"| node_chatbot_content
node_app_router -->|"routes to"| node_services_pages
node_app_router -->|"routes to"| node_learning_pages
node_app_router -->|"routes to"| node_career_pages
node_app_router -->|"routes to"| node_product_pages
node_learning_pages -->|"enrollment data"| node_form_submitters
node_career_pages -->|"applications"| node_form_submitters
node_app_router -->|"serves media"| node_frontend_assets
node_form_submitters -->|"HTTP requests"| node_form_controllers
node_api_host -->|"hosts"| node_form_controllers
node_form_controllers -->|"binds"| node_request_dtos
node_form_controllers -->|"maps to"| node_form_entities
node_form_controllers -->|"writes resumes"| node_resume_storage
node_form_entities -->|"persists through"| node_db_context
node_db_context -->|"EF Core storage"| node_database
node_migrations -.->|"evolves schema"| node_database
node_firebase_hosting -->|"serves built app"| node_react_entry

click node_react_entry "https://github.com/englorayservice-prog/engloray-website/blob/main/src/index.js"
click node_app_router "https://github.com/englorayservice-prog/engloray-website/blob/main/src/App.js"
click node_site_shell "https://github.com/englorayservice-prog/engloray-website/blob/main/src/Components/Navbar/Navbar.jsx"
click node_seo "https://github.com/englorayservice-prog/engloray-website/blob/main/src/seo/SEOHead.jsx"
click node_chatbot_content "https://github.com/englorayservice-prog/engloray-website/blob/main/src/data/chatbotData.json"
click node_services_pages "https://github.com/englorayservice-prog/engloray-website/blob/main/src/Pages/TechGroupSection/TechGroupPage/TechGroup.jsx"
click node_learning_pages "https://github.com/englorayservice-prog/engloray-website/blob/main/src/Pages/TechLearningSection/TechLearningPage/TechLearning.jsx"
click node_career_pages "https://github.com/englorayservice-prog/engloray-website/blob/main/src/Pages/Sub%20Pages/CareersPage/CareersPage.jsx"
click node_product_pages "https://github.com/englorayservice-prog/engloray-website/blob/main/src/Pages/Sub%20Pages/RaymartPage/RaymartPage.jsx"
click node_form_submitters "https://github.com/englorayservice-prog/engloray-website/blob/main/src/Pages/Sub%20Pages/HandleSubmit/HandleSubmit.js"
click node_api_host "https://github.com/englorayservice-prog/engloray-website/blob/main/EnglorayPortfolio.API/Program.cs"
click node_form_controllers "https://github.com/englorayservice-prog/engloray-website/blob/main/EnglorayPortfolio.API/Controllers/CoursesFormController.cs"
click node_request_dtos "https://github.com/englorayservice-prog/engloray-website/blob/main/EnglorayPortfolio.API/DTO's/CoursesFormRequest.cs"
click node_form_entities "https://github.com/englorayservice-prog/engloray-website/blob/main/EnglorayPortfolio.API/Models/CoursesForm.cs"
click node_db_context "https://github.com/englorayservice-prog/engloray-website/blob/main/EnglorayPortfolio.API/Data/AppDbContext.cs"
click node_resume_storage "https://github.com/englorayservice-prog/engloray-website/tree/main/EnglorayPortfolio.API/UploadedResumes"
click node_firebase_hosting "https://github.com/englorayservice-prog/engloray-website/blob/main/firebase.json"

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_react_entry,node_app_router,node_site_shell,node_seo,node_chatbot_content,node_services_pages,node_learning_pages,node_career_pages,node_product_pages,node_form_submitters,node_frontend_assets toneBlue
class node_api_host,node_form_controllers,node_request_dtos,node_form_entities,node_db_context,node_migrations toneAmber
class node_database,node_resume_storage,node_firebase_hosting toneMint
```

## Components

### React frontend

Create React App marketing and portal experience.

- [React entry](https://github.com/englorayservice-prog/engloray-website/blob/main/src/index.js): CRA bootstrap · `src/index.js`
- [App routing](https://github.com/englorayservice-prog/engloray-website/blob/main/src/App.js): composition boundary · Composes routes across the portal domains. · `src/App.js`
- [Shared site shell](https://github.com/englorayservice-prog/engloray-website/blob/main/src/Components/Navbar/Navbar.jsx): React components · Navigation, footer, chatbot, and UX primitives. · `src/Components/Navbar/Navbar.jsx`
- [SEO metadata](https://github.com/englorayservice-prog/engloray-website/blob/main/src/seo/SEOHead.jsx): SEO components · `src/seo/SEOHead.jsx`
- [Chatbot content](https://github.com/englorayservice-prog/engloray-website/blob/main/src/data/chatbotData.json): local JSON data · `src/data/chatbotData.json`
- [Services and case studies](https://github.com/englorayservice-prog/engloray-website/blob/main/src/Pages/TechGroupSection/TechGroupPage/TechGroup.jsx): page domain · `src/Pages/TechGroupSection/TechGroupPage/TechGroup.jsx`
- [Learning and enrollment](https://github.com/englorayservice-prog/engloray-website/blob/main/src/Pages/TechLearningSection/TechLearningPage/TechLearning.jsx): page domain · `src/Pages/TechLearningSection/TechLearningPage/TechLearning.jsx`
- [Careers and internships](https://github.com/englorayservice-prog/engloray-website/blob/main/src/Pages/Sub%20Pages/CareersPage/CareersPage.jsx): page domain · `src/Pages/Sub Pages/CareersPage/CareersPage.jsx`
- [Product and portal pages](https://github.com/englorayservice-prog/engloray-website/blob/main/src/Pages/Sub%20Pages/RaymartPage/RaymartPage.jsx): page domain · `src/Pages/Sub Pages/RaymartPage/RaymartPage.jsx`
- [Form submission modules](https://github.com/englorayservice-prog/engloray-website/blob/main/src/Pages/Sub%20Pages/HandleSubmit/HandleSubmit.js): API client boundary · Converges contact, enrollment, career, and internship submissions. · `src/Pages/Sub Pages/HandleSubmit/HandleSubmit.js`
- **Static media**: public assets · Images, fonts, and video served with the frontend.

### ASP.NET Core API

Form intake and persistence service.

- [API host](https://github.com/englorayservice-prog/engloray-website/blob/main/EnglorayPortfolio.API/Program.cs): ASP.NET Core startup · `EnglorayPortfolio.API/Program.cs`
- [Form controllers](https://github.com/englorayservice-prog/engloray-website/blob/main/EnglorayPortfolio.API/Controllers/CoursesFormController.cs): HTTP controllers · Endpoints for courses, internships, careers, and related forms. · `EnglorayPortfolio.API/Controllers/CoursesFormController.cs`
- [Request DTOs](https://github.com/englorayservice-prog/engloray-website/blob/main/EnglorayPortfolio.API/DTO's/CoursesFormRequest.cs): request contracts · `EnglorayPortfolio.API/DTO's/CoursesFormRequest.cs`
- [Form entities](https://github.com/englorayservice-prog/engloray-website/blob/main/EnglorayPortfolio.API/Models/CoursesForm.cs): EF Core models · `EnglorayPortfolio.API/Models/CoursesForm.cs`
- [EF Core context](https://github.com/englorayservice-prog/engloray-website/blob/main/EnglorayPortfolio.API/Data/AppDbContext.cs): persistence boundary · `EnglorayPortfolio.API/Data/AppDbContext.cs`
- **Schema migrations**: EF Core migrations

### Hosting and storage

Deployment and operational dependencies.

- **Application database**: relational database · Stores submitted form records.
- [Uploaded resumes](https://github.com/englorayservice-prog/engloray-website/tree/main/EnglorayPortfolio.API/UploadedResumes): API filesystem storage · Operational dependency for resume uploads. · `EnglorayPortfolio.API/UploadedResumes`
- [Firebase Hosting](https://github.com/englorayservice-prog/engloray-website/blob/main/firebase.json): static hosting · Hosts the built React frontend. · `firebase.json`

## Connections

- React entry → App routing: mounts
- App routing → Shared site shell: uses
- App routing → SEO metadata: renders metadata
- Shared site shell → Chatbot content: loads
- App routing → Services and case studies: routes to
- App routing → Learning and enrollment: routes to
- App routing → Careers and internships: routes to
- App routing → Product and portal pages: routes to
- Learning and enrollment → Form submission modules: enrollment data
- Careers and internships → Form submission modules: applications
- App routing → Static media: serves media
- Form submission modules → Form controllers: HTTP requests · No shared contract package.
- API host → Form controllers: hosts
- Form controllers → Request DTOs: binds
- Form controllers → Form entities: maps to
- Form controllers → Uploaded resumes: writes resumes
- Form entities → EF Core context: persists through
- EF Core context → Application database: EF Core storage
- Schema migrations → Application database: evolves schema
- Firebase Hosting → React entry: serves built app