Initial commit

Author: mixxen

.gitignore

@@ -0,0 +1,4 @@
+.DS_Store
+node_modules
+browser-bundle.js
+browser-bundle.js.map

app.js

@@ -0,0 +1,57 @@
+var express = require('express');
+var path = require('path');
+var favicon = require('static-favicon');
+var logger = require('morgan');
+var cookieParser = require('cookie-parser');
+var bodyParser = require('body-parser');
+
+var routes = require('./routes/index');
+
+var app = express();
+
+// view engine setup
+app.set('views', path.join(__dirname, 'views'));
+app.set('view engine', 'jade');
+
+app.use(favicon());
+app.use(logger('dev'));
+app.use(bodyParser.json());
+app.use(bodyParser.urlencoded());
+app.use(cookieParser());
+app.use(express.static(path.join(__dirname, 'public')));
+
+app.use('/', routes);
+
+/// catch 404 and forward to error handler
+app.use(function(req, res, next) {
+    var err = new Error('Not Found');
+    err.status = 404;
+    next(err);
+});
+
+/// error handlers
+
+// development error handler
+// will print stacktrace
+if (app.get('env') === 'development') {
+    app.use(function(err, req, res, next) {
+        res.status(err.status || 500);
+        res.render('error', {
+            message: err.message,
+            error: err
+        });
+    });
+}
+
+// production error handler
+// no stacktraces leaked to user
+app.use(function(err, req, res, next) {
+    res.status(err.status || 500);
+    res.render('error', {
+        message: err.message,
+        error: {}
+    });
+});
+
+
+module.exports = app;

bin/www

@@ -0,0 +1,9 @@
+#!/usr/bin/env node
+var debug = require('debug')('MODULE_NAME');
+var app = require('../app');
+
+app.set('port', process.env.PORT || 3000);
+
+var server = app.listen(app.get('port'), function() {
+  debug('Express server listening on port ' + server.address().port);
+});

index.js

@@ -0,0 +1,7 @@
+/**
+ * An example for exporting as npm module.
+ *
+ * Use this to import component:
+ *   var TestComponent = require('MODULE_NAME').TestComponent;
+ */
+module.exports.TestComponent = require('./src/TestComponent.jsx');

package.json

@@ -0,0 +1,27 @@
+{
+  "name": "webpack-react-express",
+  "version": "0.0.1",
+  "private": true,
+  "dependencies": {
+    "react": "^0.11.0"
+  },
+  "devDependencies": {
+    "express": "~4.2.0",
+    "static-favicon": "~1.0.0",
+    "morgan": "~1.0.0",
+    "cookie-parser": "~1.0.1",
+    "body-parser": "~1.0.0",
+    "debug": "~0.7.4",
+    "jade": "~1.3.0",
+    "statics": "~0.1.0",
+    "webpack": "^1.3.7",
+    "jsx-loader": "^0.11.0"
+  },
+  "main": "./index.js",
+  "scripts": {
+    "start": "webpack --progress --colors --watch -d",
+    "build": "webpack --progress --colors -p",
+    "server": "node bin/www",
+    "test": "echo \"Error: no test specified\" && exit 1"
+  }
+}

public/stylesheets/style.css

@@ -0,0 +1,8 @@
+body {
+  padding: 50px;
+  font: 14px "Lucida Grande", Helvetica, Arial, sans-serif;
+}
+
+a {
+  color: #00B7FF;
+}

routes/index.js

@@ -0,0 +1,9 @@
+var express = require('express');
+var router = express.Router();
+
+/* GET home page. */
+router.get('/', function(req, res) {
+  res.render('index', { title: 'Express' });
+});
+
+module.exports = router;

src/TestComponent.jsx

@@ -0,0 +1,12 @@
+/** @jsx React.DOM */
+var React           = require('react');
+
+var TestComponent = React.createClass({
+  render: function() {
+    return (
+      <div>Hello World</div>
+    );
+  }
+});
+
+module.exports = TestComponent;

src/index.jsx

@@ -0,0 +1,8 @@
+/** @jsx React.DOM */
+var React         = require('react');
+var TestComponent = require('./TestComponent.jsx');
+
+React.renderComponent(
+  <TestComponent/>,
+  document.getElementById("react-container")
+);

views/error.jade

@@ -0,0 +1,6 @@
+extends layout
+
+block content
+  h1= message
+  h2= error.status
+  pre #{error.stack}