Yeoman generator for scaffolding new React applications.
While tools like Create React App and Next.js are objectively awesome, over time I've decided that I want to learn more about the engine behind the application. As such, I started building and evolving my own React + Webpack configuration over time as a learning experience.
I have since decided to share this tool with the open source community. Love it or loathe it, I will not be happy or offended either way. 🤷♂️
node ^14.6.0
, moving forward the default version is >= 16.13.1
.npm >= 7.x
, though it should remain backwards compatible with npm ^6.14.7
.yarn ^1.22.4
, and no testing has been done for yarn >= 2.x
as of yet.This scaffolding tool is a yeoman generator, and requires that yo
be installed. After installing yo
, run the following commands.
npm install -g generator-react-scaffolder
yarn global add generator-react-scaffolder
To begin the scaffolding process:
yo react-scaffolder
At this stage, you will be prompted to provide the following:
Generate with TypeScript:
yo react-scaffolder --typescript
// alternatively
yo react-scaffolder --ts
The generator will attempt to install dependencies for you by default, though this operation can be disabled:
yo react-scaffolder --skip-install
✅ Rendering: client-side only\
✅ Syntax: react, js, jsx, ts, tsx\
✅ Tooling: eslint, stylelint, editorconfig, babel (non-TypeScript template only)\
✅ Styling: scss, css, postcss, css module syntax (*.module.scss
and *.module.css
nomenclature supported)\
✅ Testing: jest, react testing library\
✅ Build instructions: provided via the README.md
file generated with each new scaffold
❌ Script ejection: There are links to the default webpack config on github in each webpack.*.js
file.\
❌ Environment variables: The boilerplate is agnostic to your preferred implementation for consuming environment variables.