Hot Sauce List Website

Responsive User-Driven Site, Created with the Yii Framework

www.hotsaucefever.com


Hot Sauce Fever is a personal project to create a definitive reference list of hot sauces, that anyone can rate and review. The idea was born when I started looking for a site like this, expecting that it already existed, as it does for beer and wine. When I didn’t find anything, I decided to make it happen, with the help of designer Danny Day. I ended up choosing the Yii PHP Framework, seeing that it was gaining a lot of traction lately, and was a useful learning tool for a proper MVC (Model-View-Controller) structure.

The is a fully responsive fluid-width site, with breakpoints dependent on both the design and resolutions. It was built desktop-first, rather than the mobile-first. During the initial build, I kept in mind how it was going to have to change at smaller widths. For example, the 4 main navigation buttons around the logo were made a single list, with spacing applied to the 2nd and 3rd list items, knowing that they would have to push down. Perhaps you could call this planned-retrofit responsive design. This approach, without a specifically designed mobile or iPad-sized design, worked fine in this case, since I was the client.

Users can register for an account, verify by email, edit their profile, and reset their password. They can then submit a review, which uses a jQuery UI Slider, and custom JavaScript to display a letter grade as the rating slider is changed. New sauce information can be submitted with a review as well, if it is not already in the database. New hot sauces require approval, and users are notified by email once an admin approves their new entry. Some other features include a clickable autocomplete, blog, edit and delete options for reviews, CSS transitions, responsive slider, social media setup, initial data entry of 75 sauces, and more.


Project Year: 2012

Project Details:

  • Responsive Design
  • Yii Framework (PHP)
  • User Registration System
  • HTML5 and CSS3
  • jQuery Sliders, Autocomplete, etc
  • User Content Submission and Editing