Last weekend, I took part in my first proper hackathon - Hack Around the World - which was hosted by MLH. I thoroughly enjoyed the experience and my project placed second overall and also won a sponsor category (best domain name from domain.com).

Coming up with an idea

As this was my first hackathon, I wanted to build something on theme (to do with travel) to really get the most out of it. So, I gave myself no more than 30 minutes to come up with an idea, and jotted them down using Reminders. Here was my list:

  • An app to suggest runs in different cities, as recommended by other users
  • A minimalist organiser for booking trips abroad
  • A flight prices or delay prediction ML model
  • A map of COVID-19 restrictions around the world

From this, I chose the final option as I felt it was achievable, simple in concept but also topical and really useful. By making the database publicly editable, the map would be constantly up to date and correct. I then went on to brainstorm the architecture of my solution.

I decided to use React and Chakra UI for the front end and identified a number of packages that would make working with a map and countries easier. I also chose to use Google Cloud Functions and Firestore for the backend and did so for three reasons: best use of Google Cloud was a sponsor prize at the hackathon; a serverless architecture would definitely be easier to pursue; and I wanted to learn more about Google as a cloud provider.

In hindsight, whilst I decided on the frameworks well, I should have spent more time planning the format the data would take. I started off with different lists of countries for many categories (vaccinated, with testing, quarantine, etc) but eventually simplified to just a largely open and a largely closed for each destination. If I had planned it out better I could have avoided this change.

At this stage, I also decided on and registered a domain name. As best domain.com domain was a sponsor prize, I registered the domain wherecanitravel.tech at domain.com. It was important to think about a good domain, and this ended up winning me this category.

The programming

The next step was to actually program the thing!

I started with the Google Cloud Functions as they would be necessary to access the data in the Firestore. Whilst I have worked with AWS lambda before, this was new to me and I struggled to get the code to work. In retrospect, I should have set up a local development environment to test the code before waiting for it to deploy on Google Cloud.

The front-end, on the other hand, was much more straight forward. Chakra UI made it easy to put together a clean, modern interface that obviously appealed to the judges. I learnt a lot about some of Chakra UI's more uncommon elements such as Collapse and Modal which worked well in my website. To deploy the site, I used Netlify.

I worked on the project for around 15 hours in total. As I could not take part on the Sunday, I submitted my project to Devpost on Saturday evening.

Lessons I've learnt

In my first ever hackathon, my project won second place overall and also won Best Domain from Domain.com. Here are my tips that I've learnt from this experience:

  • Take time to plan your project. With a well thought-out plan, programming the project will be so much quicker as you will have to back-track less frequently. I didn't do this enough and should have spent time working out the intricacies of my project.
  • Think about the categories. If your aim is winning a category, take the time to think about what technologies you can incorporate into your project. For me this meant using Google Cloud as it was a sponsor prize; registering a free domain from domain.com and also staying on theme. You can choose to what degree you follow the sponsor's technologies but if you can definitely use them!
  • Focus on your UI/UX. In the end, the UI/UX of your project matter much more than the internals. For small hackathons, your hack only has to just work - every corner of it is not going to be tested by the judges - but your UI is going to be their lasting impression of your project. If possible keep it clean, minimalist and modern with a few pops of colour.
  • Enjoy the experience. Whilst I completed my project alone, in the future I'd love to take part in a team and attend more of the mini-events and workshops. These truly make the hackathon experience and motivate you to hack better so are actually well worth your while.

I really enjoyed taking part in Hack Around the World and can't wait to take part in future hackathons too!

If you'd like to see my project, you can do so at wherecanitravel.tech or you can view the code on GitHub.