so you want to build a facebook app

74
So you want to build a Facebook app Facebook Developer Garage Kuala Lumpur Kamal Fariz, RSB

Upload: kamalfariz

Post on 19-Jan-2015

7.210 views

Category:

Technology


0 download

DESCRIPTION

Here's my 50-foot view of building a Facebook application on Rails. Rails itself is not part of the presentation - you can check out one of my available slides for that. Target: non-techies and people who just want to find out the Facebook API architecture. I wished I could've put more content, like y'know, ACTUAL CODE???

TRANSCRIPT

Page 1: So you want to build a Facebook app

So you want to builda Facebook appFacebook Developer Garage Kuala Lumpur

Kamal Fariz, RSB

Page 2: So you want to build a Facebook app

Basic Ingredients

Page 4: So you want to build a Facebook app

Ruby on Rails

Page 5: So you want to build a Facebook app

rfacebook gem

Page 6: So you want to build a Facebook app

STEP 1

Setup a new application

Page 7: So you want to build a Facebook app
Page 8: So you want to build a Facebook app
Page 9: So you want to build a Facebook app
Page 10: So you want to build a Facebook app
Page 11: So you want to build a Facebook app
Page 12: So you want to build a Facebook app
Page 13: So you want to build a Facebook app
Page 14: So you want to build a Facebook app
Page 15: So you want to build a Facebook app
Page 16: So you want to build a Facebook app
Page 17: So you want to build a Facebook app
Page 18: So you want to build a Facebook app

STEP 2

Create a Rails app

Page 19: So you want to build a Facebook app

A full-stack framework for developing database-backed web applications according to the Model-View-Controller pattern.

Page 20: So you want to build a Facebook app

A full-stack framework for

developing database-backed

web applications according

to the Model-View-Controller

pattern.

A bunch of stuff that makes web developers

happy!

- David Heinemeier Hansson http://flickr.com/photos/pragdave/174964316/

Page 21: So you want to build a Facebook app

MacBook-Pro:~ kamal$ rails super_gifts

Page 22: So you want to build a Facebook app

MacBook-Pro:~ kamal$ rails super_gifts create create app/controllers create app/controllers/application.rb create app/helpers/application_helper.rb create test/test_helper.rb create config/database.yml create config/routes.rb ... create public/images/rails.png create public/javascripts/prototype.js create public/javascripts/effects.js create public/javascripts/dragdrop.js create public/javascripts/controls.js create public/javascripts/application.js create doc/README_FOR_APP create log/server.log create log/production.log create log/development.log create log/test.logMacBook-Pro:~ kamal$

Page 23: So you want to build a Facebook app

MacBook-Pro:~ kamal$ gem install rfacebook

Page 24: So you want to build a Facebook app

MacBook-Pro:~ kamal$ gem install rfacebookSuccessfully installed rfacebook-0.9.81 gem installedInstalling ri documentation for rfacebook-0.9.8...Installing RDoc documentation for rfacebook-0.9.8...MacBook-Pro:~ kamal$

Page 25: So you want to build a Facebook app

MacBook-Pro:~ kamal$ gem install rfacebookSuccessfully installed rfacebook-0.9.81 gem installedInstalling ri documentation for rfacebook-0.9.8...Installing RDoc documentation for rfacebook-0.9.8...MacBook-Pro:~ kamal$ cd super_gifts/

Page 26: So you want to build a Facebook app

MacBook-Pro:~ kamal$ gem install rfacebookSuccessfully installed rfacebook-0.9.81 gem installedInstalling ri documentation for rfacebook-0.9.8...Installing RDoc documentation for rfacebook-0.9.8...MacBook-Pro:~ kamal$ cd super_gifts/MacBook-Pro:super_gifts kamal$

Page 27: So you want to build a Facebook app

MacBook-Pro:~ kamal$ gem install rfacebookSuccessfully installed rfacebook-0.9.81 gem installedInstalling ri documentation for rfacebook-0.9.8...Installing RDoc documentation for rfacebook-0.9.8...MacBook-Pro:~ kamal$ cd super_gifts/MacBook-Pro:super_gifts kamal$ ./script/plugin install \

Page 28: So you want to build a Facebook app

MacBook-Pro:~ kamal$ gem install rfacebookSuccessfully installed rfacebook-0.9.81 gem installedInstalling ri documentation for rfacebook-0.9.8...Installing RDoc documentation for rfacebook-0.9.8...MacBook-Pro:~ kamal$ cd super_gifts/MacBook-Pro:super_gifts kamal$ ./script/plugin install \http://rfacebook.rubyforge.org/svn/trunk/rfacebook/

