HackGen: My Experience at 2017 AngelHack

I managed to snatch a free ticket for the 2017 AngelHack, so I was off to another hackathon!

My team and I created HackGen, which grabs DevPost data and displays winning hackathon idea randomly, often resulting in quite hilarious results. Seriously, my team spent a good portion of time after code freeze in laughter. Some people’s hackathon idea makes no logical sense. I can only deduce that they wrote it after a long all-nighter and did not presented their project that way on stage.

For this hackathon, I participated predominately in the front-end features, making sure the data that my teammate, Ting-Wai To and Michael Snowden, are displayed in an aesthetic, user-friendly manner. Consistent with my coding habits, the site uses responsive design. The languages I used included HTML, CSS, JS, Ajax, and jQuery. The framework we used was Django. We started trying to host the site on AWS, but ended up using Heroku. The VCS was Git on both Github and Heroku. Our project works with Amazon Echo and also allows visitors to subscribe by using the SparkPost API.

The site started with the name HackPredict and was supposed to predict the chance of success for an hackathon idea:

Initial version, HackPredict

However, the collected data wasn’t enough for an accurate prediction. No matter what was input, the result remained between 40%-50%. Eventually, it developed into an idea generator:

HackGenerator, draft version. I have no idea who wrote that idea… (Fruit Ninja?)

And this is its final outlook:

HackGen, Final iteration!

Now, for the struggles and lessons:

In this case, I was reminded that Anaconda and Virtual Environment don’t play well together. My team had a lot of trouble. I was able to solved it by doing a simple conda install python=2.7.8. I think it helped that I have previously set up everything to work once already last month while working on a Slackbot with Django as backend. All I needed was to switch from Python3 to Python2.7. The other guys sounded like they had bit more trouble.

I also ran into trouble with static file management in Django, which according to Michael, is a common problem. When Ting-Wai wanted to use Bootstrap with static url, Michael and I were all going “No! Just CDN it!” Yea, we didn’t get along with it.

Ting-Wai apparently hates the Bootstrap progress bar, but Michael really wanted a progress bar. So, I went with a customized dot progress bar. Fortunately, while I know Bootstrap, I often practice coding in raw CSS to build my foundation, so it was easy to whip one up:

My teammates were surprise that I didn’t use Bootstrap at all for the site. I actually did started with Bootstrap, but I wanted more customization on the input and buttons. Besides, almost everyone use Bootstrap with very few customization in a hackathon, so why not take a different approach? For a small site, raw CSS is pretty easy.

I also had trouble once my teammate set up mysql with Django. I first got “Did you install mysqlclient or MySQL-python?” error, which persisted even after installing those packages. Following online suggestion, I homebrewed mysql-connector-c, which turned out to be a Python3 suggestion. I got a “Segmentation fault 11” error and wasn’t able to do a runserver at all. I uninstalled mysql-connector-c and looked up for new solutions. The golden solution:

export DYLD_LIBRARY_PATH=/usr/local/mysql/lib:$DYLD_LIBRARY_PATH.

*Sighs* I swear, setting things up probably took more time from my team than coding. I am not the one in charge of set up, but I can tell by the way my teammates acted. If this is an anime or cartoon, they would probably had smoke coming out of their ear. One of them rushed to a couch for a nap right after demo. There were a lot of demos too. The hosts had to divide us and the judges into 2 rooms, and I think we were the last few teams to demo.

I got to brush up on my front-end skill during that weekend and hang out with a lot of cool people. Got a bunch of nice goodies:

Amazon have notebook, t-shirt, and ninja sticker – who don’t like ninjas!? IBM have cool hexagon sticker and external usb port, the later of which I totally need for my Chromebook (only 1 usb port there). SparkPost is my favorite since I am a sticker collector: they have grid notepad and awesome stickers. Apparently, they have all the languages they supported sticker-ify, plus one more design for our beautiful Golden Gate Bridge!

All in all, it was a good hackathon, with awesome people, good amount of API challenge choices, cool goodies, healthy food and plenty of coffee, and a lot of fun demos and ideas.

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.