TypeScript

TypeScript TypeScript

TypeScriptに関する記事を紹介しています。

初歩的なものから学習コストの高いものまで幅広く扱っています。

※React内でもTypeScriptを採用して記述しているため、Reactの記事も含まれます。

TypeScript

TypeScriptの高度な型を解説

この記事は、以下の方に向けて書いています。 TypeScriptの型についてもっと知りたい RecordやPickのような型を使ってるサンプルコードが知りたい はじめに 今回はTypeScriptで採用されている型で、少し学習コストの高い内...
React

useEffectの特性と注意点

この記事は、以下の方を対象に書いています。 useEffectについての知識を深めたい 注意点を知りたい はじめに この記事は、私自身がuseEffectの挙動を理解しないまま使用していたために、 発生していた問題の備忘録として書いています...
React

ReactでMUIのテーブルを操作

この記事は以下の方を対象に書いています。 MUIのテーブルの使い方を知りたい MUIのテーブル操作をするサンプルコードを見たい 準備 まずは、Reactのプロジェクトを作り、MUIのインストールをしましょう。 開発環境は以下の通りになります...
React

ReactでMuiのSnackbarをカスタマイズする

この記事は以下の方を対象に書いています。 MuiのSnackbarの使い方を知りたい Snackbarを汎用的に使えるようにしたい Snackbarとは? Snackbarは、ユーザーに簡単な情報、通知、またはアクションの提案を表示するため...
React

ReactのuseStateで配列を扱う

この記事は以下の方を対象に書いています。 useStateで配列を扱いたい 配列をどのように扱うかのサンプルコードを見たい はじめに 今回は、useStateを使った中級編?として、配列を扱い、 どのように状態の更新をするのかを見ていきます...
TypeScript

TypeScriptのタプルについて解説

この記事は以下の方を対象に書いています。 タプルの使い道が分からない タプルの利便性が分からない タプルを使ったサンプルコードをみたい タプルとは? タプルとは、異なる型に要素をもつ固定長の配列のことです。 TypeScriptでは、特定の...
React

ReactのuseRefの使い道を探してみる

この記事は以下の方を対象に書いています。 useRefで出来ることを知りたい useRefの使い道が分からない useRefとは? まずは、useRefについて簡単に説明します。 useRefはReactの状態管理をするhook(フック)の...
React

ReactのuseStateを解説

この記事は、以下の方を対象に書いています。 useStateの基本的な使い方を知りたい useStateを使ったサンプルコードを見たい TypeScriptと合わせたサンプルコードが見たい useStateの宣言 useStateは、Rea...
React

Reactでルーティング設定

開発環境は、以下の通りです。 react: 18.2.0 typescript: 4.9.5 実現したいこと Reactで、ルーティング設定をしたい。 ルーティングとは、簡単に言うと画面遷移です。 ReactのようなSPAを実現するためのフ...
TypeScript

TypeScriptの非同期処理を解説

この記事は、以下の方を対象に書いています。 非同期処理の基礎から知りたい 非同期処理を使ったサンプルコードを知りたい 非同期処理とは? 非同期処理とは、一連の処理が終了するまで待たずに、他の処理を実行するプログラミング手法のことです。 例え...