Home icon

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


Go to article

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
Best practices to build generative AI applications on AWS
Mar 11
2024
New Generative AI Insights for AWS Partners to Accelerate Your Customer Offerings
Mar 19
2024
Introducing ‘Get started with generative AI on AWS: A guide for public sector organizations’
Apr 24
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.