Sandeep Kumar Patel's Blog

Traceur Compiling ES6 Block Scope Binding Using Let Keyword

ES6 provides the true block scope binding using Let keyword.let allows us to declare variables that are limited in scope to the block, statement, or expression on which it is used.variable declared in var keyword are global or local to an entire function regardless of block scope.In this demo, “We will learn to use true block scope binding using let keyword”.We are using the same project that we have used in my previous post.The following code has 2 different method printIUsingVar() and print...

Grunt Traceur Compiler And Watcher For ES6 Code

Grunt provides a compiler and watch to detect changes in ES6 code and generates the corresponding ES3 code.In this demo,”We will learn how to implement Grunt for Traceur compiler for ES6 code”.We need to install Grunt locally to project using following command npm install grunt.The following screenshot shows the terminal with Grunt installation in project.
The 2 modules for Traceur Grunt modules are grunt-traceur-latest and grunt-contrib-watch.The grunt-traceur-latest module is grunt plug-in...

Traceur ES6 Arrow Operator Offline Compilation

Traceur provides offline compilation of ES6 code to ES5 code for testing ES6 feature.In the previous post we learnt installing Traceur and installing traceur-runtime.js file using Bower.In this Demo, “We will learn to use traceur command to compile ES6 code to ES5 for ES6 Arrow operator”.For this demo we have created 2 directories es6dev and build. We have also created demo.html file for demonstrating ES6 feature.The es6dev directory will have ES6 code and build directory will have compiled...

Installing Traceur For Testing ES6 Code

                                      
Google provides a compiler name Traceur for testing ES6 feature.Traceur compiles the ES6 code to ES5 for testing ES6 feature.You can find more details about Traceur compiler in the following link:                   ht...

WebStorm Creating AngularJS Seed Project

                
WebStorm 9 IDE provides feature to create a AngularJS project by generating the skeleton of the application.In this demo, “We will learn to create a seed AngularJS project using WebStorm 9”.In WebStorm 9 IDE select File>New project and enters the name of the project and select the project type as following screenshot:
Then press OK button.It shows a message to run NPM as following screenshot: ...

Beginning With Protractor Testing NonAngularJS Application

ProtractorJS provides suits and specs to test web application.In this demo,”We will learn to test a non AngularJS application using protractor”.Two files conf.js and spec.js are required as conf.js contains all the configuration object and spec.js contains all the test cases.In this example we will test to check www.google.com contains a title text a Google in the pages.The content of conf.js is as follows:exports.config = {
seleniumAddress: 'http://localhost:4444/wd/hub',
specs: ['spec...

Installing Protractor For AngularJS Testing

                                    
Protractor provides end to end testing for AngularJS application.In this demo, “We will learn to install protractor”.To install protractor use npm install –g protractor command in the terminal as following screenshot:
To set up protractor we need to update webdriver-manager using...

JavaScript BatteryManager API Demo

                                       
Navigator object provides Battery API for accessing charging attribute.a BatteryManager object can be accessed using getBattery() method.In this demo, “We will learn to access charging attribute on chargingchange event fired by BatteryManager”.The following cod...

Lodash Pluck And Where Method Example

               
lodash provides many utility methods for JavaScript developer.pluck() method is used for get the values of keys from a collection/array.where() method returns an array of element with matching property values.In this demo, “We will learn to use the methods pluck and where in lodash utility library”.The following code shows the use of _.pluck() and _.where() method to work with student object array.<!DOCTYPE...

Random Number Generator Using Lodash Utility

                               
lodash provides _.random() method to generate number.It takes 3 parameter min,max and boolean flag.The boolean flag with true value indicates the output as floating point number.In this demo, “We will learn about random() method to generate a random number”.The following code shows the use of random() method...