Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/ashish-simplecoder/js-material-note-app
https://github.com/ashish-simplecoder/js-material-note-app
Last synced: about 24 hours ago
JSON representation
- Host: GitHub
- URL: https://github.com/ashish-simplecoder/js-material-note-app
- Owner: Ashish-simpleCoder
- Created: 2021-08-21T19:12:23.000Z (about 3 years ago)
- Default Branch: master
- Last Pushed: 2022-01-08T16:27:39.000Z (almost 3 years ago)
- Last Synced: 2023-03-18T05:02:26.543Z (over 1 year ago)
- Language: SCSS
- Size: 225 KB
- Stars: 4
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# js-material-note-app
# See my App in action
- https://ashish-simplecoder.github.io/js-material-note-app/# Features of this Note App
* Note => This App has CRUD operations functionality.
* This Note App is made with Vanilla JS, with no external libray. It is mobile responsive and also have "Dark mode"
* This Note App has built with code splliting and uses dynamic imports to load the Javascript file when an action is triggred.
* When you will refresh the browser, all of the notes will load with Animation made using Vanilla JS and CSS.
* I have used Intersection Oberserver API to load the notes dynamically.
* The note withing the screen will load and other notes will not be loaded.
* This feature allows to load site very quickly. Don't belive it then just create some notes and refresh the browser tab and you will see how fast the site loads.
* I have included the Search feature to search your notes very quickly.
* You can type your notes keyword and matched notes will be displayed.
* You can also edit your notes and also delete them if you want to.
* To edit a note just click on the note which you want to edit.# Create notes very easily.
![image](https://user-images.githubusercontent.com/62009244/140534434-c93883e7-da93-48d8-89a8-82ee11326c6f.png)
# search your notes.
![image](https://user-images.githubusercontent.com/62009244/140534589-9b65b610-b9bb-4fb0-bc61-4d2f97ba6114.png)
![image](https://user-images.githubusercontent.com/62009244/140534652-519bc408-d2db-4aba-9b4d-c1f0a34b5db8.png)
# Edit notes very easily, Just click on the note which you wanna edit.
![image](https://user-images.githubusercontent.com/62009244/140534732-a701142b-f83c-4b0c-a207-ae69edf9d055.png)