16 Commands to Set up React apps for Every use in Seconds ⚡🚀
Tags: webdev, react, javascript, productivity
Published: 2022-01-11 16:14:56

---
title: 16 Commands to Set up React apps for Every use in Seconds ⚡🚀
published: true
description: 
tags: webdev, react, javascript, productivity
cover_image: https://cdn.hashnode.com/res/hashnode/image/upload/v1641915367677/frHzX1gN4.png
canonical_url: https://madza.hashnode.dev/16-commands-to-set-up-react-apps-for-every-use-in-seconds
---
Today speed is one of the main criteria to beat the competition. With technologies becoming more complex, we spend increasing amounts of time setting up and configuring everything. 

In this article, I have handpicked 16 commands to set up your React apps in seconds. I tried to cover a variety of the tools for different use cases you might face in your developer workflow.

Most of the tools included in this article are open-source. I will give you the direct access link, the description of the tool as well as the commands to run them from the terminal.

<hr/>

### [create-react-app](https://github.com/facebook/create-react-app)

An officially supported way to create single-page [React](https://reactjs.org/) applications. It offers a modern build setup with no configuration.

```bash
npx create-creact-app project-name
cd project-name
npm start

# starts on port 3000
```

### [nano-react-app](https://github.com/nano-react-app/nano-react-app)

A truly minimal replacement for [Create-React-App](https://create-react-app.dev/). A full [React](https://reactjs.org/) project in only 6 files. Uses [ViteJS](https://vitejs.dev/) with zero-config instead of [Webpack](https://webpack.js.org/). No eject, no linting, no service worker.

```bash
npx nano-react-app project-name
cd project-name
npm install
npm start

# starts on port 3000
```

### [react-starter-kit](https://github.com/kriasoft/react-starter-kit)
The web's most popular front-end template for building web applications with [React](https://reactjs.org/), [Relay](https://relay.dev/), and [GraphQL](https://graphql.org/). Based on [JAM stack](https://jamstack.org/) architecture.

```bash
git clone -o seed -b main --single-branch https://github.com/kriasoft/react-starter-kit.git project-name
cd project-name
npm install
npm start

# starts on port 3000
```

### [react-boilerplate](https://github.com/react-boilerplate/react-boilerplate)
A highly scalable, offline-first foundation with the best developer experience and a focus on performance and best practices.

```bash
git clone --depth=1 https://github.com/react-boilerplate/react-boilerplate.git project-name
cd project-name
npm run setup
npm start

# starts on port 3000
```

### [neutrino](https://github.com/neutrinojs/neutrino)

It uses [Webpack](https://webpack.js.org/) to build both web and [Node.js](https://nodejs.org/en/) projects by providing complete build presets which can be shared across targets and projects.

```bash
npx @neutrinojs/create-project project-name
# pick react from the wizard
cd project-name
npm start

# starts on port 5000
```

### [razzle](https://github.com/jaredpalmer/razzle)

A tool that abstracts all the complex configuration needed for building SPA's and SSR applications. It leaves your app's architectural decisions about frameworks, routing, and data fetching up to you.

```bash
npx create-razzle-app project-name
cd project-name
npm start

# starts on port 3000
```

### [create-react-library](https://github.com/transitive-bullshit/create-react-library)

CLI for creating reusable, modern [React](https://reactjs.org/) libraries using [Rollup](https://rollupjs.org/guide/en/).

```bash
npx create-react-library 
# enter project-name as a title in wizard
cd project-name
npm start

# runs `rollup` with the watch flag to recompile your source on changes, no port used
```
in a separate terminal run another server to preview example:

```bash
cd project-name/example
npm start

# starts on port 3000
```


### [tsdx](https://github.com/jaredpalmer/tsdx)


A zero-config CLI that helps you develop, test, and publish modern [TypeScript](https://www.typescriptlang.org/) packages with ease - so you can focus on your awesome new library and not waste another afternoon on the configuration.

```bash
npx tsdx create project-name 
# choose react as a template in the wizard
cd project-name
npm start

# runs in watch mode to recompile your source on changes, no port used
```

### [react-pwa](https://github.com/Atyantik/react-pwa)

An upgradable boilerplate for Progressive web applications (PWA) with server-side rendering, build with SEO in mind, and achieving max page speed and optimized user experience.

```bash
git clone https://github.com/Atyantik/react-pwa.git project-name
cd project-name
npm install
npm start

# starts on port 9090
```

### [rekit](https://github.com/rekit/rekit)

A toolkit for building scalable web applications with [React](https://reactjs.org/), [Redux](https://redux.js.org/) and [React-router](https://reactrouter.com/). It's designed to be scalable, testable, and maintainable by using feature-oriented architecture, one action per file pattern.

```bash
npm install -g rekit  # install rekit cli
npm install -g rekit-studio  # install rekit studio

rekit create project-name
cd project-name
npm install
rekit-studio -p 3000

# starts on port 3000
```

### [react-firebase-starter](https://github.com/kriasoft/react-firebase-starter)

A boilerplate project for creating web apps with [React](https://reactjs.org/), [GraphQL](https://graphql.org/) and [Relay](https://relay.dev/).

```bash
git clone https://github.com/kriasoft/react-firebase-starter.git project-name
cd project-name
npm setup
npm start

# starts on port 3000
```

### [electron-react-boilerplate](https://github.com/electron-react-boilerplate/electron-react-boilerplate)

A Foundation for Scalable Cross-Platform Apps. Uses [Electron](https://electron.atom.io/), [React](https://facebook.github.io/react/), [React Router](https://github.com/reactjs/react-router), [Webpack](https://webpack.js.org/) and [React Fast Refresh](https://www.npmjs.com/package/react-refresh).

```bash
git clone --depth 1 --branch main https://github.com/electron-react-boilerplate/electron-react-boilerplate.git project-name
cd project-name
npm install
npm start

# starts on port 1212
```

### [create-react-native-app](https://github.com/expo/create-react-native-app)

Focused on being the fastest way to bootstrap a [React Native](https://reactnative.dev/) app that runs on iOS, Android, and web without worrying about the native platforms or bundlers required for developing and shipping apps.

```bash
npx create-react-native-app
# set the name to project-name in the wizard
cd project-name
npm run web

# starts on port 19006
```

### [create-next-app](https://nextjs.org/docs/api-reference/create-next-app)

The easiest way to get started with [Next.js](https://nextjs.org/). You can create a new app using the default Next.js template, or by using one of the official Next.js [examples](https://github.com/vercel/next.js/tree/canary/examples).

```bash
npx create-next-app project-name
cd project-name
npm run dev

# starts on port 3000
```

### [gatsby.js](https://github.com/gatsbyjs/gatsby)

Free and open-source framework based on [React](https://reactjs.org/) that helps developers build blazing-fast websites and apps.  It combines the control and scalability of dynamically rendered sites with the speed of static-site generation.

```bash
npm install -g gatsby-cli # install gatsby cli

gatsby new
# set the name to project-name in the wizard
cd project-name
gatsby develop

# starts on port 8000
```

### [blitz](https://github.com/blitz-js/blitz)

A batteries-included framework that's inspired by [Ruby on Rails](https://rubyonrails.org/), is built on [Next.js](https://nextjs.org/) and features a Zero-API data layer abstraction that eliminates the need for REST/GraphQL.

```bash
npm install -g blitz --legacy-peer-deps # install blitz cli

blitz new project-name
cd project-name
blitz dev

# starts on port 3000
```

<hr>

Hopefully, you will find some of these instructions useful, so you can save a lot of time on setting up the workspace and fully focus on the actual coding instead.

Writing has always been my passion and it gives me pleasure to help and inspire people. If you have any questions, feel free to reach out!

Connect me on [Twitter](https://twitter.com/madzadev), [LinkedIn](https://www.linkedin.com/in/madzadev/) and [GitHub](https://github.com/madzadev)!
Visit my [Blog](https://madza.dev/blog) for more articles like this.