Saturday, September 26, 2015

Must-see presentation for end to end testing using protractor for angularJS apps

In Wellington AngularJS meetup, I gave a talk on using protractor for end to end testing of angularJS applications. Here I presented and demonstrated some best practices with a live demo on how to get started with using protractor for e2e testing.

My presentation and demonstration application are both available online. Links are as below:


Tuesday, September 15, 2015

Using Protractor to test AngularJS Apps

Hi All,
To share my knowledge and experience in testing AngularJS apps, I am presenting on using Protractor for end-to-end testing of AngularJS applications at the Wellington AngularJS meetup. If you are planning or already using AngularJS for your front-end development and interested to know some best practices for the end to end testing of web apps, do RSVP to this event.
Cheers!!


Monday, September 7, 2015

UI Testing in Xcode

Xcode 7 has introduced new UI testing features fully integrated into the IDE. I learned about the new APIs and how UI testing fits in with existing testing features in Xcode. Also got to see how to get started by recording your app, and how to efficiently craft and maintain UI tests.

check this link introducing this API and UI testing tool in WWDC/2015

Though this tool is in beta stage, IT industry has taken this as a tool for future UI testing for apple apps and have started using it already.

I came across another good article related to this. It summarizes the WWDC 2015 UI Testing talk and gives the detail of coming beta releases as well. Check it out here


Friday, September 4, 2015

Must-have SublimeText Plugins for JavaScript Developers


Sublime Text is a great application for just about any developer to have in their toolbox. It's a sophisticated text editor for code, markup and prose.You'll love the slick user interface, extraordinary features and amazing performance. It is basically a cross platform, highly customizable, advanced text editor and sits nicely between full featured IDEs (which are notoriously resource hungry) and command line editors such Vim or Emacs (which have steep learning curves).

One of the things that makes Sublime so great is its extensible plugin architecture. This makes it easy for developers to extend Sublime’s core functionality with new features such as code completion, or the embedding of remote API documentation. Sublime Text doesn’t come with plugins enabled out of the box — they are typically installed through a 3rd party package manager simply called Package Control. To install Package Control in Sublime Text, please follow the installation guide on their website.

To improve your workflow and make you more productive as JavaScript developers, the ten must-have Sublime plugins are as below:

1. Babel

2. JSHint

3. JsFormat

4. DocBlockr

5. Side​Bar​ Enhancements

6. AngularJS

7. TypeScript

8. Handlebars

9. Better CoffeeScript

10. jQuery

Full described article available here

Friday, August 7, 2015

Learn How to Write Angular 2 Style Unit Tests with Angular 1.X Code


The development of Angular 2 is on its way with much talk, hype, and fanfare. Surprisingly, there is not much being said about unit testing. As a responsible developer, you have undoubtedly already written a giant unit test suite to achieve ‘near perfect’ code coverage, and I'm here to let you know, there is no need to throw that all away! While Angular 2 is currently in ‘developer preview’, implying that nothing serious should be built with it currently, the Angular Team has already created a giant wealth of unit tests and a custom testing setup: (https://github.com/angular/angular/tree/master/modules/angular2/test). Unfortunately, it is not easy to set this up for yourself. So this post should help you get started.

link to full post here

Wednesday, July 15, 2015

Use Page Objects in Protractor for Spaghetti free Code

Firstly, what are Page Objects? Here is a definition from the Selenium team:
Page Object is a Design Pattern which has become popular in test automation for enhancing test maintenance and reducing code duplication. A page object is an object-oriented class that serves as an interface to a page of your AUT. The tests then use the methods of this page object class whenever they need to interact with that page of the UI. The benefit is that if the UI changes for the page, the tests themselves don’t need to change, only the code within the page object needs to change. Subsequently all changes to support that new UI are located in one place.

Using Page objects in test cases has been very useful. It will feel hard and time consuming initially but, once you have all page objects up and running. Its going be a smooth ride . Till now writing test cases for an Angular Apps has been smooth ride. Thanks to some good articles online to get me going.

I have found some very helpful resources, which talks about using Page objects in Protractor for end-to-end testing which, I would like to share with other peps... Enjoy..


Sunday, June 28, 2015

Karma-Jasmine | Protractor for AngularJS

