Thanks for checking out this front-end coding challenge.
Your users should be able to:
- View the optimal layout for the site depending on their device's screen size
- See hover states for all interactive elements on the page
- Filter job listings based on the categories
So, if a job listing is for has the following categories Frontend, Junior, JavaScript, React
your HTML data attributes would look like this data-role="frontend" data-level="junior" data-languages="javascript" data-tools="react"
.
Use the data.json file to pull the data and then dynamically add the content. This would be perfect if you're looking to practice a JS library/framework like React, Vue, or Svelte.
To add a filter, the user needs to click on the tablets on the right-side of the listing on desktop or the bottom on mobile. For each filter added, only listings containing all selected filters should be returned.