React– tag –

以前、Cognitoを使った認証処理を実装しました。このときは認証処理を実装しただけで、認証後にのみアクセスできる画面に認証前はアクセスできないようにする処理を実装していませんでしたので、本記事で実装したいと思います。はじめはuseEffectに認証前...

前回はDynamoDBとAppSyncを作成しました。今回は作成したAppSyncからアカウント情報を取得する処理をNext.jsに実装していきます。前回の記事はこちらを参照してください。 AppSyncとNext.jsを接続する 作成したAppSyncとNext.jsを接続するにあたり、エンド...

前回はCognitoを利用して認証処理を作成しました。今回はCognitoのユーザーIDに紐づく情報をDynamoDBからAppSyncを利用して取得します。前回の記事はこちらを参照してください。 DynamoDB Amazon DynamoDBは、Amazon Web Services（AWS）が提供する完全マ...

前回はCognitoユーザープールと動作確認用のユーザーを作成しました。今回は認証処理の実装と作成したユーザーを用いて動作確認を実施します。前回の記事はこちらを参照してください。 Contextとは 認証処理を実装するにあたりReactのContext機能を利用し...

前回Next.jsをインストールしたところで、次はログイン画面を作成していこうと思います。まず本記事ではログイン画面の認証アクション云々の前に、フォームやバリデーション機能について実装します。また今後勤怠管理システムを作成していくため、システム...

Next.jsとは、ReactをベースにしたオープンソースのフルスタックJavaScriptフレームワークです。Next.jsは、静的サイト生成（SSG）やサーバーサイドレンダリング（SSR）といった機能を簡単に実装できるのが大きな特徴で、パフォーマンスの向上やSEO対策が...