# tan-sd/makan-boleh architecture

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

- Interactive diagram: https://gitdiagram.com/tan-sd/makan-boleh
- Repository: https://github.com/tan-sd/makan-boleh

## Overview

MakanBoleh is a food-sharing web application: people discover nearby surplus-food posts, while logged-in users can share food, manage their profile, and participate in a forum. The Vue app sends requests to Flask services; the sampled backend code shows food_management coordinating user verification, food/forum services, and activity logging. Food and user persistence are represented by their SQLAlchemy services and database schemas. README and excerpts support the main product areas, but do not establish the wiring of every notification or messaging module, so those connections are omitted.

Main entry points: [`my_app/src/router/index.js`](https://github.com/tan-sd/makan-boleh/blob/main/my_app/src/router/index.js) (Page routing), [`food_management.py`](https://github.com/tan-sd/makan-boleh/blob/main/food_management.py) (Food coordination), [`my_app/src/App.vue`](https://github.com/tan-sd/makan-boleh/blob/main/my_app/src/App.vue) (Vue application), [`my_app/src/components/FoodList.vue`](https://github.com/tan-sd/makan-boleh/blob/main/my_app/src/components/FoodList.vue) (Food discovery)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_client["Web application"]
  node_app["Vue application<br/>[App.vue]"]
  node_routes["Page routing<br/>[index.js]"]
  node_foodlist["Food discovery<br/>[FoodList.vue]"]
  node_map["Food map<br/>[Map.vue]"]
  node_signup["Registration<br/>[SignUpPage.vue]"]
  node_profile["User profile<br/>[UserProfile.vue]"]
  node_forumui["Forum interface<br/>[Forum.vue]"]
  node_store["Session state<br/>[index.js]"]
end

subgraph group_coord["API coordination"]
  node_foodmgmt["Food coordination<br/>[food_management.py]"]
  node_managefood["Food API<br/>[manage_food.py]"]
  node_manageforum["Forum API<br/>[manage_forum.py]"]
end

subgraph group_domain["Product services"]
  node_foodsvc["Food posts<br/>[food_info.py]"]
  node_usersvc["User accounts<br/>[user_info.py]"]
  node_forumsvc["Forum content<br/>[forum_info.py]"]
  node_activity["Activity logging<br/>[activity_log.py]"]
end

subgraph group_state["Persistent data"]
  node_fooddb[("Food database<br/>[food_db.sql]")]
  node_userdb[("User database<br/>[user_info.sql]")]
  node_forumdb[("Forum database<br/>[forum_db.sql]")]
end

node_person(("Food sharer or seeker"))
node_firebase[("Firebase Storage")]
node_maps["Google Maps"]

node_person -->|"uses"| node_app
node_app -->|"renders routes"| node_routes
node_routes -->|"opens discovery"| node_foodlist
node_routes -->|"opens map"| node_map
node_routes -->|"opens signup"| node_signup
node_routes -->|"opens profile"| node_profile
node_routes -->|"opens forum"| node_forumui
node_app -->|"installs state"| node_store
node_foodlist -->|"requests nearby food"| node_foodmgmt
node_map -->|"requests food markers"| node_foodmgmt
node_map -.->|"renders map"| node_maps
node_foodlist -.->|"loads food images"| node_firebase
node_signup -->|"submits registration"| node_managefood
node_profile -->|"updates profile"| node_usersvc
node_forumui -->|"creates forum content"| node_manageforum
node_forumui -->|"loads forum posts"| node_manageforum
node_foodmgmt -->|"verifies user"| node_usersvc
node_foodmgmt -->|"fetches food"| node_foodsvc
node_foodmgmt -->|"creates forum post"| node_forumsvc
node_foodmgmt -->|"records activity"| node_activity
node_foodsvc -->|"reads and writes"| node_fooddb
node_usersvc -->|"reads and writes"| node_userdb
node_forumsvc -->|"reads and writes"| node_forumdb

click node_app "https://github.com/tan-sd/makan-boleh/blob/main/my_app/src/App.vue"
click node_routes "https://github.com/tan-sd/makan-boleh/blob/main/my_app/src/router/index.js"
click node_foodlist "https://github.com/tan-sd/makan-boleh/blob/main/my_app/src/components/FoodList.vue"
click node_map "https://github.com/tan-sd/makan-boleh/blob/main/my_app/src/components/Map.vue"
click node_signup "https://github.com/tan-sd/makan-boleh/blob/main/my_app/src/views/SignUpPage.vue"
click node_profile "https://github.com/tan-sd/makan-boleh/blob/main/my_app/src/views/UserProfile.vue"
click node_forumui "https://github.com/tan-sd/makan-boleh/blob/main/my_app/src/views/Forum.vue"
click node_store "https://github.com/tan-sd/makan-boleh/blob/main/my_app/src/store/index.js"
click node_foodmgmt "https://github.com/tan-sd/makan-boleh/blob/main/food_management.py"
click node_managefood "https://github.com/tan-sd/makan-boleh/blob/main/manage_food.py"
click node_manageforum "https://github.com/tan-sd/makan-boleh/blob/main/manage_forum.py"
click node_foodsvc "https://github.com/tan-sd/makan-boleh/blob/main/food_info.py"
click node_usersvc "https://github.com/tan-sd/makan-boleh/blob/main/user_info.py"
click node_forumsvc "https://github.com/tan-sd/makan-boleh/blob/main/forum_info.py"
click node_activity "https://github.com/tan-sd/makan-boleh/blob/main/activity_log.py"
click node_fooddb "https://github.com/tan-sd/makan-boleh/blob/main/database/food_db.sql"
click node_userdb "https://github.com/tan-sd/makan-boleh/blob/main/database/user_info.sql"
click node_forumdb "https://github.com/tan-sd/makan-boleh/blob/main/database/forum_db.sql"

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_app,node_routes,node_foodlist,node_map,node_signup,node_profile,node_forumui,node_store toneBlue
class node_foodmgmt,node_managefood,node_manageforum,node_firebase toneAmber
class node_foodsvc,node_usersvc,node_forumsvc,node_activity toneMint
class node_fooddb,node_userdb,node_forumdb toneRose
class node_person,node_maps toneIndigo
```

## Components

### Web application

- [Vue application](https://github.com/tan-sd/makan-boleh/blob/main/my_app/src/App.vue): `my_app/src/App.vue`
- [Page routing](https://github.com/tan-sd/makan-boleh/blob/main/my_app/src/router/index.js): `my_app/src/router/index.js`
- [Food discovery](https://github.com/tan-sd/makan-boleh/blob/main/my_app/src/components/FoodList.vue): `my_app/src/components/FoodList.vue`
- [Food map](https://github.com/tan-sd/makan-boleh/blob/main/my_app/src/components/Map.vue): `my_app/src/components/Map.vue`
- [Registration](https://github.com/tan-sd/makan-boleh/blob/main/my_app/src/views/SignUpPage.vue): `my_app/src/views/SignUpPage.vue`
- [User profile](https://github.com/tan-sd/makan-boleh/blob/main/my_app/src/views/UserProfile.vue): `my_app/src/views/UserProfile.vue`
- [Forum interface](https://github.com/tan-sd/makan-boleh/blob/main/my_app/src/views/Forum.vue): `my_app/src/views/Forum.vue`
- [Session state](https://github.com/tan-sd/makan-boleh/blob/main/my_app/src/store/index.js): `my_app/src/store/index.js`

### API coordination

- [Food coordination](https://github.com/tan-sd/makan-boleh/blob/main/food_management.py): `food_management.py`
- [Food API](https://github.com/tan-sd/makan-boleh/blob/main/manage_food.py): `manage_food.py`
- [Forum API](https://github.com/tan-sd/makan-boleh/blob/main/manage_forum.py): `manage_forum.py`

### Product services

- [Food posts](https://github.com/tan-sd/makan-boleh/blob/main/food_info.py): `food_info.py`
- [User accounts](https://github.com/tan-sd/makan-boleh/blob/main/user_info.py): `user_info.py`
- [Forum content](https://github.com/tan-sd/makan-boleh/blob/main/forum_info.py): `forum_info.py`
- [Activity logging](https://github.com/tan-sd/makan-boleh/blob/main/activity_log.py): `activity_log.py`

### Persistent data

- [Food database](https://github.com/tan-sd/makan-boleh/blob/main/database/food_db.sql): `database/food_db.sql`
- [User database](https://github.com/tan-sd/makan-boleh/blob/main/database/user_info.sql): `database/user_info.sql`
- [Forum database](https://github.com/tan-sd/makan-boleh/blob/main/database/forum_db.sql): `database/forum_db.sql`

### Other components

- **Food sharer or seeker**
- **Firebase Storage**
- **Google Maps**

## Connections

- Food sharer or seeker → Vue application: uses
- Vue application → Page routing: renders routes
- Page routing → Food discovery: opens discovery
- Page routing → Food map: opens map
- Page routing → Registration: opens signup
- Page routing → User profile: opens profile
- Page routing → Forum interface: opens forum
- Vue application → Session state: installs state
- Food discovery → Food coordination: requests nearby food
- Food map → Food coordination: requests food markers
- Food map → Google Maps: renders map
- Food discovery → Firebase Storage: loads food images
- Registration → Food API: submits registration
- User profile → User accounts: updates profile
- Forum interface → Forum API: creates forum content
- Forum interface → Forum API: loads forum posts
- Food coordination → User accounts: verifies user
- Food coordination → Food posts: fetches food
- Food coordination → Forum content: creates forum post
- Food coordination → Activity logging: records activity
- Food posts → Food database: reads and writes
- User accounts → User database: reads and writes
- Forum content → Forum database: reads and writes