If you are building a web-app, which needs to use OAuth for user authentication across Facebook, Google, Twitter and other social media, testing the app locally, on your development machine, can be a real challenge.

On your local machine, the app URL might look like http://localhost/my_app/login.xxx while in the production environment the URL would be http://my_app.com/login.xxx

Now, when you try to test the OAuth integration, using Facebook (or any other resource server) it will not work locally. Because when you create the facebook app, you need to give the URL where the code will be located. This is different on local and production environment.

So how do you resolve this issue?

One way to resolve this issue is to set up a Virtual Host on your machine, such that your local environment have the same URL as the production code.

To achieve this, following the 4 simple steps:

1. Map your domain name to your local IP address
Add the following line to /etc/hosts file
127.0.0.1 my_app.com

Now when you request for http://my_app.com in your browser, it will direct the request to your local machine.

2. Activate virtual hosts in apache

Uncomment the following line (remove the #) in /private/etc/apache2/httpd.conf

#Include /private/etc/apache2/extra/httpd-vhosts.conf

3. Add the virtual host in apache

Add the following VHost entry to the /private/etc/apache2/extra/httpd-vhosts.conf file

<VirtualHost *:80>
    DocumentRoot "/Users/username/Sites/my_app"
    ServerName my_app.com
</VirtualHost>

4. Restart Apache
System preferences > “Sharing” > Uncheck the box “Web Sharing” – apache will stop & then check it again – apache will start.

Now, http://my_app.com/login.xxx will be served locally.

These days its fashionable for businesses to have a Facebook and Twitter account. I can see how social media can help them. But what beats me is, every now and then, I see a billboard or a poster with just Facebook and Twitter icons in one corner of their printed ad. What does this mean?

Its like having visiting card like this:

Instead of:

Over the last few days, I’ve heard friends complain about Facebook’s timeline (3rd major redesign of the profile page.)

I’m surprised that some people don’t like Timeline. IMHO its very elegantly designed and very “consuming information” friendly. The article: 5 Keys To Creating A UI With Soul explains the thinking process behind the timeline.

Obviously I like other other forms of consuming information like a Twitter stream or a Web page with comments. But I think timeline is neat.

I’m interested to hear from you, what you like or don’t like about timeline? Specific details will help me.