websitebuilder/QUICKSTART.md

MoreMinimore SAAS - Quick Start Guide

Overview

This guide helps you get started with the MoreMinimore SAAS transformation project.

---

Prerequisites

Before starting, ensure you have:

• Node.js >= 20 installed
• PostgreSQL >= 16 installed
• Redis >= 7 installed
• Git installed
• npm or yarn package manager
• Python 3.x (for UI/UX Pro Max)
• Gitea instance (self-hosted or cloud)
• Easypanel API access
• Stripe account (for billing)

---

Getting Started

1. Clone the Repository

git clone https://github.com/kunthawat/moreminimore-vibe.git
cd moreminimore-vibe

2. Review Documentation

Read the following documents in the Websitebuilder/ folder:

1. SPECIFICATION.md - Complete technical specification
2. TASKS.md - Detailed task breakdown
3. QUICKSTART.md - This file

3. Understand the Architecture

Key architectural decisions:

• Platform: Next.js 15 web application (removing Electron)
• Database: PostgreSQL (migrating from SQLite)
• Cache: Redis
• Authentication: Custom JWT with role-based access control
• Code Storage: PostgreSQL + Gitea backup
• Deployment: Easypanel API integration
• Billing: Stripe integration

4. Set Up Development Environment

4.1 Install Dependencies

npm install

4.2 Set Up PostgreSQL

# Create database
createdb moreminimore

# Or using psql
psql -U postgres
CREATE DATABASE moreminimore;
\q

4.3 Set Up Redis

# Start Redis server
redis-server

# Test connection
redis-cli ping
# Should return: PONG

4.4 Configure Environment Variables

Create a .env.local file:

# Database
DATABASE_URL=postgresql://postgres:password@localhost:5432/moreminimore
REDIS_URL=redis://localhost:6379

# Authentication
JWT_SECRET=your-super-secret-jwt-key-change-this
JWT_REFRESH_SECRET=your-super-secret-refresh-key-change-this

# AI Providers (optional - users can add their own)
OPENAI_API_KEY=sk-...
ANTHROPIC_API_KEY=sk-ant-...
GOOGLE_API_KEY=...

# Easypanel (will be provided later)
EASYPANEL_API_KEY=your-easypanel-api-key
EASYPANEL_API_URL=https://panel.moreminimore.com/api

# Gitea
GITEA_API_URL=https://gitea.moreminimore.com/api/v1
GITEA_TOKEN=your-gitea-token

# Stripe (will be provided later)
STRIPE_SECRET_KEY=sk_test_...
STRIPE_WEBHOOK_SECRET=whsec_...
STRIPE_PRICE_ID_FREE=price_...
STRIPE_PRICE_ID_PRO=price_...
STRIPE_PRICE_ID_ENTERPRISE=price_...

# Email (optional)
RESEND_API_KEY=re_...

# Application
NEXT_PUBLIC_APP_URL=http://localhost:3000
NEXT_PUBLIC_API_URL=http://localhost:3000/api

4.5 Run Database Migrations

# Generate migrations
npm run db:generate

# Push schema to database
npm run db:push

4.6 Start Development Server

npm run dev

Visit http://localhost:3000 to see the application.

---

Development Workflow

Phase 1: Foundation (Weeks 1-4)

Start with Phase 1 tasks from TASKS.md:

1. Project Setup

   • Initialize Next.js project
   • Set up folder structure
   • Install dependencies

2. Database Setup

   • Set up PostgreSQL
   • Configure Drizzle ORM
   • Create database schema

3. Authentication System

   • Implement password hashing
   • Implement JWT tokens
   • Create authentication APIs
   • Create authentication middleware

4. User Management

   • Create user profile APIs
   • Create admin user APIs
   • Create user management UI

5. CI/CD Pipeline

   • Set up GitHub Actions
   • Set up automated testing

Phase 2-9: Follow the Task Breakdown

Continue with the remaining phases as outlined in TASKS.md.

