Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Coffeeroasters subscription site

P
Karol 1,970

@VillageR88

Desktop design screenshot for the Coffeeroasters subscription site coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
3intermediate
View challenge

Design comparison


SolutionDesign

Solution retrospective


What are you most proud of, and what would you do differently next time?

I completed this project using Flask for the backend, with the frontend built using vanilla CSS, HTML, and JavaScript. I also developed a custom JavaScript script to parse the DOM and update it client-side, mimicking some React-like behavior, although it’s not a true React implementation. This approach avoids full page reloads and performs quite efficiently.

I used pure CSS for this project as an experiment to challenge myself, but I've since realized that Tailwind would have been much more enjoyable and efficient. Working solely with vanilla CSS proved to be more cumbersome than I anticipated. Additionally, managing state and interactions with just vanilla JS was somewhat frustrating. For my next project, I plan to use Flask along with Preact, TypeScript, and Tailwind to improve development efficiency and functionality.

Community feedback

RedMwp 790

@RedMwp

Posted

This is amazing, I would like to know how you prepare before you start coding..

0

P
Karol 1,970

@VillageR88

Posted

@RedMwp Hi RedMwp, I’m really glad you found it okay! 😊

Before diving into a challenge, I usually do a quick study of the design to understand what needs to be done. If it’s similar to designs I’ve worked on before, I might reuse some of my templates. However, I don’t usually do extensive preparation; I prefer to jump in and figure things out as I go.

1
RedMwp 790

@RedMwp

Posted

Thanks @VillageR88

0

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord