Added day - 3 with the boiler plate in order to start creating code f…

…rom the very begining without thinking on code bundling

day-3/ecma6/.babelrc

@@ -0,0 +1,11 @@
+{
+  "presets": ["react", "es2015" , "stage-0"],
+  "plugins": [
+    ["transform-decorators-legacy"]
+  ],
+  "env": {
+    "start": {
+      "presets": ["react-hmre"]
+    }
+  }
+}

day-3/ecma6/.bootstraprc

@@ -0,0 +1,113 @@
+---
+# Output debugging info
+# loglevel: debug
+
+# Major version of Bootstrap: 3 or 4
+bootstrapVersion: 3
+
+# Webpack loaders, order matters
+styleLoaders:
+  - style
+  - css
+  - sass
+
+# Extract styles to stand-alone css file
+# Different settings for different environments can be used,
+# It depends on value of NODE_ENV environment variable
+# This param can also be set in webpack config:
+#   entry: 'bootstrap-loader/extractStyles'
+# extractStyles: false
+# env:
+#   development:
+#     extractStyles: false
+#   production:
+#     extractStyles: true
+
+
+# Customize Bootstrap variables that get imported before the original Bootstrap variables.
+# Thus, derived Bootstrap variables can depend on values from here.
+# See the Bootstrap _variables.scss file for examples of derived Bootstrap variables.
+#
+# preBootstrapCustomizations: ./path/to/bootstrap/pre-customizations.scss
+
+
+# This gets loaded after bootstrap/variables is loaded
+# Thus, you may customize Bootstrap variables
+# based on the values established in the Bootstrap _variables.scss file
+#
+# bootstrapCustomizations: ./path/to/bootstrap/customizations.scss
+
+
+# Import your custom styles here
+# Usually this endpoint-file contains list of @imports of your application styles
+#
+# appStyles: ./path/to/your/app/styles/endpoint.scss
+
+
+### Bootstrap styles
+styles:
+
+  # Mixins
+  mixins: true
+
+  # Reset and dependencies
+  normalize: true
+  print: true
+  glyphicons: true
+
+  # Core CSS
+  scaffolding: true
+  type: true
+  code: true
+  grid: true
+  tables: true
+  forms: true
+  buttons: true
+
+  # Components
+  component-animations: true
+  dropdowns: true
+  button-groups: true
+  input-groups: true
+  navs: true
+  navbar: true
+  breadcrumbs: true
+  pagination: true
+  pager: true
+  labels: true
+  badges: true
+  jumbotron: true
+  thumbnails: true
+  alerts: true
+  progress-bars: true
+  media: true
+  list-group: true
+  panels: true
+  wells: true
+  responsive-embed: true
+  close: true
+
+  # Components w/ JavaScript
+  modals: true
+  tooltip: true
+  popovers: true
+  carousel: true
+
+  # Utility classes
+  utilities: true
+  responsive-utilities: true
+
+### Bootstrap scripts
+scripts:
+  transition: true
+  alert: true
+  button: true
+  carousel: true
+  collapse: true
+  dropdown: true
+  modal: true
+  tooltip: true
+  popover: true
+  scrollspy: true
+  tab: true
+  affix: true

day-3/ecma6/.eslintrc

@@ -0,0 +1,26 @@
+{
+  "parser": "babel-eslint",
+  "extends": "eslint-config-airbnb",
+  "env": {
+    "browser": true,
+    "node": true,
+    "mocha": true
+  },
+  "globals": {
+    "connect": true
+  },
+  "rules": {
+    "max-len": 0,
+    "react/jsx-uses-react": 2,
+    "react/jsx-uses-vars": 2,
+    "react/react-in-jsx-scope": 2,
+    "block-scoped-var": 0,
+    "padded-blocks": 0,
+    "no-console": 0,
+    "id-length": 0,
+    "no-unused-expressions": 0,
+  },
+  "plugins": [
+    "react"
+  ]
+}

day-3/ecma6/README.md

@@ -0,0 +1,17 @@
+## Directory App for react redux
+
+SPA, very simple one just to learn about redux.
+
+## References
+
+Todos from redux examples, and https://github.com/anorudes/redux-easy-boilerplate.
+
+Also learning from React in a day book :).
+
+Also learnt about react router too.
+
+## Contributors
+
+Juan José García
+
+www.jotaoncode.com

day-3/ecma6/bin/server.js

@@ -0,0 +1,14 @@
+var fs = require('fs');
+
+var babelrc = fs.readFileSync('./.babelrc');
+var config;
+
+try {
+  config = JSON.parse(babelrc);
+} catch (err) {
+  console.error('==>     ERROR: Error parsing your .babelrc.');
+  console.error(err);
+}
+
+require('babel-core/register')(config);
+require('../server');

day-3/ecma6/index.html

@@ -0,0 +1,18 @@
+<html>
+
+<head>
+  <meta charset="utf-8">
+  <title>Directors Application</title>
+  <meta name="description" content="">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <link rel="stylesheet" type="text/css" href="dist/bundle.css"/>
+  <link rel="shortcut icon" type="image/png" href="./src/images/favicon.png"/>
+</head>
+
+<body>
+  <div id="root"></div>
+</body>
+
+<script src="dist/bundle.js"></script>
+
+</html>

day-3/ecma6/karma.conf.js

