Application Generator User Guide

Overview

The Application Generator enables users to build complete applications from natural language descriptions in approximately 10 minutes. Describe your vision ("I need a task management app with projects and teams"), and MAGIEVA generates database schemas, API endpoints, UI components, and deployment configurations automatically.

Quick Start

1. Describe Your Application

Navigate to: Dashboard → Generate Application

Enter Intent (natural language description):

Example Intent:

Build a task management application where users can:
1. Create projects with name and description
2. Add tasks to projects with title, due date, and priority
3. Assign tasks to team members
4. Track task status (to-do, in-progress, done)
5. View dashboard with project progress and upcoming deadlines

Tips for Good Intents: - Be specific about features and functionality - Mention user roles (admin, member, guest) - Specify data relationships (project has tasks, task has assignee) - Include UI requirements (dashboard, forms, tables) - Mention integrations (OAuth, email notifications, webhooks)

2. Review Generated Architecture

MAGIEVA Analyzes Intent (30 seconds): - Extracts entities: Project, Task, User, TeamMember - Identifies relationships: Project → Task (one-to-many), User → Task (one-to-many) - Plans API endpoints: GET/POST/PUT/DELETE for projects, tasks, team_members - Plans UI pages: Dashboard, Projects, Tasks, Team

Architecture Preview: - Database Schema: ERD diagram (Mermaid) - API Endpoints: 9 endpoints with methods and paths - UI Components: 4 pages, 8 components - Integrations: OAuth (Google, GitHub), webhooks - Estimated Generation Time: 10 minutes - Estimated Cost: $12.45

3. Customize Configuration (Optional)

Preferences: - Primary Color: Brand color (hex code or picker) - Font Family: Inter, Roboto, Poppins, etc. - Database: PostgreSQL (default), MySQL, MongoDB - Backend Language: Go (default), Node.js, Python - Frontend Framework: Next.js (default), React, Vue

Advanced Options: - Authentication: JWT (default), OAuth only, custom - Deployment Target: Cloud Run (default), Kubernetes, Vercel - Custom Domain: your-app.example.com

4. Start Generation

Click "Generate Application" Button

Generation Process (10 minutes): 1. Intent Decomposition (10%): AI analyzes intent, extracts requirements 2. Schema Generation (30%): Creates database tables, indexes, RLS policies 3. API Generation (50%): Generates Go/Fiber endpoints with auth, validation 4. UI Generation (70%): Generates Next.js/React components with branding 5. Integration Generation (80%): Creates OAuth configs, webhook handlers 6. Bundling (90%): Packages 30-40 files into ZIP archive 7. Deployment (100%): Deploys to Cloud Run (optional)

Real-Time Progress: - Progress bar (0-100%) - Current step indicator - File count (0 → 32 files) - Cost tracking ($0.00 → $12.45) - Time remaining estimate

5. Download or Deploy

Options:

A. Download Generated Code (ZIP): - Click "Download ZIP" button - Extract archive (32 files, ~145KB) - Follow README.md setup instructions - Deploy to your own infrastructure

B. Deploy to Cloud Run: - Click "Deploy to Cloud Run" button - Enter service name (e.g., "task-management-app") - Configure environment variables (database URL, JWT secret) - Wait for deployment (3 minutes) - Access at the generated application URL shown after deploy

---

Generated Application Structure

Database Schema

Example (Task Management App):

-- projects table
CREATE TABLE projects (
    id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
    name VARCHAR(255) NOT NULL,
    description TEXT,
    created_by UUID NOT NULL REFERENCES auth.users(id),
    created_at TIMESTAMPTZ NOT NULL DEFAULT NOW(),
    updated_at TIMESTAMPTZ NOT NULL DEFAULT NOW()
);

-- tasks table
CREATE TABLE tasks (
    id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
    project_id UUID NOT NULL REFERENCES projects(id) ON DELETE CASCADE,
    title VARCHAR(255) NOT NULL,
    description TEXT,
    due_date DATE,
    priority VARCHAR(20) CHECK (priority IN ('low', 'medium', 'high')),
    status VARCHAR(20) CHECK (status IN ('to-do', 'in-progress', 'done')),
    assigned_to UUID REFERENCES auth.users(id),
    created_at TIMESTAMPTZ NOT NULL DEFAULT NOW()
);

