https://github.com/nathanbrodin/repos
A React application to explore GitHub repositories by username with search, filtering, and sorting capabilities
https://github.com/nathanbrodin/repos
Last synced: 6 months ago
JSON representation
A React application to explore GitHub repositories by username with search, filtering, and sorting capabilities
- Host: GitHub
- URL: https://github.com/nathanbrodin/repos
- Owner: NathanBrodin
- License: mit
- Created: 2025-04-06T09:22:19.000Z (6 months ago)
- Default Branch: main
- Last Pushed: 2025-04-06T09:37:48.000Z (6 months ago)
- Last Synced: 2025-04-06T10:26:45.661Z (6 months ago)
- Language: TypeScript
- Homepage: https://repos.brodin.dev
- Size: 86.9 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Repos
A React application to explore GitHub repositories by username with search, filtering, and sorting capabilities.
UI is a clone of Github itself.## Tech Stack
- [Vite](https://vite.dev): Build Tool
- [React](https://react.dev/): JS Framework
- [Redux Toolkit](https://redux-toolkit.js.org/): State Management and Data Fetching
- [Tailwindcss](https://tailwindcss.com/): Styling
- [Shadcn/ui](https://ui.shadcn.com/): Component library fondations## Running locally
- Install dependencies```sh
npm install
```Or with a better package manager:
```sh
bun install
```- Run the dev server
```sh
npm run dev
```Repos is now running on [http://localhost:5173/](http://localhost:5173/)
## Instructions
Create a simple React app using Redux that does the following:- [x] Fetches a list of GitHub repositories for a given username.
- [x] Displays the repositories in a list with name and description.
- [x] Allows users to filter repositories by name using an input field.**Requirements:**
- [x] Use Redux Toolkit for state management.
- [x] Handle loading and error states.
- [ ] Implement a debounced search to avoid unnecessary API calls. *The app implements debouncing by fetching repositories only on form submit rather than real-time, and filtering happens client-side, which prevents excessive API calls.*
- [x] Use TypeScript in the project.