Skip to content
  • Unlock Pro
  • Log in with GitHub
Solution
Submitted over 3 years ago

Audiophile ecommerce website - React, Mongodb-realm, Sass

mongodb, react, react-router, sass/scss
Chamu•13,890
@ChamuMutezva
A solution to the Audiophile e-commerce website challenge
View live sitePreview (opens in new tab)View codeCode (opens in new tab)

Solution retrospective


It is one of the complex challenges that i have taken on Frontend Mentor, which i used to learn how to work with Mongodb-realm. I have little knowledge on backend, Realm makes it easy to integrate the backend and the frontend. Some minor changes where made to simplify the project a bit - the mobile navigation in particular and the confirmation modal.

Fetching data from realm is taking about 5 seconds to load on the Frontend, I used a modal box to compensate for the time delay.

An interesting aspect that i learned was to hide fieldsets on a form until the top ones have filled and are valid - this can be done with the css below

/* Hide the fieldset after an invalid fieldset */
fieldset:invalid~fieldset {
    display: none;
}
  • some omissions and improvements may be found and such feedback is welcome
Code
Loading...

Please log in to post a comment

Log in with GitHub

Community feedback

No feedback yet. Be the first to give feedback on Chamu's solution.

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

Stay up to datewith new challenges, featured solutions, selected articles, and our latest news

Frontend Mentor

  • Unlock Pro
  • Contact us
  • FAQs
  • Become a partner
  • Use cases

Explore

  • Learning paths
  • Challenges
  • Solutions
  • Articles

Community

  • Discord
  • Guidelines

For companies

  • Hire developers
  • Train developers
© Frontend Mentor 2019 - 2025
  • Terms
  • Cookie Policy
  • Privacy Policy
  • License