Guide to Web Toolkits

create-react-app (react-scripts)

npm version license monthly downloads github stars

Create React App is great because it gets so much right. It manages the complexity of a single-page-app ready Webpack configuration. It allows you to eject said configuration if you decide you need to customize it. It comes with support for TypeScript out of the box. It separates your application’s bundle from your dependencies’ vendor bundle.

eslint-config-react-app

npm version license monthly downloads

If you want the same eslint configuration that Create React App comes with, you can install this package.

It encourages best practices with helpful fixits. It also stays away from code styling opinions. Unlike many linting presets, if you see a complaint with this, chances are it’s telling you something important that’s worth fixing.

preact-cli

npm version license monthly downloads github stars

A richly featured yet lightweight foundation for single page apps. Its bundle size is 4.5KB, which includes a router.

It prerenders the homepage to improve performance for slower connections, and can be set up to prerender subpages too. You can customize the underlying Webpack config. A new version of preact-cli is currently under development, which incorporates Webpack 4 and other enhancements.

Because it starts so lightweight, other frameworks such as React, Vue, or Elm can be added on top.

vue-cli

npm version license monthly downloads github stars

Vue CLI has a nice range of plugins such as TypeScript and PostCSS. You can customize the underlying Webpack config, which Create React App does not officially support.

Gatsby

To come

React Static

To come

NWB

To come

React library picks

Reach Router

minzipped size npm version license monthly downloads github stars

A mature take on routing for React. Its creator helped make React Router, and Reach Router succeeds it by improving on accessibility, ease of use, and bundled size.

Reach UI