Creating Demo APIs Without Code Using Microsoft Flow

I build a lot of demos. As someone who tries to learn and speak about emerging web standards, I spend a lot of time building random, little, useless apps (sometimes full of silly movie references). The next app I had kicked around building is a basic mileage tracker PWA which would track start/stop latitude and longitude and a few other items, and push them up to a server. This would be a good app to demonstrate offline capabilities, and would actually be useful to me.

Most interesting web demos require a server of some sort, and I’ve gotten pretty good at writing bad Express applications quickly. But that’s a lot of work that’s tangential to the demo I’m trying to build. I cut corners and definitely don’t build enterprise RESTful APIs for these things, but I’d rather not build any API at all or worry about hosting.

Here comes Edge Summit

While I was at the Microsoft Edge Summit last week, I had a lightbulb moment. I had spent much of the Summit thinking about PWAs and almost no time thinking about anything on servers. I needed to build the mileage PWA app, and while doing so it was finally time to skip the server.

The rest of this blog post deals with building a RESTful API using Microsoft Flow. I’ve got a post or two in the works about PWAs, but this isn’t one of them.

Side note: Edge Summit was awesome and you should try to attend or stream it next year! This year’s videos are on Channel 9.

Another side note: I love the Edge Summit logo. Whoever created it did a great job.

A third side note: Thank you to the Edge team for inviting me to the Summit and continuing to be an awesome team to work with as a Microsoft MVP.

Microsoft Flow

At HMB we’ve been using Microsoft Flow quite a bit for business automation. It’s sort of like Microsoft’s version of IFTT, and it has great integrations with all sorts of other MS products as you’d expect. I feel less weird giving Flow access to my One Drive than other apps since they already have it, and it just works which is nice.

Flow supports a bunch of useful things that can be pretty advanced, but it also supports basic HTTP requests and responses. Those sound suspiciously like RESTful endpoints.

Flow allows you to create a Request endpoint based on a JSON Schema, which is pretty powerful. However, JSON Schema can be a little weird and complicated so they created a shortcut. You can simply copy/paste in a JSON object, and it will back into a relevant schema for you. This is an awesome user experience and one worth stealing copying if you build this sort of tool.

{
    "reason": "Test",
    "dateTime": "2017-09-17T19:49:45.326Z",
    "startLocation": {
        "latitude": 40.1262,
        "longitude": -82.9291
    },
    "stopLocation": {
        "latitude": 39.9612,
        "longitude": -82.9988
    }
}

It ended up generating a nice JSON Schema for me, and we were ready to go.

Bing Integration

Because I’m building a mileage app, the next thing I wanted to accomplish was to lookup the driving directions between the two locations to find the mileage. This was as easy as adding another step to my Flow and choosing a “Get route” action from Bing.

There was a little confusion becaues it listed “latitude” and “longitude” twice without giving any context about their location in the JSON, but I assumed (correctly) that the first choice in each list was the first one in the document. So this just worked.

I specified that I wanted driving directions in miles, and set each waypoint to be equal to “latitude, longitude”. That’s really it.

Saving Data to One Drive

Finally, I needed to dump this data somewhere. I decided to create a spreadsheet on One Drive to use since Flow integrates easily there.

This took a little bit of work. You need to attach Flow to your One Drive account by logging into Office 365. Also, you need to creat an Excel spreadsheet with (this is important) a named table with appropriate column headers.

Flow read the POST and created parameters for each column. I then added the relevant data types from the Request object and the Bing response to the correct fields. It took a minute or two for the new spreadsheet on One Drive to show up in Flow but then we were up and running.

Magic

That’s it, and it just works. I’ve used Postman to send multiple requests over, and within a few seconds I have a new entry in my spreadsheet with the mileage.

This isn’t a production ready system. There’s no security and I wouldn’t try to scale it to 10 million users. Flow has a limited number of requests before you have to pay although the costs are reasonable after that. All that said though, for building demos, Flow is every bit as awesome as it is for building business automation.

Now I should probably get back to PWAs!