Create a new Expo project with TypeScript in React Native

Creating a new project with React Native, Expo, and TypeScript is a relatively straightforward process. Here are the basic steps you can follow:

Step 1: Install Node.js and npm

Make sure you have Node.js and npm installed on your machine. You can download them from the official Node.js website: https://nodejs.org/

Step 2: Install Expo CLI

Install Expo CLI globally using the following command in your terminal:

npm install -g expo-cli

Step 3: Create a New Project with TypeScript

Run the following command to create a new React Native project with TypeScript:

npx create-expo-app -t expo-template-blank-typescript

If it asks to install create-expo-app@2.1.1, press y.

Now it asks for the application name:

Write the name and wait while it creates the project.

And it’s ready:

Now it is recommended to add this inside package.json

{
  "scripts": {
    "ts:check": "tsc"
    ... 
  }
}

Ending up like this:

This is used to check TypeScript, we can use this command:

npm run ts:check

Now let’s generate the **tsconfig.json** file responsible for checking TypeScript:

Paso 4: Navegar al directorio del proyecto

Ingresa al directorio de tu proyecto recién creado:

cd myReactNativeApp

Paso 5: Run the project:

expo start

This command will open a new window in your browser with the Expo interface. From here, you can launch your app on an emulator or physical device.

Step 6: Develop with TypeScript

Now you can start developing your application using TypeScript. TypeScript files have the .tsx extension, and Expo has already set up TypeScript for you in this project.

Step 7: Other Useful Tools

• Visual Studio Code (VSCode): I recommend using VSCode as your code editor. You can also install the “React Native Tools” extension for a better development experience.
• Expo Go: You can download the Expo Go app on your device to test your app on a physical device.