Skip to content
Submitted about 2 years ago

Responsive app built with React/React-Router/Material UI

Matt West•440
@matt-o-west
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Planets fact site
  • HTML
  • CSS
  • JS
3intermediate

Design comparison

SolutionDesign

Solution retrospective

Deployment and state management gave me some headaches in this one. I still have a bug I need to fix where if you refresh the page, the GET request fails even though the route looks fine. Any ideas how to resolve this?

I utilized React-Router and any best practices related to this would be appreciated, I don't know if I implemented it in the optimal way. That said, I think I am getting much better now that I am comfortable building in React to the point where I can pull in UI libraries. Hopefully, it's an upward trajectory from here!

Community feedback

  • markus•2,250
    @markuslewinPosted about 2 years ago

    This comment was deleted about 2 years ago

    1
    Matt West•440
    @matt-o-westPosted about 2 years ago

    @markuslewin Thank you! I was trying to figure that out :)

    1
  • Chamu•13,150
    @ChamuMutezvaPosted about 2 years ago

    Hi Matt

    So far so good on your project. You managed to pull the data from the json file, but what you really need to work on is your styling as your page is not responsive. Practice styling on a project that is of a lower level than this one. A site should generally be able to be viewed on any device smoothly

    • all img should have a alt property and an img is a self closing element . <img src="./image.jpg" alt="" />
    • interactive elements such as buttons and anchor element should have readable text that is available to assistive technology users.
    • see also the feedback response
    Marked as helpful
    1
    Matt West•440
    @matt-o-westPosted about 2 years ago

    @ChamuMutezva thank you for that feedback! you're right, the media queries aren't working well when deployed (for some reason they are working better in the dev build?), I'm going to do as you suggest and work on a project strictly for responsiveness

    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