Effortlessly coordinate your market lists in real time. Share codes or links for instant collaboration—perfect for moms, friends, and beyond!
Shoplist is a collaborative shopping list application designed to simplify the process of organizing and managing shopping tasks. Built with React and Firebase, the app allows users to create, share, and update shopping lists in real time. Whether you're planning groceries with family or coordinating supplies with a team, Shoplist ensures seamless collaboration and synchronization.
- Create and Manage Lists: Easily add, edit, or remove items from shopping lists.
- Real-time Collaboration: Share lists via unique codes or links for simultaneous updates.
- User Authentication: Securely log in to manage personal and shared lists.
- Responsive Design: Optimized for use across desktops, tablets, and smartphones.
- Frontend:
- React: For building the user interface and managing state.
- React Router: For seamless navigation.
- Tailwind CSS: For a modern and responsive design.
- Backend:
- Firebase Realtime Database: To enable real-time updates.
- Firebase Authentication: For secure user logins.
- Hosting:
- Netlify: For quick and reliable deployment.
- Node.js and npm installed on your system.
- A Firebase account.
- Clone the repository:
git clone https://github.com/nurulmukhlisa/shoplist.git cd shoplist - Install dependencies:
npm install
- Set up Firebase: Create a Firebase project in the Firebase Console. Enable Authentication and Realtime Database. Copy your Firebase configuration and replace the placeholder values in src/firebaseConfig.js.
- Start the development server:
Visit http://localhost:3000 in your browser to view the app.
npm start
Contributions are welcome! Feel free to open an issue or submit a pull request.