Home

Cogs 121 - Assignment 1

In this assignment, you will implement a web application that incorporates Facebook and Instagram integration. Social networking sites collect different kinds of social information about their users and this can be used in a variety of ways. For example, Wolfram Alpha can now give facebook users a detailed report on their posts, photos and other activities on facebook. This is done by having the user log-in and give them access permission to use their data. You can try this here: http://www.wolframalpha.com/input/?i=facebook+report (note all the different ways your data from facebook is used by wolfram).

The Assignment

Think of a creative and innovative way to integrate the information you can get from social media into your own NEW application. There is no specific requirement on what type of application you should make; however it has to incorporate both Facebook and Instagram components as listed below.

Facebook: To start Facebook integration, you would need to first register as a developer at https://developers.facebook.com/. This will allow you to create a Facebook application and get access to Facebook user’s information using your application’s “App ID” and “App Secret”. Once users logs into your application using Facebook Authentication (OAuth) and agrees to the necessary permissions, your app will get access to the specific user’s information using the predefined Facebook Graph API Methods (See the links under ‘Useful Resources’ for more details). There are different Node.js libraries that make Facebook integration more accessible and straight-forward: in this assignment we are going to use the FBgraph library which can be found here: https://github.com/criso/fbgraph 

Facebook Requirements:

1. Use Facebook Authentication within your application so the user can log into your web application using their Facebook credentials. In other words, add a “Log-in with Facebook” button in your website that would perform Facebook Authentication.
2. Once the user is logged in, access and display basic information about the user based on your application.
3. Retrieve the user’s posts,likes and use this data to create useful feedback for the users about their habits in the social media. Your application should also be available directly on Facebook, this means that it can be viewed and interacted with from within Facebook. An example of such an application is “postplanner” and can be found here: https://apps.facebook.com/postplanner/
4. Adapt your application for usage within Facebook for example by providing a different styling and look-and-feel. Consider using Cascading Style Sheets (CSS) to do that. Note that both versions should be available and reachable separately.

Instagram: The boilerplate code is already provided for you.

Submission Guidelines: Follow the submission link and choose the assignment number that you are submitting (this is Assignment 1). Enter your PID. If you are working in a team of two, also enter your partner's PID in the spaces provided. Include a link to your heroku application, a link to your github repository, and a link to your standalone application, as well as the facebook-integrated application in the appropriate places in the form. Submit here: TBA

Technologies:

• Facebook Graph-API to access user information
• node.js - http://nodejs.org/
• Site will be hosted on http://heroku.com/

Useful Resources: Facebook Graph API https://developers.facebook.com/docs/graph-api/ https://developers.facebook.com/docs/facebook-login/login-flow-for-web/ https://developers.facebook.com/docs/javascript/quickstart https://developers.facebook.com/docs/graph-api/reference/user/ https://developers.facebook.com/docs/javascript/reference

Here is a list of the basic information that is defaulted to be public on facebook: https://developers.facebook.com/docs/facebook-login/permissions#reference-basic- info For other information, you would need to ask the user’s permission before being able to access it: https://developers.facebook.com/docs/facebook- login/permissions#adding