This project was made for COMP6343 Class L4AC Group 12. Group members:
- Nicholas Michael Halim - 2201798761
- Marco Melvern - 2201798351
This is the front end repository for the website ticketmaya.me.
ticketMaya is a web application specially designed for students in universities or high-schools as the platform to host events and to manage their ticketing arrangements. It could be utilized to create and share events, manage organizing their ticketing as well as ensure the proof of payment of the attendees, all without hassle.
Our front end uses Angular Framework for single-paged design. This enables fluid page transitions between pages with minimal load times during page navigation. There are several plugins we implemented to enhance the experience in using this site, to name a few:
- Carousel by OWL Carousel
- Angular Material
- Bootstrap
- Templates published in StartBootstrap and Colorlib with modifications.
- Browser Animation by AOS
- Countdown Timer supported by Ngx Countdown
All rights reserved to their respective owners.
- Easily Signup and Login to create an account
- Verify your email
- Create events by supplying relevant data and a poster
- Manage the event by downloading list of attendees and getting payment proofs in one click
- Easily share the event-page by sharing the event-id
- Upload proof of payment easily, an email with instructions and link to upload the proof is sent after purchasing an event.
- Create your account using the signup button from the top bar.
- After, successfully registered, you will be directed to the dashboard. There you will be able to see your basic info and events.
- Head to the create event page from the top bar, you will be shown a form to create the event Tip: you can add up to 3 emails and phone numbers as contact person per event
- After filling up the details and uploading your event poster, you can then click the 'create event' button
- If successful, your event will now have its own event page, head on to your dashboard to see the event.
- Sharing the event is as simple as sending people the link to the event page, or giving them the event code!
- If you have the event code, head on to the search page from the top bar
- Put in the event code and hit enter on your keyboard, you will be directed to the event page.
- Click on the buy ticket and fill in the form
- An email will be sent to you with a link to upload the payment proof
- After submitting the proof of payment, your ticket will then be labeled as paid, the EO will verify your proof.
- List of attendees and proof of payments can be downloaded from dashboard by clicking the buttons on the 'Your Events' section
- If your account is registered as an admin, a link to the admin page can be seen on the dashboard
- Admin can see users registered on the website
- Admin can ban users, which will cause the user to be unable to log in
While most of the website is eagerly loaded, the ADMIN routes are lazy loaded since not everyone can access it.
We incorporate the integration of Bootstrap, Angular Material, along with our own design language to craft and develop the design language of this website. The templates that we implemented are listed on the section below:
- Template Name: Sailor - v2.0.0
- Template URL: https://bootstrapmade.com/sailor-free-bootstrap-theme/
- Author: BootstrapMade.com
- License: https://bootstrapmade.com/license/
- Template Name: Workshop
- Template URL: https://colorlib.com/wp/template/workshop/
- Author: Colorlib.com
- License: Template is licensed under CC BY 3.0.
All rights reserved to their respective owners.
The front-end connects to the backend using RESTFUL APIs, link to the backend repository can be found here.