Skip to content

React web app developed for the Web Application I exam

Notifications You must be signed in to change notification settings

onim-at/polito-wa1-car-rental

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

5 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Car Rental WebApp

Introduction

Built with React, this WebApp application allows you to rent vehicles from a predefined list, check your bookings or simply browse the vehicles. Unahuthenticated users are only able to browse the vehicles list. Once authenticated users can access a configuration page, where they can set parameters for their new rental. The vehicle is choosen randomly from all avaible ones that meet the parameters. They payment is not fully implemented and supported by a stub API.

Setup

Check it live here or set it up locally

clone it
run two different terminal, one for the client and one for the server
terminal 1: cd client; npm install; npm start
terminal 2: cd server; npm install; nodemon server.js

Test users

mail password frequent
aldo@mail.com baglio no
giovanni@mail.com storti no
giacomo@mail.com poretti no
tony@mail.com stark yes
peter@mail.com parker no

Description

React client application routes

  • Route /browse: Browse vehicles list
  • Route /login: Login page
  • Route /config: Authenticated user can configure his rental
  • Route /payment:
  • Route /bookings: Show future bookings and past rentals

REST API server

  • POST /api/login
    • request body: email, password
    • response body: user_id, name
    • response cookie: user_id, jwtSecret
  • POST /api/logout
    • response body: empty
  • GET /api/vehicles
    • request parameters: category, brand
    • response body: vehicles list
  • GET /api/user
    • request cookie: user
    • response body: id, name
  • GET /api/past
    • request body: user_id
    • response body: list of past rentals
  • GET /api/future
    • request body: user_id
    • response body: list of future rentals
  • GET /api/isfrequent
    • response body: number of past rents of logged user
  • GET /api/available
    • request parameters: category, start, end
    • response body: number of vehicle of a specific category available in start to end days
  • POST /api/payment
    • request body: name, surname, card_number, CVV
    • response body: empty
  • POST /api/rent
    • request body: rent object
    • response body: id of new rent created
  • DELETE api/rent/:rentId
    • response body: empty

Server database

  • Table users - id, username, email, hash
  • Table vehicles - id, category, brand, model
  • Table rents - contains id, user, vehicle, starting_day, end_day, cost, km, driver_age, extra_driver, category, extra_insurance

Main React Components

  • Browse (in Browse.js): show vehicles list and filters
  • Filters (in Filters.js): filter list of vehicles
  • Header (in Header.js): Header with links to different routes
  • ConfigureForm (in ConfigureForm.js): configurator to rent a vehicle
  • PaymentForm (in PaymentForm.js): payment form to submit a rent
  • LoginForm (in LoginForm.js): Login page

About

React web app developed for the Web Application I exam

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published