Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/kimjuny/koa-react-universal
lightweight React-Koa2 universal boilerplate, only what is essential
https://github.com/kimjuny/koa-react-universal
boilerplate code-splitting hmr isomorphic koa react react-router-v4 redux-thunk ssr universal webpack3
Last synced: about 1 month ago
JSON representation
lightweight React-Koa2 universal boilerplate, only what is essential
- Host: GitHub
- URL: https://github.com/kimjuny/koa-react-universal
- Owner: kimjuny
- License: mit
- Created: 2017-08-11T05:09:59.000Z (over 7 years ago)
- Default Branch: master
- Last Pushed: 2022-02-12T03:46:30.000Z (almost 3 years ago)
- Last Synced: 2024-09-28T22:07:32.724Z (about 2 months ago)
- Topics: boilerplate, code-splitting, hmr, isomorphic, koa, react, react-router-v4, redux-thunk, ssr, universal, webpack3
- Language: JavaScript
- Homepage: https://kimjuny.github.io/koa-react-universal/
- Size: 1.21 MB
- Stars: 111
- Watchers: 6
- Forks: 22
- Open Issues: 22
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Koa React Universal
[](https://greenkeeper.io/)
[](https://travis-ci.org/kimjuny/koa-react-universal)
[](https://codeclimate.com/github/kimjuny/koa-react-universal)
[](https://codeclimate.com/github/kimjuny/koa-react-universal/coverage)
> koa2、react、react-universal-component、koa-webpack-server、async/await、code-splitting、hot-module-replacement、react-router4、redux-thunk
This project is dedicated to build simple yet powerful Koa-React-Universal boilerplate.
Less is More: All key ingredients are in `src/development`、`src/production` and webpack configurations, easy to understand、set-up and extend. We promise to use the most recent & official packages(as much as we can), no weird or tricky stuffs, keeping this project clean and fully customizable.
Fully functional: HMR for client and server side, code splitting for both javascript and css, async/await universal programming support for koa2 server-side and redux-thunk client-side...
Universal: We are using [react-universal-component](https://github.com/faceyspacey/react-universal-component)、[webpack-flush-chunks](https://github.com/faceyspacey/webpack-flush-chunks). It simplifies universal development with code-splitting(js、css) and is also compatible with the latest react-router-v4.
Production: We are using webpack to build client(target: web) and server(target: node).
Development: We are using [koa-webpack-server](https://github.com/kimjuny/koa-webpack-server) (which simplifies development env set-ups), it also webpacks client and server(with client & server hot-load), so we can stay as much as the same with production.
### Screenshots
DEMO: Search Github Repositories.
> Noted: Github search API has [Rate Limitation](https://developer.github.com/v3/search/#rate-limit) of 10 reqs/min (without credentials).
### Components
* koa2
* react
* react-router4
* redux-thunk
* react-universal-component
* es2015 + async/await
* less、postcss(autoprefixer)
* webpack
* koa-webpack-server
* webpack-flush-chunks
* axios
* ejs
* jest
* eslint(airbnb)
* docker
* wallaby
### Roadmap
* graphql(Github API v3 -> v4)
* flow
* enzyme
* immutable
* vendor
### Start
#### Prerequisites
development
* yarn / npm
* node ≥ 7.0
production
* docker ≥ 1.13
#### Production
```
yarn prod
```
or with docker
```
docker build -t koa-react-universal .
docker run -d -p 3006:3006 koa-react-universal
```
#### Development
```
yarn dev
```
#### Test
```
yarn test
```
also supports [wallaby.js](https://wallabyjs.com/) live test reports [view](http://wallabyjs.com/app/#/files)
```
CMD + SHIFT + R -> R (vscode)
```
### License
[MIT](https://github.com/kimjuny/koa-react-universal/blob/master/LICENSE)
### Contributing
Issues are welcome :)
PRs are welcome (if you can help to make things more concise and simple!).