Skip to content

thecodeholic/VanillaJsNotes

Repository files navigation

Notes app using plain javascript

Install in your project

npm install @thecodeholic/plainjs-notes

Usage

const noteManager = new NoteManager({
  el: document.getElementById('your_wrapper_element_id'),
  notes: [
    {
      title: 'sunt aut facere repellat',
      body: 'uia et suscipit suscipit recusandae consequuntur expedita et cum reprehenderit molestiae ut ut quas totam nostrum rerum est autem sunt rem eveniet architecto'
    },
    // ...
  ]
});

Methods

// Add the note at the bottom
noteManager.addNote({
  title: '',
  body: ''
});

// Add the note at the top
noteManager.prependNote({
  title: '',
  body: ''
});

// Remove the first note
noteManager.removeNote(noteManager.notes[0]);

// Update all notes and rerender
noteManager.notes = [...];
noteManager.renderNotes();

Events

noteManager.onNoteAdd = (note) => {
  console.log("Note added ", note);
};
noteManager.onNoteChange = (note) => {
  console.log("Note changed ", note);
};
noteManager.onNoteRemove = (note) => {
  console.log("Note removed ", note);
};

Installation and view demo

  1. Clone the project
  2. Go to the project root directory
  3. Run npm install

Running on development using dev server

Run npm run start to start to webpack dev server with HMR ready

Build For production

Run npm run build to build project's all assets in dist folder.

About

Sticky notes app using vanilla javascript

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published