DEV Community

Cover image for Building FridgeChef AI: Turning Available Ingredients into Recipes | 10 Days of Building AI Agents on AWS | Day 9
abdullah haroon
abdullah haroon

Posted on

Building FridgeChef AI: Turning Available Ingredients into Recipes | 10 Days of Building AI Agents on AWS | Day 9

10 Days of Building AI Agents on AWS | Day 8

Opening the fridge and still not knowing what to cook is a frustrating daily problem.

You may already have chicken, eggs, vegetables, rice, spices, and other ingredients at home, but still spend more time searching for recipes than actually preparing a meal.

That was the problem behind FridgeChef AI.

FridgeChef AI is an AI-powered recipe assistant that transforms the ingredients already available in your kitchen into personalized meal ideas using generative AI and AWS serverless technologies.

The idea is simple:

Available Ingredients → Preferences → AI → Personalized Recipe

Instead of searching through multiple recipe websites, users can enter what they already have and let AI suggest what they can cook.

Vision and What FridgeChef AI Does

One of the most common everyday frustrations is standing in front of the refrigerator wondering:

What can I actually cook with this?

Even when we have several ingredients available, it can be difficult to combine them into a complete meal idea.

This often leads to:

  • Wasted time searching for recipes
  • Unnecessary grocery purchases
  • Ingredients being forgotten
  • Food eventually expiring unused

I wanted to build a focused application that solves this one problem.

With FridgeChef AI, users simply enter the ingredients available in their kitchen and select optional preferences such as:

  • Preferred cuisine
  • Dietary restrictions
  • Cooking time

The AI then generates personalized recipe suggestions in seconds.

Each response can include:

  • Recipe suggestions
  • Required ingredients
  • Cooking instructions
  • Estimated cooking time
  • Additional cooking tips

The goal was not to build a complete recipe platform with thousands of manually created recipes.

Instead, the focus was on one useful experience:

Tell FridgeChef what you have, and let AI help you decide what to cook.

By encouraging users to cook with ingredients they already have, the application can also help reduce unnecessary food waste.

How I Built It

I wanted the project to use a modern serverless architecture while keeping the deployment process automated and reproducible.

Frontend

The frontend was built using:

  • React
  • Vite

The interface uses a warm, kitchen-inspired design focused on making the experience simple and intuitive.

Users can:

  • Add available ingredients
  • Select cuisine preferences
  • Choose dietary options
  • Specify their preferred cooking time
  • Generate personalized recipes

The frontend communicates with the backend through an API.

Backend

The backend was developed using Node.js and deployed as an AWS Lambda function.

Instead of maintaining a traditional server, the backend runs only when a request is received.

The request flow is:

User enters ingredients
        ↓
Frontend sends request
        ↓
Amazon API Gateway
        ↓
AWS Lambda
        ↓
Groq API
        ↓
Recipe generation
        ↓
Structured JSON response
        ↓
Frontend displays recipes
Enter fullscreen mode Exit fullscreen mode


`

This architecture keeps the backend lightweight and serverless.

The AI Recipe Generation

For AI-powered recipe generation, I integrated the Groq API.

The backend receives the user's ingredients and preferences and creates a structured prompt.

For example, the input may contain:

`
Ingredients:
Chicken, rice, onions, tomatoes, garlic

Cuisine:
Pakistani

Dietary Preference:
None

