Home Explore Help
Sign In
brwong
/
maker
Watch 1
Star 0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Browse Source

added webpack-based frontend (incl. react/redux) template

Brandon Wong 8 years ago
parent
a8f231a007
commit
748422dd24
27 changed files with 7124 additions and 0 deletions
Unified View Show Diff Stats
  1. 9 0
      frontend-blank/.babelrc
  2. 8 0
      frontend-blank/.gitignore
  3. 37 0
      frontend-blank/package.json
  4. 0 0
      frontend-blank/public/assets/.gitkeep
  5. 11 0
      frontend-blank/public/index.html
  6. 6 0
      frontend-blank/src/index.js
  7. 4 0
      frontend-blank/src/style/index.scss
  8. 8 0
      frontend-blank/test/main.js
  9. 16 0
      frontend-blank/test/suite.js
  10. 33 0
      frontend-blank/webpack.config.js
  11. 3383 0
      frontend-blank/yarn.lock
  12. 9 0
      frontend/.babelrc
  13. 8 0
      frontend/.gitignore
  14. 46 0
      frontend/package.json
  15. 0 0
      frontend/public/assets/.gitkeep
  16. 12 0
      frontend/public/index.html
  17. 8 0
      frontend/src/actions.js
  18. 9 0
      frontend/src/components/App.js
  19. 23 0
      frontend/src/components/ExampleContainer.js
  20. 27 0
      frontend/src/index.js
  21. 12 0
      frontend/src/reducers/exampleReducer.js
  22. 11 0
      frontend/src/reducers/index.js
  23. 4 0
      frontend/src/style/index.scss
  24. 8 0
      frontend/test/main.js
  25. 16 0
      frontend/test/suite.js
  26. 33 0
      frontend/webpack.config.js
  27. 3383 0
      frontend/yarn.lock

+ 9 - 0
frontend-blank/.babelrc
View File 

@@ -0,0 +1,9 @@
 
+{
 
+  "presets": ["latest", "react"],
 
+  "plugins": ["transform-runtime", "transform-object-rest-spread"],
 
+  "env": {
 
+    "production": {
 
+      "plugins": ["transform-remove-console"]
 
+    }
 
+  }
 
+}

+ 8 - 0
frontend-blank/.gitignore
View File 

@@ -0,0 +1,8 @@
 
+.idea
 
+node_modules
 
+build
 
+test-build
 
+npm-debug*
 
+*.swp
 
+public/assets/*
 
+!public/assets/.gitkeep

+ 37 - 0
frontend-blank/package.json
View File 

@@ -0,0 +1,37 @@
 
+{
 
+  "name": "@brwong/$foldername",
 
+  "author": "Brandon Wong",
 
+  "version": "0.1.0",
 
+  "main": "index.js",
 
+  "scripts": {
 
+    "test": "node test/index.js",
 
+    "watch": "webpack -d --display-error-details --progress --watch",
 
+    "serve": "http-server -a 127.0.0.1",
 
+    "testwatch": "nodemon --watch src --watch test --exec \"npm test\""
 
+  },
 
+  "devDependencies": {
 
+    "babel-core": "^6.23.1",
 
+    "babel-loader": "^6.3.2",
 
+    "babel-plugin-transform-object-rest-spread": "^6.23.0",
 
+    "babel-plugin-transform-remove-console": "^6.8.0",
 
+    "babel-plugin-transform-runtime": "^6.23.0",
 
+    "babel-polyfill": "^6.20.0",
 
+    "babel-preset-latest": "^6.22.0",
 
+    "babel-preset-react": "^6.23.0",
 
+    "babel-register": "^6.18.0",
 
+    "css-loader": "^0.26.1",
 
+    "extract-text-webpack-plugin": "^2.0.0-rc.3",
 
+    "file-loader": "^0.10.0",
 
+    "http-server": "^0.9.0",
 
+    "node-sass": "^4.5.0",
 
+    "nodemon": "^1.11.0",
 
+    "sass-loader": "^6.0.0",
 
+    "style-loader": "^0.13.1",
 
+    "tape-promise": "^2.0.1",
 
+    "tape": "^4.6.3",
 
+    "url-loader": "^0.5.7",
 
+    "webpack": "^2.2.1"
 
+  },
 
+  "description": "",
 
+  "private": true
 
+}

+ 0 - 0
frontend-blank/public/assets/.gitkeep
View File


+ 11 - 0
frontend-blank/public/index.html
View File 

@@ -0,0 +1,11 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+<head>
 
+    <meta charset="UTF-8">
 
+    <title>$foldername</title>
 
+    <link rel="stylesheet" href="/assets/style.css">
 
+</head>
 
+<body>
 
+<script src="/assets/script.js"></script>
 
+</body>
 
+</html>

+ 6 - 0
frontend-blank/src/index.js
View File 

@@ -0,0 +1,6 @@
 
+
 
+import _styles from './style/index.scss';
 
+
 
+console.log('hello');
 
+
 
+

+ 4 - 0
frontend-blank/src/style/index.scss
View File 

@@ -0,0 +1,4 @@
 
+
 
+/* styles go here */
 
