https://react-express-app-template.herokuapp.com/
- CRA watch mode and hot module reloading for React application.
- Watch mode for our node Express server.
- Styled components (zero css files).
- Storybook component development.
- Express server comes with proxy, middleware, logging.
- Git Workflow: Prettier, eslint, imagemin is run on every commit.
- Isomorphic ES6 import statements on both client app and server.
# Copy env file then copy paste env variables.
cp env/local.env .env
# install dependencies
yarn install
# Spin up dev server.
yarn start
# Run unit tests with Jest and Enzyme.
yarn test
# Analyze bundle size.
yarn analyze
# Run storybook.
yarn storybook
# Build and run production app.
yarn production
https://create-react-app.dev/docs/advanced-configuration
Having too many node modules can increase the disk space requirement and memory usage on your development machine and servers. Use this command to analyze the size of individual dependencies in your node modules.
du -h -d1 node_modules/ | sort -hr | less
By default this template does not come with storybook addons although I highly recommend using them for development. You can find a full list of add-ons here: https://github.com/storybookjs/storybook/tree/master/addons
yarn add -D @storybook/addon-viewport @storybook/addon-docs
Then edit .storybook/main.js
addons: [
'@storybook/addon-viewport',
'@storybook/addon-docs'
],