Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/hallowshaw/my-todo-list-using-firebase
A simple todo list application built with React, Vite, and Firebase. Users can securely sign up, log in, and manage their todo items in real-time with Firebase's real-time database. The application features CRUD operations, authentication, and a responsive design, making it easy to use across different devices.
https://github.com/hallowshaw/my-todo-list-using-firebase
crud crud-application crud-operation firebase firebase-database firebase-realtime-database javascript js jsx react react-hooks reactjs
Last synced: 3 days ago
JSON representation
A simple todo list application built with React, Vite, and Firebase. Users can securely sign up, log in, and manage their todo items in real-time with Firebase's real-time database. The application features CRUD operations, authentication, and a responsive design, making it easy to use across different devices.
- Host: GitHub
- URL: https://github.com/hallowshaw/my-todo-list-using-firebase
- Owner: hallowshaw
- Created: 2024-03-12T05:33:11.000Z (10 months ago)
- Default Branch: main
- Last Pushed: 2024-04-01T19:34:16.000Z (9 months ago)
- Last Synced: 2024-04-01T20:37:17.976Z (9 months ago)
- Topics: crud, crud-application, crud-operation, firebase, firebase-database, firebase-realtime-database, javascript, js, jsx, react, react-hooks, reactjs
- Language: JavaScript
- Homepage:
- Size: 357 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# React Todo List with Firebase
This is a simple todo list application built using React and Vite for the frontend and Firebase for the backend/database. This application allows users to create, read, update, and delete todo items in real-time.
## Features
- **Authentication**: Users can sign up and log in securely using Firebase Authentication.
- **Real-time Updates**: Todo items are synchronized across multiple clients in real-time.
- **CRUD Operations**: Users can create, read, update, and delete todo items.
- **Responsive Design**: The application is designed to work on various screen sizes.
## Technologies Used
- **React**: JavaScript library for building user interfaces.
- **Vite**: Next-generation frontend tooling.
- **Firebase**: Platform for building web and mobile applications.
## Getting Started
### Prerequisites
Before running the application, make sure you have the following installed:
- Node.js
- npm (Node Package Manager)
### Installation
1. Clone the repository:
```bash
git clone https://github.com/hallowshaw/My-Todo-List-using-Firebase.git
```
2. Navigate to the project directory:
```bash
cd My-Todo-List-using-Firebase
```
3. Install dependencies:
```bash
npm install
```
### Configuration
1. Create a Firebase project on the [Firebase Console](https://console.firebase.google.com/).
2. Enable Firestore database and Firebase Authentication for your project.
3. Copy the Firebase configuration object from your Firebase project settings.
4. Paste the configuration object into `src/firebase/config.js`.
### Running the Application
1. Start the development server:
```bash
npm run dev
```
2. Open your web browser and navigate to [http://localhost:3000](http://localhost:3000) to view the application.
## Deployment
To deploy the application, you can follow the hosting instructions provided by Firebase. Typically, you would use the Firebase CLI to deploy your application.
```bash
firebase login
firebase init
# Follow the prompts to initialize Firebase Hosting
firebase deploy
```
## Contributing
Contributions are welcome! Please feel free to submit a pull request or open an issue if you encounter any problems or have suggestions for improvement.
## Acknowledgments
- [React](https://reactjs.org/)
- [Vite](https://vitejs.dev/)
- [Firebase](https://firebase.google.com/)