RecipeAI Mobile App - Expo Project
Description
RecipeAI is a mobile application built with Expo, designed to help users discover recipes based on the ingredients they have. Users can manually input ingredients or select from preset options, and the app will use AI to generate personalized recipes. The app is intuitive and user-friendly with a sleek, modern design, making it easy to find new recipes quickly.

Features
Ingredient Input with Quick Selection

Users can manually input ingredients.
There will be preset ingredient tags like "tomato," "cheese," and "pepper" for quick selection.
Recipe Suggestions

AI generates personalized recipe suggestions based on selected ingredients.
Recipes are generated for 3 people by default (this can be changed in the future).
AI-Powered Recipe Improvement

An "Improve" button allows the AI to suggest additional ingredients that users may not have but that could improve the dish.
Example: "You don’t have garlic, but it would enhance the dish."
Step-by-Step Cooking Guide

After selecting a recipe, users can follow an easy step-by-step guide for cooking.
Technologies Used
Frontend:

Expo (React Native): The framework for building the mobile app.
React Navigation: For managing screen transitions and navigation.
Styled Components: For creating modern, clean, and colorful UI styling.
Backend and AI Integration:

Node.js & Express: To serve API requests and handle backend logic.
MongoDB (Optional): If future versions need to store data for history or analytics.
Pollinations AI API: For generating recipe suggestions and improvement recommendations based on ingredients.
Text API: https://text.pollinations.ai/
Image API: https://pollinations.ai/p/
Screens and User Flow
Home Screen:

Ingredient Entry: Users can manually input ingredients, or select from preset tags (like Tomato, Cheese, Bell Pepper).
Preset Tags: Quick access to common ingredients for easy selection.
Improve Button: Users can tap this to send the current ingredient list to the AI, which suggests improvements.
Recipe Suggestions:

Displayed After Ingredients Are Entered: A list of recipes generated by the AI based on the available ingredients.
AI-Generated Images: Each recipe has an image generated by the Pollinations Image API.
Users can save recipes or view them step-by-step.
Recipe Details:

Shows detailed steps for cooking the recipe.
Users can follow a step-by-step guide that includes timers and reminders.
API Integration Example
Pollinations AI (Text & Image)
We'll use Pollinations AI to both suggest recipes and offer additional ingredients to improve recipes.

Text API for Recipe Suggestions:

Prompt: “Generate a recipe with [user’s ingredients] for 3 people. It should be easy to cook for dinner.”
Endpoint: https://text.pollinations.ai/
Response: A generated recipe with steps, ingredients, and preparation time.
js
Kodu kopyala
const axios = require('axios');

async function getRecipe(ingredients) {
  const prompt = `Generate a recipe with ${ingredients.join(', ')} for 3 people.`;
  const response = await axios.post('https://text.pollinations.ai/', { prompt });
  return response.data;
}
Text API for Improvement Suggestions:

Prompt: “These are the available ingredients: [user’s ingredients]. Suggest additional ingredients to improve the recipe.”
Response: AI suggests extra ingredients to enhance the dish.
js
Kodu kopyala
async function improveRecipe(ingredients) {
  const prompt = `These are the available ingredients: ${ingredients.join(', ')}. Suggest additional ingredients to improve the recipe.`;
  const response = await axios.post('https://text.pollinations.ai/', { prompt });
  return response.data;
}
Image API:

For every generated recipe, we'll use the Pollinations Image API to create a vibrant, colorful representation of the dish.
js
Kodu kopyala
async function getRecipeImage(recipeDescription) {
  const prompt = `A vibrant image of ${recipeDescription}.`;
  const response = await axios.post('https://pollinations.ai/p/', { prompt });
  return response.data;
}
Project Structure
bash
Kodu kopyala
RecipeAI-Mobile/
│
├── assets/                  # Icons, images, fonts, etc.
│
├── components/              # Reusable UI components
│   ├── IngredientInput.js   # Input for entering ingredients
│   ├── RecipeCard.js        # UI for displaying recipes
│   └── StepGuide.js         # Step-by-step cooking guide
│
├── screens/                 # Application screens
│   ├── HomeScreen.js        # Ingredient input and improve functionality
│   ├── RecipeScreen.js      # Shows recipe suggestions
│   └── RecipeDetailsScreen.js # Detailed recipe steps
│
├── services/                # API calls
│   ├── pollinationsApi.js   # Pollinations AI integration
│
├── App.js                   # Main app file
├── app.json                 # App configuration (Expo specific)
└── package.json             # Dependencies and scripts
New Features to Add
Preset Ingredient Tags:

Example: Display tags like "Tomato," "Cheese," "Pepper." Users can tap to add them to the list. as the person adds, it will use text ai api to get new items to the list.
Implementation: Add a component for displaying common ingredients.
Improve Button:

Function: AI suggests additional ingredients if the user has missing key ingredients.
Text: "You don’t have garlic, but adding it would improve the flavor."
Recipe Suggestion:

Based on user-entered ingredients, recipes are generated for 3 people by default. AI provides recipe steps, images, and cooking instructions.
UI/UX Design
The design will be sleek, modern, and colorful:

Color Scheme: Use vibrant colors like orange, green, and blue for buttons, and light backgrounds for better contrast.
Ingredient Tags: Display common ingredients as colorful, clickable tags.
Step-by-Step Cooking: Easy-to-follow steps with a large, clean interface. Use icons and color-coded timers to enhance the cooking experience.
AI Improvements & Future Plans
Advanced AI Suggestions: In future versions, users can provide feedback on recipes to improve AI suggestions.
Dietary Preferences: Filters for vegan, keto, and other dietary needs.
Shopping List Generator: Automatically create a shopping list for missing ingredients based on selected recipes.