I managed to complete the core task using Typescript and Vite, and was in the middle of adding a histogram filter feature for the value counts of each column of the table.
One small struggle I had was learning how to use Vite and how to separate pages into components as I am very much used to NextJS's pages router.
Given more time, I would have:
- Improved the styling of the table
- Allowed sorting when clicking on a column
- Added pagination of the table when rows exceeded a set value (say 100 rows)
- Consider error handling for the API call
- Unit testing of the API call and frontend
- Allowing filtering when clicking on a histogram bar
- Properly handled the sizing of each histogram bar
This is a simplified React starter templateconfigured using Vite, a build tool that aims to provide a faster and leaner development experience.
It has minimal dependencies and configuration to allow for easy installation and to allow the candidate to make their own decisions about styling, external libraries and other tooling.
You are free to make changes to the template but please be aware that those reviewing your work will need to be able to install and run it locally without difficulty.
To use the repository for your challenge submission, please fork the repository to your own Github account and then clone locally and begin development. Please DO NOT try to push branches or make pull requests to the original source template repository.
From the root folder, run npm install to install all required dependencies.
From the root folder, run npm run dev to run a local server with hot reloading.
If you would prefer a JavaScript template, please close the repository here.