Project Overview
Foodie is a recipe website aimed at casual food enthusiasts. It allows users to store their own recipes, view others’ recipes, and quickly access meal ideas in one convenient place.
User Experience (UX)
User Stories
- Smooth navigation across the entire site.
- Quickly grasp the purpose of the website upon loading.
- Easily contact Foodie for more information.
- View personal and other users’ recipes.
- Add new recipes after creating an account.
- Maintain a personal account for recipe management.
Features
Existing Features
- Logo Navigation: A clickable logo at the top, returning users to the home page for quick access.
- Add Recipe Button: Allows registered users to add their own recipes.
- Recipes Page: Displays all recipes stored in the database with sorting options.
- Login / Register: Lets users create an account or log in to manage and add recipes.
- Footer: Consistent across pages, providing contact email and social media icons.
Future Features
- Sort recipes by category (e.g., savory, dessert).
- Add social media sharing for individual recipes.
- Enable social media login and account linking.
Design
Typography
“Playfair Display” offers a classic, sleek look reminiscent of a professional kitchen’s atmosphere.
Colour Scheme
Black and white to evoke a clean, modern yet classic kitchen feel, maintaining a simple and elegant aesthetic.
Technologies Used
- HTML5, CSS3
- Bootstrap (Responsive Layout)
- MongoDB (Database)
- JavaScript
- Heroku / GitHub Pages (Deployment)
GitHub Repository
Explore the complete codebase on GitHub: GitHub Repository