Project Setup
Overview
In this section we will be doing a very standard setup of React with Typescript.
If you have an existing project you can skip to the next section
Node and NPM
For this tutorial we will be using Node to run Javascript outside of the browser and we will be using NPM to install packages.
React
React is an open source Javascript library for building component based user interfaces developed by Meta (formerly Facebook).
Typescript
Typescript is a strongly typed programing language that extends Javascript. Specifically note here that as Typescript is a strongly typed language, it will complement GraphQL so that we can always be sure of the data we are working with.
Create our project
Before starting make sure Node and NPM are installed on your computer by following the instructions found here
To setup our project we will be using the Create React App toolchain as recommended here for creating a new single-page app. Following the instructions here we simply need to open a terminal, move to the directory we want our project folder to be placed in and then run:
npx create-react-app react-example --template typescript
cd react-example
We can also run npm start to start our project in development mode but we will leave this for a little later after we have setup a few other tools
You should now have a few folder called react-example with basic boilerplate code.