TypeScript 入門の記録（５）Create React Appを利用する
前回、WSL2（Ubuntu）上で、TypeScript Deep Dive 日本語版のReact & TypeScript のプロジェクト作成と実行確認ができたので、今回は、その続き「Create React Appを利用する場合」を試します。
Create React Appを利用する
Create React Appは、Reactの公式チュートリアルで利用したことがあります。React のチュートリアルでは、Create React Appで生成されたプロジェクトの src ディレクトリ配下のファイルを削除して、そこに新たに三目並べのindex.cssとindex.jsを作成しました。今回は、Create React App のTypeScriptテンプレートを利用します。
Create React App のインストール
WSL2(Ubuntu) を起動して、そのままターミナルでCreate React App をインストールをしても良いのですが、VS Codeのターミナルからインストール実行したいと思います。
問題なくインストールできたので、TypeScriptのテンプレートを指定してアプリケーションを作成します。
ディレクトリの移動と実行をするといいよ！って書いてあるので、試してみます。
自動的にブラウザがポップアップして、実行結果が表示されました。今後は、TypeScriptのコードを変更すれば、自動的にコンパイルされ、ブラウザがリロードされるはずです。
テンプレートのTypeScriptのコードを更新してみる
以前試したReactチュートリアルは、src 配下に新しく作成した index.js を編集しましたが、TypeScript は、src/App.tsx を編集すれば良さそうです。編集して保存すると、自動的にビルドが実行されました。
ブラウザに結果が反映されていればOKです。
思ったとおりの結果が確認できたので、満足です。今日の目標は、これで達成できました（小さいステップでやっていきます）今日の学習は、ここまで。次回以降は、TypeScriptで何かを作りたいので、サバイバルTypeScriptの「作って学ぶTypeScript」から、やっていこうと思います。