113 lines
3.9 KiB
Markdown
113 lines
3.9 KiB
Markdown
# Wedding RSVP site
|
|
Forked from [React Starter Kit](https://www.reactstarterkit.com)
|
|
development built on top of [Node.js](https://nodejs.org/),
|
|
[Express](http://expressjs.com/), [GraphQL](http://graphql.org/) and
|
|
[React](https://facebook.github.io/react/), containing modern web development
|
|
tools such as [Webpack](http://webpack.github.io/), [Babel](http://babeljs.io/)
|
|
and [Browsersync](http://www.browsersync.io/). Helping you to stay productive
|
|
following the best practices. A solid starting point for both professionals
|
|
and newcomers to the industry.
|
|
|
|
## Getting Started
|
|
|
|
### Requirements
|
|
|
|
* Mac OS X, Windows, or Linux
|
|
* [Yarn](https://yarnpkg.com/) package + [Node.js](https://nodejs.org/) v6.5 or newer
|
|
* `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-editors.md))
|
|
|
|
### Quick Start
|
|
|
|
#### 1. Run `yarn install`
|
|
|
|
This will install both run-time project dependencies and developer tools listed
|
|
in [package.json](../package.json) file.
|
|
|
|
#### 2. Run `yarn 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.
|
|
|
|
> [http://localhost:3000/](http://localhost:3000/) — Node.js server (`build/server.js`)<br>
|
|
> [http://localhost:3000/graphql](http://localhost:3000/graphql) — GraphQL server and IDE<br>
|
|
> [http://localhost:3001/](http://localhost:3001/) — BrowserSync proxy with HMR, React Hot Transform<br>
|
|
> [http://localhost:3002/](http://localhost:3002/) — BrowserSync control panel (UI)
|
|
|
|
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 `yarn 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
|
|
$ yarn start -- --release
|
|
```
|
|
*NOTE: double dashes are required*
|
|
|
|
|
|
### How to Build, Test, Deploy
|
|
|
|
If you need just to build the app (without running a dev server), simply run:
|
|
|
|
```shell
|
|
$ yarn run build
|
|
```
|
|
|
|
or, for a production build:
|
|
|
|
```shell
|
|
$ yarn run build -- --release
|
|
```
|
|
|
|
or, for a production docker build:
|
|
|
|
```shell
|
|
$ yarn run build -- --release --docker
|
|
```
|
|
|
|
*NOTE: double dashes are required*
|
|
|
|
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
|
|
$ yarn run lint
|
|
```
|
|
|
|
To launch unit tests:
|
|
|
|
```shell
|
|
$ yarn run test # Run unit tests with Mocha
|
|
$ yarn run test:watch # Launch unit test runner and start watching for changes
|
|
```
|
|
|
|
By default, [Mocha](https://mochajs.org/) test runner is looking for test files
|
|
matching the `src/**/*.test.js` pattern. Take a look at `src/components/Layout/Layout.test.js`
|
|
as an example.
|
|
|
|
To deploy the app, run:
|
|
|
|
```shell
|
|
$ yarn 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 `yarn install --production`
|
|
upon receiving new files from you. Note, you should only deploy the contents
|
|
of the `/build` folder to a remote server.
|
|
|