Asia

TypeScript with ReactJs

21 July 2021

Why TypeScript? Benefits of TypeScript

The top main reasons for Typescript is below:

  • Superset of Javascript, easy to learn.
  • Supports Class and Modules: Keywords like Class, Module, extends and interface are used.
  • The compiler has the support to check for the type of the variable ( Static Type Checking).
  • Supports latest ECMAScript along with different language support. The typescript compiler can compile the “.ts” file into “ES6” or other versions.
  • Support Javascript package in-build.
  • The syntax is more familiar with Java and Scala, which is used as a back-end language.

Setup of React app with Typescript

  • Create React app along with “–typescript” keyword.
    • npx create-react-app todo-app –typescript
  • For any React app which is already existing, install Typescript and other required types.
    • npm install –save typescript @types/node @types/react @types/react-dom
    • Rename all the existing file extensions to “.ts” or “.tsx”.
    • Restart the server.
  • Using webpack to create react app and then install typescript.
    • Install the required package using
      • npm install –save-dev typescript awesome-typescript-loader
    • Updated the webpack configuration to let know the file extension “.ts” or “.tsx”. Also. the loader responsible for these file formats.
    • Lastly, in the root of the file add a typescript configuration file.
    • Restart the server, all set to go with Typescript.

Tudip Technologies

Tudip Technologies is a value-driven Software Services company. We deliver excellence in dedicated and business-centric web solutions incorporated with innovation and expertise as the tools to achieve business goals. Our high-quality, cost-effective, reliable, and scalable services have helped us build an enduring relationship with our clients and customers.

Latest Posts

  • All Posts
  • Casestudy
  • Cloud
  • Healthcare
  • Ios
  • IOT
  • Java
  • Manufacturing
  • News
  • OTT
  • Supply Chain
  • Support and Maintainance
    •   Back
    • Banking

Related Posts

  • All Posts
  • Healthcare