MiniPics showcase

The What

Furlon is an e-commerce for stores to sell their furniture in a central platform. The concept behind the site is that stores are able to host their products online to be sold.

To facilitate this, the site has certain functions including:

  • A search tool where users are able to search for different products.
  • A registration and login pages where users are able to update their password, view their order history, view their pending orders and even leave and update reviews on products they have purchased.
  • A reviews section for each product where users who have purchased a product are able to to reviews. Other users are then able to visit those reviews.
  • A basket section where users are able to view and update their basket.

what image
why image

The Why

I found myself to be really enjoying using the Django framework and I wanted to stretch myself by assigning myself a project where I would to do some planning and research before starting the project.

My research involved investigating database designs and code organisation in such a way that would promote scalability. I decided that I would be using SASS and TypeScript as they both make it easy to make components whereas TypeScript has the added benefit of allowing type checking thus reducing bugs. I did not know how to use either of these technologies and so I took some to time to learn how to use both.

I have since been able to create smaller, manageable components which I can easily transfer to any new project. I have also used webpack to bundle my files so that there is only one request for the CSS and one for the JavaScript thus reducing the load time.

The main reason for pursuing the project was because I knew that the project would involve me having to learn new technologies and dive a bit into design patterns. It also forced me to learn to manage my time and not end up spending hours on a piece of CSS as there was a lot to do.

The How

I began by firstly creating a Ghantt Chart to help me plan my time. Following which, I spent time planning the structure of the code and planning the database.

During the development phase, I used a local PostGreSQL database on my local machine, but as the project started to get bigger, I also created a database on elephantSQL which I would connect to whenever I was working on my train on my way and back to work.

For for the frontend I decided to use SASS and TypeScript and produce components rather than code the CSS and TypeScript for each page. I used webpack to bundle all my code to reduce the load time.

For a quite parts of the website, I found that Django's query took was not allowing the flexibility I needed. This was apparent when I was building the search page. I decided to then adopt the lazy getter design pattern and in essence cache queries to avoid hitting the database multiple times.

I hosted the database on DigitalOcean and and have created some scripts to help populate the database.

how image