This past week I participated in my first ever hackathon. I had known that hackathons were a thing, and I had been encouraged to sign up for one. I don’t even know where I got the link from, but I figured ‘why not?’. I participated in Essteem’s Equalithon which specifically supports non-profit organizations.

the beforetimes, when mass gatherings weren’t filled with existential horror

Before I get into what I’ve actually been up to this week, let’s look at a bit of history….

What is a Hackathon?

The word itself is pretty easy to break down: a portmanteau of “Hack” and “Marathon”. The general idea of a hackathon is a software engineering competition where the goal is to create a piece of software within a predetermined (short) amount of time. They tend to have a specific focus, such as using a specific programming language or operating system.

They will typically start with a presentation from the organizers that lay out the objective, limiting factors, and other details. The development time can range from a few hours to several days or weeks.

At the end of the hackathon, each time will present their software and answer questions about their development process. There is often a culture of sharing ideas and processes, but there is sometimes a contest element to a hackathon. In a contest structure the judges are usually senior engineers or peer-developers and award the winning team with some sort of prize. Sometimes these prizes are substantial amounts of money, such as the winners of the 2013 Salesforce.com hackathon who awarded $1 million to the winning team.

A little history

Every industry and subculture eventually starts making up competitions amongst themselves to show off and to test their skills. There seems to be arguments over how far back the concept of an event such as this has taken place, but there is a consensus over the first one to use the term ‘hackathon’. The first one took place in Calgary on June 4, 1999. It was organized by OpenBSD as a way to avoid international export regulations. Since then, the internet has allowed these events to multiply and mutate in countless ways

Types of Hackathons

There are countless types of hackathons but here’s a short list of some examples of specificity within the community:

mobile games, music software, tv box apps, APIs, neuroscience, evolutionary science, hackathons devoted to a single language/framework, based around a single platform (facebook, yahoo), hackathons devoted to improving public services, improving disaster response, improving accessibility….. the list goes on and on.

I personally have been a fan of Game Jams in the past which are a variant where teams compete to make a playable videogame in a weekend. https://globalgamejam.org/

Equalithon

The hackathon I participated in this week is part of a series called equalithons that Essteem is organizing that are devoted to public service. When I signed up I was asked to choose between two different non-profit organizations that were in need of some software development. I chose to compete for AAJC, who are an advocacy group for Asian Americans. I am an Asian American, so this became personal to me very quickly. The other organization was Parity Productions, who advocate for women and trans professionals in the theatre industry.

On the event launch night, the organizers released the team rosters, and heard from the two representatives from each organization in need. They explained what they do, and how they were in need of technical solutions. In the case of AAJC, they needed an overhaul to their landing page. All they had were 4 images with links to their regional affiliates. It certainly needed to be updated.

screenshot of AAJC’s existing landing page

Development

Once the launch presentations were over, we broke into separate breakout rooms with our assigned teams and started brain storming. My team “The Justice Team” decided to keep with the frameworks they were already using (Bootstrap) and make it a bit more dynamic and actually display some relevant information. The team organization happened fairly organically, there was one developer who clearly had more experience than they rest of us and they took the lead. Myself and another dev split the components evenly between us. Another two teammates were UX designers and made us nice wireframes to build out.

This hackathon was described as being ‘Asynchronous’ which was appealing to me, because as things warm up here in NYC my schedule as gotten very erratic. So each day we set some goals and a time to meet on zoom and share the work in progress. We didn’t practice any pair programming, just assign components to build out, and merge them together later.

I was put in charge of implementing image carousels, which I have experience in, but was clueless about how to do it in Bootstrap. So really the first full day of the hackathon was devoted to learning how to install and work with Bootstrap. It turns out, they’re dead simple (provide you’re following their rules). Keeping in mind that if we win, we’ll be handing off this design to a future webmaster, and I wanted future updates to be fairly frictionless. I decided to keep all of the carousel content in its own file, to be referenced by the react component. This way a non-programmer would not have a hard time adding/removing content.

don’t judge me too hard on my bland image alts lol

Pitch Day

As I write this, the Justice Team has submitted all materials. We’ll find out on Tuesday how we did. During our final team meeting we all found out this this was everyone’s first hackathon, which was a surprising revelation because it was a smooth process and we ended up with a great submission (whether or not we’re chosen as the winner).

If you want to see the work we’ve done, our finished submission is viewable here: https://aapi-justice-team.netlify.app/

Update 4/28/21:

We won! The judges picked our website as the winner of this hackthon. All of the teams made some compelling projects, but most of them were still only in the concept phase. What pushed us over the edge is submitting a fully functioning web application for them.

I take things apart, and then I put them back together again