Cooking Time:
30 minutes
`

The backend sends this information to the AI model and requests a structured recipe response.

The AI can generate information such as:

  • Recipe name
  • Description
  • Ingredients
  • Cooking instructions
  • Estimated preparation time
  • Cooking tips

The response is then formatted into structured JSON before being returned to the frontend.

Using structured responses makes it easier for the application to reliably display the generated recipes.

Why I Chose a Serverless Architecture

This project did not need a traditional server running continuously.

Recipe generation happens only when a user submits ingredients.

That makes a serverless architecture a good fit.

The backend can remain inactive until a request arrives:

No request → No backend processing

When a user generates a recipe:

Request arrives → Lambda runs → AI generates recipe → Response returns

This allowed me to focus on the application rather than managing servers.

AWS Services and Architecture

The application uses several AWS services.

AWS Amplify Hosting

AWS Amplify hosts the React frontend and makes the application publicly accessible.

It provides the hosting layer for the user interface.

Amazon API Gateway

Amazon API Gateway receives requests from the frontend and routes them to the serverless backend.

The frontend does not communicate directly with the AI provider.

Instead:


Frontend

API Gateway

AWS Lambda

Groq API

This keeps the AI integration inside the backend.

AWS Lambda

AWS Lambda runs the Node.js backend.

It is responsible for:

  • Receiving recipe requests
  • Processing ingredients and preferences
  • Creating the AI prompt
  • Calling the Groq API
  • Processing the AI response
  • Returning structured recipe data

Lambda runs when the application receives a request, so there is no continuously running backend server.

AWS SAM

I used AWS SAM (Serverless Application Model) to simplify the development and deployment of the serverless backend.

SAM makes it easier to define and deploy resources such as:

  • Lambda functions
  • API Gateway endpoints
  • IAM permissions
  • Environment configuration

AWS CloudFormation

The infrastructure is provisioned using AWS CloudFormation.

Rather than manually creating resources through the AWS Console, the infrastructure is defined as code.

This means the deployment can be repeated consistently.

The infrastructure definition includes:

  • AWS Lambda configuration
  • API Gateway configuration
  • IAM roles and permissions
  • Environment variables
  • Required service connections

The workflow becomes:

Infrastructure Code → AWS SAM → CloudFormation → AWS Resources

Amazon CloudWatch

Amazon CloudWatch is used for monitoring and debugging.

During development, CloudWatch logs helped identify deployment and runtime issues.

Architecture Overview

The complete architecture looks like this:


USER


AWS Amplify
React + Vite App


Amazon API Gateway


AWS Lambda
Node.js


Groq API
AI Recipe Generation


AWS Lambda
Process AI Response


Amazon API Gateway


React Frontend


Personalized Recipes

The application starts when a user submits a list of ingredients through the frontend.

API Gateway receives the request and invokes the Lambda function.

Lambda prepares the AI prompt and sends it to the Groq API.

Once the AI generates recipe suggestions, the backend formats the result into structured JSON and returns it through API Gateway.

The frontend then displays the recipes to the user.

Infrastructure as Code

One of my main goals was to avoid manually configuring cloud resources.

I used AWS SAM and AWS CloudFormation to automate the infrastructure deployment.

Instead of creating resources one by one through the AWS Console, the backend infrastructure can be deployed using the AWS CLI.

This approach makes deployments:

  • Repeatable
  • Easier to manage
  • Easier to update
  • Less dependent on manual configuration

During development, I encountered challenges related to CloudFormation parameter handling and environment variables.

After debugging the deployment scripts and configuration, I was able to automate the deployment workflow and deploy the backend consistently.

This was an important learning experience because it showed me that building an application is not only about writing the frontend and backend code.

Deployment and infrastructure configuration are also important parts of the development process.

Challenges I Faced

Like other serverless projects, the main challenges were related to deployment and configuration.

Some of the issues involved:

  • CloudFormation parameters
  • Environment variable configuration
  • Deployment scripts
  • AWS resource configuration

Debugging these issues helped me better understand how the different parts of a serverless application connect together.

Using Infrastructure as Code also made it easier to identify configuration problems because the infrastructure was defined explicitly instead of being hidden inside manual AWS Console settings.

What I Learned

Building FridgeChef AI gave me valuable hands-on experience with serverless application development on AWS.

Infrastructure as Code

I strengthened my understanding of Infrastructure as Code by deploying the backend through AWS SAM and CloudFormation.

This helped me understand how cloud resources can be defined and managed as part of the application codebase.

API Gateway and Lambda

I learned more about integrating Amazon API Gateway with AWS Lambda.

The project required designing the flow between:

  • The React frontend
  • API Gateway
  • Lambda
  • The external AI provider

This gave me more experience with serverless APIs and event-driven backend architecture.

AI Integration

Another important learning was integrating an external AI provider into an AWS application.

Groq handles the AI inference, while AWS provides the infrastructure required to deliver the application.

The combination looks like this:

AWS manages the application infrastructure → Groq provides AI generation

This separation allows the application to use managed cloud services while integrating specialized AI capabilities.

Debugging Deployments

Working through CloudFormation and deployment issues also improved my troubleshooting skills.

I learned more about:

  • Managing deployment parameters
  • Working with environment variables
  • Reading deployment errors
  • Debugging CloudFormation configuration
  • Structuring applications for repeatable deployment

FridgeChef AI is an experiment in combining generative AI with AWS serverless technologies to solve a simple everyday problem.

The application takes ingredients that users already have and transforms them into personalized meal ideas.

The complete workflow is simple:

Open the App → Enter Ingredients → Choose Preferences → Generate Recipes

Building the project gave me more experience with:

  • React and Vite
  • AWS Amplify
  • Amazon API Gateway
  • AWS Lambda
  • AWS SAM
  • AWS CloudFormation
  • Amazon CloudWatch
  • Serverless architecture
  • Infrastructure as Code
  • Groq AI integration

More importantly, it demonstrated how quickly a useful AI-powered application can be built by combining managed AWS services with a focused product idea.

Sometimes the best project is not the one with the most features.

It is the one that solves a small, annoying problem well.

Try FridgeChef AI

Live Application:

https://staging.d2rlx4nfgtm79o.amplifyapp.com/

Top comments (0)