UNIVERSITY OF WEST ATTICA
SCHOOL OF ENGINEERING
DEPARTMENT OF COMPUTER ENGINEERING AND INFORMATICS

University of West Attica · Department of Computer Engineering and Informatics

---

Special Topics in Software Engineering

Preze Cinemas Web
Front-end

Panagiotis Petropoulos
Student ID: 20390188

GitHub

Stylianos Xynos
Student ID: 171181

GitHub

---

Supervision

Supervisor: Georgios Prezerakos, Professor

UNIWA Profile · LinkedIn

---

Athens, February 2024

---

---

README

Preze Cinemas Web - Front-end

This repository contains the front-end UI for the Preze Cinemas Web App.

The front-end is implemented using React.js and focuses exclusively on look & feel, providing a responsive and interactive interface for the cinema booking system.

Note: This repository is front-end only. All business logic, authentication, and data persistence are handled by the back-end: Preze Cinemas Web – Back-End.

---

Repository Structure

Front-end/
├── assign/ # Assignment instructions and reference PDFs
├── cinema_webapp/ # Main React application
│ ├── public/ # Static assets (favicon, manifest, images)
│ ├── src/
│ │ ├── Components/ # React components
│ │ │ ├── Style/ # CSS styling files for each component
│ │ │ ├── Delete.js
│ │ │ ├── EditInput.js
│ │ │ ├── ForgetPassword.js
│ │ │ ├── HeaderHome.js
│ │ │ ├── Home.js
│ │ │ ├── HomeSearch.js
│ │ │ ├── Information.js
│ │ │ ├── LayoutHome.js
│ │ │ ├── Login.js
│ │ │ ├── LogRegContainer.js
│ │ │ ├── MainHome.js
│ │ │ ├── modal.js
│ │ │ ├── MovieIcon.js
│ │ │ ├── Pagination.js
│ │ │ ├── Profile.js
│ │ │ ├── Register.js
│ │ │ ├── RegisterInput.js
│ │ │ ├── Reservations.js
│ │ │ ├── Ticket.js
│ │ │ ├── TicketPurchase.js
│ │ │ ├── ValidationLogin.js
│ │ │ └── ValidationRegister.js
│ │ ├── Images/ # Images used in the UI
│ │ ├── Routes/ # Protected routes and auth providers
│ │ ├── App.js # Main React app component
│ │ ├── index.js # Entry point
│ │ └── index.css # Global styles
├── package.json # NPM dependencies
└── README.md
└── INSTALL.md

---

1. Objectives

• Implement UI components for the cinema booking experience:
  • Home page, movie listing, ticket selection
  • Authentication screens (login/register)
  • Reservation views and ticket display
• Apply CSS styling for visual consistency and responsive layout
• Use React framework to structure the UI into reusable components
• No back-end logic: all components are currently static or use placeholder data
• Prepare front-end to integrate with back-end APIs in future phases

---

2. Team

Role	Members
Back-End	2 developers
Front-End	2 developers

---

3. Related Repositories

Preze Cinemas Back-End