Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/dikshitadas/githubber

GitHubber is a MERN stack project leveraging Tailwind CSS and GitHub API to explore user profiles, manage repositories, and authenticate via Passport.js for seamless GitHub integration.
https://github.com/dikshitadas/githubber

expressjs jsx mern-stack mongodb mongoose nodejs passportjs reactjs tailwindcss ui ux

Last synced: 11 days ago
JSON representation

GitHubber is a MERN stack project leveraging Tailwind CSS and GitHub API to explore user profiles, manage repositories, and authenticate via Passport.js for seamless GitHub integration.

Host: GitHub
URL: https://github.com/dikshitadas/githubber
Owner: DikshitaDas
Created: 2024-11-28T16:14:03.000Z (2 months ago)
Default Branch: main
Last Pushed: 2025-01-20T14:26:43.000Z (21 days ago)
Last Synced: 2025-01-20T15:32:40.540Z (21 days ago)
Topics: expressjs, jsx, mern-stack, mongodb, mongoose, nodejs, passportjs, reactjs, tailwindcss, ui, ux
Language: JavaScript
Homepage: https://git-hubber.vercel.app
Size: 2.85 MB
Stars: 0
Watchers: 1
Forks: 0
Open Issues: 0
Metadata Files:
- Readme: README.md

Awesome Lists containing this project

README

# 🌟 GitHubber 🌟

### 🛠️ **A MERN-based Web App to Explore GitHub User Profiles and Repositories**

GitHubber integrates **MERN**, **TailwindCSS**, and the **GitHub API** to offer a seamless experience for viewing and filtering GitHub user data. It simplifies authentication with **Passport.js** and takes error handling seriously, making it a must-try app for developers!

---

## 🚀 **Features**

- **⚙️ Tech Stack**: MERN + TailwindCSS + GitHub API
- **🔑 Authentication & Authorization**: Secure login via **GitHub OAuth** using Passport.js
- **👾 Fetch Profiles and Repos**: View and explore GitHub user profiles dynamically
- **🚀 Filter Repositories**: Quickly search and filter repositories on the client
- **🎭 Learn Authentication**: Understand OAuth and server-client integration behind the scenes
- **🐛 Error Handling**: Robust error management on both server and client sides
- **🎃 Free Deployment**: Guides for pro-level deployment of your project!
- **⏳ And Much More!**

---

## 🌐 **Tech Stack**

| **Category** | **Technology** |
|---------------------|-----------------------------------------------------------------------------------------------|
| **Frontend** | ![React](https://img.shields.io/badge/React-20232A?style=for-the-badge&logo=react&logoColor=61DAFB)
![Tailwind CSS](https://img.shields.io/badge/TailwindCSS-06B6D4?style=for-the-badge&logo=tailwindcss&logoColor=white) |
| **Backend** | ![Node.js](https://img.shields.io/badge/Node.js-339933?style=for-the-badge&logo=nodedotjs&logoColor=white)
![Express.js](https://img.shields.io/badge/Express.js-404D59?style=for-the-badge) |
| **Database** | ![MongoDB](https://img.shields.io/badge/MongoDB-4EA94B?style=for-the-badge&logo=mongodb&logoColor=white) |
| **Authentication** | ![Passport.js](https://img.shields.io/badge/Passport.js-34E27A?style=for-the-badge&logo=passport&logoColor=white) |
| **API Integration** | ![GitHub API](https://img.shields.io/badge/GitHub%20API-181717?style=for-the-badge&logo=github&logoColor=white) |

---

## 📸 **Screenshots**

### **Home Page**

---

## 💻 **Setup**

1. **Clone the repository**:
```bash
git clone https://github.com/DikshitaDas/GitHubber.git
cd GitHubber
```

2. **Install dependencies**:
```bash
npm install
cd client
npm install
```

3. **Run the app**:
```bash
# Run the backend
npm start

# In another terminal, run the frontend
cd client
npm start
```

4. **Start exploring GitHub profiles!**

---

## 📜 **License**

MIT License. See the [LICENSE](LICENSE) file for details.