1 Creating Facebook Application Step By Step Part-3

facebook how to php sdk step by step tutorial

hello guys this is the third part of the series of Creating Facebook Application step by step . if have haven't seen last part please have a look Developing-A-Facebook-Application-Part-2 In this tutorial i am going to cover the following topics

• Setting up the environment
• Clonning your phpfogapp Repository
• getting facebook php sdk and starting with the example

So lets Start..

1. Downloading The tools
   if you already have s\installed any of these you can skip that
   Download and install Github for Windows
   Download and install WampServer 2 32 or 64 bit
   Make a full install for both of them, to avoid the unncessary trouble
2. Next Step is to generating ssh key so here is the process for that
   1. open Git Bash
   2. type
      $ cd ~/.ssh
      If you get "no such file or directory", create the directory:
      $ mkdir ~/.ssh
   3. Generate your key by following command
      
      $ cd ~/.ssh
      $ ssh-keygen -t rsa
      Generating public/private rsa key pair.
      Enter file in which to save the key (/Users/PHPFog/.ssh/id_rsa):id_rsa (use id_rsa)
      Enter passphrase (empty for no passphrase):(enter your password)
      Enter same passphrase again:
      This password is used to protect the private key.
      

      Your identification has been saved in /Users/PHPFog/.ssh/id_rsa.
      Your public key has been saved in /Users/PHPFog/.ssh/id_rsa.pub.
      The key fingerprint is:
      31:be:4f:13:d4:68:f1:43:ea:97:9b:33:ad:b6:e5:85 us@phpfog.com
      The key's randomart image is:
      +--[ RSA 2048]----+
      |                 |
      |         .       |
      |        . o      |
      |       . * = .   |
      |        S B E .  |
      |       o = o o   |
      |        o o o .  |
      |         . . o o.|
      |             .+.*|
      +-----------------+
      

   4. Now since the key is genereted . next step is to add this in your phpfog account
      Open your public key with a text editor and copy the entire text.
      A real key will look like:

      ssh-rsa
      AAAAB3NzaC1yc2EAAAADAQABAAABAQDgMaD2kOEQAq0ir0C/U3880mFmpv
      K0/7/qaYx8Uu2GFnsBabIsPJttndqAl6/k1Du4c2s2S+Aem0qS+R4hbSDDuWqjZbEH
      ks5qiAjD64vCavRwl96pKk/bvNB4sCe0MTsrPEU0rzI/MFDkCp8UkwonJkDVGafkhGIu
      UtVrXlCd5JrZFUUvYmLQoLdiTTjCJeBlfG46VqdX2qg4LRN2tMWecYhXrb+ghXsk
      7MfVo+RGQ9pQsiozbd2oROWOsoy2XKPsE2wXXINMpHAg/r6XUzddkW3mAfLAJ
      D7Te78lX+AImxPYhOQccODJlswTTlxKNZuqa9znAGaiyf1pYigHLVD5
      us@phpfog.com

   5. open phpfog goto My Account->settings->ssh keys->add key -> add key details (key name can be any name)
      
      
3. now we need to clone the source code from our phpgog git repository . cloning is the process of copying entire project files
   Go to your App Console at PHP Fog and click on the "Source Code" tab on the left.
   
   
   Copy the value for "Clone your git repository:", which should look something like:

   $ git clone git@:foo.phpfogapp.com

   Run the command in your terminal, and you should see something like this:

   $  git clone git@git01.phpfog.com:how2labsdemo.phpfogapp.com
   Cloning into 'how2labsdemo.phpfogapp.com'...
   The authenticity of host 'git01.phpfog.com (some ip)' can't be established.
   
   RSA key fingerprint is a6:c5:32:57:cc:21:0c:91:d0:f3:11:43:53:eb:9f:23.
   Are you sure you want to continue connecting (yes/no)? yes
   Warning: Permanently added 'git01.phpfog.com,(some ip)' (RSA) to the list of
   known hosts.
   Enter passphrase for key '/c/Users/Abhi/.ssh/id_rsa':
   remote: Counting objects: 3, done.
   remote: Total 3 (delta 0), reused 0 (delta 0)
   Receiving objects: 100% (3/3), done.
   

4. Now we can work on our source files change the directory to our project directiry .
   $ cd foo.phpfogapp.com replace foo with your app name for me its how2labsdemo
   now open the index.php file with the following command or you can open it in text editor by going through the following directory
   C:\Users\Abhi\how2labsdemo.phpfogapp.com for windows user only
   command for viewing and editing files with
   To view/edit a file vi filename.extension open file vi index.php
   To save press ESC key enter :w
   To close/quit editing press ESC key enter :q
