Thanks to visit codestin.com
Credit goes to github.com

Skip to content

eren1106/mocknica

Repository files navigation

Mocknica Banner

Mocknica

An AI-Powered Open-Source Mock API Server that enables users to self-host, manage, and run mock APIs with ease.

Demo

mocknica.demo.mp4

Try it out at https://mocknica.dev

Why Mocknica?

Stop waiting for backend APIs. Mocknica empowers frontend developers and teams to build and test applications without backend dependencies.

✨ Key Features

  • ⚑ Instant REST Endpoints - Instantly generate REST endpoints you can call from any client
  • πŸ“ Schema-Based Design - Define reusable data schemas and auto-generate complete CRUD endpoints
  • πŸ€– AI-Powered Generation - Generate schemas and endpoints using LLM like GPT, Gemini, or local Ollama models
  • πŸ“¦ Response Wrappers - Customize response structure with reusable wrapper templates
  • πŸ“Š Multi-Project Support - Organize mock APIs by project with isolated endpoints and configurations
  • πŸ” Token Authentication - Secure your mock APIs with Bearer token authentication
  • 🌐 CORS Configuration - Configure allowed origins for browser requests

🎯 Perfect For

Use Case Description
Frontend Development Build UIs before backend APIs are ready
Rapid Prototyping Validate ideas quickly with realistic data
Demo Applications Create compelling demos with realistic scenarios
QA Testing Test edge cases with controlled mock data
API Design Design and iterate on API contracts before implementation

πŸ› οΈ Tech Stack

Mocknica is built with modern and reliable technologies:

Category Technologies
Framework Next.js, React, TypeScript
Styling Tailwind CSS, Shadcn
Data Fetching TanStack Query
Database PostgreSQL, Prisma ORM
Authentication Better Auth, Google OAuth
AI Providers OpenAI, Google Gemini, Ollama
Rate Limiting Redis, Upstash
Monorepo Turborepo, pnpm Workspaces
Testing Vitest
Containerization Docker
CI/CD GitHub Actions
Deployment Vercel

πŸ“ Monorepo Structure

Mocknica uses a Turborepo-powered monorepo architecture for better code organization, shared configurations, and efficient builds with caching.

mocknica/
β”œβ”€β”€ apps/
β”‚   β”œβ”€β”€ dashboard/          # Main Next.js application
β”‚   β”‚   β”œβ”€β”€ app/            # App router pages & API routes
β”‚   β”‚   β”œβ”€β”€ components/     # React components
β”‚   β”‚   β”œβ”€β”€ lib/            # Utilities, services, repositories, auth
β”‚   β”‚   └── prisma/         # Database schema & migrations
β”‚   └── www/                # Landing page / Marketing website
β”œβ”€β”€ packages/
β”‚   β”œβ”€β”€ ui/                 # Shared UI component library
β”‚   β”œβ”€β”€ eslint-config/      # Shared ESLint configurations
β”‚   └── tsconfig/           # Shared TypeScript configurations
β”œβ”€β”€ docker-compose.yml      # Docker orchestration
β”œβ”€β”€ turbo.json              # Turborepo configuration
└── pnpm-workspace.yaml     # pnpm workspace config

πŸš€ Getting Started

Prerequisites

Quick Setup

  1. Clone and install

    git clone https://github.com/eren1106/mocknica.git
    cd mocknica
    pnpm install
  2. Configure environment

    cp apps/dashboard/.env.example apps/dashboard/.env

    Add your database, AI provider, and Redis credentials:

     # Database (required)
     DATABASE_URL="postgresql://postgres:postgres@localhost:5432/mocknica"
    
     # AI Providers (at least one recommended)
     GEMINI_API_KEY="your-gemini-key"          # Free tier available
     OPENAI_API_KEY="sk-..."                   # Optional
     OLLAMA_BASE_URL="http://localhost:11434"  # Optional
    
     # Optional: Rate Limiting (recommended for production)
     REDIS_URL="http://localhost:8079"         # Local via proxy, or Upstash URL
     REDIS_TOKEN="example_token"
  3. Better Auth Setup

    Generate a secure secret for authentication:

    openssl rand -hex 32

    Add the generated secret to your .env file:

    BETTER_AUTH_SECRET=your_generated_secret_here
    BETTER_AUTH_URL="http://localhost:3000"
  4. Google OAuth Setup (Optional - for Google sign-in)

    • Go to Google Cloud Console

    • Create a new project (or select an existing one)

    • Navigate to APIs & Services > OAuth consent screen

      • Configure the consent screen (External or Internal based on your needs)
      • Add your email as a test user during development
    • Navigate to APIs & Services > Credentials

      • Click Create Credentials > OAuth client ID
      • Select Web application as the application type
      • Add authorized redirect URIs:
        • Development: http://localhost:3000/api/auth/callback/google
        • Production: https://your-domain.com/api/auth/callback/google
    • Add the credentials to your .env file:

      GOOGLE_CLIENT_ID=your_client_id
      GOOGLE_CLIENT_SECRET=your_client_secret

    Note: During development, add yourself as a test user in the OAuth consent screen under Test users.

  5. Setup database

    pnpm docker:db
    pnpm db:sync

    For rate limiting, also start Redis and proxy:

    docker-compose up redis serverless-redis-http -d
  6. Start developing

    pnpm dev

    Open http://localhost:3000 to get started.

Docker Alternative

Deploy the complete stack with a single command:

# Start all services (app, database, Redis)
pnpm docker:up

# Sync database
pnpm db:sync

Docker Services

Service Description Port
app Mocknica application 3000
db PostgreSQL database 5432
redis Redis for rate limiting 6379
serverless-redis-http Upstash-compatible proxy 8079

πŸ“‘ Using Your Mock APIs

Once created, your mock APIs are instantly available:

# Get all items
curl http://localhost:3000/api/mock/{project-id}/users

# Get single item
curl http://localhost:3000/api/mock/{project-id}/users/123

# Create item
curl -X POST http://localhost:3000/api/mock/{project-id}/users \
  -H "Content-Type: application/json" \
  -d '{"name": "John Doe", "email": "[email protected]"}'

# With authentication
curl http://localhost:3000/api/mock/{project-id}/users \
  -H "Authorization: Bearer your-project-token"

🀝 Contributing

We welcome contributions! Here's how to get started:

  1. Fork the repository
  2. Create a feature branch: git checkout -b feature/amazing-feature
  3. Make your changes
  4. Run tests: pnpm test
  5. Commit your changes: git commit -m 'Add amazing feature'
  6. Push to the branch: git push origin feature/amazing-feature
  7. Open a Pull Request

Reporting Issues

  • Use GitHub Issues for bug reports
  • Include reproduction steps and environment details
  • Check existing issues before creating new ones

Releases

No releases published

Packages

 
 
 

Languages