# crkr-dev/mern-cicd-learning architecture

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

- Interactive diagram: https://gitdiagram.com/crkr-dev/mern-cicd-learning
- Repository: https://github.com/crkr-dev/mern-cicd-learning

## Overview

This is a task-manager application and a hands-on CI/CD learning project. Users add and list tasks in the React app; it calls the Express API, which validates requests and reads or writes task records in MongoDB. The README also documents a GitHub-to-Jenkins pipeline that builds and pushes images and deploys to Kubernetes. Source excerpts show the app, API, configuration, and database connections; deployment relationships below are based on README descriptions, not inspected pipeline or manifest contents.

Main entry points: [`backend/src/server.js`](https://github.com/crkr-dev/mern-cicd-learning/blob/main/backend/src/server.js) (API server), [`Jenkinsfile`](https://github.com/crkr-dev/mern-cicd-learning/blob/main/Jenkinsfile) (Jenkins pipeline), [`frontend/src/App.js`](https://github.com/crkr-dev/mern-cicd-learning/blob/main/frontend/src/App.js) (Task interface), [`backend/src/app.js`](https://github.com/crkr-dev/mern-cicd-learning/blob/main/backend/src/app.js) (Express app)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_frontend["Task interface"]
  node_frontend_boot["React bootstrap<br/>[index.js]"]
  node_task_ui["Task interface<br/>[App.js]"]
end

subgraph group_backend["Task API"]
  node_api["Express app<br/>[app.js]"]
  node_task_routes["Task routes<br/>[tasks.js]"]
  node_server["API server<br/>[server.js]"]
  node_config["Runtime config<br/>[config.js]"]
end

subgraph group_data["Persistence"]
  node_db_connection["DB connection<br/>[db.js]"]
  node_task_model["Task model<br/>[Task.js]"]
end

subgraph group_delivery["Deployment"]
  node_jenkins["Jenkins pipeline"]
  node_k8s_manifests["Kubernetes manifests"]
  node_frontend_deploy["Frontend deployment"]
  node_ingress["Ingress routing<br/>[ingress.yaml]"]
end

node_user(("User"))
node_mongodb[("MongoDB Atlas")]
node_github(("GitHub"))
node_dockerhub["Docker Hub"]
node_minikube["Minikube"]

node_user -->|"uses"| node_task_ui
node_frontend_boot -->|"renders"| node_task_ui
node_task_ui -->|"requests tasks"| node_api
node_server -->|"reads settings"| node_config
node_server -->|"connects database"| node_db_connection
node_server -->|"creates app"| node_api
node_api -->|"mounts routes"| node_task_routes
node_task_routes -->|"queries and creates"| node_task_model
node_db_connection -->|"connects"| node_mongodb
node_task_model -.->|"persists records"| node_mongodb
node_github -->|"triggers pipeline"| node_jenkins
node_jenkins -->|"pushes images"| node_dockerhub
node_jenkins -->|"deploys manifests"| node_k8s_manifests
node_k8s_manifests -->|"deploys workloads"| node_minikube
node_minikube -.->|"runs frontend"| node_frontend_deploy
node_ingress -.->|"routes requests"| node_frontend_deploy

click node_frontend_boot "https://github.com/crkr-dev/mern-cicd-learning/blob/main/frontend/src/index.js"
click node_task_ui "https://github.com/crkr-dev/mern-cicd-learning/blob/main/frontend/src/App.js"
click node_api "https://github.com/crkr-dev/mern-cicd-learning/blob/main/backend/src/app.js"
click node_task_routes "https://github.com/crkr-dev/mern-cicd-learning/blob/main/backend/src/routes/tasks.js"
click node_server "https://github.com/crkr-dev/mern-cicd-learning/blob/main/backend/src/server.js"
click node_config "https://github.com/crkr-dev/mern-cicd-learning/blob/main/backend/src/config.js"
click node_db_connection "https://github.com/crkr-dev/mern-cicd-learning/blob/main/backend/src/db.js"
click node_task_model "https://github.com/crkr-dev/mern-cicd-learning/blob/main/backend/src/models/Task.js"
click node_jenkins "https://github.com/crkr-dev/mern-cicd-learning/blob/main/Jenkinsfile"
click node_k8s_manifests "https://github.com/crkr-dev/mern-cicd-learning/blob/main/k8s/backend-deployment.yaml"
click node_frontend_deploy "https://github.com/crkr-dev/mern-cicd-learning/blob/main/k8s/frontend-deployment.yaml"
click node_ingress "https://github.com/crkr-dev/mern-cicd-learning/blob/main/k8s/ingress.yaml"

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_frontend_boot,node_task_ui,node_user toneBlue
class node_api,node_task_routes,node_server,node_config,node_mongodb toneAmber
class node_db_connection,node_task_model toneMint
class node_jenkins,node_k8s_manifests,node_frontend_deploy,node_ingress toneRose
class node_github,node_dockerhub,node_minikube toneIndigo
```

## Components

### Task interface

- [React bootstrap](https://github.com/crkr-dev/mern-cicd-learning/blob/main/frontend/src/index.js): `frontend/src/index.js`
- [Task interface](https://github.com/crkr-dev/mern-cicd-learning/blob/main/frontend/src/App.js): `frontend/src/App.js`

### Task API

- [Express app](https://github.com/crkr-dev/mern-cicd-learning/blob/main/backend/src/app.js): `backend/src/app.js`
- [Task routes](https://github.com/crkr-dev/mern-cicd-learning/blob/main/backend/src/routes/tasks.js): `backend/src/routes/tasks.js`
- [API server](https://github.com/crkr-dev/mern-cicd-learning/blob/main/backend/src/server.js): `backend/src/server.js`
- [Runtime config](https://github.com/crkr-dev/mern-cicd-learning/blob/main/backend/src/config.js): `backend/src/config.js`

### Persistence

- [DB connection](https://github.com/crkr-dev/mern-cicd-learning/blob/main/backend/src/db.js): `backend/src/db.js`
- [Task model](https://github.com/crkr-dev/mern-cicd-learning/blob/main/backend/src/models/Task.js): `backend/src/models/Task.js`

### Deployment

- [Jenkins pipeline](https://github.com/crkr-dev/mern-cicd-learning/blob/main/Jenkinsfile): `Jenkinsfile`
- [Kubernetes manifests](https://github.com/crkr-dev/mern-cicd-learning/blob/main/k8s/backend-deployment.yaml): `k8s/backend-deployment.yaml`
- [Frontend deployment](https://github.com/crkr-dev/mern-cicd-learning/blob/main/k8s/frontend-deployment.yaml): `k8s/frontend-deployment.yaml`
- [Ingress routing](https://github.com/crkr-dev/mern-cicd-learning/blob/main/k8s/ingress.yaml): `k8s/ingress.yaml`

### Other components

- **User**
- **MongoDB Atlas**
- **GitHub**
- **Docker Hub**
- **Minikube**

## Connections

- User → Task interface: uses (evidence: `README.md`)
- React bootstrap → Task interface: renders (evidence: `frontend/src/index.js`)
- Task interface → Express app: requests tasks (evidence: `frontend/src/App.js`)
- API server → Runtime config: reads settings (evidence: `backend/src/server.js`)
- API server → DB connection: connects database (evidence: `backend/src/server.js`)
- API server → Express app: creates app (evidence: `backend/src/server.js`)
- Express app → Task routes: mounts routes (evidence: `backend/src/app.js`)
- Task routes → Task model: queries and creates (evidence: `backend/src/routes/tasks.js`)
- DB connection → MongoDB Atlas: connects (evidence: `backend/src/db.js`)
- Task model → MongoDB Atlas: persists records
- GitHub → Jenkins pipeline: triggers pipeline (evidence: `README.md`)
- Jenkins pipeline → Docker Hub: pushes images (evidence: `README.md`)
- Jenkins pipeline → Kubernetes manifests: deploys manifests (evidence: `README.md`)
- Kubernetes manifests → Minikube: deploys workloads (evidence: `README.md`)
- Minikube → Frontend deployment: runs frontend
- Ingress routing → Frontend deployment: routes requests