"Greetings, fellow code warriors and pixel pioneers! Prepare to embark on a rollercoaster ride through the wild and wacky world of software development, where bugs are features in disguise and every line of code tells a story ..."
Okay, let's drop the chatGPT generated lines for now (God knows what these things do nowadays outside of generating disappointing masterpieces).
Unveiling the new cool kid on the block "Github timeline" . This is something personal for me as i've been wanting to work on a portfolio project for a while now - something that actually solves a problem as I wasn't about to add the 109 millionth to-do app to the github database. Okay, no offense and i am not trying to sound like this is a ground-breaking project either so, let me take you through the nitty-gritty without standing the risk of sounding phallic:
Project Overview
Aim
This project aims to address the need for a streamlined interface to access key insights about your GitHub repositories. While the official platform offers comprehensive functionality, some users seek a simpler, less cluttered experience to quickly glance at essential information.Key Features
- Weekly Commit Visualization: Gain instant insights into your development activity with a visual representation of your weekly commit frequency. Identify trends and track your progress with ease.
- Effortless Repository Access through links: Instantly access both SSH and HTTPS links for your repositories without digging through menus. Streamline your workflow and jump right into coding. Other completed features that offer quick insights are: displaying total contributions, collaborators, and recent commits.
Overcoming Data Challenges
The initial simplicity of fetching data from the GitHub GraphQL API revealed unforeseen complexities. Normalizing data across disparate repositories and determining essential versus extraneous information presented a hurdle. Additionally, the absence of readily available GraphQL schemas for specific data points necessitated writing custom functions for data translation.
To tackle these challenges, I researched and implemented efficient data normalization techniques. Writing custom functions enabled translation of raw data into a consistent and usable format. Exploring alternative data endpoints provided the necessary information when direct schema queries weren't available. Through this process, I learned valuable lessons about optimizing data handling and leveraging the flexibility of GraphQL for diverse data sources.
Technical Challenges
One of the primary challenges I encountered during the project was managing data caching and invalidation. Initially, I attempted to implement a caching solution using Apollo Client, but due to my limited knowledge of the tool, I faced difficulties in effectively configuring and utilizing its features. As a result, I turned to local storage as a temporary caching mechanism. While this approach provided some benefits, I soon realized its limitations, particularly in handling complex data types and ensuring efficient data retrieval. To address these issues, I am currently exploring the adoption of IndexedDB, a browser-based database known for its non-blocking nature and ability to handle complex data structures. By leveraging IndexedDB, I aim to enhance the project's performance and scalability while ensuring seamless data management. Additionally, integrating the various technologies - React.js, GraphQL, and Express.js - presented its own set of challenges. Ensuring seamless communication between the front end and back end required careful consideration of data structures, API endpoints, and error handling mechanisms. Despite these challenges, each obstacle provided valuable learning opportunities and ultimately contributed to the robustness of the final product.
Another of the challenges i faced (and still yet to find a solution to btw), was getting the collaborators to a repository (besides the author). it seems github used to make that accessible via the graphQL API prior to now but not anymore - not even with all permissions enabled on your PAT (Personal Access Token) and i think this change was intentional. I was able to arrive at that conclusion due to this conversation on github
Technical Learnings and Growth
This project provided invaluable opportunities to grow as an engineer. I quickly picked up how to write concise GraphQL queries to retrieve targeted data. Successfully implementing a caching mechanism for user preferences and non-sensitive data enhanced application performance and usability. Integrating OAuth authentication not only added security but also streamlined the user experience. Beyond technical skills, I gained a deeper understanding of the importance of realistic project estimates, appreciating the potential complexity hidden beneath seemingly simple ideas.
Future Directions and Insights
This project serves as a stepping stone for future development. While offering core functionalities, the potential for expansion remains. Implementing a search functionality across repositories would further enhance usability. Optimizing performance, exploring advanced caching techniques, and potentially integrating code analysis tools are additional exciting avenues for exploration.
Furthermore, the experience challenged some preconceived notions. While I initially considered myself comfortable with simple projects, this venture highlighted the importance of thorough planning and anticipating potential complexities.
Conclusion
This project demonstrates the value of offering streamlined solutions for specific user needs. By focusing on essential data and a clutter-free interface, I aimed to create a tool that empowers users to quickly access key insights into their GitHub repositories. The technical challenges encountered and overcome served as valuable learning experiences, shaping my approach to future projects and my overall growth as an engineer.
"As an aspiring software engineer, I'm passionate about crafting user-friendly interfaces and leveraging technology to simplify complex tasks. This project served as a valuable learning experience, pushing me to tackle both technical hurdles and user-centric design challenges. I'm constantly seeking opportunities to grow and contribute to meaningful projects that empower others."
Relevant Links
Deployed Project Page: live preview
LinkedIn Profile: linkedin