# chi-chi256/sangkap architecture

> Architecture diagram of the GitHub repository chi-chi256/sangkap, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-11-12). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/chi-chi256/sangkap
- Repository: https://github.com/chi-chi256/sangkap

## Overview

S.A.N.G.K.A.P. is a browser-based recipe discovery and ingredient-matching app. Users browse or search recipes, compare recipe ingredients with a basket, and view match details; they can also rate recipes, save favorites, create accounts, manage profiles, and share community recipes. The sampled code shows matching, recipe-detail rendering, rating aggregation, profile rendering, and local-storage handling. Several page modules are indexed but not excerpted, so their capabilities are represented without speculative call relationships.

Main entry points: [`js/recipes.js`](https://github.com/chi-chi256/sangkap/blob/master/js/recipes.js) (Recipe catalog), [`js/database.js`](https://github.com/chi-chi256/sangkap/blob/master/js/database.js) (Shared records), [`js/recipe-details.js`](https://github.com/chi-chi256/sangkap/blob/master/js/recipe-details.js) (Recipe details), [`js/profile.js`](https://github.com/chi-chi256/sangkap/blob/master/js/profile.js) (Member profiles)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_discovery["Recipe Discovery"]
  node_catalog["Recipe catalog<br/>[recipes.js]"]
  node_home["Home highlights<br/>[home.js]"]
  node_featured["Featured recipes<br/>[featured.js]"]
  node_suggestions["Recommendations<br/>[recommendation.js]"]
  node_sponsored["Sponsored dishes<br/>[sponsored.js]"]
  node_recipeview["Recipe details<br/>[recipe-details.js]"]
end

subgraph group_engagement["Cooking &amp; Community"]
  node_basket["Ingredient basket<br/>[basket.js]"]
  node_community["Community recipes<br/>[community.js]"]
  node_ratings["Ratings<br/>[ratings.js]"]
  node_favorites["Favorites<br/>[favorites.js]"]
end

subgraph group_identity["Accounts &amp; Profiles"]
  node_auth["Authentication<br/>[auth.js]"]
  node_profile["Member profiles<br/>[profile.js]"]
end

subgraph group_data["Data &amp; Shared UI"]
  node_database[("Shared records<br/>[database.js]")]
  node_storage[("Local storage<br/>[storage.js]")]
  node_app["Shared interface<br/>[app.js]"]
end

node_cook(("Recipe seeker"))

node_cook -.->|"browses"| node_catalog
node_catalog -->|"gets recipes"| node_database
node_recipeview -->|"gets recipe"| node_catalog
node_recipeview -->|"reads basket"| node_basket
node_recipeview -->|"scores match"| node_suggestions
node_sponsored -->|"builds basket set"| node_suggestions
node_ratings -->|"updates recipe"| node_database
node_community -->|"shares recipe table"| node_database
node_profile -->|"counts ratings"| node_ratings
node_profile -->|"renders recipes"| node_catalog
node_database -.->|"persists data"| node_storage
node_app -->|"invokes logout"| node_auth

click node_catalog "https://github.com/chi-chi256/sangkap/blob/master/js/recipes.js"
click node_home "https://github.com/chi-chi256/sangkap/blob/master/js/home.js"
click node_featured "https://github.com/chi-chi256/sangkap/blob/master/js/featured.js"
click node_suggestions "https://github.com/chi-chi256/sangkap/blob/master/js/recommendation.js"
click node_sponsored "https://github.com/chi-chi256/sangkap/blob/master/js/sponsored.js"
click node_recipeview "https://github.com/chi-chi256/sangkap/blob/master/js/recipe-details.js"
click node_basket "https://github.com/chi-chi256/sangkap/blob/master/js/basket.js"
click node_community "https://github.com/chi-chi256/sangkap/blob/master/js/community.js"
click node_ratings "https://github.com/chi-chi256/sangkap/blob/master/js/ratings.js"
click node_favorites "https://github.com/chi-chi256/sangkap/blob/master/js/favorites.js"
click node_auth "https://github.com/chi-chi256/sangkap/blob/master/js/auth.js"
click node_profile "https://github.com/chi-chi256/sangkap/blob/master/js/profile.js"
click node_database "https://github.com/chi-chi256/sangkap/blob/master/js/database.js"
click node_storage "https://github.com/chi-chi256/sangkap/blob/master/js/storage.js"
click node_app "https://github.com/chi-chi256/sangkap/blob/master/js/app.js"

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_catalog,node_home,node_featured,node_suggestions,node_sponsored,node_recipeview toneBlue
class node_basket,node_community,node_ratings,node_favorites toneAmber
class node_auth,node_profile toneMint
class node_database,node_storage,node_app toneRose
class node_cook toneIndigo
```

## Components

### Recipe Discovery

- [Recipe catalog](https://github.com/chi-chi256/sangkap/blob/master/js/recipes.js): `js/recipes.js`
- [Home highlights](https://github.com/chi-chi256/sangkap/blob/master/js/home.js): `js/home.js`
- [Featured recipes](https://github.com/chi-chi256/sangkap/blob/master/js/featured.js): `js/featured.js`
- [Recommendations](https://github.com/chi-chi256/sangkap/blob/master/js/recommendation.js): `js/recommendation.js`
- [Sponsored dishes](https://github.com/chi-chi256/sangkap/blob/master/js/sponsored.js): `js/sponsored.js`
- [Recipe details](https://github.com/chi-chi256/sangkap/blob/master/js/recipe-details.js): `js/recipe-details.js`

### Cooking & Community

- [Ingredient basket](https://github.com/chi-chi256/sangkap/blob/master/js/basket.js): `js/basket.js`
- [Community recipes](https://github.com/chi-chi256/sangkap/blob/master/js/community.js): `js/community.js`
- [Ratings](https://github.com/chi-chi256/sangkap/blob/master/js/ratings.js): `js/ratings.js`
- [Favorites](https://github.com/chi-chi256/sangkap/blob/master/js/favorites.js): `js/favorites.js`

### Accounts & Profiles

- [Authentication](https://github.com/chi-chi256/sangkap/blob/master/js/auth.js): `js/auth.js`
- [Member profiles](https://github.com/chi-chi256/sangkap/blob/master/js/profile.js): `js/profile.js`

### Data & Shared UI

- [Shared records](https://github.com/chi-chi256/sangkap/blob/master/js/database.js): `js/database.js`
- [Local storage](https://github.com/chi-chi256/sangkap/blob/master/js/storage.js): `js/storage.js`
- [Shared interface](https://github.com/chi-chi256/sangkap/blob/master/js/app.js): `js/app.js`

### Other components

- **Recipe seeker**

## Connections

- Recipe seeker → Recipe catalog: browses
- Recipe catalog → Shared records: gets recipes (evidence: `js/recipes.js`)
- Recipe details → Recipe catalog: gets recipe (evidence: `js/recipe-details.js`)
- Recipe details → Ingredient basket: reads basket (evidence: `js/recipe-details.js`)
- Recipe details → Recommendations: scores match (evidence: `js/recipe-details.js`)
- Sponsored dishes → Recommendations: builds basket set (evidence: `js/sponsored.js`)
- Ratings → Shared records: updates recipe (evidence: `js/ratings.js`)
- Community recipes → Shared records: shares recipe table (evidence: `js/community.js`)
- Member profiles → Ratings: counts ratings (evidence: `js/profile.js`)
- Member profiles → Recipe catalog: renders recipes (evidence: `js/profile.js`)
- Shared records → Local storage: persists data
- Shared interface → Authentication: invokes logout (evidence: `js/app.js`)