Skip to content

Commit e055606

Browse files
Create README.md for NoteTaking app
Added a comprehensive README for the NoteTaking app, detailing features, technologies used, project structure, and future improvements.
1 parent 4084f0c commit e055606

File tree

1 file changed

+75
-0
lines changed

1 file changed

+75
-0
lines changed

README.md

Lines changed: 75 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,75 @@
1+
# 📝 NoteTaking App
2+
3+
A modern and minimal **Note Taking web application** built using **HTML, CSS, and JavaScript**.
4+
The app allows users to create, edit, delete, and manage notes with persistent storage and theme support.
5+
6+
> ⚠️ This project was built by following a **step-by-step tutorial** as part of my JavaScript learning journey.
7+
> The goal was to understand DOM manipulation, state management, and browser storage.
8+
9+
---
10+
11+
## 🚀 Features
12+
13+
- Add notes with **title and content**
14+
- Edit existing notes
15+
- Delete notes
16+
- Notes saved using **localStorage**
17+
- Responsive **grid-based layout**
18+
- Modal dialog for note creation & editing
19+
- Light / Dark theme toggle 🌙
20+
- Theme preference saved in localStorage
21+
- Empty state UI when no notes exist
22+
23+
---
24+
25+
## 🛠️ Built With
26+
27+
- **HTML** – Structure and layout
28+
- **CSS** – Styling, animations, themes, and responsiveness
29+
- **JavaScript** – App logic, DOM manipulation, and localStorage
30+
31+
---
32+
33+
## 📚 What I Learned
34+
35+
- Managing application state using arrays
36+
- Creating, updating, and deleting data dynamically
37+
- Working with `localStorage`
38+
- Handling form submission and events
39+
- Using the `<dialog>` element for modals
40+
- Implementing edit mode using IDs
41+
- Theme toggling using CSS variables
42+
- Writing cleaner and reusable functions
43+
44+
---
45+
46+
## 📂 Project Structure
47+
48+
NoteTaking/
49+
50+
├── index.html
51+
├── style.css
52+
├── app.js
53+
└── README.md
54+
55+
56+
---
57+
58+
## 💡 Future Improvements
59+
60+
- Search notes by title
61+
- Add timestamps to notes
62+
- Pin important notes
63+
- Add note categories or tags
64+
- Export notes as text or JSON
65+
66+
---
67+
68+
## 🌱 Learning Note
69+
70+
This project was created as a **practice project** while learning JavaScript.
71+
I plan to refactor and improve it as I learn more advanced concepts.
72+
73+
---
74+
75+
⭐ Feel free to star the repository if you like it!

0 commit comments

Comments
 (0)