Back to Browse

Full-Stack Application with NestJS, AWS Cognito, DynamoDB & EC2, S3, CloudFront – Complete Tutorial

824 views
Mar 31, 2025
4:45:44

Github Repo Backend: https://github.com/deepakjha14/dashboard-nest-apis Frontend: https://github.com/deepakjha14/dashboard-ng19 🚀 Learn how to build a secure, full-stack authentication system using NestJS, AWS Cognito, DynamoDB, and EC2! In this step-by-step tutorial, you'll develop a UI and backend that authenticates users, stores data in DynamoDB, and hosts APIs on AWS EC2 with an API Gateway. What You’ll Learn in This Tutorial: ✅ Implement OAuth2 authentication with AWS Cognito ✅ Set up NestJS for backend development ✅ Secure routes using Auth Guards in NestJS ✅ Store and retrieve user data using AWS DynamoDB ✅ Deploy backend APIs on AWS EC2 & API Gateway ✅ Host your UI on AWS S3 with CloudFront ✅ Configure IAM roles, API Gateway, and security settings 📌 Chapters & Timestamps: 🔹 Introduction ⏳ 00:00 – Overview of the tutorial and objectives 🔹 Frontend Authentication & Redirection ⏳ 04:20 – Implement redirect logic in the UI app 🔹 Setting Up the NestJS Backend ⏳ 14:25 – Create a new NestJS application ⏳ 20:05 – Configure environment variables and install @nestjs/config 🔹 Authentication with AWS Cognito ⏳ 26:30 – Create the auth module in NestJS with login endpoints ⏳ 36:20 – Develop the auth service in NestJS ⏳ 39:42 – Create an AWS Cognito client for authentication ⏳ 56:00 – Handle token retrieval from AWS Cognito after redirection 🔹 Securing the Backend ⏳ 01:00:25 – Define a secured route in NestJS ⏳ 01:05:05 – Implement an Auth Guard to protect secured routes ⏳ 01:09:19 – Call the secured API route from the UI 🔹 UI Authentication Enhancements ⏳ 01:16:30 – Create a UI interceptor to attach Bearer Token in API calls 🔹 AWS DynamoDB Integration ⏳ 01:30:30 – Set up AWS DynamoDB and add data ⏳ 01:34:20 – Create an IAM Role to allow NestJS to access DynamoDB ⏳ 01:40:15 – Build a DynamoDB client in NestJS to fetch data 🔹 Fetching Data in the UI ⏳ 02:07:30 – Create a students table in DynamoDB & API to fetch data ⏳ 02:19:40 – Design a UI component and route for displaying charts ⏳ 02:34:30 – Create a UI form to collect user data 🔹 Saving Data to DynamoDB ⏳ 02:47:40 – Create a POST API in NestJS to save UI data to DynamoDB 🔹 Deploying Backend on AWS EC2 ⏳ 03:04:55 – Create an AWS EC2 instance to host NestJS APIs ⏳ 03:10:50 – Retrieve secret keys for Git repo cloning in EC2 ⏳ 03:13:19 – Clone the GitHub repo and install dependencies ⏳ 03:14:55 – Set up the .env file and run NestJS in EC2 🔹 API Gateway & Cloud Deployment ⏳ 03:30:22 – Configure AWS API Gateway to expose EC2 APIs ⏳ 03:40:46 – Create an S3 bucket to host the UI and connect it to CloudFront 🔹 Configuring AWS Cognito & Networking ⏳ 03:55:30 – Add callback URLs to AWS Cognito ⏳ 04:01:55 – Assign a static IP to EC2 ⏳ 04:19:15 – Update API Gateway URLs 🔹 Final Adjustments & UI Deployment ⏳ 04:21:27 – Modify callback URLs and update CloudFront settings ⏳ 04:24:30 – Configure S3 and CloudFront for public access ⏳ 04:26:30 – Update UI links for authentication ⏳ 04:34:50 – Upload the latest UI build to S3 🔹 Recap & Final Thoughts ⏳ 04:41:30 – Summary of the complete project 🔥 Who is this for? Full-stack developers Backend developers working with NestJS Anyone looking to integrate AWS Cognito, DynamoDB, API Gateway, EC2, and CloudFront 🔔 Subscribe for more full-stack tutorials! 📢 Like, share, and comment if you found this tutorial helpful!

Download

0 formats

No download links available.

Full-Stack Application with NestJS, AWS Cognito, DynamoDB & EC2, S3, CloudFront – Complete Tutorial | NatokHD