Posted on

Leaflet – a JavaScript library for interactive maps

Leaflet is the leading open-source JavaScript library for mobile-friendly interactive maps. Weighing just about 38 KB of JS, it has all the mapping features most developers ever need.

Leaflet is designed with simplicity, performance and usability in mind. It works efficiently across all major desktop and mobile platforms, can be extended with lots of plugins, has a beautiful, easy to use and well-documented API and a simple, readable source code that is a joy to contribute to.

Source: Leaflet – a JavaScript library for interactive maps

Posted on

Clean Code concepts adapted for JavaScript

Software engineering principles, from Robert C. Martin’s book Clean Code, adapted for JavaScript. This is not a style guide. It’s a guide to producing readable, reusable, and refactorable software in JavaScript.Not every principle herein has to be strictly followed, and even fewer will be universally agreed upon. These are guidelines and nothing more, but they are ones codified over many years of collective experience by the authors of Clean Code.

Source: ryanmcdermott/clean-code-javascript: Clean Code concepts adapted for JavaScript

Posted on

npm- Specifying dependencies and devDependencies in a package.json file

Install packages required by your application in production:

npm install [package name]

 

Install packages that are only needed for local development and testing:

npm install [package name] --save-dev

NPM cheat sheet:
https://kapeli.com/cheat_sheets/npm.docset/Contents/Resources/Documents/index

Specifying dependencies and devDependencies in a package.json fileTo specify the packages your project depends on, you must list them as “dependencies” or “devDependencies” in your package’s package.json file. When you (or another user) run npm install, npm will download dependencies and devDependencies that are listed in package.json that meet the semantic version requirements listed for each. To see which versions of a package will be installed, use the semver calculator.”dependencies”: Packages required by your application in production.”devDependencies”: Packages that are only needed for local development and testing.

To specify the packages your project depends on, you must list them as "dependencies" or "devDependencies" in your package’s package.json file. When you (or another user) run npm install, npm will download dependencies and devDependencies that are listed in package.json that meet the semantic version requirements listed for each. To see which versions of a package will be installed, use the semver calculator.

  • "dependencies": Packages required by your application in production.
  • "devDependencies": Packages that are only needed for local development and testing.

Source: Specifying dependencies and devDependencies in a package.json file | npm Documentation

Posted on

mockserver – npm

mockserver is a library that will help you mocking your APIs in a matter of seconds: you simply organize your mocked HTTP responses in a bunch of mock files and it will serve them like they were coming from a real API; in this way you can write your frontends without caring too much whether your backend is really ready or not.

Source: mockserver – npm

Posted on

Javascript debugging helper – Count number of eventlisteners in Chrome console

Paste and run one of the code blocks below in chrome console to get eventlisteners count.

//eventlisteners counter - grouped summary
Array.from(document.querySelectorAll('*'))  .reduce(function(pre, dom){
    var evtObj = getEventListeners(dom)
    Object.keys(evtObj).forEach(function (evt) {
      if (typeof pre[evt] === 'undefined') {
        pre[evt] = 0
      }
      pre[evt] += evtObj[evt].length
    })
    return pre
  }, {})
  
//_-------------------------------------------
  
  // //eventlisteners - totalcount
  var totalCount = 0;
  Array.from(document.querySelectorAll('*')).reduce(function(pre, dom){
    var evtObj = getEventListeners(dom)
    Object.keys(evtObj).forEach(function (evt) {
      if (typeof pre[evt] === 'undefined') {
        pre[evt] = 0
      }
      // pre[evt] += evtObj[evt].length
	  totalCount += evtObj[evt].length;
    })
    return totalCount;
  }, {})
  
  
  //---------------------------------------