# aps31012005-prog/task_11_full_application_containerization architecture

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

- Interactive diagram: https://gitdiagram.com/aps31012005-prog/task_11_full_application_containerization
- Repository: https://github.com/aps31012005-prog/task_11_full_application_containerization

## Overview

This is a CIFAR-10 image-classification application: users upload an image in a Streamlit interface, which sends it to a Flask prediction API; the API preprocesses it, runs the trained CNN, and returns a class and confidence for display. The main dashboard also checks API health, and a separate prediction page provides another upload workflow. The README documents a two-container Docker Compose deployment, but deployment configuration is not mapped as product runtime behavior. The API and main dashboard are sampled; wiring for the separate page follows its sampled source.

Main entry points: [`flask_api.py`](https://github.com/aps31012005-prog/task_11_full_application_containerization/blob/main/flask_api.py) (Prediction Endpoint), [`app.py`](https://github.com/aps31012005-prog/task_11_full_application_containerization/blob/main/app.py) (Classification Dashboard), [`pages/1_Image_Prediction.py`](https://github.com/aps31012005-prog/task_11_full_application_containerization/blob/main/pages/1_Image_Prediction.py) (Prediction Page), [`model/cifar10_cnn.keras`](https://github.com/aps31012005-prog/task_11_full_application_containerization/blob/main/model/cifar10_cnn.keras) (Trained CNN)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_frontend["Streamlit UI"]
  node_dashboard["Classification Dashboard<br/>[app.py]"]
  node_prediction_page["Prediction Page"]
end

subgraph group_backend["Flask API"]
  node_health["Health Check<br/>[flask_api.py]"]
  node_predict_route["Prediction Endpoint<br/>[flask_api.py]"]
end

subgraph group_inference["Model Inference"]
  node_preprocess["Image Preprocessing<br/>[flask_api.py]"]
  node_cnn["CNN Inference<br/>[flask_api.py]"]
  node_model_file["Trained CNN<br/>[cifar10_cnn.keras]"]
end

node_user(("User"))

node_user -->|"uploads image"| node_dashboard
node_user -->|"uploads image"| node_prediction_page
node_dashboard -->|"checks health"| node_health
node_dashboard -->|"posts image"| node_predict_route
node_prediction_page -->|"checks health"| node_health
node_prediction_page -->|"posts image"| node_predict_route
node_predict_route -->|"processes image"| node_preprocess
node_preprocess -->|"provides tensor"| node_cnn
node_cnn -->|"loads model"| node_model_file
node_predict_route -->|"returns JSON"| node_dashboard
node_predict_route -->|"returns JSON"| node_prediction_page

click node_dashboard "https://github.com/aps31012005-prog/task_11_full_application_containerization/blob/main/app.py"
click node_prediction_page "https://github.com/aps31012005-prog/task_11_full_application_containerization/blob/main/pages/1_Image_Prediction.py"
click node_health "https://github.com/aps31012005-prog/task_11_full_application_containerization/blob/main/flask_api.py"
click node_predict_route "https://github.com/aps31012005-prog/task_11_full_application_containerization/blob/main/flask_api.py"
click node_preprocess "https://github.com/aps31012005-prog/task_11_full_application_containerization/blob/main/flask_api.py"
click node_cnn "https://github.com/aps31012005-prog/task_11_full_application_containerization/blob/main/flask_api.py"
click node_model_file "https://github.com/aps31012005-prog/task_11_full_application_containerization/blob/main/model/cifar10_cnn.keras"

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_dashboard,node_prediction_page,node_user toneBlue
class node_health,node_predict_route toneAmber
class node_preprocess,node_cnn,node_model_file toneMint
```

## Components

### Streamlit UI

- [Classification Dashboard](https://github.com/aps31012005-prog/task_11_full_application_containerization/blob/main/app.py): `app.py`
- [Prediction Page](https://github.com/aps31012005-prog/task_11_full_application_containerization/blob/main/pages/1_Image_Prediction.py): `pages/1_Image_Prediction.py`

### Flask API

- [Health Check](https://github.com/aps31012005-prog/task_11_full_application_containerization/blob/main/flask_api.py): `flask_api.py`
- [Prediction Endpoint](https://github.com/aps31012005-prog/task_11_full_application_containerization/blob/main/flask_api.py): `flask_api.py`

### Model Inference

- [Image Preprocessing](https://github.com/aps31012005-prog/task_11_full_application_containerization/blob/main/flask_api.py): `flask_api.py`
- [CNN Inference](https://github.com/aps31012005-prog/task_11_full_application_containerization/blob/main/flask_api.py): `flask_api.py`
- [Trained CNN](https://github.com/aps31012005-prog/task_11_full_application_containerization/blob/main/model/cifar10_cnn.keras): `model/cifar10_cnn.keras`

### Other components

- **User**

## Connections

- User → Classification Dashboard: uploads image
- User → Prediction Page: uploads image
- Classification Dashboard → Health Check: checks health
- Classification Dashboard → Prediction Endpoint: posts image
- Prediction Page → Health Check: checks health
- Prediction Page → Prediction Endpoint: posts image
- Prediction Endpoint → Image Preprocessing: processes image
- Image Preprocessing → CNN Inference: provides tensor
- CNN Inference → Trained CNN: loads model
- Prediction Endpoint → Classification Dashboard: returns JSON
- Prediction Endpoint → Prediction Page: returns JSON