+
 
+

+ 8 - 0
frontend-blank/test/main.js
View File 

@@ -0,0 +1,8 @@
 
+
 
+require('babel-register')({
 
+    "presets": ["latest", "react"],
 
+    "plugins": ["transform-runtime", "transform-object-rest-spread"],
 
+});
 
+require('babel-polyfill');
 
+require('./suite.js');
 
+

+ 16 - 0
frontend-blank/test/suite.js
View File 

@@ -0,0 +1,16 @@
 
+
 
+import tape from 'tape';
 
+import _test from 'tape-promise';
 
+
 
+const tapetest = _test(tape);
 
+
 
+import * as reducers from '../src/reducers/index.js';
 
+import * as actions from '../src/actions.js';
 
+
 
+
 
+tapetest('test', async function testProgram(t) {
 
+    t.pass('empty test file');
 
+    t.end();
 
+});
 
+
 
+

+ 33 - 0
frontend-blank/webpack.config.js
View File 

@@ -0,0 +1,33 @@
 
+const webpack = require("webpack");
 
+const path = require('path');
 
+
 
+const ExtractTextPlugin = require('extract-text-webpack-plugin');
 
+
 
+module.exports = {
 
+    entry: {
 
+        script: path.resolve(__dirname, 'src', 'index.js'),
 
+    },
 
+    output: {
 
+        path: path.resolve(__dirname, 'public', 'assets'),
 
+        filename: '[name].js',
 
+        chunkFilename: '[name].js',
 
+        publicPath: '/assets/'
 
+    },
 
+    module: {
 
+        rules: [
 
+            { test: /\.scss$/, use: ExtractTextPlugin.extract({ fallback: "style-loader", use: ["css-loader", "sass-loader"], publicPath: "/assets" }), exclude: /node_modules/ },
 
+            { test: /\.js$/, use: "babel-loader", exclude: /node_modules/ },
 
+            { test: /\.(woff|woff2)(\?v=\d+\.\d+\.\d+)?$/, loader: 'url-loader?limit=10000&mimetype=application/font-woff' },
 
+            { test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/, loader: 'url-loader?limit=10000&mimetype=application/octet-stream' },
 
+            { test: /\.svg(\?v=\d+\.\d+\.\d+)?$/, loader: 'url-loader?limit=10000&mimetype=application/octet-stream' },
 
+            { test: /\.eot(\?v=\d+\.\d+\.\d+)?$/, loader: 'file-loader' },
 
+        ],
 
+    },
 
+    plugins: [
 
+        new ExtractTextPlugin({
 
+            filename: "style.css",
 
+            disable: false,
 
+            allChunks: true
 
+        }),
 
+    ],
 
+};

File diff suppressed because it is too large
+ 3383 - 0
frontend-blank/yarn.lock


+ 9 - 0
frontend/.babelrc
View File 

@@ -0,0 +1,9 @@
 
+{
 
+  "presets": ["latest", "react"],
 
+  "plugins": ["transform-runtime", "transform-object-rest-spread"],
 
+  "env": {
 
+    "production": {
 
+      "plugins": ["transform-remove-console"]
 
+    }
 
+  }
 
+}

+ 8 - 0
frontend/.gitignore
View File 

@@ -0,0 +1,8 @@
 
+.idea
 
+node_modules
 
+build
 
+test-build
 
+npm-debug*
 
