Skip to content
Submitted over 2 years ago

Responsive Design, React JS, SCSS, Flexbox, Grid

Bryan Sanchez•590
@0-BSCode
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Tip calculator app
  • HTML
  • CSS
  • JS
2junior

Design comparison

SolutionDesign

Solution retrospective

I had a lot of fun creating this one! This is the first time I tried doing a challenge with React JS, and a few questions came into mind while I was making the project:

  1. How to organize the file structure in React? I think this was a relatively small project, so I didn't really place a lot of effort into organizing my files, but are there good practices when it comes to file organization and, if so, what are they?
  2. Are there any good practices for using React JS in general? I'm completely new to using this tool so any advice and feedback is more than welcome :)

Community feedback

  • Dev Rathore•2,600
    @GitHub-dev12345Posted over 2 years ago

    ❤️👍 My small suggestion : 1.In Card design CSS Code Used this:

    transform : scale(0.8); this property decrease the size of card. 😉

    large size for increase the number of scale & small size for decrease the number of scale

    I hope you find this helpful

    Marked as helpful
    0
    Bryan Sanchez•590
    @0-BSCodePosted over 2 years ago

    @GitHub-dev12345 Thank you so much for the tip! It never clicked in my head that I could do that. Will definitely be trying that out in my next challenges!

    0

Please log in to post a comment

Log in with GitHub

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