Design comparison
Solution retrospective
I created a solution with React, the point wasn't simply to filter on the front with css but i wanted to filter the array accordingly.
I'd love a feedback about my code in Jobs.js
Thank you. :)
Community feedback
- @vandermsPosted over 2 years ago
Hi there! Well done!
I will start making this project and I am happy to have found your solution because I had some doubts about how the app works.
I only have two suggestions:
The first is when you are using Create React App (or other framework), you should remember to change the favicon and the title on the index.html file. Currently the title of your solution is "React App". "Job Listings" would definitely be a better title.
The second is it's much easier to deploy a React App on free services like Netlify or Cloudflare Pages. You should give them a try.
0 - @Captressketh001Posted over 2 years ago
Nice attempt. I will love to point out a few things I discovered while checking your design.
-
The filter list has a longer width. You can make the width nice by making the width of the list width:auto in your code. like this:
.filterList h2{ width:auto }
-
The filter list container is also displaying when no filtering is happening. You can toggle the display of the list by checking the length of the filter array. if the array does not contain any item, the bar should not show. Example This is how to toggle display in Vue, don't know how to do it in react.
<div v-show="filterlength >0"></div>
-
Don't forget to fix the html and accesibility issues.
Nice work once again
0@FlomhwPosted over 2 years ago@Captressketh001
Hey thank you for your feedback. Yes i remarked that the filter container is always visible but since i focus more on the js part is figured it wasn't a big deal. But of course i'd be better to stick to the design.
Thanks. :)
0 -
Please log in to post a comment
Log in with GitHubJoin 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