server-side rendering(SSR) scheme based on Next.js+Koa React
ReactSSR is based on Next.js+koa React's SSR server-side rendering solution, which is easy to use and works out of the box.
Background: In the use of react, there is no scaffolding tool like vue-cli, egg enterprise architecture and code specification; for novices, it is not suitable for immediate action.
Doc
Features
- Koa: Integrated koa backend architecture (planned to develop optional egg).
- Server-Side Rendering (SSR): Use the Next.js SSR rendering scheme to make development simpler and cooler.
- Css compiler: support for the introduction of less, sass, css development, external resource references.
- Css-in-js: styled-jsx integrated sass solution, easy to use, quickly write css style.
- Code syntax: eslint grammar rule detection and prettier code style checking tools, integrated TypeScript, to make the grammar more - rigorous, code style unified.
- Unit test: jest, greatly reducing the difficulty of writing unit tests, no need for more configuration.
- Grammatical compatibility: support React className and class two styles; css, sass, less, styled-jsx support autoprefixer prefix auto-fill
- Code optimization: support package module analysis npm run analyze: bundles; source Maps.
Quick Start
# git clone
> git clone git@github.com:Baiang/ReactSSR.git
# install
> npm install
# dev
> npm run dev
# Eslint code detection and prettier formatting code
> npm run eslint
# Automatic eslint code detection and prettier formatting code
> npm run lint:watch
# Unit test and coverage test
> npm run test
# build
> npm run build
# analyze:bundles
> npm run analyze:bundles
# Start the server
> npm run start
Eslint
You can use the Standard specification or you can choose Airbnb. Eslint offers two specifications:
Unit test
React unit test based on Jest + Enzyme
Editor syntax highlighting
Styled-jsx syntax highlighting method https://github.com/zeit/styled-jsx
TODOs
- Add egg
- Add dva
- Support vue-ssr switch