The Interactive Recipe App is a full-stack web application designed to simplify meal planning and enhance the cooking experience. Users can search, filter, and save recipes while accessing personalized recommendations. The app ensures seamless interaction, real-time recipe seeding, and an intuitive interface, making it easy for users to discover and manage their favorite recipes.
- Advanced Search and Filter: Users can search and filter recipes based on ingredients, dietary restrictions, and preferences.
- Recipe Saving: Save and manage favorite recipes for quick future access.
- Dynamic Recipe Seeding: Automatically seeds recipes using the Spoonacular API and supports pagination for smooth browsing.
- Personalized Recommendations: Filters recipes based on user-selected pantry items and dietary restrictions.
- User-Friendly Design: Intuitive interface optimized through iterative design and A/B testing.
- Frontend: React, JavaScript, HTML, CSS
- Backend: Node.js, Express
- Database: MongoDB
- APIs: Spoonacular API
- Additional Libraries: Material-UI, Axios, dotenv, cors
- Node.js installed on your system.
- MongoDB set up locally or on a cloud provider.
- Spoonacular API key for recipe data.
- Clone the repository:
git clone <repository-url>
- Navigate to the project directory
cd interactive-recipe-app - Install dependencies:
npm install
- Create a .env file with the following:
MONGODB_URI=your-mongodb-connection-string SPOONACULAR_API_KEY=your-spoonacular-api-key
- Start the server:
npm start
- Access the application: Open your browser and navigate to http://localhost:3000.
- Launch the app as described in the installation section.
- Use the search bar to find recipes based on keywords or ingredients.
- Save your favorite recipes and access them easily under the "Favorites" section.
- Add pantry items and dietary restrictions to get personalized recommendations.
- Enjoy an enhanced cooking experience with curated recipe suggestions!