# rajairfanahmed/irfanlovefront architecture

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

- Interactive diagram: https://gitdiagram.com/rajairfanahmed/irfanlovefront
- Repository: https://github.com/rajairfanahmed/irfanlovefront

## Overview

irfanlovefront combines a multi-agent installer for a documented 14-skill engineering suite with an `extract-tool` website-section capture application. The installer selects agent targets and installation scope, then delegates to agent-specific installers; the README describes the suite’s PRD, backend, frontend, and documentation stages. The extraction app accepts a URL and capture options, then captures sections and returns a ZIP. Job-based capture and its supporting gates are visible in sampled server code, but the job API route wiring and several UI interactions are not shown, so those links are omitted.

Main entry points: [`extract-tool/src/server/captureEngine.ts`](https://github.com/rajairfanahmed/irfanlovefront/blob/main/extract-tool/src/server/captureEngine.ts) (Multi-page capture), [`src/index.js`](https://github.com/rajairfanahmed/irfanlovefront/blob/main/src/index.js) (Installer CLI), [`extract-tool/src/server/jobManager.ts`](https://github.com/rajairfanahmed/irfanlovefront/blob/main/extract-tool/src/server/jobManager.ts) (Job orchestration), [`extract-tool/src/components/workstation/DesignCaptureCard.tsx`](https://github.com/rajairfanahmed/irfanlovefront/blob/main/extract-tool/src/components/workstation/DesignCaptureCard.tsx) (Capture workstation)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_installer["Skills Installer"]
  node_cli["Installer CLI<br/>[index.js]"]
  node_banner["CLI banner<br/>[banner.js]"]
  node_claude["Claude installer<br/>[claude.js]"]
  node_windsurf["Windsurf installer<br/>[windsurf.js]"]
  node_otheragents["Other agent installers"]
end

subgraph group_suite["Engineering Skills"]
  node_prd["PRD discovery<br/>[README.md]"]
  node_backend["Backend engineering<br/>[README.md]"]
  node_frontend["Frontend pipeline<br/>[README.md]"]
  node_docs["Documentation skill<br/>[README.md]"]
end

subgraph group_capture["Website Capture"]
  node_extractengine["Single-page capture<br/>[extractorEngine.ts]"]
  node_jobs["Job orchestration<br/>[jobManager.ts]"]
  node_pipeline["Multi-page capture<br/>[captureEngine.ts]"]
  node_zip["ZIP packaging<br/>[zipGenerator.ts]"]
  node_types["Extraction data types<br/>[extractor.ts]"]
end

subgraph group_analysis["Capture Analysis"]
  node_validator["URL validation<br/>[urlValidator.ts]"]
  node_discovery["Page discovery<br/>[pageDiscovery.ts]"]
  node_readiness["Readiness checks<br/>[readinessGate.ts]"]
  node_profiles["Site profiling"]
  node_naming["Section naming<br/>[sectionNamer.ts]"]
  node_quality["Capture quality gate<br/>[qualityGate.ts]"]
end

subgraph group_interface["Extraction Interface"]
  node_extractorui["Capture workstation"]
  node_extractroute["Extraction endpoint<br/>[route.ts]"]
  node_sitepreview["Sample site data<br/>[siteData.ts]"]
end

node_user(("CLI user"))
node_website(("Target website"))

node_user -->|"runs"| node_cli
node_cli -->|"prints"| node_banner
node_cli -->|"dispatches"| node_claude
node_cli -->|"dispatches"| node_windsurf
node_cli -->|"dispatches"| node_otheragents
node_prd -->|"precedes"| node_backend
node_backend -->|"provides contracts"| node_frontend
node_frontend -->|"followed by"| node_docs
node_user -.->|"configures"| node_extractorui
node_extractorui -.->|"submits request"| node_extractroute
node_extractroute -->|"runs"| node_extractengine
node_website -.->|"is captured"| node_extractengine
node_jobs -->|"validates URL"| node_validator
node_jobs -->|"discovers pages"| node_discovery
node_jobs -->|"runs capture"| node_pipeline
node_pipeline -->|"checks readiness"| node_readiness
node_pipeline -->|"detects profiles"| node_profiles
node_pipeline -->|"names sections"| node_naming
node_pipeline -.->|"uses quality gate"| node_quality
node_pipeline -->|"packages captures"| node_zip
node_extractroute -->|"uses request types"| node_types
node_extractengine -->|"uses data types"| node_types
node_extractorui -.->|"uses sample data"| node_sitepreview

click node_cli "https://github.com/rajairfanahmed/irfanlovefront/blob/main/src/index.js"
click node_banner "https://github.com/rajairfanahmed/irfanlovefront/blob/main/src/utils/banner.js"
click node_claude "https://github.com/rajairfanahmed/irfanlovefront/blob/main/src/agents/claude.js"
click node_windsurf "https://github.com/rajairfanahmed/irfanlovefront/blob/main/src/agents/windsurf.js"
click node_otheragents "https://github.com/rajairfanahmed/irfanlovefront/tree/main/src/agents"
click node_prd "https://github.com/rajairfanahmed/irfanlovefront/blob/main/README.md"
click node_backend "https://github.com/rajairfanahmed/irfanlovefront/blob/main/README.md"
click node_frontend "https://github.com/rajairfanahmed/irfanlovefront/blob/main/README.md"
click node_docs "https://github.com/rajairfanahmed/irfanlovefront/blob/main/README.md"
click node_extractorui "https://github.com/rajairfanahmed/irfanlovefront/blob/main/extract-tool/src/components/workstation/DesignCaptureCard.tsx"
click node_extractroute "https://github.com/rajairfanahmed/irfanlovefront/blob/main/extract-tool/src/app/api/extract/route.ts"
click node_extractengine "https://github.com/rajairfanahmed/irfanlovefront/blob/main/extract-tool/src/server/extractorEngine.ts"
click node_jobs "https://github.com/rajairfanahmed/irfanlovefront/blob/main/extract-tool/src/server/jobManager.ts"
click node_validator "https://github.com/rajairfanahmed/irfanlovefront/blob/main/extract-tool/src/server/urlValidator.ts"
click node_discovery "https://github.com/rajairfanahmed/irfanlovefront/blob/main/extract-tool/src/server/pageDiscovery.ts"
click node_pipeline "https://github.com/rajairfanahmed/irfanlovefront/blob/main/extract-tool/src/server/captureEngine.ts"
click node_readiness "https://github.com/rajairfanahmed/irfanlovefront/blob/main/extract-tool/src/server/readinessGate.ts"
click node_profiles "https://github.com/rajairfanahmed/irfanlovefront/blob/main/extract-tool/src/server/siteProfileDetector.ts"
click node_naming "https://github.com/rajairfanahmed/irfanlovefront/blob/main/extract-tool/src/server/sectionNamer.ts"
click node_quality "https://github.com/rajairfanahmed/irfanlovefront/blob/main/extract-tool/src/server/qualityGate.ts"
click node_zip "https://github.com/rajairfanahmed/irfanlovefront/blob/main/extract-tool/src/utils/zipGenerator.ts"
click node_types "https://github.com/rajairfanahmed/irfanlovefront/blob/main/extract-tool/src/types/extractor.ts"
click node_sitepreview "https://github.com/rajairfanahmed/irfanlovefront/blob/main/extract-tool/src/data/siteData.ts"

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_cli,node_banner,node_claude,node_windsurf,node_otheragents,node_user toneBlue
class node_prd,node_backend,node_frontend,node_docs toneAmber
class node_extractengine,node_jobs,node_pipeline,node_zip,node_types toneMint
class node_validator,node_discovery,node_readiness,node_profiles,node_naming,node_quality toneRose
class node_extractorui,node_extractroute,node_sitepreview,node_website toneIndigo
```

## Components

### Skills Installer

- [Installer CLI](https://github.com/rajairfanahmed/irfanlovefront/blob/main/src/index.js): `src/index.js`
- [CLI banner](https://github.com/rajairfanahmed/irfanlovefront/blob/main/src/utils/banner.js): `src/utils/banner.js`
- [Claude installer](https://github.com/rajairfanahmed/irfanlovefront/blob/main/src/agents/claude.js): `src/agents/claude.js`
- [Windsurf installer](https://github.com/rajairfanahmed/irfanlovefront/blob/main/src/agents/windsurf.js): `src/agents/windsurf.js`
- [Other agent installers](https://github.com/rajairfanahmed/irfanlovefront/tree/main/src/agents): `src/agents`

### Engineering Skills

- [PRD discovery](https://github.com/rajairfanahmed/irfanlovefront/blob/main/README.md): `README.md`
- [Backend engineering](https://github.com/rajairfanahmed/irfanlovefront/blob/main/README.md): `README.md`
- [Frontend pipeline](https://github.com/rajairfanahmed/irfanlovefront/blob/main/README.md): `README.md`
- [Documentation skill](https://github.com/rajairfanahmed/irfanlovefront/blob/main/README.md): `README.md`

### Website Capture

- [Single-page capture](https://github.com/rajairfanahmed/irfanlovefront/blob/main/extract-tool/src/server/extractorEngine.ts): `extract-tool/src/server/extractorEngine.ts`
- [Job orchestration](https://github.com/rajairfanahmed/irfanlovefront/blob/main/extract-tool/src/server/jobManager.ts): `extract-tool/src/server/jobManager.ts`
- [Multi-page capture](https://github.com/rajairfanahmed/irfanlovefront/blob/main/extract-tool/src/server/captureEngine.ts): `extract-tool/src/server/captureEngine.ts`
- [ZIP packaging](https://github.com/rajairfanahmed/irfanlovefront/blob/main/extract-tool/src/utils/zipGenerator.ts): `extract-tool/src/utils/zipGenerator.ts`
- [Extraction data types](https://github.com/rajairfanahmed/irfanlovefront/blob/main/extract-tool/src/types/extractor.ts): `extract-tool/src/types/extractor.ts`

### Capture Analysis

- [URL validation](https://github.com/rajairfanahmed/irfanlovefront/blob/main/extract-tool/src/server/urlValidator.ts): `extract-tool/src/server/urlValidator.ts`
- [Page discovery](https://github.com/rajairfanahmed/irfanlovefront/blob/main/extract-tool/src/server/pageDiscovery.ts): `extract-tool/src/server/pageDiscovery.ts`
- [Readiness checks](https://github.com/rajairfanahmed/irfanlovefront/blob/main/extract-tool/src/server/readinessGate.ts): `extract-tool/src/server/readinessGate.ts`
- [Site profiling](https://github.com/rajairfanahmed/irfanlovefront/blob/main/extract-tool/src/server/siteProfileDetector.ts): `extract-tool/src/server/siteProfileDetector.ts`
- [Section naming](https://github.com/rajairfanahmed/irfanlovefront/blob/main/extract-tool/src/server/sectionNamer.ts): `extract-tool/src/server/sectionNamer.ts`
- [Capture quality gate](https://github.com/rajairfanahmed/irfanlovefront/blob/main/extract-tool/src/server/qualityGate.ts): `extract-tool/src/server/qualityGate.ts`

### Extraction Interface

- [Capture workstation](https://github.com/rajairfanahmed/irfanlovefront/blob/main/extract-tool/src/components/workstation/DesignCaptureCard.tsx): `extract-tool/src/components/workstation/DesignCaptureCard.tsx`
- [Extraction endpoint](https://github.com/rajairfanahmed/irfanlovefront/blob/main/extract-tool/src/app/api/extract/route.ts): `extract-tool/src/app/api/extract/route.ts`
- [Sample site data](https://github.com/rajairfanahmed/irfanlovefront/blob/main/extract-tool/src/data/siteData.ts): `extract-tool/src/data/siteData.ts`

### Other components

- **CLI user**
- **Target website**

## Connections

- CLI user → Installer CLI: runs (evidence: `README.md`)
- Installer CLI → CLI banner: prints (evidence: `src/index.js`)
- Installer CLI → Claude installer: dispatches (evidence: `src/index.js`)
- Installer CLI → Windsurf installer: dispatches (evidence: `src/index.js`)
- Installer CLI → Other agent installers: dispatches (evidence: `src/index.js`)
- PRD discovery → Backend engineering: precedes (evidence: `README.md`)
- Backend engineering → Frontend pipeline: provides contracts (evidence: `README.md`)
- Frontend pipeline → Documentation skill: followed by (evidence: `README.md`)
- CLI user → Capture workstation: configures
- Capture workstation → Extraction endpoint: submits request
- Extraction endpoint → Single-page capture: runs (evidence: `extract-tool/src/app/api/extract/route.ts`)
- Target website → Single-page capture: is captured
- Job orchestration → URL validation: validates URL (evidence: `extract-tool/src/server/jobManager.ts`)
- Job orchestration → Page discovery: discovers pages (evidence: `extract-tool/src/server/jobManager.ts`)
- Job orchestration → Multi-page capture: runs capture (evidence: `extract-tool/src/server/jobManager.ts`)
- Multi-page capture → Readiness checks: checks readiness (evidence: `extract-tool/src/server/captureEngine.ts`)
- Multi-page capture → Site profiling: detects profiles (evidence: `extract-tool/src/server/captureEngine.ts`)
- Multi-page capture → Section naming: names sections (evidence: `extract-tool/src/server/captureEngine.ts`)
- Multi-page capture → Capture quality gate: uses quality gate (evidence: `extract-tool/src/server/captureEngine.ts`)
- Multi-page capture → ZIP packaging: packages captures (evidence: `extract-tool/src/server/captureEngine.ts`)
- Extraction endpoint → Extraction data types: uses request types (evidence: `extract-tool/src/app/api/extract/route.ts`)
- Single-page capture → Extraction data types: uses data types (evidence: `extract-tool/src/server/extractorEngine.ts`)
- Capture workstation → Sample site data: uses sample data