initial commit

.editorconfig

@@ -0,0 +1,13 @@
+# http://editorconfig.org
+root = true
+
+[*]
+indent_style = space
+indent_size = 2
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true
+
+[*.md]
+trim_trailing_whitespace = false
+

.gitignore

@@ -0,0 +1,3 @@
+node_modules
+public
+bower_components

.jshintrc

@@ -0,0 +1,3 @@
+{
+  "browserify": true
+}

README.md

@@ -0,0 +1,61 @@
+# Project template for [gulp.js](http://gulpjs.com/)
+<img width="114px" height="257px" align="right" src="https://raw.githubusercontent.com/gulpjs/artwork/master/gulp-2x.png"/>
+
+### What it does
+* [Jade](http://jade-lang.com) files to HTML
+* [Stylus](http://learnboost.github.io/stylus) files to CSS
+* [JSX](http://facebook.github.io/react/docs/jsx-in-depth.html) files to Javascript through [browserify](http://browserify.org/)
+    * You are able to use 'require' in your client-side code
+* Serves your static files to localhost:9001
+* Reloads your browser with LiveReload when files change
+
+## Getting things up and running
+- Install [Node.js](http://nodejs.org)
+
+```
+ git clone git@github.com:leonidas/gulp-project-template.git <your project name>
+ cd <your project name>
+ npm install
+ npm start
+ open http://localhost:9001 in your browser
+````
+### Enable LiveReload
+Install [LiveReload for Chrome](https://chrome.google.com/webstore/detail/livereload/jnihajbhpnppcggbcgedagnkighmdlei?hl=en)
+
+## CLI Commands
+* npm install
+    * Installs server-side dependencies from NPM and client-side dependencies from Bower
+* npm start
+    * Compiles your files, starts watching files for changes, serves static files to port 9001
+* npm run build
+    * Builds everything
+
+Minification, uglification and other tasks you're expected to run before deploying your product can be made by running the build command with env variable NODE_ENV set to "production"
+
+    NODE_ENV=production npm run build
+
+## Development guidelines
+* **public** - directory should be dedicated only to compiled/copied files from **src** - directory.
+  It should be possible to delete directory completely and after **npm start** or **npm run build** everything should be as they were before the deletion.
+* All backend dependencies should be installed with **npm**. Browser dependencies should be installed with **bower** or with **npm**.
+
+### Using JavaScript instead of CoffeeScript
+Remove coffeeify transform from package.json file (browserify.transform field)
+```diff
+    "transform": [
+-     "coffeeify",
+      "debowerify",
+      "deamdify"
+    ]
+```
+
+and change the ".coffee" extension to ".js" from gulpfile.coffee
+```diff
+config =
+  scripts:
+-   source: './src/coffee/main.coffee'
+-   extensions: ['.coffee']
++   source: './src/js/main.js'
++   extensions: ['.js']
+```
+You also can change the directory name to scripts or what ever.

bower.json

@@ -0,0 +1,16 @@
+{
+  "name": "gulp-template",
+  "version": "0.0.0",
+  "authors": [
+    "Riku Rouvila <riku.rouvila@gmail.com>"
+  ],
+  "license": "MIT",
+  "ignore": [
+    "**/.*",
+    "node_modules",
+    "bower_components",
+    "test",
+    "tests"
+  ],
+  "dependencies": {}
+}

gulpfile.js

@@ -0,0 +1,106 @@
+'use strict';
+
+var browserify = require('browserify');
+var ecstatic = require('ecstatic');
+var gulp = require('gulp');
+var gutil = require('gulp-util');
+var livereload = require('gulp-livereload');
+var path = require('path');
+var source = require('vinyl-source-stream');
+var watchify = require('watchify');
+
+var config = {
+  scripts: {
+    source: './src/js/main.js',
+    extensions: ['.jsx'],
+    destination: './public/js/',
+    filename: 'bundle.js'
+  },
+  templates: {
+    source: './src/**/*.html',
+    watch: './src/**/*.html',
+    destination: './public/'
+  },
+  styles: {
+    source: './src/**/style.css',
+    watch: './src/**/*.css',
+    destination: './public/css/'
+  },
+  assets: {
+    source: './src/assets/**/*.*',
+    watch: './src/assets/**/*.*',
+    destination: './public/'
+  }
+};
+
+function handleError(err) {
+  gutil.log(err);
+  gutil.beep();
+  return this.emit('end');
+}
+
+gulp.task('scripts', function() {
+  var build, bundle;
+  bundle = browserify({
+    entries: [config.scripts.source],
+    extensions: config.scripts.extensions,
+    debug: false
+  });
+  build = bundle.bundle().on('error', handleError).pipe(source(config.scripts.filename));
+  return build.pipe(gulp.dest(config.scripts.destination));
+});
+
+gulp.task('templates', function() {
+  return gulp.src(config.templates.source)
+    .pipe(gulp.dest(config.templates.destination))
+    .on('error', handleError)
+    .pipe(livereload({auto: false}));
+});
+
+gulp.task('styles', function() {
+  return gulp.src(config.styles.source)
+  .pipe(gulp.dest(config.styles.destination))
+  .pipe(livereload({auto: false}));
+});
+
+gulp.task('assets', function() {
+  return gulp.src(config.assets.source)
+  .pipe(gulp.dest(config.assets.destination));
+});
+
+gulp.task('server', function() {
+  return require('http').createServer(ecstatic({
+    root: path.join(__dirname, 'public')
+  })).listen(9001);
+});
+
+gulp.task('watch', function() {
+  livereload.listen();
+
+  gulp.watch(config.templates.watch, ['templates']);
+  gulp.watch(config.styles.watch, ['styles']);
+  gulp.watch(config.assets.watch, ['assets']);
+
+  var bundle = watchify(browserify({
+    entries: [config.scripts.source],
+    extensions: config.scripts.extensions,
+    debug: true,
+    cache: {},
+    packageCache: {},
+    fullPaths: true
+  }));
+
+  return bundle.on('update', function() {
+    return bundle.bundle()
+      .on('error', handleError)
+      .pipe(source(config.scripts.filename))
+      .pipe(gulp.dest(config.scripts.destination))
+      .pipe(livereload());
+  }).emit('update');
+});
+
+gulp.task('no-js', ['templates', 'styles', 'assets']);
+
+gulp.task('build', ['scripts', 'no-js']);
+
+gulp.task('default', ['watch', 'no-js', 'server']);

package.json

@@ -0,0 +1,44 @@
+{
+  "name": "gulp-template",
+  "version": "1.0.0",
+  "description": "Project template for gulp.js",
+  "author": "Riku Rouvila <riku.rouvila@leonidasoy.fi>",
+  "license": "MIT",
+  "main": "gulpfile.js",
+  "scripts": {
+    "prepublish": "bower install",
+    "start": "gulp",
+    "build": "gulp build"
+  },
+  "keywords": [
+    "gulp",
+    "template"
+  ],
+  "dependencies": {
+    "react": "^0.11.2"
+  },
+  "devDependencies": {
+    "bower": "~1.3.5",
+    "browserify": "~6.1.0",
+    "ecstatic": "~0.5.3",
+    "deamdify": "^0.1.1",
+    "debowerify": "~0.9.1",
+    "gulp": "~3.8.1",
+    "gulp-autoprefixer": "1.0.1",
+    "gulp-livereload": "~2.1.0",
+    "gulp-minify-css": "~0.3.5",
+    "gulp-streamify": "0.0.5",
+    "gulp-uglify": "~1.0.1",
+    "gulp-util": "~3.0.1",
+    "reactify": "~0.14.0",
+    "vinyl-source-stream": "~1.0.0",
+    "watchify": "~2.0.0"
+  },
+  "browserify": {
+    "transform": [
+      "reactify",
+      "debowerify",
+      "deamdify"
+    ]
+  }
+}

src/index.html

@@ -0,0 +1,10 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <title>Gulp template</title>
+    <link rel="stylesheet" href="css/style.css">
+  </head>
+  <body>
+    <script src="js/bundle.js"></script>
+  </body>
+</html>

src/js/app.jsx

@@ -0,0 +1,13 @@
+/*** @jsx React.DOM */
+
+var React = require('react');
+
+var APP = React.createClass({
+    render:function(){
+        return (
+                <h1>Hello World</h1>
+            )
+    }
+});
+
+React.renderComponent(<APP />, document.body)

src/js/main.js

@@ -0,0 +1,5 @@
+/*jslint browser: true */
+'use strict';
+
+require('./app');
+

src/style.css

@@ -0,0 +1,3 @@
+body, html {
+  margin: 0;
+}