Anotesapp that storesnoteson yourbrowser.Lokalnotes useslocalStorage to store the notes data on your localStorage.

This will stay on your browser and will be cleared when you chose to do it manually or enabled during your browser history deletion. So it's up to you whether it stays on the browser

Why browser?

We have seen many notes application(online/offlie) and I havebuilt one myself usingPHP andSQLite so offline and on-disk storage. These are somewhat created to manage multiple features including media. These note-taking apps can't considered forquick andeasy to use.

Lokalnotes is alightweight and effective solution for managing your notes directly in your browser.

It'sprivate,no registration required andvery very easy tocreate andexport as a.txt file.

Working and Features

In Lokalnotes we can,

• Create new note
• Delete all notes
• Copy a note
• Download a note
• Delete a note

Create Note

When you create a note, a itemnotesData is set in localstorage and the values are stored asjson converted to string.

We leverage this to create multiple notes as values for a single localstorage key, since data in localstorage are stored as key-value pairs.

LocalStorage

key : notesData, value : {"1683644984302": "hi", "1683644984469": "bye"}

When a note is created thenote name iscurrent timestamp. So we can create, read, update and delete a note the same we would if we use a database.

Write and Save Note

Atextarea willopen up at the side when youclick on thenotename. The clickednotename will be inbold and background converted towhitesmoke to highlight the current note you are working on.

Click'Save Note' button to save. You can see the'Note Saved' message at the sidenav.

You can also check thelocalStorage to look at your stored notes 👇

Copy and Download

Copy

Foreach note created, we can copy the contents of the note by clicking the copy icon.

You can see a popup message confirming that the contents of the note are copied to the clipboard.

Download

For download, the contents of that note will be downloaded as a .txt file with the notename as the filename.

Example :
value : {"1683644984302": "hi",...
will be downloaded as1683644984302.txt

Techonolgies used

• HTML
• CSS
• Javascript

Conclusion

Start using LokalNotes today and experience a hassle-free note-taking experience right in your favorite web browser.