This Web App is created using GithubAPI. This application allows you to view all of my GitHub repositories, with pagination and search functionality. You can also view detailed information for each repository.
- ReactJs
- Chakra UI
- Tailwind CSS
- GitHub API
-
GitHub Repository List: View all of my GitHub repositories with pagination enabled.
-
Search and Filter: Easily search for repositories to find what you're looking for.
-
Detailed Repository View: Click on a repository to view detailed information.
-
Nested Routes: I utilized nested routes for navigation within the application.
-
Error Boundary: The error boundary component catches errors in the RepositoriesPage.
-
404 Error Page: Display a custom 404 page for routes that do not exist. The navlink "Activities" in the navbar is used to implement this
-
Good Layout and UI: Ensured a visually appealing and user-friendly design.
-
Accessibility Techniques: Implement accessibility techniques for a more inclusive user experience.
-
Responsiveness: The web app is responsive on various devices.
-
At first I struggled with using Tailwind CSS and Chakra UI, but after using a day to learn the basics and reading some documentations on I was able to style this web app.
-
I learnt that nothing is Impossible if I can set my mind on it.
-
I tried to add a filter icon, more like a dropdown button to filter each repository by it language (i.e HTML, Javascript) but it didn't work out as it was intended to.
-
I created a button to create a new repository but after the modal pop up and the new repo details is inputed the new repo is not appending on the repositories list. I tried to debug what was wrong what I still haven't figure it out.
- Repositories : The home page.
- Test : Implements the error boundary.
- Activities : This page does not exist.
Check out the Live Demo here
