# kinginthenorth12/agentic_ai_frontforge architecture

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

- Interactive diagram: https://gitdiagram.com/kinginthenorth12/agentic_ai_frontforge
- Repository: https://github.com/kinginthenorth12/agentic_ai_frontforge

## Overview

FrontForge AI turns a user’s website request into a locally generated React project. The main workflow gathers missing requirements, plans the project, creates a normalized UI blueprint, then generates its components and entrypoints. For generation, the component agent retrieves relevant reference documentation and writes code into the project. Documentation ingestion prepares that local retrieval store. The graph reflects the sampled entrypoints; some implementation details are omitted from the excerpts.

Main entry points: [`component_agent.py`](https://github.com/kinginthenorth12/agentic_ai_frontforge/blob/main/component_agent.py) (Component generator), [`main.py`](https://github.com/kinginthenorth12/agentic_ai_frontforge/blob/main/main.py) (Workflow runner), [`UI_Architect.py`](https://github.com/kinginthenorth12/agentic_ai_frontforge/blob/main/UI_Architect.py) (UI architect), [`clarification_agent.py`](https://github.com/kinginthenorth12/agentic_ai_frontforge/blob/main/clarification_agent.py) (Requirement clarification)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_workflow["Generation workflow"]
  node_main["Workflow runner<br/>[main.py]"]
end

subgraph group_planning["Requirements and planning"]
  node_clarification["Requirement clarification"]
  node_planner["Project planner<br/>[planner_agent.py]"]
  node_planfile["Project plan"]
end

subgraph group_generation["Blueprint and code generation"]
  node_architect["UI architect<br/>[UI_Architect.py]"]
  node_blueprint["UI blueprint"]
  node_component["Component generator<br/>[component_agent.py]"]
  node_project["Generated React project"]
end

subgraph group_knowledge["Local reference knowledge"]
  node_ingest["Documentation ingestion<br/>[ingest.py]"]
  node_retriever["Reference retriever<br/>[retriever.py]"]
  node_vectorstore[("Chroma reference store")]
end

node_user(("User"))
node_ollama["Local Ollama models"]

node_user -->|"provides request"| node_clarification
node_main -->|"calls"| node_clarification
node_clarification -->|"invokes model"| node_ollama
node_clarification -->|"returns requirements"| node_main
node_main -->|"calls"| node_planner
node_planner -->|"invokes model"| node_ollama
node_planner -->|"writes plan"| node_planfile
node_main -->|"calls"| node_architect
node_architect -->|"reads plan"| node_planfile
node_architect -->|"invokes model"| node_ollama
node_architect -->|"writes blueprint"| node_blueprint
node_main -->|"calls"| node_component
node_component -->|"reads blueprint"| node_blueprint
node_component -->|"reads plan"| node_planfile
node_component -->|"queries"| node_retriever
node_retriever -->|"searches"| node_vectorstore
node_component -->|"invokes model"| node_ollama
node_component -->|"writes generated code"| node_project
node_ingest -->|"embeds documents"| node_ollama
node_ingest -->|"stores chunks"| node_vectorstore

click node_main "https://github.com/kinginthenorth12/agentic_ai_frontforge/blob/main/main.py"
click node_clarification "https://github.com/kinginthenorth12/agentic_ai_frontforge/blob/main/clarification_agent.py"
click node_planner "https://github.com/kinginthenorth12/agentic_ai_frontforge/blob/main/planner_agent.py"
click node_architect "https://github.com/kinginthenorth12/agentic_ai_frontforge/blob/main/UI_Architect.py"
click node_component "https://github.com/kinginthenorth12/agentic_ai_frontforge/blob/main/component_agent.py"
click node_ingest "https://github.com/kinginthenorth12/agentic_ai_frontforge/blob/main/ingest.py"
click node_retriever "https://github.com/kinginthenorth12/agentic_ai_frontforge/blob/main/retriever.py"

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_main,node_user toneBlue
class node_clarification,node_planner,node_planfile toneAmber
class node_architect,node_blueprint,node_component,node_project toneMint
class node_ingest,node_retriever,node_vectorstore toneRose
class node_ollama toneIndigo
```

## Components

### Generation workflow

- [Workflow runner](https://github.com/kinginthenorth12/agentic_ai_frontforge/blob/main/main.py): `main.py`

### Requirements and planning

- [Requirement clarification](https://github.com/kinginthenorth12/agentic_ai_frontforge/blob/main/clarification_agent.py): `clarification_agent.py`
- [Project planner](https://github.com/kinginthenorth12/agentic_ai_frontforge/blob/main/planner_agent.py): `planner_agent.py`
- **Project plan**

### Blueprint and code generation

- [UI architect](https://github.com/kinginthenorth12/agentic_ai_frontforge/blob/main/UI_Architect.py): `UI_Architect.py`
- **UI blueprint**
- [Component generator](https://github.com/kinginthenorth12/agentic_ai_frontforge/blob/main/component_agent.py): `component_agent.py`
- **Generated React project**

### Local reference knowledge

- [Documentation ingestion](https://github.com/kinginthenorth12/agentic_ai_frontforge/blob/main/ingest.py): `ingest.py`
- [Reference retriever](https://github.com/kinginthenorth12/agentic_ai_frontforge/blob/main/retriever.py): `retriever.py`
- **Chroma reference store**

### Other components

- **User**
- **Local Ollama models**

## Connections

- User → Requirement clarification: provides request
- Workflow runner → Requirement clarification: calls
- Requirement clarification → Local Ollama models: invokes model
- Requirement clarification → Workflow runner: returns requirements
- Workflow runner → Project planner: calls
- Project planner → Local Ollama models: invokes model
- Project planner → Project plan: writes plan
- Workflow runner → UI architect: calls
- UI architect → Project plan: reads plan
- UI architect → Local Ollama models: invokes model
- UI architect → UI blueprint: writes blueprint
- Workflow runner → Component generator: calls
- Component generator → UI blueprint: reads blueprint
- Component generator → Project plan: reads plan
- Component generator → Reference retriever: queries
- Reference retriever → Chroma reference store: searches
- Component generator → Local Ollama models: invokes model
- Component generator → Generated React project: writes generated code
- Documentation ingestion → Local Ollama models: embeds documents
- Documentation ingestion → Chroma reference store: stores chunks