---

Key Concepts

User Roles

• Admin: Full system control (you)
• Co-Admin: Global settings and AI model management (your employees)
• Owner: Customer who controls their projects
• User: Customer's employees with permissions set by Owner

Organization Structure

Organization (Owner)
├── Projects
│   ├── Project 1
│   ├── Project 2
│   └── Project 3
└── Members
    ├── Member 1 (Admin)
    ├── Member 2 (Member)
    └── Member 3 (Viewer)

Deployment Flow

User develops in MoreMinimore
    ↓
Click "Deploy to Easypanel"
    ↓
MoreMinimore commits to Gitea
    ↓
MoreMinimore calls Easypanel API
    ↓
Easypanel creates database + app
    ↓
Easypanel pulls code from Gitea
    ↓
Application is live

---

Common Commands

Development

# Start development server
npm run dev

# Build for production
npm run build

# Start production server
npm start

# Run tests
npm test

# Run tests in watch mode
npm run test:watch

# Run E2E tests
npm run e2e

Database

# Generate migrations
npm run db:generate

# Push schema to database
npm run db:push

# Open Drizzle Studio
npm run db:studio

Code Quality

# Run linter
npm run lint

# Fix linting issues
npm run lint:fix

# Format code
npm run prettier

# Check formatting
npm run prettier:check

TypeScript

# Check TypeScript compilation
npm run ts

# Check main process
npm run ts:main

# Check worker processes
npm run ts:workers

---

Project Structure

moreminimore-vibe/
├── Websitebuilder/          # SAAS transformation documents
│   ├── SPECIFICATION.md     # Complete technical specification
│   ├── TASKS.md            # Detailed task breakdown
│   └── QUICKSTART.md       # This file
├── src/
│   ├── app/                # Next.js App Router pages
│   ├── components/         # React components
│   ├── lib/                # Utility functions
│   ├── services/           # Business logic services
│   ├── db/                 # Database schema and queries
│   ├── hooks/              # Custom React hooks
│   ├── types/              # TypeScript type definitions
│   └── styles/             # Global styles
├── drizzle/                # Database migrations
├── public/                 # Static assets
├── tests/                  # Test files
└── package.json            # Project dependencies

---

Important Notes

Removing "dyad" Branding

The original codebase contains "dyad" branding that needs to be replaced with "moreminimore". This will be done in Phase 7.

Removing External Services

The following external services will be removed in Phase 7:

• Supabase
• Neon
• Vercel
• Electron

UI/UX Pro Max Integration

UI/UX Pro Max is an AI skill for design intelligence. It will be integrated in Phase 3.

Easypanel API Details

Easypanel API details will be provided when you're ready to implement Phase 4.

Gitea Integration

Gitea will be used for code backup and version control. You'll need a self-hosted Gitea instance.

---

Getting Help

Documentation

• SPECIFICATION.md - Complete technical specification
• TASKS.md - Detailed task breakdown
• README.md - Original project README

Questions?

If you have questions:

1. Check the documentation first
2. Review the task breakdown
3. Ask for clarification on specific tasks
4. Provide Easypanel API details when ready

---

Next Steps

1. ✅ Review all documentation in Websitebuilder/
2. ✅ Set up development environment
3. ✅ Start with Phase 1 tasks
4. ✅ Follow the task breakdown in TASKS.md
5. ✅ Ask for Easypanel API details when ready for Phase 4

---

Progress Tracking

Use the task checklist in TASKS.md to track progress:

• Phase 1: Foundation
• Phase 2: Core Features
• Phase 3: UI/UX Pro Max Integration
• Phase 4: Easypanel Integration
• Phase 5: Gitea Integration
• Phase 6: Billing & Subscription
• Phase 7: Migration & Cleanup
• Phase 8: Testing & Optimization
• Phase 9: Deployment & Launch

---

Document Version: 1.0 Last Updated: January 19, 2026 Author: MoreMinimore Development Team