5. if you opened the index.php you can see that hello world is wriiten in that i.e. the output we seen in the last part. this index file will get created automatically when we create the app
6. since now everything is done so we can start developing the app . for this we need the facebok sdk for php . Click here to download facebook php sdk Click on zip option
   Extract the sdk to some directory and follow the stpes
   1. copy the src folder to our local repository i.e. C:\Users\Abhi\how2labsdemo.phpfogapp.com\src . rename src to sdk so final directory will be C:\Users\Abhi\how2labsdemo.phpfogapp.com\sdk with following files

      base_facebook.php  facebook.php  fb_ca_chain_bundle.crt

   2. now open index.php and copy the following code

      <?php

      require 'sdk/facebook.php';

      $facebook = new Facebook(array(

        'appId'  => 'your app id',

        'secret' => 'your app secret',

      ));

      // See if there is a user from a cookie

      $user = $facebook->getUser();

      if ($user) {

        try {

          // Proceed knowing you have a logged in user who's authenticated.

          $user_profile = $facebook->api('/me');

        } catch (FacebookApiException $e) {

          echo '<pre>'.htmlspecialchars(print_r($e, true)).'</pre>';

          $user = null;

        }

      }

      ?>

      <!DOCTYPE html>

      <html xmlns:fb="http://www.facebook.com/2008/fbml">

        <body>

          <?php if ($user) { ?>

            Your user profile is

            <pre>

              <?php print htmlspecialchars(print_r($user_profile, true)) ?>

            </pre>

          <?php } else { ?>

            <fb:login-button></fb:login-button>

          <?php } ?>

          <div id="fb-root"></div>

          <script>

            window.fbAsyncInit = function() {

              FB.init({

                appId: '<?php echo $facebook->getAppID() ?>',

                cookie: true,

                xfbml: true,

                oauth: true

              });

              FB.Event.subscribe('auth.login', function(response) {

                window.location.reload();

              });

              FB.Event.subscribe('auth.logout', function(response) {       

       window.location.reload();
      

              });

            };

            (function() {

              var e = document.createElement('script'); e.async = true;

              e.src = document.location.protocol +

                '//connect.facebook.net/en_US/all.js';

              document.getElementById('fb-root').appendChild(e);

            }());

          </script>

        </body>

      </html>

      save the file.
   3. Now we need to upload this file to phpfog server so follow the steps given below for that
      1. First step is to add the new files
         $ git add .
         sample output
         

         warning: LF will be replaced by CRLF in sdk/base_facebook.php.
         The file will have its original line endings in your working directory.
         warning: LF will be replaced by CRLF in sdk/facebook.php.
         The file will have its original line endings in your working directory.
         warning: LF will be replaced by CRLF in sdk/fb_ca_chain_bundle.crt.
         The file will have its original line endings in your working directory.

         The "add" command tells git to "stage" new files in preparation for a commit. The "." tells git to add all the files in the current directory recursively.
      2. Second step is to commit the updation
         $ git commit -m "first commit (or type any message)"
         sample output
         

         warning: LF will be replaced by CRLF in sdk/base_facebook.php.
         The file will have its original line endings in your working directory.
         warning: LF will be replaced by CRLF in sdk/facebook.php.
         The file will have its original line endings in your working directory.
         warning: LF will be replaced by CRLF in sdk/fb_ca_chain_bundle.crt.
         The file will have its original line endings in your working directory.
          5 files changed, 1773 insertions(+), 1 deletion(-)
          create mode 100644 channel.php
          rewrite index.php (100%)
          create mode 100644 sdk/base_facebook.php
          create mode 100644 sdk/facebook.php
          create mode 100644 sdk/fb_ca_chain_bundle.crt

         This command commits the added file to your git repository. It's still local, but now it's ready to be uploaded (i.e. "pushed").
      3. Last step is push the files that means upload the file
         $ git push
         sample output
         

         Enter passphrase for key '/c/Users/Abhi/.ssh/id_rsa':(enter your password)
          Counting objects: 10, done. Delta compression using up to 2 threads. Compressing objects: 100% (8/8), done. Writing objects: 100% (8/8), 17.77 KiB, done. Total 8 (delta 0), reused 0 (delta 0) remote: -----> Deploying to the cloud
         This command commits the added file to your git repository. It's still local, but now it's ready to be uploaded (i.e. "pushed").
   4. Now we uploded the files so we can see the output file updation may take time so please don't panic. have some coffee in mean time you will get ouput something like this .

      Your user profile is
              Array
      (
          [id] => 100003149296690
          [name] => Abhimanyu Rathore
          [first_name] => Abhimanyu
          [last_name] => Rathore
          [link] => http://www.facebook.com/abhimanyu7nov
          [username] => abhimanyu7nov
          [location] => Array
              (
                  [id] => 102186159822587
                  [name] => Chennai, Tamil Nadu
              )
      
          [education] => Array
              (
                  [0] => Array
                      (
                          [school] => Array
                              (
                                  [id] => 110776898943667
                                  [name] => k.v
                              )
      
                          [type] => High School
                      )
      
                  [1] => Array
                      (
                          [school] => Array
                              (
                                  [id] => 109299605785499
                                  [name] => Dr. MGR University
                              )
      
                          [year] => Array
                              (
                                  [id] => 118118634930920
                                  [name] => 2012
                              )
      
                          [type] => College
                      )
      
                  [2] => Array
                      (
                          [school] => Array
                              (
                                  [id] => 107874392573563
                                  [name] => Dr. M.G.R. Educational and Research Institute
                              )
      
                          [degree] => Array
                              (
                                  [id] => 140065339390579
                                  [name] => B.Tech
                              )
      
                          [year] => Array
                              (
                                  [id] => 118118634930920
                                  [name] => 2012
                              )
      
                          [type] => Graduate School
                      )
      
              )
      
          [gender] => male
          [timezone] => 5.5
          [locale] => en_US
          [verified] => 1
          [updated_time] => 2012-08-06T18:54:13+0000
      )