Your SlideShare is downloading. ×
0
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Facebook Platform for Developers
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Facebook Platform for Developers

4,981

Published on

Facebook platform for .net Developers …

Facebook platform for .net Developers
@ Web Development Community, Israel, 06.02.2011

for more information: http://www.lidans.com

0 Comments
3 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
4,981
On Slideshare
0
From Embeds
0
Number of Embeds
4
Actions
Shares
0
Downloads
112
Comments
0
Likes
3
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  1. Facebook development platformFor .net Developers
  2. Photographing Music Startups Entrepreneurship www.lidans.comAbout me Interests Contact
  3. Agenda Introduction to facebook platform Facebook architecture, Platform components Enhancing facebook pages with FBML Using Static FBML Application Facebook for Websites Open Graph Protocol, Social Plugins Facebook apps development With ASP.NET MVC & Social Graph API
  4. Part 1Introduction tofacebook platform
  5. 20 Minutes on facebook... FRIEND LINKS EVENT PHOTOS MESSAGES SHARED REQUESTS INVITES UPLOADED SENT ACCEPTED1,000,000 1,484,000 1,972,000 2,716,000 2,716,000 TAGGED STATUS WALL COMMENTS PHOTOS UPDATES POSTS MADE 1,323,000 1,851,000 1,587,000 10,208,000
  6. 20 Minutes on facebook... 500 GB of data every 20 minutes! ~36 TB/day ~13 PB/year
  7. How to handle such a freakamount of information?open source
  8. facebook infrastructure
  9. facebook infrastructureMore information at:http://developers.facebook.com/opensource
  10. facebook platform- why?More than of facebook users engaged70% with facebook applications every dayMore than facebook users engaged with250M facebook on 2.5M websites every monthMore than facebook users accessing200M facebook through their mobile devices every day
  11. Platform Core Components Social Graph API Facebook Insights Social Plugins Open Graph Protocol
  12. Part 2Enhancing facebook pageswith FBML
  13. Static FBML Application Provides HTML, CSS and JavaScript functionality on facebook pages
  14. What’s needed? Be admin of your facebook page Install Static FBML Application Add FBML Tabs with static content
  15. Before getting started...facebook pages Max width is only 520px You cannot auto run JavaScript in FBML tab Use external CSS6 Tabs maximum file instead of Use FBJS <style> tag
  16. DemoAdding FBML Tab tofacebook page
  17. FBML
  18. FBML>fb:user-agent includes="ie 6, ie 7”> <link rel="stylesheet” href="ie.css” /></fb:user-agent>>fb:swf imgstyle="border-width: 3px; border-color: white;” swfsrc="http://www.youtube.com/v/CfMGFHiTKLY” imgsrc="http://i4.ytimg.com/vi/CfMGFHiTKLY/default.jpg” width="480” height="390” />
  19. FBML>fb:swf imgstyle="border-width: 3px; border-color: white;”>fb:user-agent includes="ie 6, ie 7”> swfsrc="http://www.youtube.com/v/CfMGFHiTKLY” <link rel="stylesheet” href="ie.css” /> imgsrc="http://i4.ytimg.com/vi/CfMGFHiTKLY/default.jpg”FBML Documentation is available at: width="480”</fb:user-agent> height="390” />http://developers.facebook.com/docs/reference/fbmlRemember that FBML is deprecated
  20. Part 3Facebook for Websites
  21. Platform Core Components Open Graph Protocol
  22. A Webpage...
  23. Is a real-world facebook object! Lidan Like Comment Check-in PictureRecommend
  24. What do you LIKE in thereal-world?(Except your smartphone)
  25. Movies
  26. Food
  27. Government
  28. BarGovernment
  29. Public Figure
  30. Actor
  31. What user likes in the real-worldBased off of the most popular categories for Facebook PagesActivitiesBusinesses company, restaurantGroups sports_team, causeOrganizations band, governmentPeople musician, actorPlaces city, countryProducts and Entertainment book, movie, tv_showWebsites website, blog, article
  32. Implementing the Open Graph
  33. Implementing the Open Graph>html xmlns="http://www.w3.org/1999/xhtml”> xmlns="http://www.w3.org/1999/xhtml” <head> xmlns:og=“http://ogp.me/ns#” <title> The Social Network (2010) </title> xmlns:fb="http://www.facebook.com/2008/fbml”> </head> <head> <title> The Social Network (2010) </title> </head> property="og:title” content="The Social Network” /> <meta <meta property="og:type” content="Movie” /> <meta property="og:url” content="http://www.imdb.com/897” /> <meta property="og:image” content="http://www.imdb.com/897/theSocialNetwork.jpg” /></head>
  34. Open Graph Meta-Tagsfb:admins og:street-address og:latitude og:longitudeog:audio og:emailog:video og:phone_number
  35. Open Graph Meta-TagsMore information at: fb:admins og:street-address og:latitude og:longitudehttp://ogp.me og:audio og:email og:video og:phone_number
  36. Platform Core Components Social Plugins
  37. Social Plugins Provides integration between facebook platform and your websiteLet user see what his friends haveliked, commented on or sharedacross the web
  38. Social Plugins Like Button Login Activity Feed Facepile Recommendations Comments Like Box Live Stream
  39. Like Box Enable users to like your facebook page and view its stream directly from your website
  40. Like BoxIFrame<iframesrc="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fplatform&amp;width=292&amp;colorscheme=light&amp;show_faces=true&amp;stream=true&amp;header=true&amp;height=427"scrolling="no"frameborder="0"style="border:none; overflow:hidden; width:292px;height:427px;"allowTransparency="true"></iframe>XFBML<scriptsrc="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like-box href="http://www.facebook.com/platform" width="292"show_faces="true" stream="true" header="true"></fb:like-box>
  41. DemoGenerate code for all of the social plugins at: Like Boxhttp://developers.facebook.com/docs/plugins
  42. Like Button Lets users share pages fromyour site back to their facebook profile with one click
  43. DemoLike Button
  44. Recommendations Gives users personalizedsuggestions for pages on your site they might like
  45. Advanced pluginsSetup a new application at: Create a new facebookhttp://developers.facebook.com/setup application
  46. Comments Lets users comment on any piece of content on your site
  47. DemoComments
  48. Live Stream Lets users share activity andcomments in real time, best for real-time events
  49. DemoLive Stream
  50. Login & Registration Allows users to easily sign up for your website with their facebook account
  51. More information at:http://developers.facebook.com/docs/plugins/registration
  52. A Short BreakGood time to update your status
  53. Part 4facebook apps development
  54. TOP Facebook apps (January 2011)98,607,51753,508,02237,187,222346,300
  55. What motivates users to usefacebook apps?too much free time
  56. What makes facebook apps so successful? Social Competitiveness Simple Viral Real time Anytime
  57. Platform Core Components Social Graph API
  58. The Social Graph“Privacy no longer a social norm” - Mark Zuckerberg
  59. The Social Graphhttps://graph.facebook.com/ me/ albums/ comment Profile Pictures notes My Pictures Picture Picture Picture comment
  60. ObjectsUnique ID https://graph.facebook.com/ lidan 698752998{ id: "698752998“, name: "Lidan Hifi“, first_name: "Lidan“, last_name: "Hifi“, link: "http://www.facebook.com/lidan", birthday: "04/27/1988“, location: { id: "113187025363265“, name: "BeEr Sheva`, Hadarom, Israel" }, gender: "male“}
  61. Relationships https://graph.facebook.com/ 698752998 /feed{id: "698752998_187701601241105“,from: { name: "Lidan Hifi“, id: "698752998"}message: " ‫רק הטלפון שלי עם התיקון שגיאות שלו יכול לאחל לאנשים שנה מלאה‬"...‫-,בלוויות במקום שנה מלאה בחוויות‬privacy: { description: "Friends Only; “, value: "CUSTOM“, friends: "ALL_FRIENDS"},type: "status“,created_time: "2011-01-02T13:05:10+0000“,likes: 5}
  62. Relationships https://graph.facebook.com/lidan/friends https://graph.facebook.com/lidan/photos https://graph.facebook.com/lidan/videos https://graph.facebook.com/lidan/likes https://graph.facebook.com/lidan/notes https://graph.facebook.com/lidan/links https://graph.facebook.com/lidan/events https://graph.facebook.com/lidan/groups
  63. AuthenticationOAuth 2.0-based authentication https://graph.facebook.com/me?access_token=2227470867|2.v UgGGAgEL6yF_LEYygniXA__.3600.1296417600698752998|rlW FrcgmkEVVKd7aYi3bKjNZ1gUPermissionsYou must request specific permissions from the userread_stream, publish_stream, user_photos,user_checkins, user_location, offline_access
  64. AuthenticationOAuth 2.0-based authentication https://www.facebook.com/dialog/oauth?client_id=114587458 https://www.facebook.com/dialog/oauth?client_id=114587458 https://graph.facebook.com/me?access_token=2227470867|2.v &redirect_uri=http://www.lidans.com UgGGAgEL6yF_LEYygniXA__.3600.1296417600698752998|rlW &redirect_uri=http://www.lidans.com FrcgmkEVVKd7aYi3bKjNZ1gUPermissionsYou must request specific permissions from the userread_stream, publish_stream, user_photos,user_checkins, user_location, offline_access
  65. PublishingHTTP POST https://graph.facebook.com/18754916/attendingHTTP POST https://graph.facebook.com/lidan/feed { message: ‘Hi, Do you like the graph API?’ }HTTP POST https://graph.facebook.com/lidan/checkins { coordinates: { 32.175876, 34.889177 }, place: 149111711803941, message: ‘playing with the graph API at Microsoft Israel’ }
  66. DeletingHTTP DELETE https://graph.facebook.com/5174466698
  67. Deleting HTTP DELETE https://graph.facebook.com/5174466698More info about Facebook Social Graph:http://graph.facebook.com
  68. How facebook app works 5 Response For application 6 HTML Response userApplication server 3 API Call 4 API 1 User Response Request 2 Request For application
  69. What’s needed?Web Server Facebook ApplicationValid domain or IP (NO localhost) SDK  Application Id  API Key  AppSecret
  70. Facebook applicationsSetup a new application at: Setup a new facebookhttp://www.facebook.com/developers application
  71. Application Settings APP_NAME
  72. Application Pages
  73. facebook Official SDKs FBJS
  74. facebook C#.NET SDKs Facesharp http://facesharp.codeplex.com Facebook C# SDK http://facebooksdk.codeplex.com
  75. DemoCreate facebook applicationwith ASP.NET MVC
  76. Review Facebook platform Facebook pages & Static FBML Facebook for Websites Facebook Applications
  77. More TopicsAdvanced APIsPerformanceFacebook CreditsPromote your application
  78. Related links
  79. Thanks! Questions?

×