Inspiration

GitHub has a lot of data that MLH Fellows can use to track their progress. Bringing this data together to create a personalized experience where fellows can track their PRs, most recent projects, and much more, will help fellows collect a personal MLH portfolio which they can reference for years to come. Moreover, fellows can share this personalized view of their MLH experience on social media and look back at it anytime, similar to what Spotify does in their Spotify Wrapped/ Spotify Year in Review.

What it does

Creates a personalized experience for MLH fellows by allowing them to track their contributions, PRs, and any notable achievements from the fellowship. In this way, they can not only showcase their progress, but also set realistic expectations and work towards achieving their goals since they can now monitor their progress with this web app.

Logo

Logo

Logo

How we built it

  • GitHub Firebase Authentication: Developers login in using their GitHub accounts which makes it easy to access the user's GitHub data
  • GraphQL: We used GraphQL to display users' data into card views.
  • JavaScript and React: We used JavaScript and the React library to create reusable components of cards as well as built out the landing page with additional CSS styling.
  • Liquidswipe: Used react-liquidswipe for integrating the slides in the form of an interactable slideshow.
  • AdobeXd: All the illustrations were drawn by ourselves using AdobeXd and we were inspired by low poly minimalist games such as "the Journey" except wanted to add our own touch to the project by creating our own color pallatte and coming up with the whole look & feel of the app.

Challenges we ran into

  • Time Zone: 4 contributors working in three different countries
  • GraphQL and React: We had some bit of a hard time displaying GitHub data using GraphQL and React. Since we are all from Python pods, JavaScript was a language that pushed us all out of our comfort zone but we managed to have an MVP and are happy about that :D

Accomplishments that we're proud of

We finally delivered an MVP product that can provide a better fellowship experience to fellows by providing them a way to better track their progress and achievements!

What we learned

  • React/JavaScript and GraphQL was a great learning curve for us because we are from the python pods.
  • User experience can really elevate the web experience and we learned that coming up with our own visuals can help us tell a better story.

What's next for MyMLHJourney

  • Get more data to create a more cards with data points such as displaying the mentors and pod leaders
  • Make the web app accessible on mobile and tablet screens

Built With

Share this project:

Updates