https://github.com/khaledsaifulla010/volunteersphere-client-side

VolunteerSphere is a platform that connects volunteers with opportunities to make a difference. Users can create, update, and delete volunteer need posts while others can join these initiatives.
https://github.com/khaledsaifulla010/volunteersphere-client-side

expressjs firebase jwt mongodb nodejs react tailwindcss

Last synced: about 1 month ago
JSON representation

VolunteerSphere is a platform that connects volunteers with opportunities to make a difference. Users can create, update, and delete volunteer need posts while others can join these initiatives.

• Host: GitHub
• URL: https://github.com/khaledsaifulla010/volunteersphere-client-side
• Owner: khaledsaifulla010
• Created: 2024-12-28T15:53:37.000Z (about 1 month ago)
• Default Branch: main
• Last Pushed: 2025-01-10T04:56:46.000Z (about 1 month ago)
• Last Synced: 2025-01-10T05:35:17.362Z (about 1 month ago)
• Topics: expressjs, firebase, jwt, mongodb, nodejs, react, tailwindcss
• Language: JavaScript
• Homepage: https://volunteersphere-895e6.web.app/
• Size: 8.94 MB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# 🌟 Projects Name: VolunteerSphere 🌟

## 🔗 Live-Link : https://volunteersphere-895e6.web.app/

## 🌐 Server-Link : https://volunteer-sphere-server-side.vercel.app/

---

## 🌟 About VolunteerSphere

**VolunteerSphere is a platform that connects volunteers with opportunities to make a difference. Users can create, update, and delete volunteer need posts while others can join these initiatives. The platform promotes collaboration by allowing organizers to manage posts effectively and enabling volunteers to sign up easily. With secure user authentication and seamless navigation, VolunteerSphere ensures a smooth experience. Key features include CRUD operations for posts, private routes for security, and real-time volunteer tracking. Whether you’re looking to organize an event or contribute your time, VolunteerSphere bridges the gap between need and action.**

---

## 🚀 Project Features

### ✨ General Features

#### 🔒 User Authentication

- Email and password-based login and registration.

- Social login using Google/GitHub.

- Dynamic user-specific features based on authentication status.

#### 🧭 Navigation

- Intuitive navbar with conditional login/logout functionality.

- Dropdown menu for quick access to personal features.

#### 📊 Dynamic Content Display

- Home page showcases upcoming volunteer needs sorted by deadlines.

- Detailed volunteer post pages with the ability to join as a volunteer.

---

### 🔧 CRUD Operations

#### 📝 Post Management

- Add, update, and delete volunteer need posts with ease.

- Dedicated interface for managing personal posts.

#### 🤝 Volunteer Requests

- Users can sign up as volunteers for specific posts.

- Request status management and dynamic volunteer slots.

---

### 🔐 Private Routes and Security

#### 🔒 Protected Routes

- Key functionalities accessible only to authenticated users.

#### 🔑 JWT Authentication

- Secure token-based authentication for enhanced security.

---

### 🎯 Additional Functionalities

#### 🔍 Search Functionality

- Search volunteer needs by title for quick access.

#### 🌗 Dark/Light Theme

- Theme toggling for better user experience.

#### ⚠️ Error Handling and Alerts

- Informative toast/sweet alert notifications for all actions.

- Custom 404 error page for better navigation experience.

---

### 🌟 Advanced Features

#### ⏳ Loading Spinner

- Interactive spinner displayed during data fetching.

#### 📝 Dynamic Website Title

- Page titles dynamically update based on active routes.

---

## 🛠️ NPM Packages

- `animate.css` - For animations in UI.

- `axios` - For handling HTTP requests.

- `lottie-react` - For rendering Lottie animations.

- `react-countup` - For animated number counters.

- `react-datepicker` - For date selection in forms.

- `react-icons` - For icons in the application.

- `react-scroll-trigger` - For scroll-based animations or triggers.

- `react-tabs` - For implementing tabbed interfaces.

- `react-toastify` - For toast notifications.

- `react-tooltip` - For tooltips.

- `sweetalert2` - For customizable alert popups.