AI Meal Planner is an intelligent tool designed to generate personalized meal plans based on user inputs such as weight, age, height, and dietary preferences. It leverages AI to suggest balanced and nutritious meals for breakfast, lunch, dinner, and snacks, ensuring users meet their dietary goals. The meal plan is provided in a structured format, making it easy to follow and implement.
- 🤖 Introduction
- 📸 Screen Shot
- 🤸 Quick Start
- 🔋 Features
- ⚙️ Tech Stack
- 🔗 Author
In order to run this project locally, simply fork and clone the repository or download as zip and unzip on your machine.
- Open the project in your prefered code editor.
- Go to terminal -> New terminal (If you are using VS code)
cd ai-meal-planner
Install dependencies
npm install
Set up environment variables
Create a .env.local file at the root of the project and add the following:
NEXT_PUBLIC_APP_URL=http://localhost:3000
NEXT_PUBLIC_SERVER_URL=http://localhost:3000
OPENAI_API_KEY=
NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=
CLERK_SECRET_KEY=
NEXT_PUBLIC_CLERK_SIGN_IN_URL=
NEXT_PUBLIC_CLERK_SIGN_UP_URL=
CLERK_SIGNING_SECRET=
MONGODB_URL=
CLOUDINARY_CLOUD_NAME=
CLOUDINARY_API_KEY=
CLOUDINARY_API_SECRET=
STRIPE_SECRET_KEY=
STRIPE_WEBHOOK_SECRET=
- Run the app locally
npm run dev
The app will be available at http://localhost:3000.
-
Personalized Meal Plans: Users input their preferences (calories, protein, etc.), and the app generates a custom meal plan using OpenAI's GPT-3 model.
-
AI-Generated Dish Images: Dish names in meal plans are used to generate realistic and high-quality images using DALL·E.
-
Credits System: Users can purchase or earn credits to generate meal plans and AI-generated dish images.
-
User Authentication: Secure sign-up and login functionality powered by Clerk.
-
Responsive UI: Built with Tailwind CSS for a mobile-first and user-friendly design.
-
State Management: Global state management is handled efficiently using Zustand, allowing smooth management of user preferences, meal plans, and credits.
-
API Integration: Fetches meal plans dynamically using the OpenAI API, based on user inputs for precise and personalized results. Real-time Meal Plan Generation: Generate meal plans in real-time and display them in an organized format.
This project was created using the following technologies.
- Next.js: React framework for building server-side rendered applications.
- TypeScript: Type-safe JavaScript superset for better development experience.
- Zustand: A fast, simple state management library for React.
- OpenAI API: GPT-3 model for generating meal plans based on user input.
- Clerk: User authentication library for sign-up, login, and session management.
- Tailwind CSS: A utility-first CSS framework for fast styling.
- Stripe: Payment gateway integration for managing subscriptions and transactions.
- Cloudinary: Media management platform for optimizing and serving images.
- Shadcn UI: A modern, customizable component library for building polished UIs.
- Lucide-react: Icon library for adding clean and lightweight icons to your application.
- Github: @SarahNaif
- Linkedin: @sarah-althowebi
- Email: sarah.althowebi@gmail.com



