はじめに

私は業務で主にReactを使用しているのですが、Javascriptで書いています。でも「Typescriptで書きたいよね？」という話になりまして、導入方法を調べたわけです。

アプリの作成

npx create-react-app [アプリ名] --typescript

npxならば常に最新のものが使用できるから公式では推奨しているようです。

確かに、ローカルにあるcreate-react-appだと古いバージョンで作成してしまう可能性もありますし、updateをするのも面倒ですもんね、納得です。~~最新版に発生する不具合とかもあるけど、とりあえず考えないでおきましょう！~~

アプリを作成したら、とりあえず実行します。編集はその次です。

Typescriptで作成しても、実行方法は変わらないようです。

cd [アプリ名]
npm start

すると以下のような画面が表示されました。

Javascriptで作った時とちょっと画面違いますね。青じゃなくて青緑ベースになっています。それともバージョンが変わったからでしょうか？（面倒なので確認しません。）

「コンパイルとかで面倒だったら嫌だなー」と思いつつ、とりあえずApp.tsx（App.tsじゃなかった！！）を編集してみます。

そして保存すると、なんとすぐに画面更新されました。ありがたいことです。

作成されたソースコードを見てみると、やはりJavascriptの時とはちょっと違う箇所がちらほら...そのあたりをもう少し追ってみたいと思います。