Reactの関数コンポーネント（ファンクショナルコンポーネント）をTypeScriptで作成する方法を紹介します。よく使用する関数コンポーネントの型はFCとVFCです。childrenをパラメータとし...

React+react-router-dom+TypeScriptでログイン認証の仕組みを実装する方法を紹介します。以下の仕様で実装します。未ログイン時ログイン時まずはログインページとトップページのル...

react-router-domでシングルアプリケーションを作成していると、ページ数が増えるにしたがって作成されるjsファイルのファイルサイズもどんどん増えていきます。ページごとにファイルを分割し、そ...

ReactのuseEffectを利用したときに無限ループが発生してしまうことがあります。特に注意したいのが、ESLintのreact-hooks/exhaustive-depsで表示された警告をUpd...

react-router-domでプログラムから画面遷移を行う方法を紹介します。history.psuh(遷移先URL)の形式で実行すると、画面遷移を行えます。historyはreact-router...

React+TypeScriptのプロジェクトにreact-router-domを導入してSPAのアプリケーションを作成する方法を紹介します。まずはreact-router-domのパッケージをインス...

React+TypeScriptで作成した関数コンポーネントにプロパティを設定する方法を紹介します。以下は送信ボタンのコンポーネントを作成しています。isSubmittingというプロパティを用意して...

react-create-appで作成したTypeScriptのプロジェクトにESLintやPrettierなどの設定を行う方法を紹介します。今回は、TypeScriptとReactのルールに加え、a...

react-create-appで作成したプロジェクトにimportのalias（エイリアス）を設定する方法を紹介します。react-create-appで作成したプロジェクトはwebpackの設定を...

ASP.NETのWebAPIでCORSの設定を行う方法を紹介します。例えばWEBページのURLがlocalhost:3000で、WebAPIのURLがlocalhost:5000のとき、WEBページか...