https://github.com/tagraha/react-start
Heavily modified of react universally with async data fetching (universal rendering)
https://github.com/tagraha/react-start
babel expressjs flowjs jest react reactjs redux redux-thunk universal webpack4
Last synced: 4 months ago
JSON representation
Heavily modified of react universally with async data fetching (universal rendering)
- Host: GitHub
- URL: https://github.com/tagraha/react-start
- Owner: tagraha
- License: mit
- Created: 2018-03-25T11:50:21.000Z (about 8 years ago)
- Default Branch: master
- Last Pushed: 2025-03-25T08:28:45.000Z (about 1 year ago)
- Last Synced: 2025-03-25T09:31:11.822Z (about 1 year ago)
- Topics: babel, expressjs, flowjs, jest, react, reactjs, redux, redux-thunk, universal, webpack4
- Language: JavaScript
- Homepage:
- Size: 3.59 MB
- Stars: 4
- Watchers: 0
- Forks: 0
- Open Issues: 58
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
[](#contributors)
[](https://travis-ci.org/tagraha/react-start)
[](https://circleci.com/gh/tagraha/react-start)
[](https://github.com/styled-components/styled-components)
[](https://snyk.io//test/github/tagraha/react-start?targetFile=package.json)
Heavily modification of react-universaly
----------------------------------------
React boilerplate with code spliting, asynchronous data fetching (universal/isomorphic rendering)
Heads up
--------
We are using react ^16.3.0. You might want to read this ([React v16.3.0: New lifecycles and context API](https://reactjs.org/blog/2018/03/29/react-v-16-3.html)) before starting playing around with this boilerplate.
Installation
------------
```bash
git clone git@github.com:tagraha/react-start.git
cd react-start
npm install
```
at this point make `.env` file on your root directory. you can copy it from `.env_example` file.
```bash
npm run develop
```
open up your browser and navigate to `localhost:1337`
Production script command
-------------------------
```bash
npm run build
npm start
```
-------------
The App
-------
Navigate to `shared/container/DemoApp` and start exploring the code
Configuration
-------------
you can configure like disabling SSR mode, renaming service worker file etc with `value.js` file. here's the the quick look of the file
```javascript
const values = {
clientConfigFilter: {
// This is here as an example showing that you can expose variables
// that were potentially provivded by the environment
welcomeMessage: true,
// We only need to expose the enabled flag of the service worker.
serviceWorker: {
enabled: true,
},
// We need to expose all the polyfill.io settings.
polyfillIO: true,
// We need to expose all the htmlPage settings.
htmlPage: true,
},
// The host on which the server should run.
host: EnvVars.string('HOST', 'localhost'),
// The port on which the server should run.
port: EnvVars.number('PORT', 1337),
// The port on which the client bundle development server should run.
clientDevServerPort: EnvVars.number('CLIENT_DEV_PORT', 7331),
welcomeMessage: EnvVars.string('WELCOME_MSG', 'Hello world!'),
// Disable server side rendering?
disableSSR: false,
browserCacheMaxAge: '365d',
}
```
TODOS
-----
- [x] attach redux
- [x] make it async data fetch
- [x] upgrade to webpack 4 (perks)
- [x] unit testing
- [ ] flowjs type checker
- [ ] redux-saga over redux-thunk?
Flow Coverage
-------------
we're currently working on flow coverage. you can switch to branch `feature/flow` to take a look at the code
## Contributors
Thanks goes to these wonderful people ([emoji key](https://github.com/kentcdodds/all-contributors#emoji-key)):
| [
Tirta Nugraha](http://www.betotally.com/)
[💻](https://github.com/tagraha/react-start/commits?author=tagraha "Code") [📖](https://github.com/tagraha/react-start/commits?author=tagraha "Documentation") [🔌](#plugin-tagraha "Plugin/utility libraries") [👀](#review-tagraha "Reviewed Pull Requests") [⚠️](https://github.com/tagraha/react-start/commits?author=tagraha "Tests") |
| :---: |
This project follows the [all-contributors](https://github.com/kentcdodds/all-contributors) specification. Contributions of any kind welcome!