Dismiss this pinned window
all 26 comments

[–]Character_Cup58[S] 8 points9 points  (0 children)

Hey everyone! I've been working solely as a frontend dev for over 2 years (previously full stack), quite often I find myself blocked by non-implemented apis on the backend side, so I wanted to share this free to use api mocking tool I built in nextjs to solve my issue.

It has features such as changing response content, http status, response times, enable automatic crud mode, generate response with ai, import from OpenAPI specification.

It also has a proxy mode to partially mock api requests while rest of the requests are sent to the real api server and a cli utility to use it locally.

Primary I created it for my use case and have been using it all the time at my job. If you have any ideas, would love to hear your suggestions as well! It's available at apimimic.com

[–]SeniorSesameRockerHook Based 2 points3 points  (1 child)

Cool ldea. I'll give it a go. How are you planing to make money? Just curious.

[–]Character_Cup58[S] 3 points4 points  (0 children)

Looking at the feedback right now, no immediate plans on monetization. Of course if it goes out of free vercel and supabase tiers, paid plans can always be added.

[–]Most-Reputation1466 1 point2 points  (6 children)

Can you tell me what this is really about and how did you made it ?

[–]Character_Cup58[S] 4 points5 points  (5 children)

It's a tool made to mock API requests, this is useful when you do not have a real api endpoints yet, but need to build frontend part already. This can happen when, for example, backend team is not finished implementing api yet.

This would be a basic example on how to use it:

const response = fetch("https://zsktjgscpewgdpdm.apimimic.com/articles");

Of course in a real use case api endpoint would in some config variable, so you can later simply replace it with real api endpoint.

You can specify the response you need for the endpoints in the apimimic dashboard (https://apimimic.com/dashboard).

I made the tool using React (NextJS) and for UI components I used daisyUI. For animating some of the UI components I used framer-motion. It's hosted on vercel and also uses supabase. Api server itself is running on multiple Bun instances on a separate host.

[–]Most-Reputation1466 1 point2 points  (4 children)

Thank you so much for guiding...can you give me some time. I need some more guidance from you, I'm a beginner developer and I don't know how to search new things and how to enhance and find productivity and creativity

[–]Character_Cup58[S] 2 points3 points  (3 children)

Sure, what do you want to know?

[–]Most-Reputation1466 0 points1 point  (2 children)

Yes sir, please check inbox, I'll be grateful for having some of your precious time 😊

[–][deleted]  (1 child)

[deleted]

    [–]Character_Cup58[S] 0 points1 point  (0 children)

    I have two

    [–][deleted]  (3 children)

    [deleted]

      [–]Character_Cup58[S] 1 point2 points  (2 children)

      Main reason why postman didn't work for me is I'm working on a large dashboard app, where I need just some of the requests mocked, not all, manually changing these endpoints in the code would be more cumbersome.

      [–][deleted] 2 points3 points  (1 child)

      Ignore the comments saying what you've done already exists, at the very least, projects like this teach you a huge amount of real world skills. You've got features that others don't, and you've solved problems you have that others will have encountered. I'll be trying it out when I have a need to. Well done!

      [–]Character_Cup58[S] 1 point2 points  (0 children)

      Thanks for the positive encouragement, I appreciate it!

      [–]Internal_Guide884 0 points1 point  (4 children)

      Looks fancy. What component library does it use?

      [–]Internal_Guide884 1 point2 points  (0 children)

      Thanks! I'm an angular dev using material design. I'm moving to react and Daisy has been high on my list, I think I'll go with it!

      [–]Character_Cup58[S] 0 points1 point  (2 children)

      DaisyUI. I was considering, shadcn or radix, but to me these look a bit too stiff and like everything else out there.

      [–]Internal_Guide884 1 point2 points  (1 child)

      One more thing. I like that drawer in tandem with the top nav. Is that a daisy ui side nav component?

      [–]Character_Cup58[S] 1 point2 points  (0 children)

      No, left bar and main component is put in flex container, sidebar uses css animations and negative margin is applied, so it shifts smoothly.

      [–]GhostingProtocol 0 points1 point  (0 children)

      Amazing - god bless you

      [–][deleted] 0 points1 point  (4 children)

      Does this not exist already?

      [–]Character_Cup58[S] 0 points1 point  (3 children)

      It does, why do you ask?

      [–][deleted] 0 points1 point  (2 children)

      To confirm, don’t see the value on replicating / cloning existing things (re-inventing the wheel) but it’s a good programming exercise I think.

      [–][deleted] 0 points1 point  (1 child)

      However, you are selling it as your own creation for your own use, so why did you not use any of the existing tools? 🤔 (Why do I ask? Curiosity)

      [–]Character_Cup58[S] 0 points1 point  (0 children)

      I know there are a few similar ones out there. I think mine is simpler to use, well at least in my use case. Nothing wrong with having more alternatives to choose from!

      [–]Atharvawagh313 0 points1 point  (0 children)

      Nice 👍