This is a solution to the GitHub Portfolio exam project given by AltSchool Africa School of Software Engineering tutors.
Implement an API fetch of your GitHub portfolio, show a page with a list of all your repositories on GitHub(the page should implement pagination for the repo list), and create another page showing data for a single repo clicked from the list of repos using nested routes while using all the necessary tools in react. Implement the proper SEO, Error Boundary (show a page to test the error boundary) and 404 pages. Good UI and Designs are important.
Home page
Details Page
Error Page
- Live Site URL: Maame's GitHub
- React commponents, props, useState, useEffect, createBrowserRouter, fetch API
- How to fetch data from an external source using
fetch() - Adding routes to react apps using React Router v6
- Implementing SEO using
meta - Depolying React Routed sites to netlify
- Implementing pagination using the GitHub API
- Creating error boundaries and implementing error pages
This was my first time working with most of the concepts I used in building the project. I plan to learn more about APIs, React Hooks and implementing SEOs.
These resources were useful in helping me build this project
- Different Ways to fetch data from API in Reactjs
- Netlify React 'Page Not Found' Solution
- React Router tutorial
- Github - List repositories for a user
- Website - Maame Yaa Serwaa Bona-Mensa
- Twitter - @mys_bm