Luffer Coffee

INTRODUCTION

Luffer Coffee is a portfolio website representing a coffee shop. This website was made with Hugo, it's a simple and minimalist SPA. The libraries used are mainly EmblaCarousel, JustValidate, SweetAlert, GSAP, and LufferCarousel (my own library 😊).

DESIGN

This website started as a design in Figma. It consists of 3 versions: Desktop, Tablet, and mobile.
It features a simple and minimalist design with some nice physical animations on the carousel. There are several carousels, the outermost one contains the entire website except for the header and footer. It contains three slides, the second slide contains another slide. Both carousels have their respective indicators in the form of hearts.
The header contains a selector for light, dark, and image themes.
In the mobile and tablet version, we find a marquee effect, which disappears in the desktop version and is replaced by a carousel that we can manipulate manually.

CODE

The code for this website is quite simple, the only noteworthy thing is that LufferCarousel was born thanks to this site.

CONCLUSION

The website is fully ready to be used in production, I will probably create a branch with alternatives for the header and also replace EmblaCarousel with LufferCarousel.