-- Row-Level Security (RLS)
ALTER TABLE projects ENABLE ROW LEVEL SECURITY;
CREATE POLICY "Users can view their own projects"
    ON projects FOR SELECT
    USING (created_by = auth.uid());

-- Indexes for performance
CREATE INDEX idx_tasks_project ON tasks(project_id);
CREATE INDEX idx_tasks_assigned_to ON tasks(assigned_to);

API Endpoints

Generated Go/Fiber Handlers:

// api/handlers/project_handler.go
package handlers

import (
    "github.com/gofiber/fiber/v2"
    "github.com/google/uuid"
)

// ListProjects returns all projects for authenticated user
func ListProjects(c *fiber.Ctx) error {
    userID := c.Locals("user_id").(uuid.UUID)

    var projects []Project
    err := db.Select(&projects,
        "SELECT * FROM projects WHERE created_by = $1 ORDER BY created_at DESC",
        userID,
    )
    if err != nil {
        return c.Status(500).JSON(fiber.Map{"error": "Failed to fetch projects"})
    }

    return c.JSON(projects)
}

// CreateProject creates a new project
func CreateProject(c *fiber.Ctx) error {
    userID := c.Locals("user_id").(uuid.UUID)

    var req CreateProjectRequest
    if err := c.BodyParser(&req); err != nil {
        return c.Status(400).JSON(fiber.Map{"error": "Invalid request body"})
    }

    // Validation
    if req.Name == "" {
        return c.Status(400).JSON(fiber.Map{"error": "Name is required"})
    }

    // Insert
    project := Project{
        ID:          uuid.New(),
        Name:        req.Name,
        Description: req.Description,
        CreatedBy:   userID,
    }

    _, err := db.NamedExec(`
        INSERT INTO projects (id, name, description, created_by)
        VALUES (:id, :name, :description, :created_by)
    `, project)

    if err != nil {
        return c.Status(500).JSON(fiber.Map{"error": "Failed to create project"})
    }

    return c.Status(201).JSON(project)
}

Generated Endpoints: - GET /api/v1/projects - List projects - POST /api/v1/projects - Create project - GET /api/v1/projects/:id - Get project details - PUT /api/v1/projects/:id - Update project - DELETE /api/v1/projects/:id - Delete project - GET /api/v1/tasks - List tasks (with project filter) - POST /api/v1/tasks - Create task - PUT /api/v1/tasks/:id - Update task - DELETE /api/v1/tasks/:id - Delete task

UI Components

Generated Next.js/React Components:

// app/components/ProjectList.tsx
import React, { useEffect, useState } from 'react';
import { useRouter } from 'next/navigation';

interface Project {
    id: string;
    name: string;
    description: string;
    created_at: string;
}

export function ProjectList() {
    const router = useRouter();
    const [projects, setProjects] = useState<Project[]>([]);
    const [loading, setLoading] = useState(true);
    const [error, setError] = useState<string | null>(null);

    useEffect(() => {
        fetchProjects();
    }, []);

    const fetchProjects = async () => {
        try {
            const res = await fetch('/api/v1/projects', {
                headers: {
                    'Authorization': `Bearer ${localStorage.getItem('token')}`,
                },
            });
            if (!res.ok) throw new Error('Failed to fetch projects');
            const data = await res.json();
            setProjects(data);
        } catch (err) {
            setError(err.message);
        } finally {
            setLoading(false);
        }
    };

    if (loading) return <div>Loading...</div>;
    if (error) return <div>Error: {error}</div>;

    return (
        <div className="project-list">
            <h1>Projects</h1>
            <button onClick={() => router.push('/projects/new')}>
                + Create Project
            </button>
            <div className="grid">
                {projects.map(project => (
                    <div key={project.id} className="card">
                        <h3>{project.name}</h3>
                        <p>{project.description}</p>
                        <button onClick={() => router.push(`/projects/${project.id}`)}>
                            View Details
                        </button>
                    </div>
                ))}
            </div>
        </div>
    );
}

Generated Pages: - app/dashboard/page.tsx - Dashboard with metrics - app/projects/page.tsx - Project list - app/projects/[id]/page.tsx - Project details with tasks - app/tasks/page.tsx - Task list - app/team/page.tsx - Team members

