This is a Next.js project bootstrapped with create-next-app, following the steps from Nader Dabit's Next.js Amplify Workshop. You can check it out to create your Amplify stack and run the project.

You can see the live preview at https://main.d6sa4tyuglhx9.amplifyapp.com/.

Features

• Written entirely in TypeScript. AWS Amplify features are used.
• Since GraphQL query and result types are not comfortable to use (stated in AWS Amplify API documentation), I have been inspired from this solution from hukpavlo and wrapped AWS Amplify API GraphQL functionality under a class with static methods.
• I have experienced a memory leak while dealing with this part -where we attach a listener to Hub to listen auth events-, then I searched the web an found this solution from Uclusion to keep track of the listeners we currently use.
• The project was deployed using Next.js Plugin for Serverless Framework, however CI/CD is not straightforward in that path (there is a solution by bhall2001) I have prefered using AWS Amplify for deployment too.
• ESLint and Prettier configuration added.

Issues and future work

• There is still a memory leak that sometimes crashes the app on the development mode (OS: Windows 10, Node v14 LTS). That is most probably OS dependent and is stated as issues in multiple places (here and here).
• There is no restriction to use Image Optimization (a feature of Next.js). Further work may include it.
• An admin UI can be developed in the future, to practice features about user groups and user roles of AWS DynamoDB.