create-react-app in TypeScript

create-react-app allows you to quickly setup a React JavaScript project with no build configuration. I was looking for a way to do this in TypeScript and found the create-react-app-typescript project.

Here’s how to quickly create a React app in TypeScript, assuming Node with npm is already installed:

  1. npm install -g create-react-app
  2. create-react-app app-name --scripts-version=react-scripts-ts

This will create a starter React TypeScript project with all modules and dependencies under the “app-name” folder. The following TypeScript specific npm packages will be locally installed as dev dependencies:

  • @types/node
  • @types/react
  • @types/react-dom
  • @types/jest
  • typescript

It will also install tslint as a local package.

It will also create the following TypeScript specific files in your project:

  • tsconfig.json
  • tslint.json

Note that you will need to reorganize this dependency list when you want to deploy your project to Heroku so that it can be built remotely.

To start the app, cd into the app directory and execute:

npm start

Once you generate your React starter project, you can check my guide on how to import existing code into Github.

Further Resources

Microsoft’s TypeScript React Starter instructions (Github)

react-scripts-ts (NPM)

create-react-app-typescript (Github)