Kiarash Cinema – Web Advanced Project

Introduction

Kiarash Cinema is a full-stack web application for reserving movie theater seats. It allows users to register, log in, and reserve multiple seats in real-time. Admins can manage movies, seats, and users while enforcing access controls. The system is developed using Svelte on the frontend and Node.js/Express on the backend, with a RESTful API and secure authentication.

This project builds upon the fundamentals taught in Web Basics (HTML, CSS, JavaScript, REST) and enhances them with client-server interaction, real-time updates, and full-stack development principles.

Template Overview

This project follows the Web Advanced template, which includes:

• assignment/: Assignment specification and functional design
• client/: Svelte frontend application
• server/: Express backend API
• documentation/: Markdown documentation
• README.md: Project overview

Assignment Description

You are required to build a reservation system. In this case, the reservable items are movie theater seats. The system supports the following features:

• Users can view, select, and reserve seats for a chosen movie, showtime, and building.
• Admins can create, update, and delete movies, showtimes, and buildings.
• Both roles are authenticated using JWT.
• Admins cannot reserve items unless also a user.
• Users can manage their reservations and cancel them if needed.

Actors

• User: Can view movies and available seats, make reservations, and manage personal data.
• Admin: Can manage movies, showtimes, and seats, and see user behavior/statistics. Must log in separately as a user to make reservations.

The login credentials for one admin and one user are documented in documentation/users.md.

User Stories

Functional Requirements

Non-Functional Requirements

Tech Stack

• Frontend: Svelte, Tailwind CSS, Page.js
• Backend: Node.js, Express
• Database: PostgreSQL (via Sequelize ORM)
• Authentication: JWT
• Authorization: Role-based
• Real-time updates: Server-Sent Events (SSE)
• Testing: Vitest, Supertest
• Documentation: JSDoc, Swagger

Getting Started

Setup Backend

cd server
npm install
npm run dev

Setup Frontend

cd client
npm install
npm run start

View Swagger API Documentation

Once your backend is running, open your browser and go to:

http://localhost:3000/api-docs

Documentation

All written documentation must be placed in the documentation/ folder. Markdown (.md) format is required for all files.

• Do not use PDF or Word files.
• Include screenshots, diagrams, or images to improve clarity.
• Make sure to include:
  • Admin and User test credentials
  • ER diagrams or DB schema (if available)
  • Any project-related notes or instructions

Example:

documentation/
├── credentials.md
├── api-design.md
├── db-schema.md
└── user-guide.md

Learning Goals