Tickify Client Site

The public-facing ticket purchasing site for university and college events. Students and guests can browse events, register, buy tickets, and view/print their tickets with QR codes.

---

Features

• Event Browsing — view all upcoming events with search, category, and university filters
• User Registration — register as a student (university email) or external guest
• Student-Only Events — enforced restriction for events marked student-only
• Ticket Purchase — buy tickets with instant confirmation
• QR Code Tickets — each ticket includes a unique QR code for venue entry
• Ticket Printing — print individual tickets directly from the browser
• Event Info on Tickets — tickets display event name, date, venue, and attendee details
• My Tickets — view all purchased tickets in one place
• Responsive Design — works on mobile, tablet, and desktop
• Ticket Refunds — request refunds for purchased tickets

---

Tech Stack

Layer	Technology
Frontend	HTML5, CSS3, Vanilla JS
QR Codes	qrcode.js (CDN)
Icons	Font Awesome 6 (CDN)
Font	Inter (Google Fonts)
API	Connects to Tickify Java backend

---

Project Structure

client-site/
├── index.html        # Main client interface (SPA)
├── css/
│   └── style.css     # Client styles (purple/pink gradient theme)
├── js/
│   ├── config.js     # API base URL configuration
│   └── app.js        # Client logic, event browsing, ticket purchase
└── README.md

---

Getting Started

With the Tickify Backend (All-in-One)

The client site is served automatically by the Tickify server:

cd admin-console
# Windows
compile.bat && run.bat
# Linux/macOS
./compile.sh && ./run.sh

Access at http://localhost:3000/client/

Standalone Deployment

Deploy the client-site/ folder to any static web server (Apache, Nginx, GitHub Pages, etc.) and update the API URL:

// js/config.js
window.TICKIFY_API_BASE = 'http://your-server:3000/api'

---

How It Works

1. Browse — visitors see all active events with details and pricing
2. Register — create an account with name, email, and password
   • Student emails (e.g. @tut.ac.za, @smu.ac.za) are auto-detected
3. Login — sign in to access ticket purchasing
4. Purchase — select an event, choose ticket type, and buy
   • Student-only events enforce university email validation
5. View Tickets — access purchased tickets with QR codes
6. Print — print individual tickets for physical entry
7. Refund — request a refund for unused tickets

---

API Endpoints Used

Method	Endpoint	Description
GET	/api/events	List all events
GET	/api/events/:id	Get event details
POST	/api/users/register	Register new user
POST	/api/users/login	User authentication
POST	/api/tickets/purchase	Purchase a ticket
GET	/api/tickets/user/:email	Get user's tickets
POST	/api/refunds	Request a ticket refund

---

Deployment

For production deployment on Oracle Linux VM with Apache2, see the Deployment Guide.

---

Repository

This client site is part of the Tickify platform and is also available as a standalone repo:

• GitHub: Letsoperate/Tickify-Client