This is a demonstration of a To-Do App built with SvelteKit, incorporating Svelte Store for state management, Firebase Auth for user authentication using email and password, Cloud Firestore for storing individual to-do lists for each user, Vercel for deploying the web application, and protected routes for enhanced security.
- SvelteKit
- Svelte Store
- Firebase Auth
- Cloud Firestore
- Google Fonts
- Font Awesome
- Vercel
- User authentication using Firebase Auth (email and password)
- CRUD operations for managing to-do lists
- Real-time data synchronization with Cloud Firestore
- Responsive design for a seamless user experience on various devices
First, clone the project and open it with Visual Studio Code:
git clone https://github.com/javigong/sveltekit-fullstack-todo-crud.git
cd sveltekit-fullstack-todo-crud
code .
Then, create a .env.local file in the root of the project and configure the following environment variables:
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
Finally, install the npm dependencies and run the application:
npm install
npm run dev
Now the application is running on http://localhost:5173/ 🚀
SvelteKit To-Do App deployed using Vercel: