Svelte Notes App

A simple, responsive notes application built with Svelte and TailwindCSS. The app connects to a mock API to let users create, view, edit, and delete notes.

🚀 Features

• View all notes
• Create a new note (title + content)
• Edit existing notes
• Delete notes
• Responsive design (mobile + desktop)
• Clean TailwindCSS UI

🛠 Tech Stack

• Svelte
• TailwindCSS
• Fetch API
• MockAPI.io

🌐 API

The app uses MockAPI.io.

Base URL:
https://68511b218612b47a2c08a075.mockapi.io/api/notes

Note Schema:

{
  "id": "string",
  "title": "string",
  "content": "string",
  "createdAt": "ISODate"
}

📂 Project Structure

<root>/
├── README.md              # Project readme (this file)
└── svelte-notes-app/
    ├── .vscode/           # (optional) editor settings
    ├── node_modules/      # dependencies
    ├── public/            # static assets
    ├── src/
    │   ├── assets/        # app assets
    │   ├── components/    # NoteForm, NoteList, NoteCard
    │   └── lib/           # (optional) helper modules
    ├── package.json       # npm project config
    ├── tailwind.config.js # Tailwind setup
    └── ...

⚡ Getting Started

1️⃣ Clone the repo

git clone https://github.com/SahilAdvani/Svelte-Notes-App.git

2️⃣ Install dependencies

npm install

3️⃣ Run the app

npm run dev

Open: http://localhost:5173

⚖️ Trade-offs / Assumptions

• API URL is hardcoded (safe for mock API).
• Minimal error handling; could be improved.
• No dark mode or delete confirmation yet.

✨ Future Enhancements

• Dark mode
• Delete confirmation modal
• Search & filter functionality
• Pagination or infinite scroll
• Better error handling + loading spinners

📧 Submission

✅ Code repo: https://github.com/SahilAdvani/Svelte-Notes-App.git
✅ Functional app
✅ API working as expected