Job-listings-with-filtering

Community feedback

• 

  P

  markus•2,250

  @markuslewinPosted about 2 months ago

  The trick is to realize you actually only need state for appliedFilters. The rest of the UI can be derived from data and appliedFilters:

  import jobs from "./data.json";
  
  function App() {
    const [appliedFilters, setAppliedFilters] = useState([]);
  
    const filteredJobs = jobs.filter((job) =>
      filters.every((filter) =>
        [job.role, job.level, ...job.languages, ...job.tools].includes(filter)
      )
    );
  
    return <></>
  }
  

  Now, you only need to add/remove filters, and filteredJobs will be recalculated every time appliedFilters updates!

  0