upgrated Reacme file. Added more documentation for code in app.

CHANGELOG.md

@@ -1,5 +1,11 @@
-## Suspense/Lazy/Redux App
-
-
-# 0.0.1
- * App has created.
+## Webpack4 - React16.7 Templater App
+
+
+# 0.2.0
+ * Added more beatiful mocks (extended from create-react-app).
+
+# 0.1.0
+ * App has been more clearly documented across whole app code.
+
+# 0.0.1
+ * App has been created.

README.md

@@ -0,0 +1,62 @@
+## Webpack4 - React16.7 Templater App
+# Make custom React app development easly as never before!
+
+# Features:
+ * Fast React app creation.
+ * Can be custumized as you whish.
+ * All needed packages to work you can bootstap just by one command with `lerna` npm package: `lerna bootstrap`
+ * Support TypeScript version 3^.
+
+ # Webpack:
+ * Fully support all Webpack 4^ possibilities.
+ * Support code-splitting and bundles app creation out of the box.
+ * Created 3 independent development cases: `test`, `development`, `production`. Each of them has own best optimized configuration.
+ * Integrated Babel 7^ with supporting all ES6-ES8 features.
+ * Integrated Ujlifty Webpack Plugin ^0 for optimizing JS/JSX/TS/TSX bundles for development and production.
+ * Integrated Mini CSS Webpack Plugin ^0 + OptimizeCSS Assets Webpack Plugin ^5 for optimizing CSS bundles for development and production.
+ * Integrated Webpack Bundle Analyzer ^3 for visual analyzing of code/bundles weight.
+ * Transpile all app code into native ES5 for supporting even an oldest browsers.
+
+ # React:
+ * Support all new features from React 16.7@-alpha release.
+ * Hooks, Suspence and Lazy load can be used out of the box.
+
+ # Styling:
+ * Support CSS/SASS style markup.
+ * Integrated CSSModules for independent component styling.
+ * Including PostCSS ^2 post-processor.
+
+ # Testing:
+ * Integrated Jest 23^ + Enzyme 3^ testing environment.
+ * Includes pre-commits hooks for testing app before commit (if test are present in).
+ * Support JS/JSX/TS/TSX file extensions.
+
+ # Linting:
+ * Integrated `prettier` package for beatify pre-commited code.
+ * Integrated eslint 5^ + tslint 5^ + stylelint 9^ linters based on the most popular schemas in the world (facebook, microsoft, airbnb, etc.) with React life-cycle ecosystem supporting.
+
+ # Git:
+ * Includes pre-commits hooks with husky ^1
+ * Includes lint-stages ^1 for styling and testing whole app code (js/jsx/ts/tsx/css/scss/json) before commiting.
+ * Checks code on lint rule errors before accept user commit.
+ * Run test suits before accept user commit.
+
+
+## Technical information:
+# App technical environment that are 100% support with:
+ * Node 10.5
+ * Yarn 1.9.4
+ * Webpack 4.23.1
+ * React 16.7
+
+# App global package installing requirements:
+ * node
+ * yarn/npm
+ * eslint/tsline/stylelint
+ * lerna
+ * typescript
+
+
+## FAQ:
+ # "Command `lerna bootstrap` is does not works."
+ * To bring it work you need install it globally first by command `yarn add lerna -g`. After that navigate to your working folder and repeat command `lerna bootstrap` one more time.

globals.js

@@ -1,3 +1,4 @@
+// global variables for webpack and app hot-reload. Make them work more easly.
 global.__TEST__ = process.env.NODE_ENV === 'test';
 global.__DEV__ = process.env.NODE_ENV === 'development';
 global.__PROD__ = process.env.NODE_ENV === 'production';

jest.config.js

