Skip to content
All projects

Full-Stack

Restaurant Reservation System

A React and Express application for customer accounts, reservation editing, and event inquiries, backed by a relational MySQL database.

  • Full-Stack Development
  • React
  • Express
  • MySQL
  • JWT Cookies
  • Docker

Accounts and bookings in one application

I connected customer and employee account screens, reservation editing, and event inquiries to a shared API and relational database.

The main engineering work was modeling those relationships and keeping the interface and stored records in agreement, including edits that change a reservation’s identifying fields.

From booking screens to stored records

I built a restaurant web application where customers can manage account details and reservations, browse menus and locations, and send special-event inquiries. Employee accounts provide a separate path for selected account-management operations.

The React interface sends requests to an Express API, which applies the account or booking logic and reads or updates MySQL records. Shared request services keep cookie handling consistent across screens. Separating request handlers from database queries lets each workflow follow the same route from user action to stored data.

Modeling customer and employee accounts

Customers and employees share login details but have different relationships to the restaurant. The schema keeps common credentials in one account record and connects it to a customer or employee record. Registration checks for conflicting email and phone values and hashes passwords; login issues a JWT in an HTTP-only cookie.

Selected account operations allow users to access their own record or require an employee clearance threshold. Protected handlers read current clearance from the database. These checks cover part of the API; they do not form a complete authorization layer for every business operation.

Creating an account requires several related writes. The implementation attempts to undo earlier inserts when a later step fails. A database transaction would make that operation atomic and remove the risk of partially created records.

Updating a reservation’s identity

A reservation is identified by its customer, location, and date together. Editing any of those values changes the record’s key, so an update carries both the original values used to find it and the replacements to store. Foreign keys connect the booking to its customer and location.

Special-event inquiries follow a separate workflow with request details and dates; an inquiry is not a confirmed booking. The reservation schema also stores dates while the interface accepts a time of day. Resolving that mismatch is necessary before offering dependable time-slot booking.

Tools and technologies

  • JavaScript
  • React
  • React Router
  • Node.js
  • Express
  • MySQL / mysql2
  • Axios
  • bcryptjs
  • JWT
  • Docker / Docker Compose
  • Nginx

React and React Router organize the screens; Express and mysql2 connect them to direct MySQL queries. Axios shares request configuration, while bcryptjs and JWT support login. The schema design and application integration adapt tutorial patterns from BezKoder, Lama Dev, and freeCodeCamp.