A free and open-source web application designed to connect neighbors and foster community engagement. With this app, users can post local events, report lost & found items, organize garage sales, and share important neighborhood announcements in real time.
-
👥 User Authentication
- Email/password registration and login powered by Firebase Auth.
- Protected routes ensuring only authenticated users can create, edit, or delete posts.
-
📝 Post Creation & Management
- Create detailed posts with titles, descriptions, categories, neighborhoods, and optional images.
- Image uploads to Firebase Storage (free tier supported).
- Edit and delete your own posts.
-
📬 Notifications & Real-Time Updates
- Receive in-app and push notifications (via Firebase Cloud Functions) for new posts in your selected neighborhood.
- Real-time data sync using Firestore listeners.
-
🔍 Search & Filters
- Search posts by keywords.
- Filter by category (Events, Lost & Found, Garage Sales, etc.) and neighborhood.
-
📊 Activity Insights
- Visualize community activity through charts (react-chartjs-2).
- View engagement statistics and trending posts.
-
🗺️ Interactive Map
- Browse posts on a map integrated with React Leaflet.
-
⚙️ Admin Dashboard
- Admins can manage users and moderate posts.
-
Frontend:
- React (v19)
- React Router (v7)
- Tailwind CSS & Sass for styling
- Material UI & Lucide for icons
- react-chartjs-2 for charts
- react-leaflet for map integration
-
Backend & Services:
- Firebase Auth for user authentication
- Firestore for real-time database
- Firebase Storage for image hosting
- Firebase Cloud Functions for serverless logic (notifications, post expiration)
- Firebase Hosting for deployment
neighborhood-bulletin/
├── public/ # Static assets
├── src/ # React source code
│ ├── components/ # Reusable UI components
│ ├── routes/ # Application routes
│ ├── styles/ # Tailwind and Sass styles
│ ├── utils/ # Helper functions
│ ├── App.jsx # Main application component
│ └── main.jsx # Entry point
├── .env # Environment variables
├── firebase.json # Firebase project config
├── firestore.rules # Firestore security rules
├── storage.rules # Storage security rules
├── package.json # NPM scripts and dependencies
└── README.md # Project documentation
- Node.js v14 or higher
- npm (v6+) or Yarn
- A Firebase project with Auth, Firestore, Storage, and Cloud Functions enabled
-
Clone the repository:
git clone https://github.com/yourusername/neighborhood-bulletin.git cd neighborhood-bulletin -
Install dependencies:
npm install # or yarn install -
Configure environment variables:
-
Copy
.env.example(or.env) and update with your Firebase project settings:VITE_FIREBASE_API_KEY=your_api_key VITE_FIREBASE_AUTH_DOMAIN=your_auth_domain VITE_FIREBASE_PROJECT_ID=your_project_id VITE_FIREBASE_STORAGE_BUCKET=your_storage_bucket VITE_FIREBASE_MESSAGING_SENDER_ID=your_messaging_sender_id VITE_FIREBASE_APP_ID=your_app_id VITE_FIREBASE_MEASUREMENT_ID=your_measurement_id
-
-
Run the development server:
npm start # or yarn startThe app should now be running at http://localhost:3000.
npm start: Runs the app in development mode.npm run build: Builds the app for production.npm test: Launches the test runner.npm run eject: Ejects the CRA configuration (use with caution).
-
Build the application:
npm run build
-
Deploy to Firebase Hosting:
firebase login firebase use --add firebase deploy
Contributions, issues, and feature requests are welcome! Please follow these steps:
- Fork the repository.
- Create a new feature branch:
git checkout -b feature/YourFeature - Commit your changes:
git commit -m 'Add some feature' - Push to the branch:
git push origin feature/YourFeature - Open a pull request.
Please read CONTRIBUTING.md for detailed guidelines.
This project is licensed under the MIT License - see the LICENSE file for details.
Created by Your Name. Feel free to reach out at ergishasani2020@gmail.com for any questions or feedback.