React

AWS

学習用に AWS Amplify で MUI 公式 React サンプルアプリを立ち上げる

MUI 提供の React サンプルアプリと AWS Amplify を利用すると動くアプリを簡単に立ち上げられるので、その方法を紹介します。
AWS

aws-amplify と @aws-amplify/ui-react モジュールを v6 にアップデートしてみた

aws-amplify と @aws-amplify/ui-react モジュールをバージョン 5 から 6 にアップグレードしたときの対応を紹介します。
AWS

AWS Amplify で Node.js 20 を使ってビルドする [2023年12月情報] [2024年7月更新]

AWS Amplify で動かしている React アプリを Node.js 20 でビルドできたので、そのやり方を紹介します。
アプリケーション開発

React アプリでカメラ撮影し画像データを取得する [react-webcam 使用]

React アプリ内でデバイスのカメラを操作し、撮影した画像データを取得するコードを紹介します。react-webcam というモジュールを使用しています。
アプリケーション開発

React で Chart.js のグラフサイズを自動リサイズする [MUI 使用]

Chart.js のグラフが画面の大きさによって自動リサイズする機能が期待通りに動かないケースがあっため、MUI を使用して代替機能を実現しました。
AWS

React 18 で aws-amplify v5 と AWS Amplify UI v4 にアップグレードしてみた

AWS が提供している React 用モジュール aws-amplify と @aws-amplify/ui-react のアップグレードをした際の変更経験談を紹介します。
AWS

AWS AppSync + Amazon DynamoDB + React で簡易チャット WEB アプリをつくる

AWS AppSync のプッシュ通知機能を活用して、簡易なチャット WEB アプリをつくってみましたので紹介します。主に AWS AppSync で必要になる GraphQL 周りのコード例です。
AWS

Amazon S3 にある音声ファイルを React アプリ経由でダウンロードするボタンをつくる

音声ファイルをブラウザからダウンロードさせようとしても、ダウンロードではなくブラウザ上で自動再生されてしまいます。React アプリ画面内でダウンロードさせるコードを紹介します。
アプリケーション開発

React でテキストデータをクリップボードにコピーするボタンをつくる

WEB 画面内のテキストをクリップボードにコピーさせるボタン作成に数時間ハマったので、成功したコードを書き落とします。
アプリケーション開発

React アプリ内でファイル選択 UI から読み込んだ画像をすぐにプレビューする [MUI file input 使用]

多くのサイトでよく使われている機能なので特段珍しい内容ではありませんが、自分の備忘を兼ねてブログ化しておきたいと思います。