Page 29: So you want to build a Facebook app

MacBook-Pro:~ kamal$ gem install rfacebookSuccessfully installed rfacebook-0.9.81 gem installedInstalling ri documentation for rfacebook-0.9.8...Installing RDoc documentation for rfacebook-0.9.8...MacBook-Pro:~ kamal$ cd super_gifts/MacBook-Pro:super_gifts kamal$ ./script/plugin install \http://rfacebook.rubyforge.org/svn/trunk/rfacebook/+ ./README+ ./Rakefile+ ./lib/facebook_desktop_session.rb+ ./lib/facebook_session.rb+ ./lib/facebook_web_session.rb...+ ./test/facebook_web_session_test.rb+ ./test/test_helper.rbMacBook-Pro:super_gifts kamal$

Page 30: So you want to build a Facebook app

MacBook-Pro:super_gifts kamal$ rake facebook:setup

Page 31: So you want to build a Facebook app

MacBook-Pro:super_gifts kamal$ rake facebook:setup(in /Users/kamal/super_gifts)======================================================Setting up RFacebook on Rails Plugin [1] Created config/facebook.yml <-- BE SURE TO CHANGE THE API KEY AND SECRETDone.======================================================MacBook-Pro:super_gifts kamal$

Page 32: So you want to build a Facebook app

development: key: YOUR_API_KEY_HERE secret: YOUR_API_SECRET_HERE canvas_path: /yourAppName/ callback_path: /path/to/your/callback/ tunnel: username: yourLoginName host: www.yourexternaldomain.com port: 1234 local_port: 5678

config/facebook.yml

Page 33: So you want to build a Facebook app
Page 34: So you want to build a Facebook app
Page 35: So you want to build a Facebook app

development: key: c6578c8b63873881caad22fccfe2715b secret: 6b3f1f580409cd487f431e22923f00ad canvas_path: /super_gifts/ callback_path: / tunnel: username: kamal host: deploy.ror.com.my port: 8080 local_port: 3000

config/facebook.yml

Page 36: So you want to build a Facebook app

MacBook-Pro:super_gifts kamal$ rake facebook:tunnel:start

Page 37: So you want to build a Facebook app

MacBook-Pro:super_gifts kamal$ rake facebook:tunnel:start(in /Users/kamal/super_gifts)======================================================Tunneling deploy.ror.com.my:8080 to 0.0.0.0:3000

NOTES:* ensure that you have Rails running on your local machine at port 3000* once logged in to the tunnel, you can visit http://deploy.ror.com.my:8080 to view your site* use ctrl-c to quit the tunnel* if you have problems creating the tunnel, you may need to add the following to /etc/ssh/sshd_config on your server:

GatewayPorts clientspecified

* if you have problems with deploy.ror.com.my timing out your ssh connection, add the following lines to your '~/.ssh/config' file:

Host deploy.ror.com.my ServerAliveInterval 120

======================================================

Page 38: So you want to build a Facebook app

MacBook-Pro:super_gifts kamal$ ./script/server => Booting WEBrick...=> Rails application started on http://0.0.0.0:3000=> Ctrl-C to shutdown server; call with --help for options[2008-03-14 16:38:07] INFO WEBrick 1.3.1[2008-03-14 16:38:07] INFO ruby 1.8.6 (2007-09-23) [i686-darwin9.0.0][2008-03-14 16:38:07] INFO WEBrick::HTTPServer#start: pid=68088 port=3000

Page 39: So you want to build a Facebook app

What happens when you access an app?

Page 41: So you want to build a Facebook app
Page 42: So you want to build a Facebook app
Page 43: So you want to build a Facebook app

MacBook-Pro:super_gifts kamal$ ./script/server => Booting WEBrick...=> Rails application started on http://0.0.0.0:3000=> Ctrl-C to shutdown server; call with --help for options[2008-03-14 16:38:07] INFO WEBrick 1.3.1[2008-03-14 16:38:07] INFO ruby 1.8.6 (2007-09-23) [i686-darwin9.0.0][2008-03-14 16:38:07] INFO WEBrick::HTTPServer#start: pid=68088 port=3000

Page 44: So you want to build a Facebook app

MacBook-Pro:super_gifts kamal$ ./script/server => Booting WEBrick...=> Rails application started on http://0.0.0.0:3000=> Ctrl-C to shutdown server; call with --help for options[2008-03-14 16:38:07] INFO WEBrick 1.3.1[2008-03-14 16:38:07] INFO ruby 1.8.6 (2007-09-23) [i686-darwin9.0.0][2008-03-14 16:38:07] INFO WEBrick::HTTPServer#start: pid=68088 port=3000

