Important: This documentation covers Yarn 1 (Classic).
For Yarn 2+ docs and migration guide, see yarnpkg.com.

Package detail

cra-template-rb

The official React Boilerplate template for Create React App

react, create-react-app, template, typescript, redux, reduxjs, react-redux, react-boilerplate, styled-components

readme

React Boilerplate Meets CRA
Crafted for highly scalable & performant and easily maintainable React.js applications
with a focus on best DX and best practices.



The official Create React App template of the discontinued React Boilerplate

Start your create-react-app projects in seconds with the best, industry-standard tools and practices made ready for you.

📚 Documentation: Gitbook

🎨 Check the example app: Demonstrating the features

📂 Browse in VS Code: Open in Visual Studio Code

📦 Package: npm

version version


Install & Start

⚠️ Using Yarn Package Manager is recommended over npm.

Create React App with the template

yarn create react-app --template cra-template-rb my-app

Start and check our example app, if you want

cd my-app
yarn start

Remove the example app to start your project!

yarn cleanAndSetup

Features

This project is NOT a framework, UI component library or a design system. The only purpose of this template is to assist you starting your CRA app with a solid tool stack and development patterns. It's 100% customizable. After you start your journey and once you understand the concepts offered here you should personalize your code accordingly instead of being tied to the starter project.

You can add or remove literally anything and use whichever library or tools you prefer.

Predictable state management
Unidirectional data flow allows for change logging and time travel debugging.
Instant feedback
Enjoy the best DX (Developer eXperience) and code your app at the speed of thought! Your saved changes to the CSS and JS are reflected instantaneously without refreshing the page. Preserve application state even when you update something in the underlying code!
Next generation CSS
Write composable CSS that's co-located with your components for complete modularity. Unique generated class names keep the specificity low while eliminating style clashes. Ship only the styles that are on the page for the best performance.
Industry-standard routing
It's natural to want to add pages (e.g. `/about`) to your application, and routing makes this possible.
Industry-standard i18n internationalization support
Scalable apps need to support multiple languages, easily add and support multiple languages.
Typescript
Typescript is the key to scalability. Build self-documented code, easy-to-debug code and create maintainable large applications and codebases with a highly productive development experience.
Quick scaffolding
Create components, containers, routes, selectors and sagas - and their tests - right from the CLI!
Static code analysis
Focus on writing new features without worrying about formatting or code quality. With the right editor setup, your code will automatically be formatted and linted as you work.
SEO
We support SEO (document head tags management) for search engines that support indexing of JavaScript content. (eg. Google)

But wait... there's more!

  • The best test setup: Automatically guarantee code quality and non-breaking changes. (Seen a react app with 100% test coverage before?)
  • The fastest fonts: Say goodbye to vacant text.
  • Stay fast: Profile your app's performance from the comfort of your command line!

Keywords: Create React App, React Boilerplate, Custom Template, Typescript, React.js, Redux, Hot Reloading, ESNext, Babel, react-router, styled-components, redux-saga, FontFaceObserver

Contributors


Can Sahin

💻 📖 🤔 👀 ⚠️

Recep Tiryaki

💻 🤔 🎨

David Bingham

📖

Lourens de Villiers

📖

Rejo Chandran

💻 📖 ⚠️

Caleb Hoff

💻 📖 🤔 ⚠️

This project follows the all-contributors specification. Contributions of any kind welcome!

License

This project is licensed under the MIT license, Copyright (c) 2019 Maximilian Stoiber. For more information see LICENSE.md.

changelog

Changelog

All notable changes to this project will be documented in this file. See standard-version for commit guidelines.