@@ -1,22 +1,22 @@
-module.exports = {
-    cacheDirectory: '<rootDir>/.tmp/jest',
-    coverageDirectory: './.tmp/coverage',
-    moduleNameMapper: {
-      '^.+\\.(scss)$': 'identity-obj-proxy'
-    },
-    modulePaths: ['<rootDir>'],
-    moduleFileExtensions: ['js', 'jsx', 'json'],
-    globals: {
-      NODE_ENV: 'test'
-    },
-    verbose: true,
-    testRegex: '(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js)$',
-    testPathIgnorePatterns: ['/node_modules/', '/__tests__/mocks/.*'],
-    transformIgnorePatterns: ['.*(node_modules)(?!.*torn.*).*$'],
-    transform: {
-      '^.+\\.js$': 'babel-jest'
-    },
-    setupFiles: ['<rootDir>/setupTests.js'],
-    snapshotSerializers: ['enzyme-to-json/serializer']
-  }
-  
+// Jest tesitng config. Responce for app tests.
+module.exports = {
+  cacheDirectory: '<rootDir>/.tmp/jest',
+  coverageDirectory: './.tmp/coverage',
+  moduleNameMapper: {
+    '^.+\\.(scss)$': 'identity-obj-proxy'
+  },
+  modulePaths: ['<rootDir>'],
+  moduleFileExtensions: ['js', 'jsx', 'json'],
+  globals: {
+    NODE_ENV: 'test'
+  },
+  verbose: true,
+  testRegex: '(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js)$',
+  testPathIgnorePatterns: ['/node_modules/', '/__tests__/mocks/.*'],
+  transformIgnorePatterns: ['.*(node_modules)(?!.*torn.*).*$'],
+  transform: {
+    '^.+\\.js$': 'babel-jest'
+  },
+  setupFiles: ['<rootDir>/setupTests.js'],
+  snapshotSerializers: ['enzyme-to-json/serializer']
+};

lerna.json

@@ -1,6 +1,6 @@
-{
-    "lerna": "2.11.0",
-    "npmClient": "yarn",
-    "useWorkspaces": false,
-    "hoist": true
-  }
+{
+  "lerna": "2.11.0",
+  "npmClient": "yarn",
+  "useWorkspaces": false,
+  "hoist": true
+}

package.json

@@ -90,6 +90,7 @@
     "classnames": "^2.2.6",
     "css-loader": "^1.0.1",
     "cssnano": "^4.1.7",
+    "enzyme": "^3.7.0",
     "enzyme-to-json": "^3.3.4",
     "eslint": "^5.8.0",
     "eslint-config-airbnb": "^17.1.0",
@@ -115,12 +116,13 @@
     "redbox-react": "^1.6.0",
     "sass-loader": "^7.1.0",
     "style-loader": "^0.23.1",
-    "stylelint": "^9.4.0",
+    "stylelint": "^9.7.1",
     "stylelint-config-sass-guidelines": "^5.2.0",
     "stylelint-config-standard": "^18.2.0",
     "stylelint-no-unsupported-browser-features": "^3.0.1",
     "stylelint-order": "^1.0.0",
     "stylelint-scss": "^3.3.0",
+    "tslint": "^5.11.0",
     "url-loader": "^1.1.2",
     "webpack-bundle-analyzer": "^3.0.3"
   },
@@ -135,18 +137,14 @@
     "browser-sync-webpack-plugin": "^2.2.2",
     "clean-webpack-plugin": "^0.1.19",
     "debug": "^4.1.0",
-    "express": "^4.16.4",
     "html-loader": "^0.5.5",
     "html-webpack-plugin": "^3.2.0",
     "mini-css-extract-plugin": "^0.4.1",
-    "normalizr": "^3.2.4",
     "optimize-css-assets-webpack-plugin": "^5.0.1",
     "path": "^0.12.7",
     "prop-types": "^15.6.0",
     "react": "^16.7.0-alpha.0",
     "react-dom": "^16.7.0-alpha.0",
-    "react-redux": "^5.1.0",
-    "redux": "^4.0.1",
     "uglifyjs-webpack-plugin": "^1.2.7",
     "webpack": "^4.23.1",
     "webpack-cli": "^3.1.2",

prettier.config.js

@@ -1,10 +1,10 @@
-module.exports = {
-  useTabs: false,
-  printWidth: 120,
-  tabWidth: 2,
-  singleQuote: true,
-  trailingComma: 'none',
-  jsxBracketSameLine: false,
-  semi: false,
-  write: true
-}
+module.exports = {
+  useTabs: false,
+  printWidth: 120,
+  tabWidth: 2,
+  singleQuote: true,
+  trailingComma: 'none',
+  jsxBracketSameLine: false,
+  semi: false,
+  write: true
+};