Updated VS.NET 2010 Facebook Starter Kit
I mentioned previously I’ve created my first Facebook (FB) application (which is still under development) but I’ve learned a lot along the way. I haven’t found the Facebook documentation very useful at all and have gleened a lot through Google, the Facebook developer group and simply tinkering with things. As a result I’ve put together some steps I think could help save you some time if you’re looking to write a Facebook application using ASP.NET and C#. Btw, you’ll get no help from facebook.com regarding ASP.NET development.
One thing that took me awhile was understanding how an FB application appears on your profile page. I eventually realized that FBML can be used to push markup onto a users profile page. This block of markup can be set at the time you create a new application though the first time around, if you’re like me, this may see a bit confusing keep in mind I’m new new to FB itself so a lot of this was confusing. From the FB toolkit you can also use the method setFBML to programmatically set this block of markup. Needless, to say being used to MSDN documentation FB doc leaves a lot to be desired. That said there are a few tools you can use to play with the API as well as sample your FBML markup.
At any rate, here are the steps I followed to get my application working. Note, the project includes support for Microsoft AJAX so you’ll want to have that installed as well although you could just tweak the .aspx and web.config files and use it without AJAX. The screenshot illustrates what you should get when your done. NOTE: In the following steps several links won’t work unless you have an FB account.
UPDATE: I’ve created a new page on my wiki with updated steps and a VS.NET starter kit to make this much easier.
- Sign up for a Facebook account
- Add the Developer application to your account (you need an account for that link to work)
- Click Developer application from the left column and select click Set Up New Application
- Enter the Application Name and expand Optional Fields
- Under Optional Fields
- Set your callback URL http://localhost… will work just fine for development
- Select “Use iframe”
- Click Yes for “Can your application be added on FaceBook”
- Under Installation Options
- Check “Developer Mode”
- Under Site Nav use the same URL from Canvas Page URL (see Optional Fields)
- If you use my template set Edit URL to your Canvas Page URL + /settings
- Click Save then from the Developers Application browse to My Applications
- Click View About Page then click Add Application. This will allow you to easily work with your application during development.
- Download the Facebook Developer Toolkit from Microsoft
- Download my C# ASP.NET app to get you started or generate the boilerplate code for handling login (sorry I don’t do VB.NET)
- You’ll need to add a reference to the Facebook assemby to this project as I didn’t want to include it as it being updated frequently right now
- Open Default.aspx.cs and fill in FACEBOOK_APPKEY and FACEBOOK_SECRET from your application’s page on Facebook.
- Fire up the browser and hit your http://apps.facebook.com/<your_app_name> and you’re off!
Please let me know what problems you have or let me know if these steps need tweaking.
Was this helpful?
[Updated: June 11, 2007] Added link to an update page on my wiki with this content.
[Updated: Feb. 24, 2008] Since this post was written I’ve created two VS.NET starter kits, one for Facebook Dev Toolkit and Facebook.NET. Here are some additional links:
- Visual Studio Starter Kit for Facebook application development
- Facebook application development in ASP.NET
- VS.NET starter kit for Nikhil Kothari’s Facebook.NET
- Facebook.NET Starter Kit update
- Facebook Starter Kits for VS.NET updated
This work is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License.