Moat Mobile

2015-11-11

Or "The evolution of my web skills"

Moat, for the uninitiated (so, most of you), is my original project to learn how to use APIs. The API I chose was for Voat.co, a reddit competit- sorry, news aggregator that looks an awful lot like another website.

It started off pretty rough -- in fact, you can go preview it here (dead link)

Using pretty much just pure PHP

It... worked, but the UI wasn't really where I wanted it. I was also using the Voat alpha API, which was really slow. I looked ahead, and started working on a version that utilized JavaScript and AJAX, so I could display some sort of loading animation. I also used Bootstrap for it, so that I could scale it better on mobile.

Looks nicer. But functions about the same.

The logical next step was to upgrade the interface, since so far it has been terrible. Again, I wanted to use Bootstrap, and I wanted to make it as mobile friendly as possible. And what's the best way of doing that? By using a material design bootstrap theme. I also used Material Floating Buttonsto give it navigation that made sense. I also made JavaScript do all the formatting work, using the .get() function in jQuery, and using my own server as an API middleman because of AJAX's lack of trust when getting info from other sites (for understandable reasons, but here is how you can bypass it). And here is the final product.

Not too bad.

The FAB requires a bit of tweaking, and I have a bit of functionality to add, but this is the product so far. I doubt I'll touch the styling for quite a while, unless it's to make the UI more material design like.

You can fork the project on the GitHub page if you so please, and be sure to read the FAQ if you want to know what you can help out with.