/restaurant-reservation-system

Restaurant reservations management system which allows restaurant managers to create, update, delete, search for and seat reservations.

Primary LanguageJavaScript

Capstone: Restaurant Reservation System

This is a reservation system for fine dining restaurants. The software is used only by restaurant personnel when a customer calls to request a reservation. It allows restaurant managers to create, update and save reservations, search for reservations by customer's phone number, create new tables and assign tables to reservations as well as free up tables once reservations are done with their meal. The application is fully responsive and can adapt to screens of all sizes. In Mobile View lists are scrollable horizontally.

Deployed version

Technologies used

Backend Frontend
Node.js React
Express Javascript
PostgreSQL Bootstrap
Knex CSS

API

The API allows to create, update, read and list records. User cannot delete records.

Design

DASHBOARD

Dashboard displays the list of reservations for today by default. Previous and Next buttons allow user to display reservations for past and future dates.

  • Desktop view

dashboard large screen

  • Mobile view

dashboard small screen

CREATE RESERVATION

Users can create a new reservation by clicking New reservation on the navigation bar.

  • Desktop view

create reservation large screen

  • Mobile view

create reservation small screen

UPDATE RESERVATION

Users can update existing reservation by clicking Edit button next to the reservation.

  • Desktop view

update reservation large screen

  • Mobile view

update reservation small screen

SEARCH FOR RESERVATIONS

In order to search for a reservation users need to click Search on the navigation bar. The search can be done by a phone number and will display all records that match partially or completely.

  • Desktop view

search reservation large screen

  • Mobile view

searchreservation small screen

CREATE NEW TABLE

Users can create a new table by clicking New table on the navigation bar.

  • Desktop view

create table large screen

  • Mobile view

create table small screen

SEAT RESERVATION

Users can 'seat' a reservation by clicking Seat button dsiplayed next to an existing reservation. The Seat button is only displayed next to reservations whose status 'booked'. Once the reservation is seated the button will disappear and reservation status will be displayed as 'seated'.

  • Desktop view

seat reservation large screen

  • Mobile view

seatreservation small screen

FINISH TABLE

Seated tables display Finish button clicking which the table will be cleared and available for seating again.

  • Desktop view

finish table large screen

  • Mobile view

finish table small screen

Installation

  1. Fork and clone this repository.
  2. Run cp ./back-end/.env.sample ./back-end/.env.
  3. Update the ./back-end/.env file with the connection URL's to your ElephantSQL database instance.
  4. Run cp ./front-end/.env.sample ./front-end/.env.
  5. You should not need to make changes to the ./front-end/.env file unless you want to connect to a backend at a location other than http://localhost:5001.
  6. Run npm install to install project dependencies.
  7. Run npm run start:dev to start your server in development mode.

Running tests

Test are split up by user story. You can run the tests for a given user story by running:

npm run test:X where X is the user story number.

Have a look at the following examples:

  • npm run test:1 runs all the tests for user story 1 (both frontend and backend).
  • npm run test:3:backend runs only the backend tests for user story 3.
  • npm run test:3:frontend runs only the frontend tests for user story 3.

All Tests

  • npm test runs all tests.
  • npm run test:backend runs all backend tests.
  • npm run test:frontend runs all frontend tests.
  • npm run test:e2e runs only the end-to-end tests.