In this tutorial we are going to build a real-life shopping cart 🛒 application.

We'll talk about the technology stack and the features it will have in a minute. I'll also walk you through the process step-by-step. But first, let me show you what it's going to look like.

Let’s sketch 🙃

Product List

Product List

We are going to make our app mobile friendly by implementing a decent level of responsiveness.

products-page-mobile.jpeg

cart-desktop.jpeg

cart-mobile.jpeg

This time, before going directly to the (digital) building of this project, I decided to go more traditional. I took a pen and paper and drew these ugly sketches, just to make sure I have a visual idea of what am I building.

And honestly, it does the trick ✨. It really helps when you are about to sit on your computer and ask the question:

What do I start with now?

TL;DR

If you want to skip the reading, here 💁 is the GitHub repository with a detailed README 🙌, and here you can see the live demo.