2022-07

JS

React カスタムフック(Custom Hook)の使い方を理解する #7

React カスタムフック(Custom Hook)の使い方について解説します。Reactでは独自のhook(関数)を作ることができます。カスタムフックを作ることで、複数の箇所で再利用することができます。カスタムフックの作り方と、それを利用する方法を紹介し、利用前と後の違いを見ていきます。
2022.07.31
JS
JS

React hook useEffectの使い方を理解する #6

useEffectについて紹介していきます。副作用(side Effect)について触れた後、例を用いてどのように働くかを紹介していきます。useEffectを使用する前と後での挙動の違いを解説していきます。また依存関係がある場合とない場合についても触れていきます。
2022.07.28
JS
JS

React アプリ デバッグ方法を理解する #5

React アプリでデバッグする方法を紹介致します。コンソール上での確認方法やブレークポイントの設定、React Developer Toolを使ったデバッグ方法を簡単に解説しています。
2022.07.22
JS
JS

React 条件分岐によるComponent表示切り替え方法を理解する #4

Reactにて条件分岐による表示内容(component)の切り替え方法を紹介致します。条件分岐による切り替え方法には、三項演算子や関数定義を使う方法などがあります。本記事ではボタンによる画面表示内容の切り替えを例に紹介していきます。
2022.07.20
JS
JS

React hook useStateの使い方を理解する #3

Event HandlerとuseStateについて紹介していきます。ユーザーがボタンを押下する、何か画面に入力するなどの操作をトリガーとして、定義したイベントを実行する仕組みになります。useStateと組み合わせて使うことがあるため、一緒に紹介します。
2022.07.17
JS
JS

React propsを使ったデータの渡し方を理解する #2

Reactにてpropsの基本的な使い方を紹介致します。propsはcomponent間でデータを渡す上で必要な概念になります。propsを使うことで、文字列、数字、オブジェクトを渡すことができます。また関数(function)をポインターとして指し示すこともできます。
2022.07.16
JS
JS

React入門 React プロジェクトの始め方 #1

React プロジェクトを開始するにあたって、最初に知っておきたいことを簡潔にまとめました。ReactはJavaScriptライブラリであり、ユーザーインターフェースを構成することができます。ReactではComponentの概念が欠かせません。またJSXコードを理解しておく必要があります。
2022.07.12
JS