ClickOnChris

I published my first ever screen cast tonight. enjoy!

The source code is available here: https://github.com/clickonchris/facebooker-demo

UPDATE: Sprite Club’s code has been open-sourced :  https://github.com/clickonchris/spriteclub

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

I have been working on a Facebook application in my spare time for quite a while now and I think that it is finally interesting enough to start telling people about.

The application is a game called Sprite Club; it is a place where you can judge kids (sprites) on the basis of cuteness, and upload a photo of your own sprite to have them compete for internet fame.  The application is accessible from

apps.facebook.com/spriteclub

or from the friendly url:
www.spriteclub.net

The idea was conceived by my uncle, Matthew Deutch, while looking for an outlet to prove that his daughter is the cutest kid on the internet (We think she’s pretty great).  I am in the project to learn how to do Facebook and social media development.  The application is written in Rails and uses the Facebooker library to interface with Facebook.

Enjoy!

In my free time I dabble in Ruby on Rails development and Facebook application development.   Last year I picked up Mike Mangino’s book, Developing Facebook Platform Applications with Rails, which gives great step-by-step instructions for creating a facebook FBML application using the facebooker gem.

FBML is not the only type of Facebook application, however.  There is also the iframe method, which Lead Facebook Engineer Charlie Cheever has been endorsing for a while.  His blog post gives a good comparison of the two methods:http://www.ccheever.com/blog/?p=10 .  In addition to this, the Facebook developer roadmap (http://developers.facebook.com/roadmap ) shows that soon you will not be able to create new FBML applications, and is recommending that existing FBML applications be migrated to iframe.  The message is clear: time to switch to iframe people!

Unfortunately the tutorials performing this kind of switch are hard to come by.  Mike Mangino has created a new RoR gem named facebooker2 to support iframe and facebook connect development but documentation is limited.

This blog post includes some documentation on how to convert a facebooker FBML app to a facebooker2 iframe app.  Read Charlie Cheever’s blog post to understand the architectural differences between the FBML and iframe approach, especially the bit about server-side FBML.  More details here: http://developers.facebook.com/docs/reference/fbml/serverFbml

Remove the facebooker gem

Get Facebooker2 and mogli

$gem install facebooker2
$gem install mogli