+*.swp
 
+public/assets/*
 
+!public/assets/.gitkeep

+ 46 - 0
frontend/package.json
View File 

@@ -0,0 +1,46 @@
 
+{
 
+  "name": "@brwong/$foldername",
 
+  "author": "Brandon Wong",
 
+  "version": "0.1.0",
 
+  "main": "index.js",
 
+  "scripts": {
 
+    "test": "node test/index.js",
 
+    "watch": "webpack -d --display-error-details --progress --watch",
 
+    "serve": "http-server -a 127.0.0.1",
 
+    "testwatch": "nodemon --watch src --watch test --exec \"npm test\""
 
+  },
 
+  "devDependencies": {
 
+    "babel-core": "^6.23.1",
 
+    "babel-loader": "^6.3.2",
 
+    "babel-plugin-transform-object-rest-spread": "^6.23.0",
 
+    "babel-plugin-transform-remove-console": "^6.8.0",
 
+    "babel-plugin-transform-runtime": "^6.23.0",
 
+    "babel-polyfill": "^6.20.0",
 
+    "babel-preset-latest": "^6.22.0",
 
+    "babel-preset-react": "^6.23.0",
 
+    "babel-register": "^6.18.0",
 
+    "css-loader": "^0.26.1",
 
+    "extract-text-webpack-plugin": "^2.0.0-rc.3",
 
+    "file-loader": "^0.10.0",
 
+    "http-server": "^0.9.0",
 
+    "node-sass": "^4.5.0",
 
+    "nodemon": "^1.11.0",
 
+    "react": "^15.4.2",
 
+    "react-dom": "^15.4.2",
 
+    "react-redux": "^5.0.3",
 
+    "redux": "^3.6.0",
 
+    "redux-thunk": "^2.2.0",
 
+    "sass-loader": "^6.0.0",
 
+    "style-loader": "^0.13.1",
 
+    "tape-promise": "^2.0.1",
 
+    "tape": "^4.6.3",
 
+    "url-loader": "^0.5.7",
 
+    "webpack": "^2.2.1"
 
+  },
 
+  "dependencies": {
 
+    "css-loader": "^0.26.2",
 
+    "style-loader": "^0.13.2",
 
+    "url-loader": "^0.5.8"
 
+  },
 
+  "private": true
 
+}

+ 0 - 0
frontend/public/assets/.gitkeep
View File


+ 12 - 0
frontend/public/index.html
View File 

@@ -0,0 +1,12 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+<head>
 
+    <meta charset="UTF-8">
 
+    <title>$foldername</title>
 
+    <link rel="stylesheet" href="/assets/style.css">
 
+</head>
 
+<body>
 
+    <div id="container"></div>
 
+    <script src="/assets/script.js"></script>
 
+</body>
 
+</html>

+ 8 - 0
frontend/src/actions.js
View File 

@@ -0,0 +1,8 @@
 
+
 
+
 
+export function action() {
 
+    return {
 
+        type: 'ACTION',
 
+    };
 
+}
 
+

+ 9 - 0
frontend/src/components/App.js
View File 

@@ -0,0 +1,9 @@
 
+
 
+import React from 'react';
 
+
 
+
 
+export default function App() {
 
+    return <div>application</div>;
 
+}
 
+
 
+

+ 23 - 0
frontend/src/components/ExampleContainer.js
View File 

@@ -0,0 +1,23 @@
 
+
 
+import React from 'react';
 
+import { connect } from 'react-redux';
 
+import ExampleComponent from './ExampleComponent.js';
 
+
 
+
 
+function ExampleContainer(props) {
 
+    return <div>
 
+            <ExampleComponent />
 
+        </div>;
 
+}
 
+
 
+
 
+function stateToProps(state) {
 
+    return {};
 
+}
 
+function dispatchToProps(dispatch) {
 
+    return {};
 
+}
 
+
 
+export default connect(stateToProps, dispatchToProps)(ExampleContainer);
 
+
 
+

+ 27 - 0
frontend/src/index.js
View File 

@@ -0,0 +1,27 @@
 
+
 
+import _styles from './style/index.scss';
 
+import React from 'react';
 
+import ReactDOM from 'react-dom';
 
+import { Provider } from 'react-redux';
 
+import { createStore, applyMiddleware } from 'redux';
 
+//import thunkMiddleware from 'redux-thunk';
 
+
 
+import reducers from './reducers/index.js';
 
+import App from './components/App.js';
 
+
 
+/*
 
+ex:
 
+createStore(reducer, applyMiddleware(thunkMiddleware))
 
+*/
 
