Skip to content

godfreyw53/Note-Taking-Application

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

3 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Note-Taking-Application

Notes App A simple browser-based notes app built with vanilla JavaScript. It lets you create editable notes, delete them, and automatically saves everything to localStorage so your notes persist after a page refresh. Features Create new notes

Edit notes directly in the browser

Delete notes with one click

Auto-save on typing

Notes persist using localStorage

Prevents Enter key from creating new paragraphs (keeps notes tidy) How It Works

Notes are stored as editable

elements

Each note includes a delete icon

The app uses event delegation to handle clicks and keyboard input

Notes are saved by storing the container’s HTML in localStorage project/ │ ├── index.html ├── style.css ├── script.js └── assets/ └── delete-svgrepo-com.svg Usage

Open the app in your browser.

Click the Create button to add a new note.

Click inside a note and start typing. Changes are saved automatically.

Click the delete icon to remove a note.

Refresh the page. Your notes will still be there.

JavaScript Logic Overview

showNotes() Loads saved notes from localStorage and renders them on page load.

updateStorage() Saves the current notes container HTML to localStorage.

Click events on the notes container handle:

Deleting notes when clicking the image

Saving notes when typing inside a note

A global keydown listener prevents the default Enter key behavior.

Requirements

Modern browser with JavaScript enabled

No external libraries or frameworks needed Notes

This app uses localStorage, so notes are saved per browser and per device.

Clearing browser storage will remove all saved notes.

document.execCommand is deprecated but still supported in most browsers.

Possible Improvements

Use addEventListener instead of onkeyup

Store notes as structured data (JSON) instead of raw HTML

Add timestamps or titles for notes

Improve accessibility and keyboard navigation

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published