Basics of Webpack – module bundler

Webpack is a module bundler. It takes you code transforms and bundles it, then returns a new compiled version. If you want to write ES6 Javascript code or React then I think Webpack is the better option.

what-is-webpack

webpack – Module Bundler

Continue reading

Advertisements

AngularJS: Injecting service into a HTTP interceptor (Circular dependency)

Recently, I’m getting circular dependency error while I’m injecting my service to HTTP interceptor. Code works well if I’m remove my service dependency from HTTP interceptor.

Find my interceptor code below where I’m injecting my ‘waitingDialog‘ service which have ‘$uibModal’ (angular ui-modal) dependency. Continue reading

Common Developer Mistakes in AngularJS

Hi All,

After long time, finally got a time for blog. I found such a nice post on Toptal.com by Michal Mikolajczyk. He list out top 18 most common developer mistakes in AngularJS. Couple of mistakes that I found that I’m already did such as overusing of resolve, not using named views, not fully utilizing controllerAs syntax etc. Thanks Michal 🙂

Find out complete list here and list out your mistakes. Hope it will helps you as well !!!!

How to use Media Query in Javascript?

To make webpage responsive we use lots of media queries. Actually, Media Queries are a CSS feature that allows us to apply different screen width rules to our CSS. In many adaptive application we need to write JavaScript code which supports many devices. But these Media Queries in CSS what about in JavaScript? Can I use it in JavaScript? If yes, then how can I use Media Query in JavaScript?.

Well, now it is possible to use media query in JavaScript with the help of the window.matchMedia function. It is well supported and if you don’t need to support IE8 or lower you may use it without worry. Browser Support for window.matchMedia() is also pretty good.

Example

var mql = window.matchMedia("screen and (min-width: 800px)")
if (mql.matches){ // if media query matches
 alert("Window is 800px or wider")
}
else{
 // do something else
}

Continue reading