v4.0.0
v4.0: Hooks, Immer, and react-testing-library
Breaking Changes
- Immutable.js removed — migrate to
Immerfor reducer state management - enzyme → react-testing-library — update all component tests; snapshot/behavior testing approach changed
- Class components removed from generators — new components are functions;
React.memoreplacesPureComponentoption - loadable-components → React.lazy + Suspense — update dynamic imports
- Major dependency updates: React 16.8.6, react-redux 7, react-router-dom 5, redux-saga 1, connected-react-router 6
process.noDeprecationremoved — may surface deprecation warnings during builds
Features
useInjectSagaanduseInjectReducerhooks — new defaults for saga/reducer injection (HOCs still available)eslint-plugin-react-hooks— included for hook linting- New Webpack code splitting config
Improvements
- Generators rewritten to reflect stack changes; generated components now ship with passing tests
- Windows setup script fix
webpack.DefinePlugin→webpack.EnvironmentPlugin— use environment variables in Webpack config- Default saga injection mode changed to DAEMON
- Node LTS target upgraded to dubnium
- stylelint support fixed
v4.0: "The One With Hooks (And Much More)" Edition
React Boilerplate v4.0 is out and it's a doozy! Here are the highlights:
- React has added many new features and it's time for React Boilerplate to embrace them.
- We now use
React.lazyandSuspensefor component lazy-loading instead of an external library. - We've added
useInjectSagaanduseInjectReducerhooks to manage saga and reducer injection. They're integrated into the generators and thus become the new defaults. (Should you need them, the HOCs are still there.) - The generators don't support classes anymore. The
PureComponentvsComponentchoice was replaced with an option to wrap your component insideReact.memo.
- We now use
- After much deliberation,
Immutable.jsis finally gone. We've addedImmerinstead. With it, we can write very concise and readable reducers while sticking to native JavaScript data structures. - Following the release of React Hooks, it's become even clearer that
react-testing-libraryis now the industry-standard for React DOM testing. Workarounds for the incompatibilities betweenenzymeandstyled-componentsare gone and we can now write leaner and more meaningful tests.
There are many more changes to our documentation, internals and general project setup. You can find a full changelog below.
Huge thanks to @Mensae, @gretzky, @jwinn and everyone who helped review or submit PRs! If I've forgotten your contribution in the credits below, please let me know.
We hope you enjoy this release and welcome any feedback, bug reports or feature suggestions you can send our way!
Main
- Remove
Immutable.jsin favor ofImmer(@julienben, @robertaird) - Migrate from
enzymetoreact-testing-library(@mensae)- New instructions for snapshot and behavior testing
- Embracing Hooks (@julienben)
- Add
eslint-plugin-react-hooks - Migrate all class components to functions
- Add
useInjectSagaanduseInjectReducerhooks - Remove generator options to extend
ComponentorPureComponent. Replace with aReact.memooption.
- Add
- Use
React.lazyandSuspenseinstead ofloadable-componentsto code-split and asynchronously load components (@julienben)
Documentation updates
- Update Heroku deployment instructions (@TheAncientGoat)
- Add subfolder deployment instructions (@nshimiye)
- Add AWS EB deployment instructions (@Al-un)
- Spelling and grammar fixes (@khayyamsaleem, @ngtan)
Internals updates
- Many dependency updates including: (@julienben)
- react and react-dom (
16.6to16.8.6) - react-redux (
5to7) (@bumi001, @jwinn) - connected-react-router (
4to6) - react-router-dom (
4to5) - redux-saga (
0.16to1) - sanitize.css (
4to8)
- react and react-dom (
- Update default saga injection mode to DAEMON (@howardya)
- Update generators to reflect all the stack changes
- Migrate default Node version to
lts/dubnium(@julienben) - Fix support for
stylelint(@jwinn) - Fix setup script for Windows environments (@mensae)
- Generate passing tests for components/containers (@mjhost)
- Rewrite generators code (@mensae)
- Complete rewrite or
generate-templates-for-linting.js(@mensae) webpack.DefinePlugin=>webpack.EnvironmentPlugin(@nshimiye)- New Webpack code splitting config (@julienben)
- Remove
process.noDeprecation = true(@spawnia) - Miscellaneous fixes (@ngtan)
Project maintenance
- Switch from Gitter to Spectrum (@gretzky)
- Update Code of Conduct and Contribution Guidelines (@julienben)
- New Issue Templates (@gretzky)
- New bots to help with issue management (@gretzky)
- Better recognition of contributors via adherence to All Contributors specification (@julienben)