Integration Configurations

OAuth Configuration (config/oauth.yaml):

providers:
  google:
    client_id: ${GOOGLE_CLIENT_ID}
    client_secret: ${GOOGLE_CLIENT_SECRET}
    redirect_uri: /auth/callback/google
    scopes:
      - email
      - profile

  github:
    client_id: ${GITHUB_CLIENT_ID}
    client_secret: ${GITHUB_CLIENT_SECRET}
    redirect_uri: /auth/callback/github
    scopes:
      - user:email

Environment Variables (.env.example):

# Database

# Authentication
JWT_SECRET=your-jwt-secret-here
JWT_EXPIRATION=24h

# OAuth Providers
GOOGLE_CLIENT_ID=your-google-client-id
GOOGLE_CLIENT_SECRET=your-google-client-secret
GITHUB_CLIENT_ID=your-github-client-id
GITHUB_CLIENT_SECRET=your-github-client-secret

# Deployment
PORT=8080
LOG_LEVEL=info

---

Deployment Options

Option 1: Cloud Run (Automatic)

MAGIEVA Deploys Automatically: 1. Builds Docker image from generated Dockerfile 2. Pushes image to Google Container Registry 3. Deploys to Cloud Run with auto-scaling 4. Configures environment variables 5. Sets up SSL certificate (HTTPS)

Access Your Application: - Default URL: a generated hostname issued at deploy time - Custom domain: configure DNS to point at the generated application URL

Auto-Scaling: - Min instances: 0 (scales to zero when not in use) - Max instances: 10 (scales up based on traffic)

Option 2: Kubernetes (Manual)

Generated Files: - k8s/deployment.yaml - Kubernetes deployment manifest - k8s/service.yaml - Service configuration - k8s/ingress.yaml - Ingress rules

Deploy to GKE:

# Authenticate
gcloud auth login
gcloud config set project YOUR_PROJECT_ID

# Create cluster (if needed)
gcloud container clusters create my-cluster --num-nodes=3

# Deploy application
kubectl apply -f k8s/deployment.yaml
kubectl apply -f k8s/service.yaml
kubectl apply -f k8s/ingress.yaml

# Get external IP
kubectl get ingress

Option 3: Self-Hosted (VPS, DigitalOcean, AWS)

Deploy to Any Server:

# 1. Copy ZIP to server
scp app.zip user@your-server.com:/home/user/

# 2. SSH into server
ssh user@your-server.com

# 3. Extract and setup
unzip app.zip
cd app
docker compose up -d

# 4. Access at http://your-server.com:8080

---

Customization After Generation

Modifying Generated Code

Generated code is production-ready but fully customizable:

1. Download ZIP and extract
2. Open in your IDE (VS Code, IntelliJ)
3. Install dependencies:

   # Backend
   go mod download
   
   # Frontend
   cd app && npm install
   

4. Make changes (add features, modify logic, update styling)
5. Test locally:

   # Backend
   go run main.go
   
   # Frontend
   npm run dev
   

6. Deploy your modified version

Common Customizations: - Add new database fields - Customize UI styling (colors, fonts, layout) - Add business logic (custom validation, calculations) - Integrate additional APIs - Add authentication providers - Implement email notifications

Regenerating Code

If you need to start over: 1. Go back to Application Generator 2. Update your intent with new requirements 3. Generate new version 4. Merge your custom changes if needed

Tip: Use git to track changes, so you can merge generated code with your customizations.

---

Advanced Features

Multi-Language Support

Backend Languages: - Go (default): Fast, compiled, strong typing - Node.js: JavaScript/TypeScript, large ecosystem - Python: Great for data science, ML integrations

Frontend Frameworks: - Next.js (default): React with SSR, best for SEO - React: Client-side rendering, fast, flexible - Vue: Progressive framework, gentle learning curve

Custom Templates

Use Your Own Code Templates: 1. Create custom code templates in Template Service 2. Reference in generation intent:

Build a task app using my custom API template (template_id: abc123)

3. Generator uses your template instead of default

Incremental Generation

Add Features to Existing Application: 1. Upload your existing codebase 2. Enter intent: "Add email notifications to task assignments" 3. Generator analyzes existing code 4. Generates only new files/changes 5. Provides merge instructions

