What is localmockdb?

localmockdb is a lightweight TypeScript library designed for frontend-first development. It allows you to simulate a full REST API (GET, POST, PUT, PATCH, DELETE) without setting up a server or writing any configuration.

Unlike other mock tools that reset on every page refresh, localmockdb automatically persists your data using localStorage or IndexedDB. This means your 'users', 'products', or 'posts' survive page reloads, making it feel like a real database.

// Install it via npm
npm install localmockdb

Quick Start Guide

Getting started is incredibly simple. You just need to import `createAPI` and initialize your mock database. From there, you can start making calls as if you were using fetch or axios.

import { createAPI } from "localmockdb";

const db = createAPI();

// Create a new user
await db.post("/users", { name: "Shrikant" });

// Fetch all users
const response = await db.get("/users");
console.log(response.data);

Using with React and Next.js

localmockdb works seamlessly with modern frameworks. Since it provides a familiar async API, you can use it directly inside your `useEffect` hooks or Server Components (client-side).

// lib/db.ts
import { createAPI } from "localmockdb";
export const db = createAPI();

// components/UserList.tsx
import { useEffect, useState } from "react";
import { db } from "../lib/db";

export default function UserList() {
  const [users, setUsers] = useState([]);

  useEffect(() => {
    const loadData = async () => {
      const res = await db.get("/users");
      if (res.success) setUsers(res.data);
    };
    loadData();
  }, []);

  return (
    <ul>
      {users.map(u => <li key={u.id}>{u.name}</li>)}
    </ul>
  );
}

Advanced Features: Pagination & Auto-Timestamps

One of the best parts of localmockdb is that it handles the 'boring' stuff for you. Every entry automatically gets a UUID and `createdAt`/`updatedAt` timestamps.

It also supports pagination out of the box using query parameters, which is perfect for testing your UI's loading states and list views.

// Get second page with 10 items per page
await db.get("/posts?page=2&limit=10");

// Update a specific record
await db.patch("/posts/uuid-here", { title: "Updated Title" });

Why should you use it?

1. Build and test UI independently: No more waiting for the backend team.

2. Simulate real REST APIs: Use familiar methods like GET, POST, PUT, PATCH, DELETE.

3. Zero configuration: No JSON files, no servers, no environment setup.

4. Drop-in replacement: Easily switch to real APIs when the backend is ready.