Table of Contents
- Styling (CSS)
First, let's kick the tyres by launching the sample Repospective app bundled with this project to demo some of its best features:
npm run setup && npm start
Open localhost:3000 to see it in action.
- Add a Github username to see Redux and Redux Sagas in action: effortless async state updates and side effects are now yours :)
- Edit the file at
./app/components/Header/index.jsso that the text of the
<Button>component reads "Features!!!"... Hot Module Reloading gives you a feedback loop with your UI so smooth it's almost conversational!
- Click your (newly emphatic) Features button to see React Router in action... Now you can share a direct link to that content privately over your LAN or globally addressable to any device, anywhere. Not bad for a locally-running Single Page App.
Time to build your own app: run
npm run clean
...and use the built-in generators to start your first feature.
npm start to see your app at
Building & Deploying
npm run build, which will compile all the necessary files to the
Upload the contents of the
buildfolder to your web server's root folder.
app/ directory contains your entire application code, including CSS,
The rest of the folders and files only exist to make your life easier, and should not need to be touched.
(If they do have to be changed, please submit an issue!)
Using tagged template literals
styled-components allows you to write actual CSS code to style your components.
It also removes the mapping between components and styles – using components as a
low-level styling construct could not be easier!
See the CSS documentation for more information.
We bundle all your clientside scripts and chunk them into several files using code splitting where possible. We then automatically optimize your code when building for production so you don't have to worry about that.
For a thorough explanation of the testing procedure, see the testing documentation!
npm run start:tunnel makes your locally-running app globally available on the web
via a temporary URL: great for testing on different devices, client demos, etc!
Unit tests live in
test/ directories right next to the components being tested
and are run with
npm run test.