Status: Planned for Phase 2 (Q2 2026)

---

Pricing & Limitations

Generation Costs

Typical Application (9-12 endpoints): - Intent Analysis: $0.50 (GPT-4o) - Schema Generation: $1.00 (Claude Sonnet 4.5) - API Generation: $6.00 (Claude Sonnet 4.5, ~8 endpoints) - UI Generation: $4.00 (GPT-4o, ~6 components) - Integration Generation: $0.95 (GPT-4o) - Total: ~$12.45 per generation

Deployment Costs (Cloud Run): - Free tier: First 2 million requests/month - Auto-scales to zero (no cost when not in use)

Limitations

Current Limitations: - Max Endpoints: 15 endpoints per generation - Max Tables: 10 database tables - Generation Time: 10 minutes (timeout at 15 minutes) - Supported Languages: Go, Node.js, Python (backend), Next.js, React, Vue (frontend)

Future Enhancements (Roadmap): - Mobile app generation (React Native, Flutter) - Real-time features (WebSockets, subscriptions) - Advanced authentication (SSO, SAML) - Multi-tenancy support - Microservices architecture

---

Troubleshooting

Generation fails with "Invalid intent"

Solution: - Be more specific in intent description - Include entity names, relationships, features - Mention UI requirements explicitly - Example: Instead of "task app", say "task management app with projects, tasks, and team collaboration"

Generated code has compilation errors

Solution: - Download ZIP and check error details - Common issue: Missing dependencies (run go mod tidy or npm install) - Report issue to support@magieva.com with generation_id

Deployment to Cloud Run fails

Solution: - Check GCP credentials configured correctly - Verify billing enabled on GCP project - Check service name is unique (no conflicts) - Review deployment logs in Cloud Run console

Generated UI doesn't match my branding

Solution: - Ensure primary_color set correctly in preferences - Upload your brand assets to Asset Manager first - Regenerate with correct preferences - Or download ZIP and customize manually

---

Best Practices

Writing Good Intents

✅ Good Intent:

Build a customer relationship management (CRM) system where:
- Sales reps can create and manage customer records with contact info, company, and deal value
- Track deals through pipeline stages: Lead, Qualified, Proposal, Negotiation, Won, Lost
- Dashboard shows total deal value, win rate, and upcoming follow-ups
- Email integration to log customer communications
- User roles: Admin (full access), Sales Rep (own customers only)

❌ Bad Intent:

Make a CRM app with customers and deals.

Key Differences: - Good intent is specific about entities, features, UI - Good intent mentions user roles and permissions - Good intent describes business logic (pipeline stages) - Bad intent is too vague, missing critical details

Testing Generated Applications

Before Deploying to Production: 1. Test locally: Run on your machine first 2. Test all features: Create, read, update, delete operations 3. Test authentication: Login, logout, permissions 4. Test edge cases: Empty inputs, invalid data, errors 5. Test performance: Load testing with 100+ concurrent users 6. Security audit: Check for SQL injection, XSS vulnerabilities

Maintaining Generated Applications

Recommended Workflow: 1. Use version control: Initialize git repository immediately 2. Create branches: feature branches for new development 3. Write tests: Add unit tests, integration tests 4. Monitor in production: Set up logging, error tracking (Sentry) 5. Regular updates: Keep dependencies up-to-date

---

FAQs

Q: Can I generate mobile apps? A: Not yet. Planned for Q2 2026 (React Native, Flutter).

Q: How accurate is the generated code? A: 85%+ success rate (code compiles and runs). May need minor tweaks for complex business logic.

Q: Can I regenerate with changes? A: Yes! Update your intent, regenerate. Use git to merge with your customizations.

Q: What databases are supported? A: PostgreSQL (default), MySQL, MongoDB. All include ORMs and migrations.

Q: Can I use custom AI models? A: Yes! Set your preferred models under Settings → Model Preferences. The generator honours whatever you choose there.

Q: How do I add features later? A: Download ZIP, add features manually, redeploy. Or use incremental generation (planned Q2 2026).

---

Getting Help

• Support: support@magieva.com
• Community: Discord

---

Last Updated: 2026-02-07 Related Guides: Template Marketplace Guide, Workflow Builder Guide