要件 アイコンの文字は名前の1文字目を表示する 色は５色からランダムで設定する 色はユーザーに固有のもので、再読み込みなどで変更されない。 やり方 登録日時を文字コードにし、ランダムのhsl（ 色相(Hue)、彩度(Saturation)、輝度(Lightness)）で色を割…

Propsとは コンポーネントに渡す引数のようなものです。 コンポーネントは受け取ったPropsに応じて表示する内容やスタイルを変化させます。 どんなときに使うか よくある例ですと、文字を通常は黒文字でエラー時は赤文字にする仕様の場合です。 Propsを使わ…

イベントの扱い方 ボタンを押したときのイベントの onClick をReactで行う場合をやっていきます。 ボタンの作成 App.jsx export const App = () => { return( <> {console.log("test")} <= {}で囲う事でJavascriptも記述できます。 <h1>こんにちは！</h1> <p>React学習中</p>…

従来のDOM操作とReactの言葉使いの差について JavaScriptやJQueryで行っていたDOM操作を『〇〇を××する』手続き的と表現されます。 Reactは宣言的と表現します。(詳しい説明はここではありませんでした) React開発の始め方 本書ではCodeSandboxで行う方法が…