Red Sofa Cafe

The moment you step through the door you are greeted by friendly staff and the aroma of freshly roasted coffee. A haven for those looking to relax and freelancers alike.

• Try to bring that "home away from home" feeling to the design ( yes this is a developer portfolio, but I like a challenge 🙂 ).
• Optimal performance and usability across all devices.

Experimentation was the order of the day. This was my first launch ever and I decided to take full advantage of the opportunity.

Most notably was the use of Sass, Flexbox, deferred image loading and loading animations until banners were ready to display. A little AJAX for forms went a long way too, but more on that later.

With regards to development time, Sass came in very handy as I had yet to discover the joys of Autoprefixer. Mixins to the rescue! Mostly, I used them for Flexbox and media queries which, along with partials and variables, made organising my styles a breeze and saved me a lot of time.

I made mention of AJAX earlier which was a great way to provide real-time feedback for forms. At the time, the cafe hosted a movie night once a week and customers needed to be able to purchase tickets on the site.

Validation and sanitisation was handled by PHP with the response returned to the initiating AJAX request. If successful, customers were sent to a payment gateway provided by PayFast.

Customer details and their orders were stored in the database and I had developed a simple UI for the staff so they could view orders and payment status or manually add and edit orders as needed.