initial commit

Author: Pranesh Ravi

.babelrc

@@ -0,0 +1,7 @@
+{
+ "presets": ["latest", "react", "stage-0"],
+ "plugins":[
+   "react-hot-loader/babel",
+   "transform-decorators-legacy",
+ ]
+}

.gitignore

@@ -0,0 +1,2 @@
+node_modules
+build

app/APIs/apis.js

@@ -0,0 +1,13 @@
+import { actions } from '../actions/'
+import axios from 'axios'
+
+const noop = () => {}
+
+export const sampleApi = (callback = noop) => dispatch =>
+  axios('http://google.com')
+  .then((res) => {
+    console.log(res)
+  })
+  .catch((err) => {
+    console.log(err)
+  })

app/APIs/index.js

@@ -0,0 +1,5 @@
+import * as APIs from './apis'
+
+export {
+  APIs,
+}

app/actions/_action-types.js

@@ -0,0 +1,8 @@
+const actionTypes = [
+  'SAMPLE',
+]
+
+export default actionTypes.reduce((obj, str)=> {
+  obj[str] = str
+  return obj
+}, {})

app/actions/actions.js

@@ -0,0 +1,8 @@
+import actionTypes from './_action-types'
+import { createAction } from 'redux-actions'
+
+const sample = createAction(actionTypes.SAMPLE)
+
+export default {
+  sample,
+}

app/actions/index.js

@@ -0,0 +1,5 @@
+import actions from './actions'
+
+export {
+  actions,
+}

app/components/component.jsx

@@ -0,0 +1,17 @@
+import React, { Component, PropTypes } from 'react'
+
+import style from './style'
+
+export default class Sample extends Component {
+  constructor(props) {
+    super(props)
+  }
+
+  render() {
+    return (
+      <div className={style.hello}>
+        <p>wewe.....</p>
+      </div>
+    );
+  }
+}

app/components/style.scss

@@ -0,0 +1 @@
+$color: #000;

app/constants/_style-variables.scss

@@ -0,0 +1,38 @@
+import React, { Component, PropTypes } from 'react'
+
+import { AppContainer } from 'react-hot-loader'
+import Layout from './layout/'
+import { Provider } from 'react-redux'
+import ReactDOM from 'react-dom'
+import Test from './components/component'
+import easyBind from 'react-easy-bind'
+import page from 'page'
+import store from './store'
+
+const DefaultStore = store()
+
+function renderIntoDOM(Node, props) {
+  ReactDOM.render(
+      <AppContainer>
+        <Provider store={DefaultStore}>
+          <Node/>
+        </Provider>
+      </AppContainer>,
+    document.getElementById('app')
+  )
+}
+
+function renderPage(data) {
+  if (module.hot)
+    module.hot.accept('./layout/index.jsx', () => {
+      const NextApp = require('./layout').default
+      renderIntoDOM(NextApp, data)
+    })
+  renderIntoDOM(Layout, data)
+}
+
+page('/test', (context) => {
+  renderPage({ context })
+})
+
+page()

app/index.js

@@ -0,0 +1,40 @@
+import React, { Component } from 'react'
+
+import A from '../components/component'
+import { APIs } from '../APIs/'
+import _ from 'lodash'
+import { actions } from '../actions'
+import { bindActionCreators } from 'redux'
+import { connect } from 'react-redux'
+
+function mapStateToProps(states) {
+  return { ui: states.reducer };
+}
+function mapDispatchToProps(dispatch) {
+  return {
+    actions: bindActionCreators(
+      Object.assign(
+        {},
+        actions,
+        APIs,
+      ), dispatch), //Add additional actions inthe Object.assign() method
+  }
+}
+
+class Root extends Component {
+  constructor(props) {
+    super(props)
+  }
+
+  render() {
+    const Component = this.props.component
+    return (
+      <A/>
+    )
+  }
+}
+
+export default connect(
+  mapStateToProps,
+  mapDispatchToProps
+)(Root)

app/layout/index.jsx

@@ -0,0 +1,6 @@
+import { combineReducers } from 'redux';
+import reducer from './reducer'
+
+export default combineReducers({
+  reducer,
+})

app/reducers/index.js

@@ -0,0 +1,14 @@
+import actionTypes from '../actions/_action-types'
+import { createState } from './utils'
+import { handleActions } from 'redux-actions'
+
+const initialState = {
+  sample: 'rtsjdhfvjshdv',
+}
+
+const reducer = handleActions({
+  [actionTypes.SAMPLE]: (state, { payload }) =>
+    createState(state, payload, 'sample'),
+}, initialState)
+
+export default reducer

app/reducers/reducer.js

@@ -0,0 +1,5 @@
+export default (state, payload, key) => {
+  const newState = {}
+  newState[key] = payload
+  return { ...state, ...newState }
+}

app/reducers/utils/createState.js

@@ -0,0 +1,5 @@
+import createState from './createState'
+
+export {
+  createState,
+}

