The now deprecated Instagram API was one of my favourite APIs to use. It was well documented, simple to use and provided some great data. It’s unfortunate that they decided to stop its usage, but I understand that companies need to protect their data as it’s often their most valuable asset.

I recently found out though that Instagram provides a public feed of users recent posts. So I thought I’d look at creating something with it.

As there isn’t any server side processing that is essential I decided to use a frontend framework to build it out. I went for Vue.js having used it for some Laravel work and find there are also plenty of good resources available for the framework.

I think using Vue gives the SPA a nice snappy feel and the lack of page reload when submitting the form helps engage the user.

Having heard lots of good things about Tailwind CSS I wanted to give that a try. It took a little bit of time to get used to the abbreviated syntax but once I started to get my head around it I found there are lots of useful features. I particularly like the media queries for each element. Again there are some very good resources out there, especially Tailwind Components.

Finally I added Animate on Scroll library to add some visual interest when the user scrolls through the feed.

Rather than just dump out the feed I also separated out the most recent, most like and most commented on posts and finished up by showing the remaining posts.

You can try it out at https://recentgram.ianluckraft.co.uk/