[React] react highlight words で検索文字列をハイライトしてみる | 心を無にして始める React
準備react highlight word のインストールnpm install react-highlight-words使ってみるイメージ
入力フォームに入れた文字を検索してハイライトします。
ついでに、このぐらいだと ...
[React] React Table で テーブル内のファジー(あいまい)検索 をしてみる | 心を無にして始める React
準備
TanStack Table v8 で React Table を使うのはこちら (*’▽’)
バックエンドには、いつもの json-server を使います。
検索イメージシンプルな検索 ...[React] React 18 から setInterval などの非同期処理で気をつけること
React 18 での変化点(の1つ)
コンポーネントがアンマウントされたあとに状態が更新されても、警告が出なくなりました。
でなくなった警告はこれです。
Warning: Can’t perform ...
[React] TanStack Table v8 を React で使ってみる | 心を無にして始める React
TanStask Table v8準備インストールnpm install @tanstack/react-tablereact-tableイメージTable.js を編集する
ここで作った Table.js を編集していきます。 ...
[React] Suspense(React 18 の新機能) を Axios と合わせてみる | 心を無にして始める React
Suspenseサスペンスにより、コンポーネントツリーの一部がまだ表示できない場合に、ロード中という状態を宣言的に記述できるようになります。
いままで state で isLoading を準備して書いていたのを、楽にできる便利さん ( ...
Google Search Console Insight の通知(過去28日間でクリック数が〇〇クリックに到達しました。)
このサイトでも Google Search Console を使っているのですが、少し前から「ミッションを達成した」かのような連絡がくるようになりました。
すばらしい結果ではありませんか?このニュースをぜひ共有しましょうと ...
今日から React 18 | 心を無にして始める React
React 18 の新機能をみたら、使いたくなったから今日から React 18 。
インストール新しく npx create-react-app しましょう。
React 18 になります (/・ω・)/ ...
[AWS] CRUDするWebサービス環境のテンプレ (Route53 + CloudFront + API Gateway + Lambda + S3)
Route53
スケーラブルなドメインネームシステム(DNS)
ドメインを解決して、ルーティングするために使います。
この構成では、ドメイン名 と CloudFront のディストリビューションドメイン名 を紐づ ...
[React] Axios で複数の通信を待ち合わせてみる | 心を無にして始める React
準備
Axios のインストールと使い方はこちら。
バックエンド今回も json-server です。
使う json はこちら。
{ "cats": , "dogs": }複数の通信を待ち合わせるイメージ ...[React] Canvas で画像を拡大するとき、画像がぼけやるのを防ぐには
今回は React に限った話ではありませんが…、サンプルを React で書いています。
HTMLやCSSを準備するよりReactで用意するほうがエコシステムがいろいろ揃えてくれて楽ちん (。´・ω・)
Canv ...