Convoy Frontend

Designed Convoy Offer and My Job Page

For applications, clicking an offer or a job directly applied to, or cancelled from My Jobs, since we don't really have api to call. Applications persist when reopeninig the browser via local storage.

Offer fetch count is guaranteed to be exact 3 offers for following 3 cases, i.e. initial rendering, clicking Show More, & choosing Sorting Type. Offer fetch would retry 3 times when server errors occur. Fetch status are added to Footer to show status of the fetch, i.e. Not Started, Loading, Retrying, Completed, Failed.

Main app is designed with hidden scroll bar, and would scroll to top when a new sorting, i.e. either sort type or sort order is clicked. Animations and transitions added on all user interactions. Header, Footer, 2 Sortings components are sticky.

Designed with Redux and Hot Reload for easy debugging

How tos

Installation

$ yarn

Run

$ yarn start

Run in Local

$ yarn open

Build

$ yarn build

Libraries Applied

• Typescript 3
• React 16.8
• Redux 4
• React Router 4.3
• Redux DevTools Extension

Build tools

• Webpack 4
  • Tree Shaking
  • Webpack Dev Server
• Typescript Loader
• CSS modules
• React Hot Loader
• Mini CSS Extract Plugin
• HTML Webpack Plugin

To dos

• Create a server to cosume upstream API, and save user information, recent activity, save jobs with a persist storage, redis / DB
• Server-Side Rendering
• Static code analysis
• Testing Frameworks
• Local Storage compliance to GDPR, and reduce Xxs attack
• Accessiblity - Keyboard focus via tabs, and outline with contrast on focus
• Accessiblity - Focused or Hovered items should be able to narrate