Page 45: So you want to build a Facebook app
Page 46: So you want to build a Facebook app
Page 47: So you want to build a Facebook app
Page 48: So you want to build a Facebook app

Making things look right

Page 49: So you want to build a Facebook app

FBML

Page 50: So you want to build a Facebook app

<fb:name uid="508258787" /> => you

Page 51: So you want to build a Facebook app

<fb:name uid="508258787" /> => you<fb:name uid="508258787" capitalize="true" /> => You

Page 52: So you want to build a Facebook app

<fb:name uid="508258787" /> => you<fb:name uid="508258787" capitalize="true" /> => You<fb:name uid="508258787" possessive="true" /> => Your

Page 53: So you want to build a Facebook app

<fb:name uid="508258787" /> => you<fb:name uid="508258787" capitalize="true" /> => You<fb:name uid="508258787" possessive="true" /> => Your<fb:name uid="508258787" reflexive="true" /> => Yourself

Page 54: So you want to build a Facebook app

<fb:name uid="508258787" /> => you<fb:name uid="508258787" capitalize="true" /> => You<fb:name uid="508258787" possessive="true" /> => Your<fb:name uid="508258787" reflexive="true" /> => Yourself<fb:name uid="508258787" useyou="false" /> => Kamal Fariz Mahyuddin

Page 55: So you want to build a Facebook app

<fb:name uid="508258787" /> => you<fb:name uid="508258787" capitalize="true" /> => You<fb:name uid="508258787" possessive="true" /> => Your<fb:name uid="508258787" reflexive="true" /> => Yourself<fb:name uid="508258787" useyou="false" /> => Kamal Fariz Mahyuddin <fb:name uid="510442171" /> => Daniel CerVentus

Page 56: So you want to build a Facebook app

<fb:name uid="508258787" /> => you<fb:name uid="508258787" capitalize="true" /> => You<fb:name uid="508258787" possessive="true" /> => Your<fb:name uid="508258787" reflexive="true" /> => Yourself<fb:name uid="508258787" useyou="false" /> => Kamal Fariz Mahyuddin <fb:name uid="510442171" /> => Daniel CerVentus<fb:name uid="510442171" firstnameonly="true" /> => Daniel

Page 57: So you want to build a Facebook app

<fb:user-table cols="3"> <fb:user-item uid="508258787" /> <fb:user-item uid="510442171" /> <fb:user-item uid="780410586" /> <fb:user-item uid="544248752" /> <fb:user-item uid="543101914" /></fb:user-table>

Page 58: So you want to build a Facebook app

<fb:comments xid="super_gift_comments" canpost="true" returnurl="http://apps.facebook.com/super_gifts"> <fb:title>The Wall</fb:title></fb:comments>

Page 59: So you want to build a Facebook app

FBML Test Consolehttp://developers.facebook.com/tools.php?fbml

Page 60: So you want to build a Facebook app

Making things act right

Page 61: So you want to build a Facebook app

API

Page 62: So you want to build a Facebook app

fbsession.friends_get

<?xml version="1.0" encoding="UTF-8"?><friends_get_response ... list="true"> <uid>400156</uid> <uid>1906543</uid> <uid>5404778</uid> <uid>8602139</uid> ... <uid>5404778</uid> <uid>8602139</uid></friends_get_response>

Page 63: So you want to build a Facebook app

fbsession.notifications_send(:to_ids => ['400156', '1906543'], :notification => message)

Page 64: So you want to build a Facebook app

API Test Consolehttp://developers.facebook.com/tools.php?api

Page 65: So you want to build a Facebook app

STEP 3

PROFIT!!!111!!!1!!

Page 66: So you want to build a Facebook app

Resources

Page 67: So you want to build a Facebook app

Hosting - Joyent Accelerator for Facebook Developershttp://www.joyent.com/developers/facebook/

Facebook Developers Wikihttp://wiki.developers.facebook.com/

FBML Test Consolehttp://developers.facebook.com/tools.php?fbml

API Test Consolehttp://developers.facebook.com/tools.php?api

Ruby on Railshttp://www.rubyonrails.org/

rfacebookhttp://rfacebook.rubyforge.org/

facebookerhttp://facebooker.rubyforge.org/

Page 68: So you want to build a Facebook app
Page 69: So you want to build a Facebook app
Page 70: So you want to build a Facebook app

Malaysia.rbMalaysia Ruby Brigade

Page 71: So you want to build a Facebook app

106 people in Google Groups53 people in Facebook Group

Page 72: So you want to build a Facebook app

Meets every third Thursday of the month

Page 73: So you want to build a Facebook app

Malaysia.rb 3rd MeetupJuly 2007