Top 5 Cool Things You Can Do On Amock.io
For the benefit of those who don’t know, or haven’t had the pleasure of using amock.io, I’ll start with a brief intro.
Amock.io is basically a free web based, content (REST/SOAP API) mocking service. It was originally developed to help designers, developers or testers, working with external APIs to test their apps independently of the external API, using a mock (that is under their control) that returns same response as expected from the API. However, with time, the service has naturally grown beyond just that.
Here are some of the original reasons you might want to use amock.io.
- The external API you are working with is down or not responding as expected for whatever reason(s).
- You’re being billed/charged per call/request to your external API and you’re running a test on your app that does not require dynamic content from the external API each time.
- You’re running a load test on your app and the external API is not able to keep up.
- You are prototyping an app UI while the back-end is still in development, so you need some mock data to be returned from a mock back-end.
- You just need a reliable web service that returns a specific static response every time it’s called.
The list goes on, but I believe by now you’ve gotten the picture. I’ll now proceed with my top 5 cool things to do on amock.io.
1. Playing Around With APIs (API Fiddler™)
For a system that can mock practically all digital content types, there are many cool things you can create using amockAPIs. Personally, I’ve created quite a number of cool mocks on the platform while playing around with APIs.
Like this one time, I had an idea where everybody mock REST APIs for themselves instead of carrying complementary cards or even a personal ID card. That way, you can just share your REST endpoint with whomever you want and they can GET your details from amock.io in JSON or XML format.
LOL. It’s just an idea, no one said the idea has to make sense. And this is just one illustration for some of the different crazy things amock gives you liberty to try out. And guess what? I went ahead to make that silly API for myself 
HTTP 1.1 GET https://www.amock.io/api/k32yResponse 200 Ok{ “name”: “Okezie Arukwe”, “nick”: “k32y”, “planetOfOrigin”: “Uwa”, “specie”: “nwoke mmadu”, “race”: “human”, “descent”: “african”, “age”: “of ultron”, “occupation”: “hacker”, “personality”: “awesome/amazing”, “skills”: “mad”}
And since I did it from my account, I can always update it anytime as required.
So go ahead now and mock your own id tag on amockor create something much cooler. It’s all up to your imagination.
2. Personal Notepad
What’s better than saving notes on your handheld or desktop device for future reference? I guess that would be saving notes on amock.io and being able to reference them from any web enabled electronic device (doesn’t even have to be yours). Of all the cool stuff I can do on amock, I often find this one very handy.
Saving your notes on amock.io is as easy as creating a new mock on the platform with the following config:
- Content-Type :
text/plain - HTTP Method :
GET - HTTP Response Code :
200 Ok - Endpoint : Choose any endpoint URL you like
- Response Body : Enter your note here…
amock.io also plays well with mobile devices.
To retrieve or access your notes at any time just point your browser to the URL generated by the system when you saved the mock. Remember to save this note from within your amock account after logging in, to avoid your notes expiring after 24 hours.
3. Host A Website’s CSS File
Much like using a CDN without the DN part. Your page’s CSS can be easily served from amock.io’s servers for free. To achieve this, you will have to create a mock with the following config:
- Content-Type :
text/css - HTTP Method :
GET - HTTP Response Code :
200 Ok - Endpoint : Choose any endpoint URL you like
- Response Body : Enter your CSS code here…
Do not include the
<style></style>tags in your CSS mock body.
To use this CSS in your website, all you have to do is add it in the <head> section of your website code with the tag:
<link type=”text/css” rel=”stylesheet” href=”your_generated_mock_url” />
Use the generated CSS mock URL as the hrefattribute for your link tag.
4. Host A Website’s JS Files
Much like what we did with the CSS above, the only difference is, with JavaScript, we set our mock’s content type as application/javascript.
Do not include the
<script></script>tags in your mock body.
To use your amock hosted JavaScript in your website, you will need to include it in your HTML <head> section like so:
<script type=”application/javascript” src=”your_generated_mock_url"></script>
using the generated mock URL as the <script> tag’s src attribute.
5. Free Web Hosting
Now this is getting interesting. The trick to getting this right is making sure the webpage you are mocking is not referencing any files in a directory on your localhost. That means that all linked images, CSS, JavaScript, fonts, and linked html pages must be online. Actually your amockhosted html page can also link to other amockhosted resources, but let’s not get ahead of ourselves (That’s a discussion for another article**).
To mock a webpage you would create your mock with the following config:
- Content-Type :
text/html - HTTP Method :
GET - HTTP Response Code :
200 Ok - Endpoint : Choose any endpoint URL you like
- Response Body :
<Enter your HTML code here…>
You can now visit the generated mock endpoint on a browser and witness the magic!
6. Bonus, Web Apps!
Yes, I know I said Top 5 but this one is just too cool to be left out.
As long as your web app is entirely front end (JavaScript -Angular, React, JQuery, etc), you can totally host it on amock.io as an html mock. Just take a look at this handy mock I whipped up some time ago on https://amock.io/api/k32y/devtools.
https://amock.io/api/k32y/devtools
**How to mock webpages and full websites on amock.io is discussed in more details in this medium article here:
https://medium.com/@k32y/how-to-host-a-free-website-with-amock-io-a676496c2f2e#.frmpp9vpy.
