Thank you for creating such a fun challenge! I had a great time working on it. I hope you enjoy my solution.
-
If I was working with larger JSON objects, I would like most likely use IndexedDB to store and search through the data locally. This would allow for faster load times and a better user experience.
-
I would add unit testing with Jest and e2e testing with Playwright.
-
From a CSS point of view: I would fix the position of the header, search bar, and filters to the top of the page. Then I would make the table header sticky in order to make sure the user can always see the column names.
-
I would add a loading spinner to the page while the data is being fetched.
-
I would add a "No Results Found" message if the user searches for a term that does not exist in the data.
Simply run npm install and then npm run dev to run the app locally.