app/reducers/utils/index.js

@@ -0,0 +1,39 @@
+// import React, { Component, PropTypes } from 'react'
+//
+// import { AppContainer } from 'react-hot-loader'
+// import Layout from './layout/'
+// import { Provider } from 'react-redux'
+// import ReactDOM from 'react-dom'
+// import easyBind from 'react-easy-bind'
+// import page from 'page'
+// import store from './store'
+//
+// const DefaultStore = store()
+//
+// @easyBind
+// export default class Render {
+//   constructor(renderNode) {
+//     this.renderNode = renderNode
+//   }
+//
+//   renderIntoDOM(Node, props) {
+//     ReactDOM.render(
+//       <Provider store={DefaultStore}>
+//         <AppContainer>
+//           <Node {...props}/>
+//         </AppContainer>
+//       </Provider>,
+//       this.renderNode
+//     )
+//   }
+//
+//   renderPage(data) {
+//     if (module.hot)
+//       module.hot.accept('./layout/index.jsx', () => {
+//         const NextApp = require('./layout').default
+//         ReactDOM.unmountComponentAtNode(this.renderNode)
+//         this.renderIntoDOM(NextApp, data)
+//       })
+//     this.renderIntoDOM(Layout, data)
+//   }
+// }

app/render.js

@@ -0,0 +1,18 @@
+import { applyMiddleware, compose, createStore } from 'redux'
+
+import reducers from '../reducers/'
+import thunk from 'redux-thunk'
+
+export default function configureStore() {
+  const store = createStore(reducers, compose(
+    applyMiddleware(thunk),
+  ))
+  if (module.hot) {
+    module.hot.accept('../reducers/', () => {
+      const nextRootReducer = require('../reducers').default
+      store.replaceReducer(nextRootReducer)
+    })
+  }
+
+  return store;
+}

app/store/index.js

@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <title>ML Tool</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
+  </head>
+  <body>
+    <div id="app"></div>
+  </body>
+</html>

app/views/index.ejs

@@ -0,0 +1,7 @@
+import server from './server/default'
+import webpack from './webpack/default'
+
+export {
+  webpack,
+  server,
+}

config/default.js

@@ -0,0 +1,6 @@
+const config = {
+  host: 'localhost',
+  port: 3000,
+}
+
+export default config

config/server/default.js

@@ -0,0 +1,99 @@
+import HTMLwebpackPlugin from 'html-webpack-plugin'
+import autoprefixer from 'autoprefixer'
+import path from 'path'
+import webpack from 'webpack'
+const entries = [
+  'react-hot-loader/patch',
+  'webpack-hot-middleware/client',
+  './app/',
+]
+
+
+export default {
+  browser: {
+    entry: entries,
+    resolve: {
+      extensions: ['.webpack.js', '.web.js', '.js', '.jsx', '.scss', '.html', '.ejs'],
+    },
+    node: {
+      fs: 'empty',
+    },
+    module: {
+      rules: [
+        {
+          test: /\.scss$/,
+          loaders: [
+            'style-loader',
+            'css-loader?modules&importLoaders=1&localIdentName=[path][name]__[local]__[hash:base64:10]',
+            'sass-loader',
+            'sass-resources-loader',
+            'import-glob-loader',
+            'postcss-loader',
+          ],
+        },
+        {
+          test: /\.jpe?g$|\.gif$|\.png$|\.ico$|\.svg$/,
+          loader: 'file-loader?name=../img/[name].[ext]',
+        },
+        {
+          test: /\.(woff|woff2|eot|ttf)$/,
+          loader: 'url-loader',
+        },
+        {
+          test: /\.jsx?$/,
+          loader: 'babel-loader',
+          exclude: /node_modules/,
+        }
+      ],
+    },
+    output: {
+        path: path.resolve('./build/assets/'),
+        filename: 'bundle.js',
+        publicPath: '/assets/',
+    },
+    plugins: [
+      new HTMLwebpackPlugin({
+        filename: '../index.html',
+        template: './app/views/index.ejs',
+      }),
+      new webpack.HotModuleReplacementPlugin(),
+      new webpack.NoErrorsPlugin(),
+      new webpack.LoaderOptionsPlugin({
+        options: {
+          postcss: [
+            autoprefixer(),
+          ],
+          sassResources: [
+            './app/constants/_style-variables.scss',
+          ],
+          context: path.resolve(__dirname, '../../')
+        }
+      })
+    ],
+  },
+  server: {
+    entry: './server/',
+    resolve: {
+      extensions: ['.js'],
+    },
+    node: {
+      __dirname: false,
+      __filename: false,
+    },
+    externals: /^[a-z\-0-9]+$/,
+    module: {
+      rules: [
+        {
+          test: /\.js$/,
+          loader: 'babel-loader',
+          exclude: /node_modules/,
+        },
+      ],
+    },
+    output: {
+      path: './',
+      filename: 'server.js',
+      libraryTarget: 'commonjs2',
+    },
+  },
+}