JavaScript TypeScriptの基本的な記述方法をまとめました【JavaScript/React】
どうしてもTypeScriptの書き方に慣れません、、。React限定ですが、書き方の基本をまとめたのでメモしておきます！変なところに気づいたら直します、、、。
プリミティブ型
TypeScriptとは、ざっくりな認識ですが、...
react
JavaScript 
JavaScript ストップウォッチを作成しました【JavaScript/Vanilla/React/useEffect】
JavaScriptでストップウォッチを作りました！普通のJavaScript（Vanilla）とReactバージョンを作ったのでメモしておきます。
ストップウォッチ（JavaScript版）
まずは、普通のJavaScrip...
JavaScript useReducerの使い方についてまとめました【React】
stateとは、コンポーネント内で状態を保持できる変数です。Reactには、stateを管理できるフックがいくつか用意されています。
stateの管理は、主にuseStateを使っていたので、useReducerを使う機会があまりあ...
JavaScript Reactでモーダルウィンドウを作成しました【React/createPortal】
Reactの練習で簡単なモーダルウィンドウを作成しました。こういったモーダル関係の動きはChakra UIなどのコンポーネントライブラリを使うことが多いと思いますが、createPortalの使い方のサンプルとしてメモしておきます。
...
JavaScript Reactでフォームを扱う方法についてまとめました【React/Input/Radio/Select】
Reactでフォームの部品を扱う際、HTMLの感覚で書いているとうまく動作せずハマる時があります。Reactのお作法的な書き方もあるので、そのまま覚える型としてメモしておきます。
テキストフィールド<input type="t...
JavaScript APIからデータを取得してブラウザに表示する方法を調べました【React/axios/useEffect/zipcloud】
ReactでAPIデータを取得して何かをする。という場面が多いので、今後の雛形としてメモしておきます。
住所検索アプリ（サンプル）
サンプルとして、郵便番号から住所を検索できるアプリを作りました。ユーザーが入力した郵便番号をA...
JavaScript Reactでグローバルな状態を管理する【Context/useContext】
グローバルな状態管理の方法は複数ありますが、Reactに標準で実装されてるReactHooksのContextとuseContextの使い方をまとめたのでメモ。
グローバルな状態管理とは
コンポーネント間で値を渡すにはProp...
JavaScript Reactのパフォーマンスを最適化する方法を調べました【React.memo/React.useCallback/React.useMemo】
Reactはコンポーネントを組み合わせて作っていきます。日頃あまり意識することはありませんが、一部に負荷の高いコンポーネントがあると、レンダリングの最適化を考える必要があります。Reactのレンダリングの仕組みと、パフォーマンスの最適化に...
JavaScript useRefで値を更新したりDOMを参照する方法【React/useRef/useState/useEffect/TypeScript】
useRefは、主にDOMを参照したい時に使用しますが、改めて使い方を調べたのでメモしておきます！
useRefとは
useRefは、useStateと同じく値を保持できるフックです。useStateとの主な違いは、値を更新し...
JavaScript Reactの開発環境をコマンドで構築する方法【JavaScript/TypeScript】
開発環境の構築方法は忘れやすいのでメモするようにしています。今回はReactの開発環境について調べたのでメモ。
Reactの環境構築はコマンド１つで完了動して、以下コマンドを実
結論から言うと、プロジェクトを作成するディレクト...