AngularJS-Facebook-RequireJS

Framework for a Facebook Application on AngularJS using RequireJS, Yeoman, Grunt, and Bower.

Added by: Sam Deering

GitHub

Repository

memoramirez/angularjs-facebook-requirejs

Stats

Stars: 2

Watchers: 2

Forks: 0

Module Description

#AngularJS Facebook Integration

Framework for a Facebook Application on AngularJS, Yeoman, Grunt, and Bower. This application is a test application that will integrate basic Facebook Graph API calls, as a service, into AngularJS.

Installation of Angular: Instructions for Mac/Linux

  1. Install Yeoman, Grunt and Bower in user root directory:

     sudo npm install -g yo grunt-cli bower
    
  2. Install AngularJS generator in user root directory:

     npm install -g generator-angular
    
  3. In empty project folder, install the template:

     yo angular
    
  4. Change bower.cc:

     {
       "directory": "app/bower_components",
       "json": "bower.json" // Add this line
     }
    
  1. Install angular bootstrap in the project folder:

     bower install angular-bootstrap --save
    
  1. Will need to update git if possible - do the following in the terminal in user root:

     git clone git://github.com/gitster/git.git 
     cd git 
     sudo make prefix=/usr install install-doc install-html install-info
    
  2. For Grunt to work properly, follow the first steps then in the user root:

     npm install grunt --save-dev
    
  3. After this, you'll need to install compass and sass. You'll also need to update Ruby if needed with update --system command. In the user root:

     npm install grunt-contrib-compass --save-dev
     gem update --system && gem install compass
    
  4. For the last step, you'll need to install karma in the PROJECT FILE: cd ~/project:

     npm install grunt-karma --save-dev
    

Other instructions for Grunt can be found at: http://gruntjs.com/getting-started

To configure AngularJS for CORS:

    angular.module('myApp')
      .config(['$httpProvider', function($httpProvider) {
            $httpProvider.defaults.useXDomain = true;
            delete $httpProvider.defaults.headers.common['X-Requested-With'];
        }
      ]);
      

Deploying App to Heroku: Instructions for Mac/Linux

  1. Install gzippo (serve gzip assets) and express (simple Node application framework) into the PROJECT folder:

     npm install gzippo express --save
    
  2. Create a server file named web.js into the root PROJECT folder:

     var gzippo = require('gzippo');
     var express = require('express');
     var app = express();
     
     app.use(express.logger('dev'));
     app.use(gzippo.staticGzip("" + __dirname + "/dist"));
     app.listen(process.env.PORT || 5000);
    
  3. Have grunt build the distribution app from the original development app:

     grunt build
     
    
  4. Change .gitignore file and take out dist (Heroku needs this to deploy the app).

  5. Add Procfile to the root PROJECT folder and insert this:

     web: node web.js
    

Open a new Terminal window and login to Heroku in your PROJECT directory:

  1. Turn your project into a git repo:

     git init
    
  2. Create a heroku app in you project root (where "sample-project" is the name of your app).

     heroku create sample-project
    
  3. Commit your code and deploy it to Heroku

     git add .
     git commit -m "Initial Commit"
     git push heroku master
    
  4. Add worker to you app:

     heroku ps:scale web=1
    
  5. Now open your app and check it out!

     heroku open
    

Module stats last updated: 2015-06-08 00:34:06

Disclaimer: Some data on this page may have been gathered from the authors GitHub respository. If you see any mistakes or outdated information please let us know. Thanks!