This is the 3rd post in my portfolio series. In a previous article, I wrote the way I implement dev.to API. I will tell you about my journey to find the way to show my repository on portfolio
This is the hardest part (with me) in this series, I repeat, the hardest part (with me)!!! 🤪
Problem
As I said, I am a back-end guy so I want to try to make everything automatic, less manual as I can. Like articles section, I want projects section work as the same. The first solution I think is GitHub RestAPI, its usage is quite simple BUT ... when I implemented it into 80%, I realized it does not get a thumbnail of project, I be like image below when I know it
Although I can use default image for all projects, but I don't want 🙄. I started to research with the support of Mr.KnowEverything - a.k.a Google, and no hope 😑.
Solution
After many and many searches, when I prepared to give up, I saw FreeCodeCamp's post about using Google Sheets to build CMS. An idea appeared in my head 💡 what if I build the CMS to store repository info - sounds possible huh?
When I found the way and connected with some research, I decided to combine Google Sheets and Google Drive to solve it 😎.
System Design
Here is the sketch design of my solution
In this design, it will have 3 main components:
- API Gateway: Access to get repository info (git_url, thumbnail_id, etc)
- Google Sheets: Act like SQL data table, store repository info
- Google Drive: Store the thumbnail of the repository and return a unique ID to save into the sheet (We will use this to load the thumbnail on the website 😉)
Conclusion
Sound like my solution is a little bit messy, so if you have any suggestions, please tell me 🤗
In the next article, I will show how to implement this in code.
Happy coding and learning!
Top comments (0)