Simulating HTTP responses

Hello!, this is my first post here on dev.to. I am never publishing my codes because is a specific process, it is just for the company or a bit impostor syndrome. But today are different, so let’s do it!.

First I need to say that as a software developer, I feel super proactive, I am curious to automatize processes in my work, a few lines of codes that are working for you, and are allowing to focus on the most important stuff. For that, I was thinking that a lot of times, I have used scripts or some services to simulate real data coming from the API. This is a super common case when the developer wants to make an example closer to a real use case.
Normally, when you are working in a frontend, the ideal situation, you should have the contract response with your backend team, for example, a list of items, but, sometimes it is not like this, and the frontend team is affected. Or you need to work in a POC, and you are losing time creating the fake files to emulate the API response. To create it, there are a lot of solutions, but I think the most important to highlight is fakerjs and randomuser.me, super useful projects.

Inspired on these tools, I made a merge in a tool named randomdata.loremapi.io. With randomdata, you can create fake data with the structure schema as you want and paginated as for example, let’s imagine a list of users with the following model:

{
  fullname: string;
  age: number;
  picture: string;
  mobilePhone: string;
  homePhone: string;
}

And you want a list of 50 users, something like:

{
  data: [
    {
      fullname: "...",
      age: "...",
      picture: "...",
      mobilePhone: "...",
      homePhone: "...",
    },
    // ... and 49 more
  ],
}

So, for that let’s go to https://randomdata.loremapi.io to create this response easily. Once you are on the page, scroll down to the “Random data editor” section and create a schema...

...when you think that the schema is ready, click on the “view data response” button to see the response...

After the editor, you have some snippets examples of how to call this schema.

The benefits are you don’t need locals files as users.js and lose your time creating fake data, just con focus on the UI.

If you want to follow more examples, visit this codesandbox demo: https://ssily.codesandbox.io/. Here you will find a list of users with full name, year and picture: all in one page, paginate like ?page=X or paginated by offset and limit like ?offset=X&limit=X

This tool is an extract of the principal project. At the moment it is totally free until we have done the pending features, but don’t be afraid, the price will be low.

Thanks for your time to read this, I hope it can be useful to you. Feedback is welcome, ping me on my twitter https://twitter.com/dimaslz or here in comments.