This project was made for a Svelte Fundamentals course, a key part of the Summer Internship Program 2024. In this tutorial, you'll learn the basics of Svelte by building a simple note application. This project will help you understand the core concepts of Svelte while creating a functional quick notes app.
This project is a hands-on learning experience combining Vite, Svelte, TailwindCSS, Flowbite, and Dexie to create a simple note application. Users can create, edit, and delete notes with a clean and modern interface.
- Create Notes: Add new notes with ease.
- Edit Notes: Modify existing notes.
- Delete Notes: Remove notes when no longer needed.
- Persistent Storage: Use IndexedDB via Dexie.js for reliable note storage.
- Responsive Design: TailwindCSS for a modern, responsive UI.
- Vite: Fast development server and build tool.
- Svelte: Modern and efficient UI framework.
- TailwindCSS: Utility-first CSS framework for styling.
- Flowbite: Pre-built components for TailwindCSS.
- Dexie: Wrapper for IndexedDB, providing an easier API for database interactions.
- Node.js and npm (or yarn) installed
-
Clone the repository:
git clone https://github.com/nav9v/scoopy-notes -
Install dependencies:
npm install(oryarn install)
-
Start the development server:
npm run dev(oryarn dev)
npm run devand navigate to generated local host port in your browser- Create, edit, and delete notes using the intuitive interface.
- Notes will be stored in your browser's IndexedDB for persistence.
- Fork the repository specified for the Svelte projects.
- Clone the forked repository to your local machine.
- Create a new branch with your name.
- Implement the quick notes app by following the tutorial.
- Commit your changes and push them to your forked repository.
- Create a pull request to the main repository.
To enhance your learning experience and add more functionality to your project, we encourage you to take on the following challenges:
- Add a feature to delete notes within the application.
- Use IndexedDB for storing notes instead of local storage. For easier interaction with IndexedDB, consider using the Dexie.js library.
These challenges are designed to push your skills further and give you hands-on experience with more complex application features.