@@ -0,0 +1,34 @@
+module.exports = (config) => {
+  config.set({
+    basePath: 'src',
+    singleRun: true,
+    frameworks: ['mocha'],
+    reporters: ['dots'],
+    browsers: ['Chrome'],
+    files: [
+      'test/**/*.spec.js',
+    ],
+    preprocessors: {
+      'test/**/*.spec.js': ['webpack'],
+    },
+    webpack: {
+      resolve: {
+        extensions: ['', '.js', '.ts'],
+        modulesDirectories: ['node_modules', 'src'],
+      },
+      module: {
+        loaders: [{
+          test: /\.js$/,
+          loader: 'babel-loader',
+        }],
+      },
+    },
+    webpackMiddleware: {
+      stats: {
+        color: true,
+        chunkModules: false,
+        modules: false,
+      },
+    },
+  });
+};

day-3/ecma6/package.json

@@ -0,0 +1,87 @@
+{
+  "name": "directors-application-react-redux",
+  "version": "0.0.1",
+  "description": "Directory application using react and redux",
+  "scripts": {
+    "clean": "rimraf dist",
+    "build": "webpack --progress --verbose --colors --display-error-details --config webpack/common.config.js",
+    "build:production": "npm run clean && npm run build",
+    "lint": "eslint src",
+    "start": "node bin/server.js",
+    "test": "karma start"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/jotaoncode/directory-app-react-redux.git"
+  },
+  "license": "MIT",
+  "authors": [
+    "Jota On Code (https://github.com/jotaoncode)"
+  ],
+  "devDependencies": {
+    "autoprefixer": "6.3.1",
+    "babel-core": "^6.4.5",
+    "babel-eslint": "^5.0.0-beta6",
+    "babel-loader": "^6.2.1",
+    "babel-plugin-react-transform": "^2.0.0",
+    "babel-plugin-transform-decorators-legacy": "^1.3.4",
+    "babel-polyfill": "^6.3.14",
+    "babel-preset-es2015": "^6.3.13",
+    "babel-preset-react": "^6.3.13",
+    "babel-preset-react-hmre": "^1.0.1",
+    "babel-preset-stage-0": "^6.3.13",
+    "bootstrap-loader": "^1.0.5",
+    "bootstrap-sass": "^3.3.6",
+    "classnames": "^2.2.3",
+    "css-loader": "^0.23.1",
+    "eslint": "^1.10.3",
+    "eslint-config-airbnb": "3.1.0",
+    "eslint-plugin-react": "^3.15.0",
+    "expect": "^1.13.4",
+    "exports-loader": "^0.6.2",
+    "express": "^4.13.4",
+    "express-open-in-editor": "^1.1.0",
+    "extract-text-webpack-plugin": "^1.0.1",
+    "file-loader": "^0.8.5",
+    "history": "^2.0.0-rc2",
+    "imports-loader": "^0.6.5",
+    "jasmine-core": "^2.4.1",
+    "karma": "^0.13.19",
+    "karma-chrome-launcher": "^0.2.2",
+    "karma-mocha": "^0.2.1",
+    "karma-webpack": "^1.7.0",
+    "less": "^2.5.3",
+    "less-loader": "^2.2.2",
+    "mocha": "^2.3.4",
+    "morgan": "^1.6.1",
+    "node-sass": "^3.4.2",
+    "postcss-import": "^7.1.3",
+    "postcss-loader": "^0.8.0",
+    "react-addons-css-transition-group": "^0.14.6",
+    "react-document-meta": "^2.0.0-rc2",
+    "react-dom": "^0.14.6",
+    "react-hot-loader": "^1.3.0",
+    "react-loading-order-with-animation": "^1.0.0",
+    "react-transform-hmr": "^1.0.1",
+    "redux-form": "^4.1.5",
+    "redux-logger": "2.4.0",
+    "redux-thunk": "^1.0.3",
+    "resolve-url-loader": "^1.4.3",
+    "rimraf": "^2.5.0",
+    "sass-loader": "^3.1.2",
+    "style-loader": "^0.13.0",
+    "url-loader": "^0.5.7",
+    "webpack": "^1.12.11",
+    "webpack-dev-middleware": "^1.5.0",
+    "webpack-dev-server": "^1.14.1",
+    "webpack-hot-middleware": "^2.6.0",
+    "webpack-merge": "^0.7.3"
+  },
+  "dependencies": {
+    "jquery": "^2.2.0",
+    "react": "^0.14.6",
+    "react-redux": "^4.0.6",
+    "react-router": "^2.0.0-rc5",
+    "redux": "^3.1.4"
+  }
+}

day-3/ecma6/server.js

@@ -0,0 +1,32 @@
+const http = require('http');
+const express = require('express');
+const app = express();
+
+app.use(require('morgan')('short'));
+
+(function initWebpack() {
+  const webpack = require('webpack');
+  const webpackConfig = require('./webpack/common.config');
+  const compiler = webpack(webpackConfig);
+
+  app.use(require('webpack-dev-middleware')(compiler, {
+    noInfo: true, publicPath: webpackConfig.output.publicPath,
+  }));
+
+  app.use(require('webpack-hot-middleware')(compiler, {
+    log: console.log, path: '/__webpack_hmr', heartbeat: 10 * 1000,
+  }));
+
+  app.use(express.static(__dirname + '/'));
+})();
+
+app.get(/.*/, function root(req, res) {
+  res.sendFile(__dirname + '/index.html');
+});
+
+const server = http.createServer(app);
+server.listen(process.env.PORT || 3000, function onListen() {
+  const address = server.address();
+  console.log('Listening on: %j', address);
+  console.log(' -> that probably means: http://localhost:%d', address.port);
+});