Directory Layout:
├── /app/ # The source code of the application
│ ├── /actions/ # Redux action creators
│ ├── /components/ # Generic React Components (generally Dumb components)
│ ├── /constants/ # Constants (action types etc.)
│ ├── /containers/ # Components that provide context (e.g. Redux Provider)
│ ├── /public/ # Static files which are copied into the /dist/ root folder
│ ├── /reducers/ # Redux reducers
│ ├── /routes/ # Application route definitions
│ ├── /store/ # Redux store configuration
│ ├── /tmpl/ # Static content (plain HTML or Markdown)
│ ├── /utils/ # Generic utilities
│ ├── index.js # Application bootstrap and rendering
│
├── /build/ # The folder for compiled output
├── /dist/ # The folder for deploy output
├── /node_modules/ # 3rd-party libraries and utilities
├── webpack.config.js # configuration file for webpack
├── package.json # The list of 3rd party libraries and utilities
Dev:
$ npm run dev
Browser sync:
$ npm run browsersync
Deploy:
$ npm run deploy
Image compress:
By default "npm run tinypng" will replace the original png files, there more usage:
tinypng [options] [image.png|*.png]
-k, --api-key Set default TinyPNG API key.
-r, --allow-rewrite Rewrite the original files with compressed data.
-n, --allow-nonpng Allow you to compress files without .png extention.
-p, --postfix Postfix for compressed files when rewriting disabled.
-h, --help This message.
-v, --version Show version.
you can custom the scripts in package.json file.
react router have scroll behaviors issues, i.e: getting scroll position to reset to the top of a page on navigationyou can see the solution from here: https://github.com/rackt/react-router/blob/73e6c85f427c48f90bae0bb0e9745b6b48536e2f/CHANGES.md#scrolling
iOS's dreaded 300ms tap delay. React's onClick attribute falls prey to it. Facebook's working on a solution in the form of TapEventPlugin, but it won't be made available until 1.0.see more from here: https://github.com/zilverline/react-tap-event-plugin