const Projects = ({ github_repos }) => {
return (
💼 About this project
About a year ago, I asked my design team (affiliate link) to create a mockup of a portfolio site that looks like VSCode.
This mockup was for my partner, who had recently graduated Thinkful Software Engineering Immersion. He never built the website, so I took the mockup for myself and started to build it out from scratch to practice React. I changed it a bit to more closely resemble my own VSCode editor, including small easter eggs and links to extensions that I use on a daily basis.
🧠 What I learned
- Taking a Figma Mockup and building it from scratch
- Using Github's API to import my repositories, using a special character to only showcase certain projects I designate
- Set up Google Firebase as the database, after realizing that repeatedly fetching repos from Github's API doesn't make sense. I still want to improve this part to ONLY update the database if there's an actual update to the repo, instead of updating every single time the website is loaded.
- I learned a lot about rate limits and sendign authenticated requests to Github and Firebase.
- I realized the benefit of mobile-first design after 30 hours of already having worked on this portfolio. I've learned my lesson the hard way, and in the future I will work mobile-first.
- I could've done a better job of breaking up components into smaller parts with a focus on DRY coding.
)
}
export default Projects;