Just Another Cookbook Case Study

Overview:

For this project I was tasked with developing a fully responsive dynamic web-based cookbook for the Scripting II for IDM course at Drexel University. The goal was to design and develop a cookbook that uses MySQL and PHP to dynamically pull information from a database containing information for 40 recipes including nutrition info, cook times, ingredients, steps, and images. Using this information I was to display it using HTML and CSS. This project was designed and developed in a timeline of 9 weeks and is comprised of HTML, CSS, PHP, and MySQL.

Context & Challenge:

This project is focused on using PHP to dynamically produce a website for 40 recipes. All of the recipe information and assets were provided. We were given:

• 40 PDFs containing all of the recipe information.
• 40 folders containing raw image files for each recipe.

All of these assets were compiled into a .xlsx (Microsoft Excel) File so they could be imported into phpMyAdmin to handle creation of a database in MySQL. The purpose of this project was to learn the basics of PHP and MySQL to understand how to create and maintain a database of information.

Process:

Process: Wireframing

At first I decided a flex layout would work best for this project. It is a tool I am most familiar with and it would provide a great visual appeal for a large collection of recipes and thumbnails. Keeping this in mind I started wireframing.

Process: Wireframing Images

Process: Style Tile

Next, I decided on a color scheme, logo, and fonts. The color scheme I decided would be based off a vintage italian recipe book page. This is where I got my background and highlighting color. The logo I created and name of the website is a reference and homage to a glassblower I am fond of (Just Another Glassblower). The font family I am using for this website is Roboto.

Process: Style Tile Image

The Solution:

After much work the website is completed. The initial challenge presented was to create a dynamic web based cookbook to display 40 recipes and all of their content. My website completes every aspect of the challenge and while being presented fashionably. The flex structure helped bring that together.

The colors I decided on using in the final product are red (#E40713) and an opaque yellow (#FEFBED). These colors, much like McDonalds, are known for inducing hunger in people.

You can visit the final build here:

Just Another Cookbook

The Results:

This project was a success. The goal of this project was to create a fluid, simple digital recipe cookbook. My final site demontrates the use of HTML and CSS for its overall design and the use of PHP and MySQL for the use of a database. The primary focus of this project was to learn how to implement PHP into these languages and build my knowledge around its usage.