adding local server for development

Gruntfile.js

@@ -43,15 +43,54 @@ module.exports = function(grunt) {
           'dist/styles.css': 'source/stylesheets/main.scss'
         }
       }
-    }
+    },
+
+    // watch locations
+    watch: {
+      options: {
+        livereload: true,
+      },
+      scripts: {
+        files: ['source/javascripts/**.js'],
+        tasks: ['uglify']
+      },
+      styles: {
+        files: ['source/stylesheets/**.scss'],
+        tasks: ['sass']
+      },
+      markup: {
+        files: ['index.html']
+      }
+    },
 
+  // Creating a local server
+    connect: {
+      server: {
+        options: {
+          hostname: 'localhost',
+          base: './',
+          keepalive: true,
+          livereload: true,
+          open: true
+        }
+      }
+    },
+    concurrent: {
+      options: {
+        logConcurrentOutput: true
+      },
+      dev: ['connect', 'watch']
+    }
   });
 
   // Load the task plugins
   grunt.loadNpmTasks('grunt-contrib-sass');
   grunt.loadNpmTasks('grunt-contrib-uglify');
   grunt.loadNpmTasks('grunt-contrib-clean');
+  grunt.loadNpmTasks('grunt-contrib-watch');
+  grunt.loadNpmTasks('grunt-contrib-connect');
+  grunt.loadNpmTasks('grunt-concurrent');
 
-  grunt.registerTask('default', ['clean', 'sass', 'uglify']);
+  grunt.registerTask('default', ['clean', 'sass', 'uglify', 'concurrent']);
 
 };

README.md

@@ -6,6 +6,11 @@ The Statesman's meme generator is a lightly-modified fork of the [Vox meme gener
 
 Assets are now built using Grunt, which transpiles the SASS files and concatenates/minifies the JavaScript. We modified the app this way to make it more easily deployable on our internal infrastructure.
 
+To assist in development, the default Grunt task also:
+  * launches a local server at `http://localhost:8000/`
+  * starts `grunt-contrib-watch` to watch `index.html` and the .js files in `/source`
+  * Livereload is enabled if you are running the [browser extenstions](http://livereload.com/extensions/)]].
+
 ![screenshot](readme.png)
 
 ## Deploying
@@ -17,7 +22,9 @@ Statesman images, fonts, etc. are currently in the app so you'll need to follow
 3. `npm install`
 4. `gem install compass`
 5. Run `grunt`
-6. *Optional:* Deploy to [GitHub pages](https://pages.github.com/) with `git push origin master:gh-pages`.
-7. Open the `index.html` file (or your GitHub pages URL) in your browser and meme away.
+
+A local server should open at `http://localhost:8000/` where you can use the tool locally.
+
+We run the project through [GitHub pages](https://pages.github.com/) to allow access to the newsroom. We deploy this with `git push origin master:gh-pages`.
 
 See the original repo at https://github.com/voxmedia/meme for additional info.

package.json

@@ -18,7 +18,9 @@
   "homepage": "https://github.com/statesman/meme",
   "devDependencies": {
     "grunt": "^0.4.5",
+    "grunt-concurrent": "^2.3.0",
     "grunt-contrib-clean": "^0.6.0",
+    "grunt-contrib-connect": "^1.0.2",
     "grunt-contrib-sass": "^0.8.1",
     "grunt-contrib-uglify": "^0.6.0"
   }