mirror of
https://github.com/johndoe6345789/low-code-react-app-b.git
synced 2026-04-24 21:54:56 +00:00
142 lines
5.3 KiB
JSON
142 lines
5.3 KiB
JSON
{
|
|
"title": "CodeForge",
|
|
"subtitle": "Low-Code Next.js App Builder with AI",
|
|
"overview": "CodeForge is a comprehensive visual low-code platform for generating production-ready Next.js applications. It combines the power of visual designers with direct code editing, AI-powered generation, and a complete full-stack development toolkit.",
|
|
"features": [
|
|
{
|
|
"icon": "Code",
|
|
"title": "Monaco Code Editor",
|
|
"description": "Full-featured code editor with syntax highlighting, autocomplete, and AI-powered improvements"
|
|
},
|
|
{
|
|
"icon": "Database",
|
|
"title": "Prisma Schema Designer",
|
|
"description": "Visual database model designer with automatic schema generation and AI assistance"
|
|
},
|
|
{
|
|
"icon": "Tree",
|
|
"title": "Component Tree Builder",
|
|
"description": "Hierarchical component structure builder with drag-and-drop and AI generation"
|
|
},
|
|
{
|
|
"icon": "PaintBrush",
|
|
"title": "Theme Designer",
|
|
"description": "Material UI theme customizer with multiple variants, custom colors, and AI theme generation"
|
|
},
|
|
{
|
|
"icon": "Flask",
|
|
"title": "Flask Backend Designer",
|
|
"description": "Visual Python Flask API designer with blueprints, endpoints, and CORS configuration"
|
|
},
|
|
{
|
|
"icon": "Play",
|
|
"title": "Playwright Test Designer",
|
|
"description": "E2E test builder with step configuration and AI test generation"
|
|
},
|
|
{
|
|
"icon": "Cube",
|
|
"title": "Unit Test Designer",
|
|
"description": "Comprehensive test suite builder for components, functions, hooks, and integration tests"
|
|
},
|
|
{
|
|
"icon": "Wrench",
|
|
"title": "Auto Error Repair",
|
|
"description": "Automated error detection and AI-powered code repair system"
|
|
},
|
|
{
|
|
"icon": "Gear",
|
|
"title": "Project Settings",
|
|
"description": "Configure Next.js options, npm packages, scripts, and build settings"
|
|
},
|
|
{
|
|
"icon": "Sparkle",
|
|
"title": "AI Integration",
|
|
"description": "OpenAI-powered generation across all features for rapid development"
|
|
}
|
|
],
|
|
"gettingStarted": [
|
|
{
|
|
"step": 1,
|
|
"title": "Create Your First Model",
|
|
"description": "Navigate to the Models tab and create your database schema using the visual designer or describe your data model to the AI."
|
|
},
|
|
{
|
|
"step": 2,
|
|
"title": "Design Your Components",
|
|
"description": "Use the Components tab to build your UI hierarchy visually or let the AI generate component structures based on your requirements."
|
|
},
|
|
{
|
|
"step": 3,
|
|
"title": "Customize Your Theme",
|
|
"description": "Head to the Styling tab to create custom color palettes, manage theme variants (light/dark), and configure typography."
|
|
},
|
|
{
|
|
"step": 4,
|
|
"title": "Build Your Backend",
|
|
"description": "Configure your Flask API in the Flask API tab by creating blueprints and endpoints with full CORS and authentication support."
|
|
},
|
|
{
|
|
"step": 5,
|
|
"title": "Export Your Project",
|
|
"description": "Click Export Project to generate all files including Next.js pages, Prisma schemas, Flask backend, tests, and configuration files ready for deployment."
|
|
}
|
|
],
|
|
"aiFeatures": [
|
|
{
|
|
"title": "Complete App Generation",
|
|
"description": "Describe your application and get a full project structure with models, components, and styling"
|
|
},
|
|
{
|
|
"title": "Model Generation",
|
|
"description": "Generate Prisma models with fields and relations from natural language descriptions"
|
|
},
|
|
{
|
|
"title": "Component Creation",
|
|
"description": "Build complex React components with proper structure and Material UI integration"
|
|
},
|
|
{
|
|
"title": "Theme Generation",
|
|
"description": "Create beautiful, accessible color palettes that match your brand or description"
|
|
},
|
|
{
|
|
"title": "Test Generation",
|
|
"description": "Generate comprehensive E2E, unit, and integration tests with proper assertions"
|
|
},
|
|
{
|
|
"title": "Code Explanation",
|
|
"description": "Get detailed explanations of any code snippet to understand implementation details"
|
|
},
|
|
{
|
|
"title": "Code Improvement",
|
|
"description": "Automatically optimize code for performance, readability, and best practices"
|
|
},
|
|
{
|
|
"title": "Error Repair",
|
|
"description": "Automatically detect and fix syntax, type, import, and lint errors with context-aware fixes"
|
|
}
|
|
],
|
|
"techStack": {
|
|
"frontend": [
|
|
"Next.js 14 with App Router",
|
|
"React 18 with TypeScript",
|
|
"Material UI 5",
|
|
"Monaco Editor",
|
|
"Tailwind CSS"
|
|
],
|
|
"backend": [
|
|
"Flask REST API",
|
|
"Prisma ORM",
|
|
"Playwright E2E Testing",
|
|
"Vitest & React Testing Library",
|
|
"Storybook for Components"
|
|
]
|
|
},
|
|
"proTips": [
|
|
"💡 Use the AI Generate feature to quickly scaffold entire applications from descriptions",
|
|
"💡 The Error Repair tab automatically scans and fixes common issues - check it before exporting",
|
|
"💡 Create multiple theme variants (light, dark, custom) in the Styling tab for complete theme support",
|
|
"💡 Test your components with Storybook stories before writing full E2E tests",
|
|
"💡 Flask blueprints help organize your API endpoints by feature or resource"
|
|
]
|
|
}
|