1.2.6 (2022-10-23)

  • 🔧 maintenance(multiple) (59b46a4)
  • deps: updated practically all dependencies (#198) (8c2d9d1)

1.2.5 (2022-06-20)

Internals

1.2.4 (2022-04-12)

Bug Fixes

  • 🐛 quick fix for breaking changes of @types/react 18 (69a5bb7)

1.2.3 (2022-01-19)

Internals

  • 🔧 maintenance(CRA v5) (41e775f)

1.2.2 (2021-07-20)

Bug Fixes

1.2.1 (2021-07-13)

Documentation

  • 📚️ fixed typo #129 (e7794c8)
  • 📚️ fixing typo for navigationBarReducer (#114) (d04de39)
  • 📚️added missing selector function in async components (#133) (2bb4bc7)

Internals

1.2.0 (2021-01-22)

Features

  • ✨revised folder structure & generators (#107) (b1e9d69)

Bug Fixes

  • 🐛 added missing web-vitals to startingTemplate (4fc4bc3)
  • 🐛 dynamic messages loading (02d9a1d), closes #103
  • 🐛 message extraction script #102 (4b8788c)
  • 🐛 removed offline-first paradigm (a27ceca)

Documentation

  • 📚️ removed how-to repo (324d3d3)

Internals

This section only concerns the contributors of this project. You can ignore these changes since they DO NOT create changes in the CRA Template

<summary>Click to see the internal changes</summary>
  • 👷 added manual triggers (a514701)
  • 🔧 added i18n mock to generators (#106) (2440250)
  • 🔧 bumped typescript version (386de98)
  • 🚨 fixed minor type error (976d19d)

1.1.1 (2020-12-02)

Features

  • ✨ added translation JSON files extraction (#65) (59d5cc4)
  • ✨ added .editorconfig (0423d7c)
  • ✨ added web-vitals from CRA 4.0 (17c4f97)
  • ✨ fast refresh with CRA 4.0 (bc7ea9c)

Bug Fixes

  • 🐛 included .npmrc file in the template which was ignored (53b28fd)
  • 🐛 setting html lang tag to selected language (c2e61a2)

Internals

This section only concerns the contributors of this project. You can ignore these changes since they DO NOT create changes in the CRA Template

<summary>Click to see the internal changes</summary>
  • chore: 📚️ 🔧 review & update (45c604c)
  • 📚️ added release process steps (f3eb490)
  • ♻️ fixing typos, settings and concistency (c32691c)
  • 🔧 maintenance (#66) (432f449)
  • 🔧 added component folder selection to generators (#76) (de8e6fd)
  • 🔧 switched to yarn (#89) (2a90e24)

1.0.2 (2020-10-27)

Quick patch for cra v4 bug. No changes

Bug Fixes

1.0.1 (2020-07-03)

Bug Fixes

  • 🐛 switched to plain objects in i18n helper function (de76cf6)

Documentation

  • 📚️ added react-router hooks (3927a1b)

Internals

This section only concerns the contributors of this project. You can ignore these changes since they DO NOT create changes in the CRA Template

<summary>Click to see the internal changes</summary>
  • 📚 fix redux-toolkit docs (#35) (30732a8)
  • 📚️ fixed docs issues (97d67f0)
  • 📚️ fix redux url (#42) (a491728)
  • 🐛 removing redundant "history" (#31) (0793d31)
  • ♻️ fixing variable name in redux-toolkit docs (#37) (3968ade)
  • ♻️ update redux-toolkit docs (#33) (8dd5931)
  • 🎨 added og meta tags (43657d6)
  • 🔧 merge dev for the release (#48) (043c524)
  • deps: 🔗 bump websocket-extensions from 0.1.3 to 0.1.4 (#39) (36e1f9e)
  • 🔧 removed theme from startingTemplate (02d1e62)

1.0.0 (2020-05-18)

Features

  • ✨ added media query utility (c776cdd)

Bug Fixes

  • 🐛 removed connected-react-router (#28) (f6a0350)
  • 🐛 supporting css prop in styled-components (57895a3), closes #27

Documentation

Internals

This section only concerns the contributors of this project. You can ignore these changes since they DO NOT create changes in the CRA Template

<summary>Click to see the internal changes</summary>
  • ♻️ fix typo (a4a4f50), closes #25
  • ♻️ fix typo in toolkit.tsx comment (#18) (1867a5b)
  • ♻️ updated clean script name (3cedb94)
  • ♻️ updated readme (765a897)
  • 🔧 added commit hook verify startingTemplate changes (e0240c8)
  • 🔧 added script for creating changelog (4ed9ed5)
  • 🔧 improved cleaning script (a3d05f8), closes #29
  • 🔧 moved creation of the test CRA to a script to avoid husky bug (e6f8054)
  • 🚨 added media utility tests (3f2d9c9)

0.1.3 (2020-05-05)

Bug Fixes

  • 🐛 moving typescript check to pre-commit from lint-staged (6aac0d3)

Internals

This section only concerns the contributors of this project. You can ignore these changes since they DO NOT create changes in the CRA Template

<summary>Click to see the internal changes</summary>
  • ✨ redux dev tools enabled on github page (aa890c5)
  • 👷 added job to test the released version (a328db6)
  • 🔧 added npm test to CI (1fbf852)
  • 🔧 adding commitlint to workflows (#13) (f049526)
  • 🔧Fix typo in README (#9) (8680c10)
  • 🔧switched to standard-version (#15) (ce497b5)