commit 22d7b60a6320dd0bf5bf27c0ab9974597d4fd252
parent af7bea9da2bf42d3b5984293a5dc1efa06850ea8
Author: Konstantin Tarkus <hello@tarkus.me>
Date: Sat, 19 Dec 2015 12:27:55 +0300
Update the Getting Started documentation
Diffstat:
5 files changed, 125 insertions(+), 66 deletions(-)
diff --git a/README.md b/README.md
@@ -15,11 +15,17 @@
See [demo](http://demo.reactstarterkit.com) |
[docs](https://github.com/kriasoft/react-starter-kit/tree/master/docs) |
[bugs & feature requests](https://waffle.io/kriasoft/react-starter-kit) |
-join [#react-starter-kit](https://gitter.im/kriasoft/react-starter-kit) chatroom to stay up to date
+join [#react-starter-kit](https://gitter.im/kriasoft/react-starter-kit) chatroom to stay up to date |
+visit our sponsors:
[](https://rollbar.com/?utm_source=reactstartkit(github)&utm_medium=link&utm_campaign=reactstartkit(github))
[](https://localizejs.com/?cid=802&utm_source=rsk)
+### Getting Started
+
+ * Follow the [getting started guide](./docs/getting-started.md) to download and run the project
+ * Check the [code recipes](./docs/recipes) used in this boilerplate, or share yours
+
### Directory Layout
```
@@ -56,69 +62,6 @@ join [#react-starter-kit](https://gitter.im/kriasoft/react-starter-kit) chatroom
└── preprocessor.js # ES6 transpiler settings for Jest
```
-### Getting Started
-
-Just clone the repo and start hacking:
-
-```shell
-$ git clone -o react-starter-kit -b master --single-branch \
- https://github.com/kriasoft/react-starter-kit.git MyApp
-$ cd MyApp
-$ npm install # Install Node.js components listed in ./package.json
-$ npm start # Compile and launch
-```
-
-### How to Build
-
-```shell
-$ npm run build # or, `npm run build -- --release`
-```
-
-By default, it builds in *debug* mode. If you need to build in release
-mode, just add a `-- --release` flag. This will optimize the output bundle for
-production.
-
-### How to Run
-
-```shell
-$ npm start # or, `npm start -- --release`
-```
-
-This will start a light-weight development server with "live reload" and
-synchronized browsing across multiple devices and browsers.
-
-### How to Deploy
-
-```shell
-$ npm run deploy # or, `npm run deploy -- --production`
-```
-
-For more information see `tools/deploy.js`.
-
-### How to Update
-
-You can always fetch and merge recent changes from this repo back into
-your own project:
-
-```shell
-$ git checkout master
-$ git fetch react-starter-kit
-$ git merge react-starter-kit/master
-$ npm install
-```
-
-### How to Test
-
-Run unit tests powered by [Jest](https://facebook.github.io/jest/) with the following
-[npm](https://www.npmjs.org/doc/misc/npm-scripts.html) command:
-
-```shell
-$ npm test
-```
-
-Test any javascript module by creating a `__tests__/` directory where
-the file is. Append `-test.js` to the filename and [Jest](https://facebook.github.io/jest/) will do the rest.
-
### Related Projects
* [React Static Boilerplate](https://github.com/koistya/react-static-boilerplate) — Generates static websites from React components
diff --git a/docs/README.md b/docs/README.md
@@ -2,6 +2,7 @@
### General
+* [Getting Started](./getting-started.md)
* [React Style Guide](./react-style-guide.md)
* [How to configure text editors and IDEs](./how-to-configure-text-editors.md)
* [Data fetching with WHATWG Fetch](./data-fetching.md)
diff --git a/docs/getting-started.md b/docs/getting-started.md
@@ -0,0 +1,114 @@
+## Getting Started
+
+### Requirements
+
+ * Max OS X, Windows, or Linux
+ * [Node.js](https://nodejs.org/) v5.0 or newer
+ * `npm` v3.3 or newer (new to [npm](https://docs.npmjs.com/)?)
+ * `node-gyp` prerequisites mentioned [here](https://github.com/nodejs/node-gyp)
+ * Text editor or IDE pre-configured with React/JSX/Flow/ESlint ([learn more](./how-to-configure-text-edito.md))
+
+### Quick Start
+
+#### 1. Get the latest version
+
+You can start by cloning the latest version of React Starter Kit (RSK) on your
+local machine by running:
+
+```shell
+$ git clone -o react-starter-kit -b master --single-branch \
+ https://github.com/kriasoft/react-starter-kit.git MyApp
+$ cd MyApp
+```
+
+Alternatively, you can start a new project based on RSK right from
+[WebStorm IDE](https://www.jetbrains.com/webstorm/help/create-new-project-react-starter-kit.html),
+or by using [Yeoman generator](https://www.npmjs.com/package/generator-react-fullstack).
+
+#### 2. Run `npm install`
+
+This will install both run-time project dependencies and developer tools listed
+in [package.json](../package.json) file.
+
+#### 3. Run `npm start`
+
+This command will build the app from the source files (`/src`) into the output
+`/build` folder. As soon as the initial build completes, it will start the
+Node.js server (`node build/server.js`) and [Browsersync](https://browsersync.io/)
+with [HMR](https://webpack.github.io/docs/hot-module-replacement) on top of it.
+
+Now you can open your web app in a browser, on mobile devices and start
+hacking. Whenever you modify any of the source files inside the `/src` folder,
+the module bundler ([Webpack](http://webpack.github.io/)) will recompile the
+app on the fly and refresh all the connected browsers.
+
+
+
+Note that the `npm start` command launches the app in `development` mode,
+the compiled output files are not optimized and minimized in this case.
+You can use `--release` command line argument to check how your app works
+in release (production) mode:
+
+```shell
+$ npm start -- --release
+```
+
+### How to Build, Test, Deploy
+
+If you need just to build the app (without running a dev server), simply run:
+
+```shell
+$ npm run build
+```
+
+or, for a production build:
+
+```shell
+$ npm run build -- --release
+```
+
+After running this command, the `/build` folder will contain the compiled
+version of the app. For example, you can launch Node.js server normally by
+running `node build/server.js`.
+
+To check the source code for syntax errors and potential issues run:
+
+```shell
+$ npm run lint
+```
+
+To launch unit tests:
+
+```shell
+$ npm test
+```
+
+Test any javascript module by creating a `__tests__/` directory where
+the file is. Append `-test.js` to the filename and
+[Jest](https://facebook.github.io/jest/) will do the rest.
+
+To deploy the app, run:
+
+```shell
+$ npm run deploy
+```
+
+The deployment script `tools/deploy.js` is configured to push the contents of
+the `/build` folder to a remote server via Git. You can easily deploy your app
+to [Azure Web Apps](https://azure.microsoft.com/en-us/services/app-service/web/),
+or [Heroku](https://www.heroku.com/) this way. Both will execute `npm install --production`
+upon receiving new files from you. Note, you should only deploy the contents
+of the `/build` folder to a remote server.
+
+### How to Update
+
+If you need to keep your project up to date with the recent changes made to RSK,
+you can always fetch and merge them from [this repo](https://github.com/kriasoft/react-starter-kit)
+back into your own project by running:
+
+```shell
+$ git checkout master
+$ git fetch react-starter-kit
+$ git merge react-starter-kit/master
+$ npm install
+```
diff --git a/package.json b/package.json
@@ -1,8 +1,8 @@
{
"private": true,
"engines": {
- "node": ">=4.1 <5",
- "npm": ">=3.1 <4"
+ "node": ">=5.0 <6",
+ "npm": ">=3.3 <4"
},
"dependencies": {
"babel-core": "5.8.34",
diff --git a/tools/webpack.config.js b/tools/webpack.config.js
@@ -129,6 +129,7 @@ const clientConfig = merge({}, config, {
new webpack.optimize.DedupePlugin(),
new webpack.optimize.UglifyJsPlugin({
compress: {
+ screw_ie8: true,
warnings: VERBOSE,
},
}),
