Logistics App
Tools: React + CSS, HTML
Functionality
- search-as-you-type;
- fetch data and perform simple business logic (show how many transport bays are needed for given amount of cargo boxes, with one bay holding max 10 boxes);
- render that data for selected menu item.
To Do
Add mobile view, fetch data with async function over web, create routing with React Router to have separate URLs for each detail view.
Comments
This cool task was designed by some smart people at an IT agency (I did not come up with any of the requirements). The challenge was to first translate a Figma wireframe into HTML/CSS, then add functionality. So far completed only some of the functionality — still learning React, and the more advanced features need digging into. Also, due to that limitation code piles up on the top level which should, ideally, only have the rendering block.
On the plus side: learning new tricks every day. Although I worked on it just last week, I already know a much cleaner way to implement the search-as-you-type logic (with indexOf() !== -1).
Update: added async fetch, streamlined search method, React Router to provide unique URLs for each detail view.
