GitHub Hackathon
Transform your workflow and build something original.
GitHub is the world's leading software development platform where more than 50 million developers collaborate, build, and share new ideas. With the acquisition by Microsoft in 2018, GitHub has solidified it's role in empowering developers throughout the development cycle by providing an excellent solution for cloud-based Git repository hosting services.
By making use of Git, the open-source version control software, GitHub makes it much easier to maintain and manage code across teams and different kinds of projects.
We first connected with GitHub’s head of Developer Relations team at Full Stack Fest 2019, where we even got to have them speak as a guest at the conference. We discussed the potential idea of establishing a long-term relationship with the team at GitHub, eventually leading to the opportunity to build the website for their virtual 4-week GitHub Actions Hackathon.
GitHub Actions make it easy to automate software workflows that allow developers to build continuous integration and delivery pipelines. This means that developers can build, test, and deploy their applications all within GitHub.
- Cloud Computing
- Developer Tools
- Internet
- Project Management
- Software
- Software Development
- UX Design
A visually appealing website to promote based on the user experience.
With the upcoming GitHub Actions Hackathon approaching just weeks around the corner, there was an urgent need for a visually appealing website (UI) to promote the GitHub Actions Hackathon, along with a strong user experience (UX) for the hackathon participants. The virtual nature of the hackathon required a strong attention to detail. The challenge was how to best accommodate every participant in the most light-weight and user-friendly approach possible. The four-week hackathon challenges the developer community to create original GitHub Actions, which allow developers to get creative in how they automate development workflows in an entirely new way.
Challenge
To kick things off, we began our design sprint to sculpt a beautiful and efficient UX/UI that would allow the participants to have an enjoyable virtual hackathon experience.
As part of our ideation process, we wanted to clearly highlight the specific details on how to actually participate in the hackathon, information regarding GitHub Actions in case some developers weren't familiar, and even some of the featured submissions to get an idea of what others have so far built.
Solution and Technology
Given the nature of the project and how quickly we needed to roll it out, we decided to start building out the website using JAMStack and Gridsome. By integrating GitHub's API into the website, participants can sign in with their GitHub accounts and easily link their code repositories for submission.
If a participant wants to submit multiple entries, they are easily able to manage and view the status of each in their user dashboard. To make this all possible, we leveraged GitHub Actions in our technical design! With each Action a user submits, our implementation of GitHub Actions would check to make sure they fell under the guidelines in the official rules. This will determine the status of a participant's submission with either "Accepted" or "Rejected".
By leveraging GitHub Actions in our own technical design, we wanted to highlight and spread awareness of the very feature the entire virtual hackathon is about. Our utilization of GitHub Actions is just one example of showcasing its flexibility and usefulness as part of a seamless development workflow. To get an idea of some of the different tools and ideas people are working on with GitHub Actions, you can refer to their marketplace.