Web Chef User View

The Application

A custom recipe book web application. Web Chef provides users a single place to organize and use their personal recipe collection. Users can organize their recipes into different cookbooks and meals. They can also search for recipes by ingredient. Other features include pantry, shopping list, and meal planning.

View Features

The Project

This application was designed and developed over a three month period by a six-person team led by Courtney Ward. The site was created using the .NET Core MVC framework, C#, cshtml, js, bootstrap, and css. Neo4j was used for the database.

View Repo

App Features

The video and images below showcase the various features of the Web Chef Application.

NOTE: The database server is not currently running, so live viewing of the website is not possible at this time.

Screenshot of logged-in user home page view for Web Chef application showing user recipes and cookbooks.

User Homepage

From the logged-in homepage, the user can see a summary of their recipes & cookbooks.

Screenshot of Recipes Page for Web Chef application showing the user's list of recipes.

Browse Recipes

With the Recipe Tab, users can browse & manage their individual recipes.

Screenshot of view for Web Chef application showing adding a Cookbook.

Organize by Cookbook

Using the Cookbook feature, users can organize their recipes into different cookbooks.

Screenshot of view for Web Chef application showing Cookbook view.

Browse Cookbooks

With the Cookbook Tab, users can browse their cookbooks. Selecting a cookbook will show a recipes page listing only the recipes attached to that cookbook.

Screenshot of view for Web Chef application showing the ingredient view.

Find Recipes by Ingredient

From the Ingredients Tab, users can click on one of their ingredients to get a recipe page listing all of their recipes that use that ingredient. The ingredient page is automatically updated as users add recipes and ingredients to recipes.

Screenshot of view for Web Chef application showing the recipe card view.

View Recipe

Once a recipe is selected from any of the prior screens, an easy to read recipe card is displayed for the user to reference while cooking.

Screenshot of view for Web Chef application showing the pantry view.

Pantry

Users can keep track of items in their pantry using the Pantry Page. Currently, this page is self contained. However, in future itterations, it could be linked to the shopping list and recipe card features to allow more a more automated management system.

Screenshot of view for Web Chef application showing the shopping list view.

Shopping List

Users can create a usable shopping list within the application using the Shopping List Page. Currently, this page is self contained. However, in future itterations, it could be linked to the recipe card feature to allow users to easily add recipe items to their shopping list. It could also be linked to the pantry so that bought items could more seamlessly be moved from the shopping list to the pantry inventory.

Screenshot of view for Web Chef application showing the meal view.

View a Meal

Users can also organize recipes into Meals. A Meal is a set of recipes that the user regularly makes together, such as an entree with a specific set of sides. The Meal View allows users to view all recipe cards of a meal on the same page and easily move between them while cooking them simultaneously. With this feature, users don't have to locate each recipe separately. It also serves as a reminder of what items they liked eatting together.

Screenshot of view for Web Chef application showing the meal schedule overview page.

Meal Planner: Overview

The Meal Planner was the last feature being added and is currenly in a view-only state. Once completed, users would be able to add recipes and meals to specific days and mealtimes. An overview of their planned meals would be displayed on this page.

Screenshot of view for Web Chef application showing the monthly view for the meal planner.

Meal Planner: Monthly View

Users would also be able to view their meals as scheduled for the month.

Screenshot of view for Web Chef application showing the weekly view for the meal planner.

Meal Planner: Weekly View

Users would also be able to view their meals as scheduled for the week.