1
0
Fork 0
mirror of https://github.com/terribleplan/next.js.git synced 2024-01-19 02:48:18 +00:00
next.js/examples/with-redux-code-splitting/README.md

47 lines
1.6 KiB
Markdown
Raw Normal View History

Merge v3-beta into master (#2809) * Add examples/with-redux-code-splitting. (#2721) * #1757 Relay Modern Example (#2696) * Add ReasonML example (#2640) * Add ReasonML example * Add a gitignore specifically for the reasonml example * Allow custom className for <Main /> (#2802) * 3.0.2 * Remove beta information from the README. * 3.0.3 * Remove unnecessary lookup in example with emotion (#2731) * Document SCSS/Less (#2742) * Document SCSS/Less * Add missing word * Add docs for examples dir * Add extra example * uppercase J * Add with pkg example (#2751) * Add custom server micro example (#2750) * Ease running multiple examples at the same time with process.env.PORT (#2753) * Add line-height rule for error page h2 (#2761) * Add support for fetching multiple translation files (#2743) * Add support for fetching multiple translation files * Cleanup * Clear missed interval (#2611) * clear missed interval * remove trailing whitespace * Relay Modern Example (#1757) (#2773) * Simplification of Relay Modern Example (#1757) (#2776) * Use deterministic names for dynamic import (#2788) * Always use the same name for the same dynamic import. * Add unit tests for the modulePath generation. * Allow tests to run correctly on Windows. * Make the chunk name a bit pretty. * Fix tests to run on Windows. * 3.0.4 * Revert "Make the chunk name a bit pretty." (#2792) This reverts commit 0c9e8cf2271955e74ab9f752b5869b98c1dc60f9. * 3.0.5 * Use _ as the divider for dynamic import name splitter. (#2793) Using - gives us some weird webpack errors. * 3.0.6 * next/dynamic Error Message Tweaks (#2798) * Fixed issue (#2804) https://github.com/zeit/next.js/issues/2800 * docs(material-ui): move the source code to Material-UI repository (#2808)
2017-08-27 20:13:35 +00:00
[![Deploy to now](https://deploy.now.sh/static/button.svg)](https://deploy.now.sh/?repo=https://github.com/zeit/next.js/tree/master/examples/with-redux-code-splitting)
# Redux with code splitting example
## How to use
### Using `create-next-app`
Execute [`create-next-app`](https://github.com/segmentio/create-next-app) with [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) or [npx](https://github.com/zkat/npx#readme) to bootstrap the example:
```bash
npx create-next-app --example with-redux-code-splitting with-redux-code-splitting-app
# or
yarn create next-app --example with-redux-code-splitting with-redux-code-splitting-app
```
### Download manually
Merge v3-beta into master (#2809) * Add examples/with-redux-code-splitting. (#2721) * #1757 Relay Modern Example (#2696) * Add ReasonML example (#2640) * Add ReasonML example * Add a gitignore specifically for the reasonml example * Allow custom className for <Main /> (#2802) * 3.0.2 * Remove beta information from the README. * 3.0.3 * Remove unnecessary lookup in example with emotion (#2731) * Document SCSS/Less (#2742) * Document SCSS/Less * Add missing word * Add docs for examples dir * Add extra example * uppercase J * Add with pkg example (#2751) * Add custom server micro example (#2750) * Ease running multiple examples at the same time with process.env.PORT (#2753) * Add line-height rule for error page h2 (#2761) * Add support for fetching multiple translation files (#2743) * Add support for fetching multiple translation files * Cleanup * Clear missed interval (#2611) * clear missed interval * remove trailing whitespace * Relay Modern Example (#1757) (#2773) * Simplification of Relay Modern Example (#1757) (#2776) * Use deterministic names for dynamic import (#2788) * Always use the same name for the same dynamic import. * Add unit tests for the modulePath generation. * Allow tests to run correctly on Windows. * Make the chunk name a bit pretty. * Fix tests to run on Windows. * 3.0.4 * Revert "Make the chunk name a bit pretty." (#2792) This reverts commit 0c9e8cf2271955e74ab9f752b5869b98c1dc60f9. * 3.0.5 * Use _ as the divider for dynamic import name splitter. (#2793) Using - gives us some weird webpack errors. * 3.0.6 * next/dynamic Error Message Tweaks (#2798) * Fixed issue (#2804) https://github.com/zeit/next.js/issues/2800 * docs(material-ui): move the source code to Material-UI repository (#2808)
2017-08-27 20:13:35 +00:00
Download the example [or clone the repo](https://github.com/zeit/next.js):
```bash
curl https://codeload.github.com/zeit/next.js/tar.gz/canary | tar -xz --strip=2 next.js-canary/examples/with-redux-code-splitting
Merge v3-beta into master (#2809) * Add examples/with-redux-code-splitting. (#2721) * #1757 Relay Modern Example (#2696) * Add ReasonML example (#2640) * Add ReasonML example * Add a gitignore specifically for the reasonml example * Allow custom className for <Main /> (#2802) * 3.0.2 * Remove beta information from the README. * 3.0.3 * Remove unnecessary lookup in example with emotion (#2731) * Document SCSS/Less (#2742) * Document SCSS/Less * Add missing word * Add docs for examples dir * Add extra example * uppercase J * Add with pkg example (#2751) * Add custom server micro example (#2750) * Ease running multiple examples at the same time with process.env.PORT (#2753) * Add line-height rule for error page h2 (#2761) * Add support for fetching multiple translation files (#2743) * Add support for fetching multiple translation files * Cleanup * Clear missed interval (#2611) * clear missed interval * remove trailing whitespace * Relay Modern Example (#1757) (#2773) * Simplification of Relay Modern Example (#1757) (#2776) * Use deterministic names for dynamic import (#2788) * Always use the same name for the same dynamic import. * Add unit tests for the modulePath generation. * Allow tests to run correctly on Windows. * Make the chunk name a bit pretty. * Fix tests to run on Windows. * 3.0.4 * Revert "Make the chunk name a bit pretty." (#2792) This reverts commit 0c9e8cf2271955e74ab9f752b5869b98c1dc60f9. * 3.0.5 * Use _ as the divider for dynamic import name splitter. (#2793) Using - gives us some weird webpack errors. * 3.0.6 * next/dynamic Error Message Tweaks (#2798) * Fixed issue (#2804) https://github.com/zeit/next.js/issues/2800 * docs(material-ui): move the source code to Material-UI repository (#2808)
2017-08-27 20:13:35 +00:00
cd with-redux-code-splitting
```
Install it and run:
```bash
npm install
npm run dev
# or
yarn
yarn dev
Merge v3-beta into master (#2809) * Add examples/with-redux-code-splitting. (#2721) * #1757 Relay Modern Example (#2696) * Add ReasonML example (#2640) * Add ReasonML example * Add a gitignore specifically for the reasonml example * Allow custom className for <Main /> (#2802) * 3.0.2 * Remove beta information from the README. * 3.0.3 * Remove unnecessary lookup in example with emotion (#2731) * Document SCSS/Less (#2742) * Document SCSS/Less * Add missing word * Add docs for examples dir * Add extra example * uppercase J * Add with pkg example (#2751) * Add custom server micro example (#2750) * Ease running multiple examples at the same time with process.env.PORT (#2753) * Add line-height rule for error page h2 (#2761) * Add support for fetching multiple translation files (#2743) * Add support for fetching multiple translation files * Cleanup * Clear missed interval (#2611) * clear missed interval * remove trailing whitespace * Relay Modern Example (#1757) (#2773) * Simplification of Relay Modern Example (#1757) (#2776) * Use deterministic names for dynamic import (#2788) * Always use the same name for the same dynamic import. * Add unit tests for the modulePath generation. * Allow tests to run correctly on Windows. * Make the chunk name a bit pretty. * Fix tests to run on Windows. * 3.0.4 * Revert "Make the chunk name a bit pretty." (#2792) This reverts commit 0c9e8cf2271955e74ab9f752b5869b98c1dc60f9. * 3.0.5 * Use _ as the divider for dynamic import name splitter. (#2793) Using - gives us some weird webpack errors. * 3.0.6 * next/dynamic Error Message Tweaks (#2798) * Fixed issue (#2804) https://github.com/zeit/next.js/issues/2800 * docs(material-ui): move the source code to Material-UI repository (#2808)
2017-08-27 20:13:35 +00:00
```
Deploy it to the cloud with [now](https://zeit.co/now) ([download](https://zeit.co/download))
```bash
now
```
## The idea behind the example
Redux uses single store per application and usually it causes problems for code splitting when you want to load actions and reducers used on the current page only.
This example utilizes [fast-redux](https://github.com/dogada/fast-redux) to split Redux's actions and reducers across pages. In result each page's javascript bundle contains only code that is used on the page. When user navigates to a new page, its actions and reducers are connected to the single shared application store.