Update readme

Author: thecodeholic

README.md

@@ -1,14 +1,73 @@
-# Small notes application using Plain Js
+# Notes app using plain javascript
 
-## Installation
+### Install in your project
+```
+npm install @thecodeholic/plainjs-notes
+```
+
+### Usage
+```javascript 1.8
+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
+
+```javascript 1.8
+// 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
+
+```javascript 1.8
+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](https://github.com/webpack/webpack-dev-server)
+### Running on development using [dev server](https://github.com/webpack/webpack-dev-server)
 
 Run `npm run start` to start to webpack dev server with HMR ready
 
-## For production 
+### Build For production 
 
 Run `npm run build` to build project's all assets in `dist` folder.

demo/app.js

@@ -28,10 +28,10 @@ const noteManager = new NoteManager({
 });
 
 noteManager.onNoteAdd = (note) => {
-  console.log("Note added", note);
+  console.log("Note added ", note);
 };
 noteManager.onNoteChange = (note) => {
-  console.log("Note changed", note);
+  console.log("Note changed ", note);
 };
 noteManager.onNoteRemove = (note) => {
   console.log("Note removed ", note);

package.json

@@ -1,15 +1,15 @@
 {
-  "name": "webpack-babel-demo",
+  "name": "@thecodeholic/plainjs-notes",
   "version": "1.0.0",
-  "description": "",
+  "description": "Notes app using vanilla javascript",
   "main": "index.js",
   "scripts": {
     "build": "npx webpack --config webpack.config.prod.js --mode=production",
     "watch": "npx webpack --watch",
     "start": "webpack-dev-server"
   },
-  "author": "",
-  "license": "ISC",
+  "author": "Zura Sekhniashvili <zurasekhniashvili@gmail.com>",
+  "license": "MIT",
   "devDependencies": {
     "@babel/core": "^7.2.2",
     "@babel/preset-env": "^7.2.3",
@@ -28,5 +28,14 @@
     "webpack-cli": "^3.2.0",
     "webpack-dev-server": "^3.1.14",
     "tar": ">=2.2.2"
-  }
+  },
+  "dependencies": {},
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/thecodeholic/VanillaJsNotes.git"
+  },
+  "bugs": {
+    "url": "https://github.com/thecodeholic/VanillaJsNotes/issues"
+  },
+  "homepage": "https://github.com/thecodeholic/VanillaJsNotes#readme"
 }

webpack.config.prod.js

@@ -9,7 +9,7 @@ module.exports = function (env, argv) {
   return {
     mode: 'production',
     entry: [
-      './src/app.js'
+      './src/NoteManager.js'
     ],
     optimization: {
       minimizer: [
@@ -19,9 +19,6 @@ module.exports = function (env, argv) {
     ,
     plugins: [
       new CleanWebpackPlugin(['dist']),
-      new HtmlWebpackPlugin({
-        template: path.resolve('./src/index.html')
-      }),
       new MiniCssExtractPlugin({
         filename: "[name].css",
         chunkFilename: "[id].css"
@@ -47,28 +44,7 @@ module.exports = function (env, argv) {
               presets: ['@babel/preset-env']
             }
           }
-        },
-        {
-          test: /\.(woff(2)?|ttf|otf|eot|svg)(\?v=\d+\.\d+\.\d+)?$/,
-          use: [
-            {
-              loader: 'file-loader',
-              options: {
-                name: '[name].[ext]',
-                outputPath: 'fonts/'
-              }
-            }
-          ]
-        },
-        {
-          test: /\.html$/,
-          use: {
-            loader: 'html-loader',
-            options: {
-              attrs: [':src', ':href']
-            }
-          }
-        },
+        }
       ]
     }
   };