Reccomended: unpack gems to /vendor (http://errtheblog.com/posts/50-vendor-everything)

Update environment.rb, set

RAILS_GEM_VERSION = 2.3.5

Create an initializers/load_facebook_yaml.rb file to read from facebook.yml.  It should include a single line:

Facebooker2.load_facebooker_yaml

Inside your facebook.yml file add the following two parameters to each environment config:

app_id: 131336175362
secret: f7b15a925058e7be60f0a4d56294e938

Application controller

Rename application.rb to application_controller.rb. Add the following command to your application_controller.rb

Include Facebooker2::Rails::Controller

Comment out the set_current_user method

Paste in this method:

  def current_user
    if session[:user_id]
      @current_user ||= User.find(session[:user_id])
    elsif current_facebook_user and @current_user.nil?
      @current_user = User.find_by_facebook_id(current_facebook_user.id)
      session[:user_id] = @current_user.id
    end
  end

Add a ‘ensure_authenticated_to_facebook’ method to keep making sure that the user has a facebook session when accessing your site.  In my case my sessions/login page just displays “please login to facebook”, and since we’re in an iframe in the context of apps.facebook.com/myapp, there is a facebook login prompt displayed immediately above my page.

before_filter :ensure_authenticated_to_facebook  
def ensure_authenticated_to_facebook
   if current_user == nil
     logger.info "current user is nil"
     redirect_to :controller=>'sessions', :action=>'login'
   end
end

With Facebook Connect it is not required that your application runs inside the context of apps.facebook.com/myapp.  Your login page could technically detect if it is running in app.facebook.com and only display “please login”, otherwise if you are running it as a standalone page present the user with a facebook connect login button.

Enable oauth 2.0.  This will facebook cause to send a “signed_request” request parameter to your application once the user has authenticated.  Mogli will use this token to authenticate the user and create the current_facebook_user object.

Copy/Rename your .rhtml.erb files to .html.erb.  You will no longer have a canvas and will never render rhtml files again.

Remove  <%= facebook_messages %> in your erb files or replace them with <%= flash[:error]  %> or <%= flash[:error]  %>

Put the facebook connect javascript initializer in your layouts file so that it gets executed during each page load

    <% fb_connect_async_js  do %>    
      <%= yield :fb_connect%>
    <% end %>

This should always be the first snippet of javascript to be executed as it will instantiate the FB global variable that the rest of your page will probably use.

Start going through your erb files and replace FBML code with <fb:serverFBML /> and their javascript SDK equivalents. This is pretty much the final step and will require the most effort. Use the documentation and test console found here: http://developers.facebook.com/docs/reference/javascript/

-facebooker2 reference project: https://github.com/mmangino/facebooker2_fb_connect_example

-images for stream publisher popups need to be accessible by facebook servers.  You used to use a reverse tunnel so facebook could read them directly from your local server.  If you have images that fall into this category you may still need to use a reverse tunnel.

My website has been down for the last 2+ days. The reason: Dreamhost upgraded to Rails 2.0 without any warning. Since some of my code was not 2.0 compliant – BAM! down goes my site.

In case I can help anyone else out of a bind, or avoid this horrible fate, here are the steps I had to take to get my website back up and running with Rails 2.0:

1. Add a config.actioncontroller.session entry to my environments.rb file. I added it within the Rails::Initializer block. This was in response to the following error I found in my production.log file:
   A secret is required to generate an integrity hash for cookie session data. Use config.action_controller.session = { :session_key => “_myapp_session”, :secret => “some secret phrase of at least 30 characters” } in config/environment.rb
   Luckily the error tells you exactly what to do

1. Next, I had to fix this error:
   undefined method ‘paginate’
   I fixed it by installing the plugin ‘classic_pagination’. To do this you simply have to run
   “script/plugin install svn://errtheblog.com/svn/plugins/classic_pagination” from your project root.
   Apparently they took out built-in pagination support from Rails 2.0. This will_paginate plugin is supposed to be better, but I didn’t care to figure out how to work it right now.

1. Finally, I had to fix all of my start_form_tag entries.

There was a good demo of how to do this in the what’s new in Rails2? slideshow

 have implemented AJAX style comments system. If you click on the ‘Add Comment’ button below you can see it. The difference is that now you are presented with a comments form appears within the existing page instead of a comments form being on a new page, as was the previous behavior. This is AJAX, and it is the technology that people are calling Web 2.0. 
What’s the big deal you ask? By having the ability to only update parts of a web page instead of updating the whole page every time you invoke some function, it makes the browser act more like a desktop application than a web page. The end result is more robust applications served over the web. Think google maps or facebook.

Recently I started noticing a lot of spam posts on my website. It must be those internet hacker bots! I wondered if I could put one of those fancy image verification things into my site to stave them off. They’re called ‘captchas’ and it turns out that its simple and easy to implement such a thing in Ruby on Rails using the reCaptcha plugin. Here are the instructions I wish I had when I started:

1. install the reCaptcha gem. I’m using Aptana/RadRails IDE which has a nice interface to install gems, but I hear you can install it via the command line with something like ‘gem install reCaptcha’

1. Register for public and private keys at recaptcha.net .This is also a good tutorial of how a captchas and reCaptcha works. You will have to add your public and private keys to your config/environment.rb file.

1. insert the reCaptcha function calls into your code:
   recaptcha_tags() – put this into your®html form to generate the challenge image.
   verify_recaptcha() – when inserted into the controller, checks the data passed from the form to make sure that the correct ‘answer’ was given. returns boolean

Thats it! Add a comment to test it out!

 have switched web hosts as of today from Axishost to Dreamhost. Axishost was very good, but their spamassasin has been broken for about a month and I couldn’t take it anymore!

I’ve also lowered my yearly hosting costs from $72 to $23(Dreamhost promo code: DOIT). We shall see how Dreamhost measures up.
Update: The switch went pretty smooth, although this was the most complicated one yet due to the fact that I’m using Ruby on Rails and running a photo gallery. The procedure was basically:

1. Copy Data
2. spoof new DNS by modifying ‘hosts’ file. This was required to access phpmysql and to test out the site.
3. Export/Import Mysql databases.
4. redeploy website.

I can tell the difference with Dreamhost using fastCGI. The site usually loads a lot faster. My only complaint so far is that Dreamhosts spam filtering solution isn’t as good as axishosts. Supposedly I can install a better one but I haven’t gotten around to it yet.

As I get more comfortable with Ruby on Rails development, I have been looking to take advantage of Subversion and FastCGI – tools that are vitally important to any halfway decent rails environment. Subversion (with Capistrano) helps automate deployment, while FastCGI helps your rails web pages load quickly. At the moment, my website seems sluggish at best.

My hosting provider, Axishost , does not seem concerned about providing either of these tools to its customers. When I asked about subversion support, I got the following response:

Thanks but no thanks guys. I picked this host specifically because it advertised that it supports Ruby on Rails (and its 99.9% uptime guarantee is pretty nice). The reality seems that Axishost only partially supports Ruby on Rails. This environment is not good enough for any Rails application worth a damn.

Hi Chris, At this point there are no plans to add subversion to the servers, nor is it on schedule for the near future. If the demand increases it may become a more viable option, but at this point it is not.

Please let us know if there is anything else we can do for you!

It was the same story regarding FastCGI

FastCGI is not installed.

Get it together Axishost

I am currently beginning the slow process of deploying my first Ruby on Rails application to this site to serve as a content manager. Over the next several months we will be adding some new features to the site while trying to keep it visually appealing.

My goal is to use this site to post the occasional technical article or experience. With any luck I’ll be able to draw enough traffic to get cover hosting costs from the ad revenue!

—Chris Johnson