Building a FullStack AI SaaS Web App on AWS and Vercel

Begin training and testing a machine learning model with aws rekognition custom labels, fetch data from Kaggle, store it in s3, and spin up ec2 training servers.

Fetch data from Kaggle on EC2 by configuring AWS CLI and S3 access, downloading and copying datasets to the S3 bucket, and securing credentials before terminating the instance.

Set up an AWS Rekognition project, import training data from S3, auto-label images by folder names, configure bucket policy, then train, validate data, and test with AWS Rekognition scripts.

Click start on the model page to launch your machine learning model and wait about 20–30 minutes to be up and running, then shut it down to avoid charges.

Learn to run inference and stop the model to avoid charges, using a bucket name, an image path, and validation data, while assessing predictions and confidence with a cutoff threshold.

Deploy the backend on AWS using CDK to create a DynamoDB users table and a dummy user for testing, with infrastructure as code in TypeScript and front end integration.

Create a dummy user by building a JSON item with id, name, username, email, picture, and numeric credits using the template, and prepare to host an AWS Lambda function next.

Build an AWS lambda stack that runs a hello world function triggered by image uploads, with permissions to S3, Rekognition, DynamoDB, and email services, deployed via CDK using TypeScript.

Implement an S3 bucket and connect a lambda to S3 event source for object created and put events, deploying the stacks with CDK and validating the deployment.

Register for Amazon Simple Email Service, create and verify an email identity, and learn to send results to users who upload images via SES.

Implement AWS lambda logic to modify uploaded images by appending the user id to the filename, then fetch user details from the users table via S3 and SQS.

Discover how to extract a clerk ID from an S3 object key by parsing a file name like user_12345_csv, implement a helper, and verify updates via CloudWatch and DynamoDB.

Fetches the user email from the DynamoDB users table using the AWS SDK by issuing a GetItem command and validating the result in CloudWatch logs.

Show custom labels by using AWS Rekognition to detect labels from an image in an S3 bucket with a specified model ARN.

Fix custom labels errors by adjusting the confidence threshold, removing extra logs, and implementing a fail-safe for cases with no detected labels during image uploads.

Learn to implement an SES-based send email flow, verify identities, compose subject and body, and handle errors with CloudWatch logs and DynamoDB-driven recipients in a sandbox environment.

Update user credits via a DynamoDB update item operation in an AWS Lambda workflow, using TypeScript and update expressions, with error handling and deployment toward the Next.js front end.

Set up the frontend by creating a Next.js project with a shared CDN component library, push code to GitHub, and deploy to Vercel, then verify the live project link.

Perform front-end housekeeping by organizing assets in the public folder, updating global CSS, next config, and Tailwind, then install dependencies and run the app to verify deployments.

Build and organize the front end of a SaaS web app using Next.js, Tailwind CSS, route and component folders, with home page content from constants and a reusable button.

Install Clerk authentication, protect the product page with middleware, and enable Google or email sign-in. Then configure environment variables and deploy, preparing for DynamoDB integration in the next lecture.

Configure an IAM user and keys to connect the front end with AWS. Set up DynamoDB and S3 access, and implement a webhook to store user data.

Set up Stripe products and pricing for the app by creating basic, silver, and gold plans in Stripe, configure currencies (INR/USD), and implement one-off pricing in your codebase.

Build pricing flow with get products API and pricing component that fetch Stripe products for the pricing page; use secret key and update DynamoDB with clock ID.

Develop Stripe-based payment routes and webhooks to process checkouts and update DynamoDB with user credits.

Implement image upload on the product page via an S3 upload form, use OpenAI-generated front-end code, manage credits and checkout, and monitor via CloudWatch logs with email notifications.