A good hackathon is not just about the venue, prizes or food, but also the experience itself. However, it is not easy to provide a consistent experience among 400 attendees, and having a website that allows hackathon participants to interact with the organizers seamlessly can provide a tremendous boost to the overall hackathon experience.

What it does

HackUCI Live contains two main components — a site for participants and an admin panel.

The site for participants, aka the “main site”, acts as a communication portal between participants and organizers. It contains information, such as a schedule, a real-time announcement system and a mentor request system, that is vital for the hackathon to proceed smoothly.

The admin panel, on the other hand, provides organizers and mentors a way to make announcements and attend to mentor requests. It also contains a fail-safe mechanism that allows administrators to force reload the webpage on every client’s computer in the event of an update.

How we built it

We built the site from scratch using Twitter’s Bootstrap framework and jQuery. We used Firebase as a real-time database that streams information from the admin panel to the main site and vice versa.

Challenges we ran into

The schedule was particularly challenging for us — we were trying to create a dynamic calendar that reads events from a JSON file and insert it as a card on the calendar. The schedule’s event reminder feature was also tricky as we had to write an algorithm that checks for event reminders every minute.

Accomplishments that we’re proud of

Started working on the website a month before and wrap up the final 20% on the day of the hackathon.

What we learned

Firebase rules.

What's next for HackUCI Live

Till next time, hackers!

Share this project: