Plum

Plum is a recipe sharing website designed to help users find recipes and share their own with others.

See live site.

User Experience
- Project Goals
  - User Stories
Design
- Database
  - Indexes
  - Queries
    - Browsing
    - Users
    - Searching
    - Uploading
    - Administration
- Fonts
- Colours
- Layout
Features
- Existing Features
- Future Features
Technologies
- Site architecture
- Languages
- Libraries
- Editors
- Tools
- Platforms
Testing
Source Control
- Branches
- Github Desktop
Deployment
- Database Deployment
- Deployment Platform
Credits
- Media
- Acknowledgements

User Experience

Project Goals

The project goal is to produce a recipe sharing website that allows users to share recipes.

User Stories

Browsing

(US001) - As a cook I want the website to make suggestions to me so I can be introduced to new content.
(US002) - As a cook I want to see reviews and ratings from other users so I can select the best content.

Searching

(US003) - As a cook I want to search recipes by name so that I can find specific dishes that I want to make.
(US004) - As a cook I want to search recipes on cuisine type so that I can get dishes of a specific type I want to make.
(US005) - As a cook I want to be able to be able to filter recipes based on cooking time so I can get dishes I have time to prepare.
(US006) - As a cook I want to save my favourite recipes so that I can quickly find them again in the future.

Uploading

(US007) - As a recipe creator I want to upload my own recipes so that other users can benefit from them.
(US008) - As a recipe creator I want to gain feedback on my recipes so I can discover improvements.
(US009) - As a recipe creator I want to be able to edit a recipe I've posted so I can improve it.

Users

(US010) - As a new user I want to be able to register with the site so that I can upload new recipes and track my favourites.
(US011) - As a registered user I want to be able to log into my account so that I can access my recipes and favourites.

Administration

(US012) - As an admin I want to be able to edit content to ensure it adheres to site rules.

General

(US013) - As a user I want to receive clear feedback for my actions so I know if any further action is required.

Design

Database

(PDF) (dbdiagram)

Indexes

recipes:

Unique index on page_id - Ensures pageid field is unique.

plumdb.recipes.createIndex(
{
	pageid : 1
},
{
	unique: true
})

Text index on title and description for text searches.

plumdb.recipes.createIndex(
{
	title : "text",
	description : "text"
})

users:

Unique index on name - Ensures two users can't share a username.
```
plumdb.users.createIndex(
{
	name : 1
},
{
	unqiue: true
})
```

ratings:

Unique compound index on user_id and recipe_id - Ensures only one interaction record between one recipe and user.
```
plumdb.ratings.createIndex(
{
	recipe_id : 1,
	user_id : 1
},
{
	unique : true
})
```

cuisines:

Unique index on name - Ensures each cuisine type only appears once.
```
plumdb.cuisines.createIndex(
{
	name : 1
},
{
	unique : true
})
```

Queries

Browsing

Find the newest recipes (for US001):

plumdb.recipes.find().sort(_id, -1).skip(
	current_page * items_per_page).limit(items_per_page)

Find a specific Recipe/User interaction (for US002, US008):

plumdb.ratings.find_one({user_id : user['userid'], recipe_id : recipe['_id']})

Users

Find a specific user account based on username (US011):

plumdb.users.find_one({name: username})

Insert a new user account into the database (US010):

plumdb.users.insert_one(user-record)

Find all the recipes a user has uploaded:

plumdb.recipes.find({author : username})

Find all the recipes a user has favourited (for US006):

plumdb.ratings.aggregate([
	{ $match : {user_id : userid, favorited : True} },
	{
		$lookup : {
			from : recipes,
			localField : recipe_id,
			foreignField : _id,
			as : favorites
		}
	},
	{$unwind : $favorites},
	{$replaceRoot : {newRoot : $favorites}}
])

Searching

Find a single recipe from it's pageid (for showing a single recipe page):

plumdb.recipes.find_one({pageid: pageid})

Find recipes conforming to a user's search (for US003, US004, and US005):

Any individual field can be omitted as long as at least one field is passed.

plumdb.recipes.find({
	cuisine* : query.cuisine,
	servings* : query.servings,
	time* : {$lte : query.time},
	rating* : {$gte : query.time},
	$text* : {
		$search : query.text,
		$caseSensitive : False
	}
})

*Optional

Potential improvements:

The mongodb text search defaults to "or" operations on the search terms. This means a search for Chicken Curry will return results that include the word Chicken or the word Curry. For instance searching for Chicken Curry will return results like Beef Curry and Fried Chicken. It may be more intuitive to try and use an "and" operation, so search results by default return results that match all the search terms. Wrapping the entire text search in double quotes (") will make mongodb match the whole phrase in order. So Chicken Curry will match Red Chicken Curry, but not Chicken with Curry or Beef Curry. Alternatively the individual words in the search can be wrapped in double quotes, which will match recipes with the search terms in any order.

Uploading

Add a rating vote to a recipe (for US002 and US008):

Updating the recipe record

plumdb.recipes.update_one({_id : recipeId}
{
	$set : {
		rating.0 : avg_rating,
		rating.<vote> : rating[vote] + 1
	}
})

Adding the rating record

plumdb.ratings.insert_one(interaction-record)

Update a rating vote on a recipe (for US002 and US008):

Updating the recipe record

plumdb.recipes.update_one({_id : recipeId}
{
	$set : {
		rating.0 : avg_rating,
		rating.{vote} : rating[vote] + 1
		rating.{old_vote} : rating[old_vote] - 1
	}
})

Updating the rating record

plumdb.ratings.update_one({_id : interaction._id}, 
{
	$set : {rating : new_rating}
})

Favouriting a recipe (for US006):

plumdb.ratings.update_one({_id : existing_interaction._id},
	{$set : {favorited : favorite}})

Add a comment to a recipe (for US002 and US008):

plumdb.recipes.update_one({_id : recipeId}
{
	$push : { comments : {
		author : username,
		text : comment		
	}}
})

Add a new recipe (for US007):

plumdb.recipes.insert_one(recipe-record)

Edit an existing recipe (for US009 and US012):

mongo.db.recipes.replace_one({pageid : pageid}, recipe-record)

Fonts

Headers are rendered using Open Sans with body text in Roboto. Open Sans was chosen for headers because it is bold and clear, while Roboto is easy to read and widely used on the web. Both are obtained from Google Fonts.

Colours

Sap Green was chosen as it is associated with nature, health, and freshness. Plum purple fits the branding of the site well while also being complimentary to Sap Green and evoking feelings of luxury. Honeydew was chosen as a background colour as it is near white, providing plenty of contrast for darker elements and text, while also tying into the main green colour.

Sap Green (#3F7D20) - Main site brand colour
Plum (#8E4585) - Accent colour
Honeydew (#F3FCF0) - Background colour
Rich Black (#0D0A0B) - Main text colour
White - As a background to bring out some sections

Layout

The site is designed to work and be usable on various devices from mobile phones to desktop computers with a responsive layout. The minimum targeted screen width is 320 pixels wide and a maximum tested width of 2560 pixels.

All initial wireframes are available in pdf format:

Wireframes