Merge pull request #59 from theskumar/grunt

feat(grunt): Add grunt task runner. (ref #58)

README.rst

@@ -17,6 +17,7 @@ Features
 * Procfile for deploying to Heroku
 * Heroku optimized requirements
 * Basic caching setup
+* Grunt build for compass and livereload
 
 Constraints
 -----------

{{cookiecutter.repo_name}}/.gitignore

@@ -24,3 +24,9 @@ nosetests.xml
 *~
 *.swp
 *.swo
+
+# npm
+node_modules/
+
+# Campass
+.sass-cache

{{cookiecutter.repo_name}}/Gruntfile.js

@@ -0,0 +1,101 @@
+module.exports = function (grunt) {
+
+  var appConfig = grunt.file.readJSON('package.json');
+
+  // Load grunt tasks automatically
+  // see: https://github.com/sindresorhus/load-grunt-tasks
+  require('load-grunt-tasks')(grunt);
+
+  // Time how long tasks take. Can help when optimizing build times
+  // see: https://npmjs.org/package/time-grunt
+  require('time-grunt')(grunt);
+
+  var pathsConfig = function (appName) {
+    this.app = appName || appConfig.name;
+
+    return {
+      app: this.app,
+      templates: this.app + '/templates',
+      css: this.app + '/static/css',
+      scss: this.app + '/static/scss',
+      fonts: this.app + '/static/fonts',
+      images: this.app + '/static/images',
+      js: this.app + '/static/js',
+      manageScript: this.app + '/manage.py'
+    }
+  };
+
+  grunt.initConfig({
+
+    paths: pathsConfig(),
+    pkg: appConfig,
+
+    // see: https://github.com/gruntjs/grunt-contrib-watch
+    watch: {
+      gruntfile: {
+        files: ['Gruntfile.js']
+      },
+      compass: {
+        files: ['<%= paths.scss %>/**/*.{scss,sass}'],
+        tasks: ['compass:server']
+      },
+      livereload: {
+        files: [
+          '<%= paths.js %>/**/*.js',
+          '<%= paths.scss %>/**/*.{scss,sass}',
+          '<%= paths.app %>/**/*.html'
+          ],
+        options: {
+          spawn: false,
+          livereload: true,
+        },
+      },
+    },
+
+    // see: https://github.com/gruntjs/grunt-contrib-compass
+    compass: {
+      options: {
+          sassDir: '<%= paths.scss %>',
+          cssDir: '<%= paths.css %>',
+          fontsDir: '<%= paths.fonts %>',
+          imagesDir: '<%= paths.images %>',
+          relativeAssets: false,
+          assetCacheBuster: false,
+          raw: 'Sass::Script::Number.precision = 10\n'
+      },
+      dist: {
+        options: {
+          environment: 'production'
+        }
+      },
+      server: {
+        options: {
+          // debugInfo: true
+        }
+      }
+    },
+
+    // see: https://npmjs.org/package/grunt-bg-shell
+    bgShell: {
+      _defaults: {
+        bg: true
+      },
+      runDjango: {
+        cmd: 'python <%= paths.manageScript %> runserver'
+      }
+    }
+  });
+
+  grunt.registerTask('serve', [
+    'bgShell:runDjango',
+    'watch'
+  ]);
+
+  grunt.registerTask('build', [
+    'compass:dist'
+  ]);
+
+  grunt.registerTask('default', [
+    'build'
+  ]);
+};

{{cookiecutter.repo_name}}/README.rst

@@ -45,6 +45,16 @@ For getting this running on your local machine:
 
     pip install -r requirements/local.txt
 
+3. Install Grunt Dependencies.
+
+    npm install
+
+4. Run development server. (For browser auto-reload, use Livereload_ plugins.)
+
+    grunt serve
+
+.. _livereload: https://github.com/gruntjs/grunt-contrib-watch#using-live-reload-with-the-browser-extension
+
 
 Deployment
 ------------
@@ -53,7 +63,7 @@ Run these commands to deploy the project to Heroku:
 
 .. code-block:: bash
 
-    heroku create
+    heroku create --buildpack https://github.com/heroku/heroku-buildpack-python
     heroku addons:add heroku-postgresql:dev
     heroku addons:add pgbackups
     heroku addons:add sendgrid:starter

{{cookiecutter.repo_name}}/package.json

@@ -0,0 +1,17 @@
+{
+  "name": "{{cookiecutter.project_name}}",
+  "version": "{{ cookiecutter.version }}",
+  "dependencies": {},
+  "devDependencies": {
+    "grunt": "~0.4.1",
+    "grunt-contrib-watch": "~0.5.3",
+    "grunt-bg-shell": "~2.3.1",
+    "connect-livereload": "~0.3.2",
+    "grunt-contrib-compass": "~0.7.0",
+    "time-grunt": "~0.2.7",
+    "load-grunt-tasks": "~0.2.1"
+  },
+  "engines": {
+    "node": ">=0.8.0"
+  }
+}

{{cookiecutter.repo_name}}/{{cookiecutter.project_name}}/static/css/project.css

@@ -1,31 +1,32 @@
-/*! project specific CSS goes here. */
+/* line 5, ../scss/project.scss */
-
-/* bootstrap alert CSS, translated to the django-standard levels of
-** debug, info, success, warning, error */
 .alert-debug {
   color: black;
   background-color: white;
   border-color: #d6e9c6;
 }
 
+/* line 11, ../scss/project.scss */
 .alert-info {
   color: #3a87ad;
   background-color: #d9edf7;
   border-color: #bce8f1;
 }
 
+/* line 17, ../scss/project.scss */
 .alert-success {
   color: #468847;
   background-color: #dff0d8;
   border-color: #d6e9c6;
 }
 
+/* line 23, ../scss/project.scss */
 .alert-warning {
   color: black;
   background-color: orange;
   border-color: #d6e9c6;
 }
 
+/* line 29, ../scss/project.scss */
 .alert-error {
   color: #b94a48;
   background-color: #f2dede;

{{cookiecutter.repo_name}}/{{cookiecutter.project_name}}/static/scss/project.scss

@@ -0,0 +1,33 @@
+// project specific CSS goes here
+
+// bootstrap alert CSS, translated to the django-standard levels of
+// debug, info, success, warning, error
+.alert-debug {
+  color: black;
+  background-color: white;
+  border-color: #d6e9c6;
+}
+
+.alert-info {
+  color: #3a87ad;
+  background-color: #d9edf7;
+  border-color: #bce8f1;
+}
+
+.alert-success {
+  color: #468847;
+  background-color: #dff0d8;
+  border-color: #d6e9c6;
+}
+
+.alert-warning {
+  color: black;
+  background-color: orange;
+  border-color: #d6e9c6;
+}
+
+.alert-error {
+  color: #b94a48;
+  background-color: #f2dede;
+  border-color: #eed3d7;
+}