◾️はじめに React の Material UI (MUI) に関するTipsを 徐々にまとめておく 目次 【１】ライト・ダークテーマの切替 【２】Tooltipの表示 【３】Iconの表示 【１】ライト・ダークテーマの切替 src/App.tsx import * as React from 'react'; import { Button…

◾️はじめに 個人的にReact / MUI で作成しているツールにおいて コンポーネント間にマージン（余白）が全くなかったので、 以下のように「sx={{ mt: 4 }}」を追加して解決した。 そこで、余白について、少しづつまとめていく 修正前 <Paper elevation={3}> 修正後 <Paper elevation={3} sx={{ mt: 4 }}> 目次 【１】sx</paper></paper>…

◾️はじめに https://dk521123.hatenablog.com/entry/2025/10/24/215404 で、useStateを扱ったが、 それ以外にもuseEffectとかuseRefって使うようになっていて、 それらを総称して、React Hooksというらしいので、 これを機に徐々にまとめていく 目次 【０】R…

◾️はじめに React の勉強をちょこちょこやっていて、 必ず出てくる「JSX」が無視できない位、重要になってきたので 徐々にメモしていく 目次 【１】JSX 【２】Reactでページを作成するイメージ Case１：javascriptの場合 Case２：JSXの場合 【３】使用上の注…

◾️はじめに React で ダイアログ表示において コンポーネント間のデータの受け渡しをする際に props / state を学んだのでメモ 目次 【１】props 【２】state １）使用上の注意 ２）useState 【３】サンプル 例１：ダイアログ表示 例２：ダイアログを別コン…

◾️はじめに React の マテリアル デザイン フレームワークの代表格の Material UI（MUI）について扱う 目次 【１】Material UI（MUI） 【２】作業の流れ １）Reactプロジェクト作成 ２）ライブラリのインストール ３）UIコンポーネント を組み込む 【１】Mat…

◾️はじめに reactでの多言語対応についてメモ。 目次 【１】reactでの多言語対応 １）補足：i18n 【２】作業の流れ １）ライブラリのインストール ２）翻訳ファイル作成 ３）i18next の初期設定 ４）React コンポーネントでの使用方法 【３】エラー「Failed …

■ はじめに メジャーなJavaScript フレームワークの内のひとつである React（リアクト）について、触ってみる。 目次 【０】主な JavaScript フレームワーク 【１】サイト １）公式サイト ２）動画 【２】Hello world 【０】主な JavaScript フレームワーク …