作成したアプリケーション デモ React18 & MaterialUI で作成しており、TailwindCSS も利用しています。インフラは、Amplify (Cognito/AppSync/DynamoDB) […]
React.jsの記事
React
React18 でDynamoDBをGraghQLで操作してみる
React
Next.js & Nest.js & Prisma を利用してGraphQLを使ったアプリケーションを作成する
作成したアプリケーション GraphQLの学習用のサンプルアプリケーションです。 フロントエンドは Next.js ＆ Apollo Client 、サーバーサイドは Nest.js & Prisma を利用して […]
React
Next.js で Web-RTC を利用したZoomのようなビデオ通話アプリを作成する
作成したアプリケーション https://nextjs-webrtc-firebase.web.app Next.js ＆ Web-RTC を利用したビデオ通話アプリのサンプルです。ビデオ通話、画面共有、チャット機能、録 […]
React
Firebase を利用して Next.js でWebアプリケーションを作成する
作成したアプリケーション Next.js ＆ Firebase を利用した学習用のサンプルアプリケーションです。 Firebase Auth を利用したログイン/ログアウト、会員登録機能 に対応しています。 また、投稿デ […]
React.js
React Hooksの使い方を学ぼう～関数コンポーネントの状態管理を行う
基本のフック useState useState とは、関数コンポーネントでstateを管理（ state の保持と更新）するためのReactフックであり、最も利用されるフックです。 state とはコンポーネントが内部 […]
Stripe
Laravel&React.js でStripeを利用した決算処理を作成する
Stripeとは インターネットで商品を取引する際に使えるオンライン決済サービスのことです。 カリフォルニア州にあるstripe社が手掛けており、世界の120か国以上、数百万社の企業で導入されています。 stripeの魅 […]
Firebase
Firebase Cloud Messaging(FCM) を利用してプッシュ通知を受信する − React.js
FCMとは FCM は、Firebaseが提供するメッセージを無料で確実に送信するためのクロスプラットフォーム メッセージング ソリューションです。 iPhone や Android などスマートフォンへの通知はもちろん […]
ボイラープレート
Laravel で作る！ECサイトのサンプル（フロント＆管理画面＆バッチ）
作成したアプリケーション フロント画面 https://laraec.isystk.com/ フロント画面の主な機能 ログイン/ログアウト 会員登録 パスワードリマインダ 商品一覧 カートに追加 決算処理（Stripe） […]
React
画像アップロードReact用コンポーネント(ドラッグ&ドロップ対応)− react-image-base64
react-image-base64 とは react-image-base64 は、NPMで公開 されている画像アップロード用のReactコンポーネントです。 特徴 Base64にエンコードされた画像データを取得するこ […]