Lately, I have been working on setting up the testing framework and writing test cases for angular apps. I am using Karma-Jasmine framework for unit testing. And for end-to-end testing, am using another testing framework called Protractor.

I like to follow best practices while using any technology. It will feel hard initially but, you will find the its usefulness as you come across complex scenarios. Till now writing test cases for an Angular Apps has been smooth ride. Thanks to some good articles online to get me going.

I have found some very helpful resources, which talks about unit testing and end-to-end testing which, I would like to share with other peps... Enjoy..


Friday, June 5, 2015

Learn ECMAScript 2015

ECMAScript 6 is the upcoming version of the ECMAScript standard. This standard is targeting ratification in June 2015. ES2015 is a significant update to the language, and the first update to the language since ES5 was standardized in 2009. Implementation of these features in major JavaScript engines is underway now.

Click here to read more about ..ECMAScript 6 Features


Eliminate Javascript code smells

This slide will review various common smelly snippets of code and discuss techniques on how we can eliminate and protect against their pungent odors.JavaScript Code Smells


Tuesday, June 2, 2015

AngularJS’ Internals

I came across an interesting article on AngularJS internals authored by Nicolas Bevacqua. This article gives a very clear understanding of the entire idea of scoping!

AngularJS presents a remarkable number of interesting design choices in its code base. Two particularly interesting cases are the way in which scopes work and how directives behave.

AngularJS' Internals In Depth

The first thing anyone is taught when approaching AngularJS for the first time is that directives are meant to interact with the DOM, or whatever manipulates the DOM for you, such as jQuery (get over jQuery already!). What immediately becomes (and remains) confusing for most, though, is the interaction between scopes, directives and controllers. Read more...

Saturday, May 30, 2015

Building native iOS and Android apps with existing JavaScript solutions.

When looking at the existing JavaScript solutions for building native iOS and Android apps, it's a fact that they're powerful and can extremely reduce the amount of application development time. On the other side it's also clear that they come with drawbacks and limitations. It depends heavily on a project's requirements and of course on the developer skills and sensibilities.

