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

Bookmark Landing Page developed with React.js

#accessibility#react#webpack
dannxvc 180

@dannxvc

Desktop design screenshot for the Bookmark landing page coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
3intermediate
View challenge

Design comparison


SolutionDesign

Solution retrospective


Hi, this is my first web site developed with React.js from scratch. I used useState and useEffect hooks to handle on click. I appreciate any feedback about my code. Thank you so much, I've learnt a lot by making this challenge.

Community feedback

Joramt 20

@Joramt

Posted

I just found frontendmentor and your submission, and congrats it's absolutely spot on ! Very good work, idk your level but this is coming from a consultant front end developer ( Jorel Amthor if you want to check me on LinkedIn )

Things you could improve and or expand, from easiest to hardest : Write modern JS; look into arrow function, how to use typescript, how to compile typescript file into JS using webpack Use router to have different URLs; i know this is a SPA but you try adding different page. Instead of having everything on one, try using react router to have a /pricing /feature /contact dedicated pages :) Use Redux to maintain state to display what browser you support; instead of hardcoding each supported browser, you could define a Redux store containing a SupportedBrowsers list of Browser object, each made of { id: (unique Id to identify the browser ), displayName: ( name of the browser ), browserImg: ( IMG url of the browser) }. You could loop through that list to render a Browser component which will take the data above as a prop.

Have fun, and once again, from a total neutral stranger, very, very, very good job !

Marked as helpful

1

dannxvc 180

@dannxvc

Posted

@Joramt This means SO much to me, thank you so much. I actually wasn't sure if I should've used React Router, so thank you so much, I would update it definitely. I just found you on LinkedIn, cool! And I'll take a look to Typescript and Redux as well, if you could share some resources it would be amazing. Thank you again!

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