Purpose and Responsibilities
- Generate frontend specs (e.g.
react_nextjs.md,components.md,pages.md,state_management.md), Kotlin/Swift UI specs for mobile, and prompts (e.g.generate_frontend.txt,generate_ios.txt,generate_android.txt). - Align with ProductManager (requirements) and BackendDev (API contracts).
- Coordinate with ToolManager for tooling and export.
Input/Output
Input (from generateFileContentWithAgent)
file,requirements,config,filePath,workflowContext,existingDeliverables— Same pattern as Product Manager.
Output
- Markdown or prompt (
file.type) string. For prompts, the content is used later to generate code; for markdown, it describes structure, components, and implementation notes.
Prompt Engineering
- Agent system:
"You are a Frontend Developer agent. You create UI components, pages, and frontend code. Coordinate with ProductManager for requirements and BackendDev for API contracts." - Full prompt in
generateFileContentWithAgent:workflow context,requirements,file/filePath,config.techStack,relatedFiles`, and instructions for unique, path-specific content. - Model:
callOpenRouter(..., 'GROK', { temperature: 0.8 }).
File Assignment
getAgentForFile assigns to FrontendDev when the path contains:
frontend,components, orpages
Examples
- frontend/react_nextjs.md, frontend/components.md, frontend/state_management.md (Web App)
- frontend/nextjs.md, frontend/pages.md, frontend/components.md (Website)
- frontend/prompts/generate_frontend.txt, frontend/prompts/generate_static_site.txt
- android/kotlin_ui.md, android/fragments.md, android/navigation.md, android/prompts/generate_android.txt
- ios/swiftui.md, ios/storyboards.md, ios/navigation.md, ios/permissions.md, ios/prompts/generate_ios.txt
Customization Options
- Agent system: Edit the FrontendDev entry in
agentSystemPromptsinlib/platform-templates.ts. - Assignment: Extend
getAgentForFile(e.g.themes,styles) to FrontendDev. - Platforms: Add new
frontend/orios//android/files in the platformfolderStructureand ensure they matchgetAgentForFilerules.
Below is the same content, same wording, no additions, no deletions, no rephrasing, formatted cleanly for Notion.
You can paste this directly into a Notion page.
Frontend Dev
FrontendDev produces frontend specs, components, pages, and LLM prompts for UI code.Purpose and Responsibilities
- Generate frontend specs (e.g.
react_nextjs.md,components.md,pages.md,state_management.md), Kotlin/Swift UI specs for mobile, and prompts (e.g.generate_frontend.txt,generate_ios.txt,generate_android.txt). - Align with ProductManager (requirements) and BackendDev (API contracts).
- Coordinate with ToolManager for tooling and export.
Input/Output
Input (from generateFileContentWithAgent)
file,requirements,config,filePath,workflowContext,existingDeliverables— Same pattern as Product Manager.
Output
- Markdown or prompt (
file.type) string. For prompts, the content is used later to generate code; for markdown, it describes structure, components, and implementation notes.
Prompt Engineering
- Agent system:
"You are a Frontend Developer agent. You create UI components, pages, and frontend code. Coordinate with ProductManager for requirements and BackendDev for API contracts." - Full prompt in
generateFileContentWithAgent:workflow context,requirements,file/filePath,config.techStack,relatedFiles`, and instructions for unique, path-specific content. - Model:
callOpenRouter(..., 'GROK', { temperature: 0.8 }).
File Assignment
getAgentForFile assigns to FrontendDev when the path contains:
frontend,components, orpages
Examples
- frontend/react_nextjs.md, frontend/components.md, frontend/state_management.md (Web App)
- frontend/nextjs.md, frontend/pages.md, frontend/components.md (Website)
- frontend/prompts/generate_frontend.txt, frontend/prompts/generate_static_site.txt
- android/kotlin_ui.md, android/fragments.md, android/navigation.md, android/prompts/generate_android.txt
- ios/swiftui.md, ios/storyboards.md, ios/navigation.md, ios/permissions.md, ios/prompts/generate_ios.txt
Customization Options
- Agent system: Edit the FrontendDev entry in
agentSystemPromptsinlib/platform-templates.ts. - Assignment: Extend
getAgentForFile(e.g.themes,styles) to FrontendDev. - Platforms: Add new
frontend/orios//android/files in the platformfolderStructureand ensure they matchgetAgentForFilerules.