https://github.com/catamphetamine/react-website-basic-example
`react-website` basic example
https://github.com/catamphetamine/react-website-basic-example
Last synced: 2 months ago
JSON representation
`react-website` basic example
- Host: GitHub
- URL: https://github.com/catamphetamine/react-website-basic-example
- Owner: catamphetamine
- License: mit
- Created: 2018-04-05T05:51:02.000Z (over 7 years ago)
- Default Branch: master
- Last Pushed: 2019-03-02T13:49:15.000Z (almost 7 years ago)
- Last Synced: 2025-04-06T04:31:57.129Z (9 months ago)
- Language: JavaScript
- Size: 200 KB
- Stars: 12
- Watchers: 3
- Forks: 23
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
A basic example of using [`react-website`](https://github.com/catamphetamine/react-website).
## Development
```sh
npm install
npm start
```
Then go to [`http://localhost:1234`](http://localhost:1234).
## Production
See the `dist` directory for the output files. The output files can be uploaded to the cloud (e.g. Amazon S3) and hosted for a very low price as a "static" website by mapping any URL to `index.html`.
## Explanation
This sample project illustrates the use of [`react-website`](https://github.com/catamphetamine/react-website) library for building a React/Redux application.
[Parceljs](https://parceljs.org/) is used for bundling the app because it's much simpler for beginners than Webpack.
The "Basic" page shows the "conventional" (old-fashioned) way of writing React/Redux applications.
The "Advanced" page shows the more convenient way of writing React/Redux applications.
The counters on both pages operate identically the only difference being that the counter on the "Basic" page is implemented the "conventional" (old-fashioned) way and the counter on the "Advanced" page is implemented using the ["redux module"](https://github.com/catamphetamine/react-website#redux-module) utility from `react-website` library.
`react-website` library packs a lot of utilities not showcased here for sake of simplicity, such as [`@preload()`ing pages](https://github.com/catamphetamine/react-website#preloading-pages), [making `http` requests](https://github.com/catamphetamine/react-website#http-utility), [setting `` tags](https://github.com/catamphetamine/react-website#setting-title-and--tags), [programmatic navigation](https://github.com/catamphetamine/react-website#changing-current-location), and more...