+
 
+const store = createStore(reducers, /*initialState,*/ window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__());
 
+
 
+ReactDOM.render(
 
+    <Provider store={store}>
 
+        <App />
 
+    </Provider>,
 
+    document.getElementById('container')
 
+);
 
+
 
+
 
+

+ 12 - 0
frontend/src/reducers/exampleReducer.js
View File 

@@ -0,0 +1,12 @@
 
+
 
+
 
+const defaultState = Object.freeze({});
 
+
 
+export default function example(state = defaultState, action = {type:'NO-OP'}) {
 
+    switch( action.type ) {
 
+        default:
 
+            return state;
 
+    }
 
+}
 
+
 
+

+ 11 - 0
frontend/src/reducers/index.js
View File 

@@ -0,0 +1,11 @@
 
+
 
+import { combineReducers } from 'redux';
 
+//import reducer from './reducer.js';
 
+
 
+const mainReducer = combineReducers({
 
+    
+});
 
+
 
+export { mainReducer as default };
 
+
 
+

+ 4 - 0
frontend/src/style/index.scss
View File 

@@ -0,0 +1,4 @@
 
+
 
+/* styles go here */
 
+
 
+

+ 8 - 0
frontend/test/main.js
View File 

@@ -0,0 +1,8 @@
 
+
 
+require('babel-register')({
 
+    "presets": ["latest", "react"],
 
+    "plugins": ["transform-runtime", "transform-object-rest-spread"],
 
+});
 
+require('babel-polyfill');
 
+require('./suite.js');
 
+

+ 16 - 0
frontend/test/suite.js
View File 

@@ -0,0 +1,16 @@
 
+
 
+import tape from 'tape';
 
+import _test from 'tape-promise';
 
+
 
+const tapetest = _test(tape);
 
+
 
+import * as reducers from '../src/reducers/index.js';
 
+import * as actions from '../src/actions.js';
 
+
 
+
 
+tapetest('test', async function testProgram(t) {
 
+    t.pass('empty test file');
 
+    t.end();
 
+});
 
+
 
+

+ 33 - 0
frontend/webpack.config.js
View File 

@@ -0,0 +1,33 @@
 
+const webpack = require("webpack");
 
+const path = require('path');
 
+
 
+const ExtractTextPlugin = require('extract-text-webpack-plugin');
 
+
 
+module.exports = {
 
+    entry: {
 
+        script: path.resolve(__dirname, 'src', 'index.js'),
 
+    },
 
+    output: {
 
+        path: path.resolve(__dirname, 'public', 'assets'),
 
+        filename: '[name].js',
 
+        chunkFilename: '[name].js',
 
+        publicPath: '/assets/'
 
+    },
 
+    module: {
 
+        rules: [
 
+            { test: /\.scss$/, use: ExtractTextPlugin.extract({ fallback: "style-loader", use: ["css-loader", "sass-loader"], publicPath: "/assets" }), exclude: /node_modules/ },
 
+            { test: /\.js$/, use: "babel-loader", exclude: /node_modules/ },
 
+            { test: /\.(woff|woff2)(\?v=\d+\.\d+\.\d+)?$/, loader: 'url-loader?limit=10000&mimetype=application/font-woff' },
 
+            { test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/, loader: 'url-loader?limit=10000&mimetype=application/octet-stream' },
 
+            { test: /\.svg(\?v=\d+\.\d+\.\d+)?$/, loader: 'url-loader?limit=10000&mimetype=application/octet-stream' },
 
+            { test: /\.eot(\?v=\d+\.\d+\.\d+)?$/, loader: 'file-loader' },
 
+        ],
 
+    },
 
+    plugins: [
 
+        new ExtractTextPlugin({
 
+            filename: "style.css",
 
+            disable: false,
 
+            allChunks: true
 
+        }),
 
+    ],
 
+};

File diff suppressed because it is too large
+ 3383 - 0
frontend/yarn.lock