So I built a free online API builder with CORS support 🚀 (and why another Postman alternative)
Tags: react, javascript, webdev, showdev
Published: 2019-08-28 18:37:53

# TL;DR

Use [getd.io/](https://getd.io/) to test APIs with only your browser - No app or plug-in needed. Supports CORS requests too 🔥!

Here is a screenshot for desktop:

![Desktop UI](https://thepracticaldev.s3.amazonaws.com/i/s1xlaq7drtxygbdctugp.png)

And here is the updated mobile responsive UI (thanks to @maybebored for making the suggestion):

![Mobile UI](https://thepracticaldev.s3.amazonaws.com/i/qjzgyo8ucuo100edbqu3.png)

# Why another Postman alternative?

Most Postman alternatives in the market today (including Postman) require downloading a platform-specific client app, or installing a Chrome plug-in. This is needed to provide full request support such as CORS. However, this approach has a few cons:
1. Setting up a new dev env requires downloading and installing app again.
2. App needs to be periodically updated / patched.
3. Takes up precious memory on dev machine.
4. Not all platforms are supported.

Inspired by [Postwoman](https://liyasthomas.github.io/postwoman/), I fell in love with the idea of a web-based API tester. However, Postwoman doesn't support CORS requests.

*Btw if you aren't sure what CORS is, scroll to bottom.*

# Introducing [getd.io/](https://getd.io/)🚀🚀🚀

[getd.io/](https://getd.io/) aims to build a 100% pure web-based solution that supports all kinds of API servers, while providing a modern, fluid, dark-themed UI 😎 that are familiar to existing Postman users.

[getd.io/](https://getd.io/) provides two modes:
- ☁️ Cloud mode: the request is forwarded to the back-end to be executed by node.js, and response returned to be displayed to the users. This mode works with all request types, e.g., CORS. The website is protected by TLS so your request info is safe on the wire.
- 💻 Browser mode: the request is sent using fetch() from local browser. This doesn't work with APIs that disallow CORS.

**Note:** if you are developing a local/private API server, you can only use browser mode because my cloud server doesn't have access to your private server. Since browser mode doesn't work with CORS, you will have to enable CORS for your private server to use [getd.io](https://getd.io). It's a two-line change and you can remove it before your server goes public.

```javascript
import cors from "cors";
app.use(cors());
```

# Cloud Mode

Currently I'm using a personal dev server to support the back-end requests. If a request gets a large response (e.g., a file download) the response will be terminated after exceeding certain limit. This helps reduce my Internet cost :) [❤️ Support me in Patreon](https://www.patreon.com/getd) if you'd like to keep this free service running and even better, get access to advanced features with no request limits.

# Features / Roadmap

| Feature   | Support |
| --------- | ------- |
| Local Request History and Search      | ✔ |
| Local Persistent Workspace state   | ✔ |
| Permlink to share entire request with others      | ✔ |
| Request Params    | ✔ |
| Request Headers | ✔ |
| Request Body (JSON editor, text)      | ✔ |
| Request Form (form-data, x-www-form-urlencoded)      | ✔ |
| Response Header, Body, JSON / Html prettier      | ✔ |
| Mobile Responsive  | ✔ |
| Local Multi-workspace Support  |  |
| Save Workspace to Cloud  |  |
| Save History to Cloud  |  |
| Websocket Support  |  |
| GraphQL Support  |  |
| ... and more!  |  |

# Nice! What's next?

1. Head over to [getd.io/](https://getd.io/) and start poking around!
2. Follow [twitter](https://twitter.com/getd_io) to get updates.
3. Join [Slack](https://join.slack.com/t/getd/shared_invite/enQtNzM3NDU3NjkyNTMzLTE4YWVhMTFkNzE2NTM3NzhjYTk0MWQ1ODBkMjRlNTc1MmY3ZjBmOTdhNzY0Mzk5NzRmYTQ4MDdlMGQ5MjNmNjA) or [Discord](https://discord.gg/4hmXCaT) to provide feedbacks or join discussions.
4. Support this free service in [Patreon](https://www.patreon.com/getd)❤️ 
5. Leave a comment below to provide some feedbacks. I love feedbacks!

# WTF is CORS?

Sorry I keep saying 'CORS'. You can read more [here](https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS) but the basic idea is that browser doesn't allow website A (which is loaded in the browser) to send API requests to website B, unless B explicitly says 'A is allowed' or 'Anyone is allowed, I don't care' in response header. This is a restriction enforced by the browser. That's why tools like Postman create their own client apps to work around it. A sample error looks like below:

![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/l42lh4gvjuhwa4djbh8l.png)