App performance and UI responsiveness are the main aspects when it comes to the question of using a JavaScript solution or not (native apps with a single C# code base can be realized with Xamarin). It should be clear that WebView wrapper approaches will never reach native-quality UI performance. So developers should start with a proof of concept when choosing a HTML-based WebView solution: mastering dynamic data and optimizing form controls are non-trivial tasks.

The Mobile App Framework Matrix represents a comparison and documentation of current technologies for building native iOS and Android apps with a single JavaScript code base. Find full article here: Mobile App Framework Matrix


Thursday, May 28, 2015

Google I/O Developer conference 2015.

Google I/O developer conference 2015 unveiled new version Android M. It looks very promising.

As told, there are now over 4,000 apps for Android Wear and designers have created more than 1,500 watch faces. 

There is deeper integration of Google Now into Android. So, Google Now cards will be able to appear everywhere in the phone, ready to be called up within apps or the Web via a feature Google calls "Now on Tap". Will get quick answers to quick ques. Eg: card on a movie/event while sending email.

 With M, the app will download and install without presenting permissions required, but then ask for those permissions at the time it is first looking to take action.

Android Studio Ide is the tool everyone should use for app development.

On testing end, Google is adding a feature into its tools that lets developers run automated tests of their Android code against 20 popular devices at no charge. It builds on last year’s acquisition of Appurify.

Android developers will be able to have their own home page within Google Play and use it to promote a specific app.

And much much  more.. Checkout here on the event details. Or follow them on Twitter #IO15 or Twitter @googledevs

Android M is due out later this year.

Wednesday, May 20, 2015

Looking for HTML, CSS, and JavaScript code editor in your browser?

If you haven't tried CodePen yet. You are missing something really interesting.

CodePen is an HTML, CSS, and JavaScript code editor in your browser with instant previews.

It's a playground for the front end side of the web. It's all about inspiration, education, and sharing.

Need to build a reduced test case to demonstrate and figure out a bug? 

Want to show off your latest creation and get feedback from your peers?

Want to find examples of a particular design pattern for your project? 

CodePen is great to use for all of these situation

Learn Angular.JS through the process of building 10 different projects

What is Angular JS?

Angular.JS is an open source web application framework maintained by Google.

It is a robust client-side technology for building modern web applications using model-view controller (MVC) software architecture. Angular.JS adds more functionality and features to a single-page HTML web application. Today, a lot of developers rely heavily on the MEAN stack (Mongo.DB, Express.JS, Angular.JS and Node.JS) and learning Angular.JS is surely a fruitful investment.

Angular.JS offers a bunch of interesting features, such as asynchronous dependency injection, deep link routing, form validation, two-way data binding and deep linking, to name a few.

Some of the popular applications built using Angular.JS:

Dematerializer (a blogging platform)

PunchPlay (music player application) 

Sendmachine (an email marketing tool) 

Betrend (a fashion portal) 

So, what makes Angular.JS a preferred choice for designing web applications? Let us take a look at some of its prominent features.

Angular.JS uses directives to add new mark-ups to HTML and turns static HTML files in to something dynamic. It is an innovative approach to incorporating HTML and developing big web applications. 

Angular.JS organizes views, controllers, directives, filters and such other elements in to separate modules. This division becomes convenient for building and managing an application. 

Angular.JS has a built-in dependency injection system and is unit-testable. 

Angular.JS uses data-binding directives to provide a projection of the model to the application view. It automates synchronization of data between model and view components. This allows developers to avoid writing a considerable amount of boilerplate code.

Angular.JS has a built-in template engine consisting of plain HTML pages (views) as well as controllers written in JavaScript to build rich user interfaces. 

Angular.JS uses directives to extend HTML dialect by creating new HTML elements and attributes as well as custom HTML tags that work as new widgets.

Today, Angular.JS has a pretty vast scope for mainly two reasons. Firstly, it is maintained and promoted by Google. Secondly, a large community of developers are making valuable contributions by introducing newer features and functionalities to this technology. There is also much scope for experimenting with Angular.JS to test its significance in diverse applications.

By making projects implementing Angular along with some other technologies

• HTML5 / CSS3

• JQuery

• NodeJS / NPM / Node Modules

• Bootstrap

• Foundation

• Facebook API

• Instagram API

• Socket.io

• MongoDB

Following basic projects:

Project 1 – Basic Angular Website: A simple website using dynamic functionality from AngularJS

Project 2 – myContacts Address Book: Small app to manage contacts

Project 3 – Web Template Store: Application that displays web templates for sale

Project 4 – Web Sockets Chat App: Real time chat using web sockets

Project 5 – Angular Facebook App: Facebook authentication and posting app

Project 6 – Knowledgebase: Article database using MongoDB

Project 7 – User Login App: Custom user authentication app

Project 8 – Instagram Gallery: Display images from Instagram

Project 9 – Job Directory: Small job listing site

Project 10 – Concert Finder: Concert/music directory

I have collated the  projects and resource from kick starter initiative. If interested do
Support them. kick starter initiative

Friday, May 15, 2015

A re-introduction to JavaScript (JS tutorial)


Why a re-introduction? Because JavaScript is notorious for being the world's most misunderstood programming language.

It is used by an incredible number of high-profile applications, showing that deeper knowledge of this technology is an important skill for any web or mobile developer. Rekindle your memory with awesomeness of javascript.

Full article available on Mozilla developer Network (MDN)

Thursday, May 14, 2015

Working in the Cloud

Working in the Cloud By Simon Murcott , Solnet Solutions. He specialize in: DevOps, Unix systems, security, scripting, software development, systems integration etc..

He described about, how cloud environments are being used by modern businesses. He also walked us through, what it is like to be a cloud provider and other aspects of working in IT that are not development related. Many options are available for an IT career other than being a developer. He explored the daily life (and differences between) a developer, infrastructure engineer, middleware specialist, integration engineer and product specialist. It was very insightful.

He spoke about :

  • FreeBSD is an advanced computer operating system used to power modern servers, desktops and embedded platforms.
  • OpenStack Open source software for creating private and public clouds. OpenStack software controls large pools of compute, storage, and networking resources throughout a datacenter, managed through a dashboard or via the OpenStack API. OpenStack works with popular enterprise and open source technologies making it ideal for heterogeneous infrastructure.
  • Mule is a lightweight enterprise service bus (ESB) and integration framework. The platform is Java-based, but can broker interactions between other platforms such as .NET using web services or sockets.
  • Docker is an open-source project that automates the deployment of applications inside software containers, by providing an additional layer of abstraction and automation of operating-system-level virtualization on Linux. It can be integrated into various infrastructure tools, including Amazon Web Services, Chef, Google Cloud Platform, IBM Bluemix,Microsoft Azure, OpenStack Nova,Puppet, Vagrant etc.
Best way to understand these tools is play around with it. I am gonna start with playing around with AWS. Thanks to the Abletech team for sharing how to deploy static websites to Amazon. Build a static website with AWS.


Wednesday, May 13, 2015

Scrum: What is Agile?

If you ask 10 people to define Agile development and you will receive 11 definitions emphasizing different aspects of the process. I got to hear a talk (Presented by Anthony Boobier (Nomad8)) to clear up the confusion of this buzzwords and shed light onto the fundamentals of Agile software development.

We looked into what problems Agile is trying to solve and dive deep into the reasons why it works. We undertook a brief journey into the history of software development, explore the principles and values behind Agile and then later focused on how to manage our work in an Agile fashion using its most prevalent flavour, Scrum.

Scrum is a development framework in which cross-functional teams develop products or projects in an iterative, incremental manner. It structures development in cycles of work called Sprints. These iterations are no more than four weeks each (the most common is two weeks), and take place one after the other without pause. The Sprints are timeboxed – they end on a specific date whether the work has been completed or not, and are never extended. Usually Scrum Teams choose one Sprint length and use it for all their Sprints until they improve and can use a shorter cycle. At the beginning of each Sprint, a cross-functional Team (of about seven people) selects items (customer requirements) from a prioritized list. The Team agrees on a collective target of what they believe they can deliver by the end of the Sprint, something that is tangible and will be truly “done”. During the Sprint, no new items may be added; Scrum embraces change for the next Sprint, but the current short Sprint is meant to focus on a small, clear, relatively stable goal. Every day the Team gathers briefly to inspect its progress, and adjust the next steps needed to complete the work remaining. At the end of the Sprint, the Team reviews the Sprint with stakeholders, and demonstrates what it has built. People obtain feedback that can be incorporated in the next Sprint. Scrum emphasizes working product at the end of the Sprint that is really “done”; in the case of software, this means a system that is integrated, fully tested, end-user documented, and potentially shippable. Key roles, artifacts, and events are summarized..in the link below: A Lightweight Guide to the Theory and Practice of Scrum


Design Thinking and the design process

Yesterday, 13 May,2015 I got an opportunity to hear from a Design Lead from Optimal Experience PwC..Graham Howe, their best practices in design thinking and design process.

It was all about Research, sketching, wireframes, testing, iterations and prototyping. We tried out mocking pages for a government acc site on how to find levy codes for users. It was an intense workshop. Just in 15 minutes time period, we had so much ideas on the paper. It was just beautiful.


How CSS Work

Are you new to CSS? This article is for you! Perhaps the biggest key to understanding CSS is understanding selectors. Selectors are what allows you to target specific HTML elements and apply style to them. For reading the full article please click the below link.

How CSS Selectors Work

CSS Reference

This CSS Reference lists all standard CSS properties, pseudo-classes and pseudo-elements, @-rules, units, and selectors in alphabetic order. It allows you to quickly access detailed information for each of them. It not only lists the CSS 1 and CSS 2.1 properties, but also is a CSS3 reference that links to any CSS3 property and concept standardized, or already stabilized.


Sunday, April 19, 2015

Website to display my personal projects and work profile.

I have created a new web site . It will have my latest work profile and will be a platform to host my personal web projects.

Do check it out http://gaurav2github.github.io.

Monday, April 6, 2015

Open Source Open Society OS//OS 2015 is a two-day gathering of bright minds and communities from open technology, open government, open business and open education. 16 & 17 April 2015 // Wellington, NZ


OS//OS 2015 will bring software developers, open government champions, changemakers and innovators together from across sectors.

Quote OS//OS:

We will celebrate and share global best practices, openly discuss the big challenges head on and build a community of people leading the way in the open source ethos.

"Expect inspiring keynote speakers, interactive workshops and plenty of opportunity for connection, participation & open knowledge-sharing with world-leading practitioners and the brightest local minds."

Register for the event
Click here for the Event details.

Open principles

  1. Collaboration
  2. Participation
  3. Transparency
  4. Freedom to innovate