This sample project helps to explore open GitHub repositories. Where the user can get the required public repository information, such as the repository name, the number of stars and forks, the updated date, the total number of issues, and the default branches. Additionally, you can use pagination to select the number of items per page and organize the list of the searched repositories according to various criteria.

Used API: https://api.github.com/

The application has two pages, a Home page, and a Detail Page

👉 On the Home Page users can

• Search public repositories
• Filter searched repositories options
• Have pagination.
• Change number of data per page options
• Get the searched repositories containing detail like Owner Name, Repository Name, Total stars, Total forks, Watched count, last updated date, and short description.

👉 On the Detail Page users can

• View selected repository detail like Owner Name, Repository Name, Avatar, Total Issue, and Default Branch.
• The user will be direct to the owner's GitHub page if clicked on the owner name or repository name.

🔥 React : "^18.2.0"

🔥 TypeScript : "^4.7.4"

🔥 Redux toolkit : "^8.0.2"

🔥 Tailwind : "^3.1.8"

🐒 axios : "^0.27.2"

🐒 react-paginate : "^8.1.3"

🐒 react-router-dom : "^18.0.6"

🐒 nanoid : "^4.0.0"

Clone the repo

# Clone the repo
https://github.com/NishChal370/Github-explorer.git

Install the app

# Install dependencies
npm install

# Build the project
npm run build

# Run the app
npm start

💠 Best match 💠 Most starts 💠 Fewest stars 💠 Most forks 💠 Fewest forks 💠 Recently updated 💠 Last updated

🔺 10 per page 🔺 25 per page 🔺 50 per page

axios : It is used to send asynchronous HTTP requests to REST endpoints. This library is very useful to perform CRUD operations. This popular library is used to communicate with the backend. Axios supports the Promise API, native to JS ES6.

react-router-dom : React Router is used to define multiple routes in the application. When a user types a specific URL into the browser, and if this URL path matches any 'route' inside the router file, the user will be redirected to that particular route.

react-paginate : It is used to allow users can easily switch between pages across a website or app. With the help of this component, a user can select a specific page from a range of pages.

nanoid : A tiny, secure, URL-friendly, unique string ID generator for JavaScript.

To learn React, check out the React documentation.