Use Generative AI and Next.js with AWS Amplify to build a Fullstack Recipe Generator
Front-End Web & Mobile Blog
This article discusses how to build a full-stack recipe generator app using AWS Amplify Gen 2, Next.js, and AWS Bedrock's Claude 3 Generative AI model. The recipe generator allows users to input a list of ingredients, and Claude 3 generates a recipe based on those ingredients.
Specifically, the article covers:
- Prerequisites (AWS account, Node.js, npm, git, IDE)
- Requesting access to the Claude 3 model on Amazon Bedrock
- Cloning the sample repo and installing dependencies
- The Amplify backend setup (GraphQL API, data sources, custom types)
- The Next.js frontend implementation (form, API calls, displaying results)
- Running the app locally using Amplify Sandbox
- Deploying the app to Amplify Hosting
- Cleaning up resources after the walkthrough
The AWS News Feed is currently looking for gold sponsors. If you want to support the AWS community and reach a large audience of AWS professionals, consider sponsoring the AWS News Feed.
Related articles
Mar 14
2024
2024
Best practices to build generative AI applications on AWS
Mar 11
2024
2024
New Generative AI Insights for AWS Partners to Accelerate Your Customer Offerings
Mar 19
2024
2024
Introducing ‘Get started with generative AI on AWS: A guide for public sector organizations’
Apr 24
2024
2024
Let’s Architect! Discovering Generative AI on AWS
The AWS News Feed is currently looking for silver sponsors. If you want to support the AWS community and reach a large audience of AWS professionals, consider sponsoring the AWS News Feed.