• 

  Sign-in Screen

• 

  Create project screen

• 

  create response screen

• 

  import mock api screen

• 

  mock api dashboard

• 

  request logs

API Builder

Inspiration

As a developer, working on the frontend without any structured data is tiresome. We tweak different parts of the project just to make sure everything works fine, but when we feed actual data, things start to break. That's why we built API Builder, a tool that can provide us with actual data for our applications.

What it does

API Builder is a browser-based API mocking platform for creating and hosting mock REST APIs without writing backend code.

Users can:

• Sign in with GitHub and manage private mock API projects.
• Create endpoints using GET, POST, PUT, PATCH, and DELETE.
• Configure any HTTP status code from 100 to 599.
• Create multiple response variants and manage them instantly.
• Simulate network delays.
• Use dynamic placeholders such as route parameters and query parameters.
• Organize endpoints into collections and save response templates.
• Import and export complete projects as JSON configurations.
• Inspect logs to verify incoming requests.

How we built it

API Builder is built as a full-stack TypeScript application.

We used Next.js, Tailwind CSS, and shadcn/ui for the user interface, and TypeScript throughout the project for type safety. We used Better Auth for authentication and Hono for lightweight APIs, alongside Drizzle ORM and Neon PostgreSQL for database handling, and Zod to validate runtime requests.

We used Codex and GPT-5.6 to decide the architecture of our application, plan the features, their implementation order, and scaffold the project structure, while I handled the minor fixes and reordered our tasks.

Challenges we ran into

The biggest problem we ran into was keeping the REST API design engine clean and customizable while ensuring it behaved like a real API.

We also had several architectural problems:

• Designing immutable public project IDs that prevent URL collisions.
• Handling multiple response variants while allowing one active version per endpoint.
• Simulating real API behavior with configurable status codes, headers, and delays.
• Building an interface that is easy to navigate without overwhelming users.

Accomplishments that we're proud of

We have built something that solves a real headache for frontend developers when creating interfaces.

Some highlights include:

• A browser-based API mocking platform without backend coding being required.
• Public mock API endpoints that can be consumed by any application.
• Response variants that make testing different scenarios (success, not found) effortless.
• Import and export functionality for sharing API projects.
• Request logging.

What we learned

Building API Builder taught me the importance of structural decisions.

I gained experience in:

• Designing scalable database schemas.
• Creating and abstracting reusable code.
• Implementing and maintaining secure authentication and authorization.
• Thinking about performance, security, and maintainability.

What's next for API Builder

This project establishes a strong foundation for future ideas such as:

• GraphQL mocking support.
• WebSocket and Server-Sent Events support.
• OpenAPI documentation.
• Team workspaces and collaboration support.
• Many more.

My goal is to make API Builder the go-to platform for creating and testing APIs before actual development.

Built With

• better-auth
• codex
• drizzle
• gpt-5.6
• neon
• nextjs
• postgresql
• shadcn/ui
• tailwindcss
• zod