Bike Rental Boilerplate - ReactJS

This project was created for the Trio Challenge, where candidates must create a functional system to rent bikes.

Stack used

• ReactJS
• TypeScript
• Material UI

How to run it

Install node modules:

yarn

Runs the app in the development mode.

yarn start

Open http://localhost:3000 to view it in the browser.

The page will reload if you make edits.

How to run the tests

yarn test

Or use paths to run specific component/page test

yarn test <PATH_TO_COMPONENT>

It launches the test runner in the interactive watch mode.

Folder structure

• assets/
  • fonts/
• components/
  • BikeCard/
  • BikeImageList/
  • BikeImageSelector/
  • BikeList/
  • BikeSpecs/
  • BikeType/
  • BookingAddressMap/
  • Header/
• mocks/
  • Bike.ts
• models/
  • Bike.ts
• pages/
  • BikeDetails/
  • Home/
  • Login/
• routes/
  • app.routes/
  • index/
  • paths/
• services/
  • api/
• styles/
  • global.css/
  • theme/
• App.tsx

Overview

Desktop

desktop-overview.mp4

Mobile

mobile-overview.mp4

Test coverage (so far)