Project V: Small World

Back to the app!

This Small World

Small World is a web appication written entirely by Jordan Smith. The application uses Instagram's API to update users' photos to the site in real time which were added by the use of certain hashtags in their caption. The application follows hastags that are associated with different colleges in America. These photos are generated only by those who have public Instagram acounts.

How to use the app?

  • Watch each college's personality as photos come streaming in
  • Click the 'flip' button to flip the picture and see the caption associated with the photo
  • Change college streams by choosing a different college using the drop down menu at the top of the page

How to see my photo?

  • Ensure that your Instagram account is publicly accessible
  • Take a photo
  • Upload it to Instagram using the hashtag pertaining to your college
  • Watch the feed of your college instantly update with your photo

What about the tech stuff?

I'm glad you're here to peak under the hood. You can take a look at the source code of this project on github

This is application was inspired by This Is Now! made by Lexical Gap and lollagram made by Michael Landcaster. Likewise small world was built using Node.js on Express. For communication between the server and the client, Small World uses which is a powerful node library that uses websockets. Finally to help out with the complication of Instagram's API, the module "instagram-node-lib" was used. On the first run of the node server, the app subscribes to the hashtags for each college. Instagram notifies the app each time there is a new post. The server then polls instagram for the json object of the new post. The connection between the client and the server is then used to send the object to the browser. A great deal of templating is done and the picture is displayed to the client. When the user picks a new feed, the page is wiped and the most recent photos from the new feed are displayed while it listens for new ones to come in. To fish through the specifics please check out my github for the source code!