Microsoft - A Big Thank You

1/03/2017 was a huge day in my career as I was awarded my first (and hopefully not the last) Microsoft Most Valuable Professional award under the category Visual Studio and Development Technologies. It was such a  Indescribable honor, and i have to give a shout out here to the Microsoft community for their support. There have been so many great mentors/supporters in my career over the past 6  years.Thank you  MVP Community Program Manager, my friends, colleagues, my company,followers and supporters for helping me to get my Microsoft  MVP Award for this year.

I hope this marks only the beginning of this new phase of my professional life and I feel so very lucky to be among the 6 technology leaders under the same category in Sri Lanka. Microsoft has always been a great supporter of the community, and a real partner in our ongoing efforts. I will make sure to work extra hard to give back (even more) to the community and I will be more glad to do it every day! Thank you Microsoft!Thank you to the MVPs who welcomed me and others have helped me throughout the years!

Visual Studio 2017 has landed!

It has been an amazing journey for Microsoft Visual studio , Recently marking 20 years of software development tool in the industry. Tech giant Microsoft has introduced the discharge of Visual Studio 2017. Users can obtain visual Studio 2017 by visiting https://www.visualstudio.com/.

Every Visual studio fan would have been excited about the release of Visual Studio 2017. Let's see what Visual Studio 2017 offers us ahead of the previous versions.

In one sentence, The builders can use Visible Studio 2017 to create purposes for Android, iOS, Home windows, internet, and cloud. “Code fast, debug and diagnose with ease, test often, and release with confidence".

Productiveness and efficiency , Developers life made easy:

Working with your team with one repository has never been easier. Now we can use the new 'Open Any Folder' feature to immediately open and work with virtually any code file without a formal project or solution around it.

Codebase Navigation:
Visual Studio 2017 refreshes the navigation experience with the following features,

Go To Implementation (Ctrl+F12) – navigate from any base type or member to its various implementations.

Go To All (Ctrl+T or Ctrl+,) – navigate directly to any file/type/member/symbol declaration. You can use the icons along the top of the feature to filter your result list or use the query syntax (e.g., “f searchTerm” for files, “t searchTerm” for types, etc.).

Find All References (Shift+F12) – now with syntax colorization, Find All Reference results can be custom grouped by a combination of project, definition, and path. You can also “lock” results so that you can continue to find other references without losing your original results.

Indent Guides ­– dotted, gray vertical lines act as landmarks in code to provide context within your frame of view. You may recognize these from the popular Productivity Power Tools.

With Visual studio 2017 there has been fre tweaks and additions to make the common
tasks more productively

IntelliSense – User can filter necessary completion list by category by clicking on the icons in the tray or by hovering over them to learn the keyboard shortcut.

Refactorings – use ‘Ctrl+.’ to access all the refactorings and quick actions we’ve added in VS.

Add using/Imports for types in reference assemblies/NuGet packages

Code Suggestions – code suggestions lee the user hint best practicess.

Mobile Support:
Mobile developers favourties both Xamarin and the amazing Visual Studio Tools for Apache Cordova are included in this 2017 release.  Xamarin integration in Visual Studio 2017 is a huge plus.

Testing and Debugging:

Visual Studio 2017 gives the developers debugging experience to identify the source of an issue faster with the following things,

The new Exception Helper

Run To Click

XAML Edit and Continue

Reattach To Process

Open for everyone:

Last but not the least, there is a FREE community version that everyone can try. Also
if you get  60 days of Xamarin University free if you download before 14 March 2017.

Here's a quick rundown of all the features that have arrived on the Visual Studio 2017:

Better startup and load time
Modified navigation with new features
Visual C++
Extended support for C# 7.0 and Visual Basic
Support for F# 4.1 language
Live Unit Testing
Introduction of Git features
Enhanced Visual Studio Feedback Workflow
Inclusion of .NET Core and ASP.NET Core libraries
Xamarin 4.3 support
NuGet support
Azure SDK for .NET
Office Developer Tools for Visual Studio
Developer Command Prompt
Installation Nickname, and other IDE improvements

So, what you are waiting for? Start to download Visual Studio 2017 and check out what's new? You will feel glad  as how i am. Cheers!

Use Moment.js with angular2 application

Recently i was developing an application in angular2 where i had to use a calendar which shows the results for this month, this week and this weekend. I was finding a solution in pure javascript but it was time consuming. I decided to go on with moment.js , this is how i have embedded moment with angular2 application.

Step 1 : npm install moment --save

Step 2 : In your systemjs.config.js file's map array add:

'moment': 'node_modules/moment'

to packages array add:

'moment': { defaultExtension: 'js' }

Step 3 : In your component.ts use: import * as moment from 'moment/moment';

and that's it. Now you should be able to use moment with your application.

Example:

public setDate(term: string) {
    var status: string;
    status = term;
    switch (status) {
      case "today":
        this.fromDate = moment().toDate();
        break;
      case "tomorrow":
        this.fromDate =  moment(new Date()).add(1,'days').toDate();
        break;
      case "weekend":
        this.fromDate = moment().startOf('week').add('days', 6).toDate();;
        this.toDate = moment().startOf('week').add('days', 7).toDate();
        break;
      case "thisweek":
        this.fromDate = moment().startOf('week').toDate();;
        this.toDate = moment().startOf('week').add('days', 7).toDate();
        break;
      case "nextweek":
        this.fromDate = moment().startOf('week').add('days', 7).toDate();
        this.toDate = moment().startOf('week').add('days', 14).toDate();
        break;
      case "thismonth":
        var date = new Date(), y = date.getFullYear(), m = date.getMonth();
        var firstDay = new Date(y, m, 1);
        var lastDay = new Date(y, m + 1, 0);
        this.fromDate = moment(firstDay).toDate();
        this.toDate = moment(lastDay).toDate();
        break;
    }

AngularJS directive to allow only specific numbers in input

I came across this question on stackoverflow to allow the user to type only specific numbers such as 3,6,9,12 and so on. You can use the following directive which checks for the key and allows as input.

Directive Code

 angular.module('demo').directive('restrictTo', function() {  
   return {  
     restrict: 'A',  
     link: function (scope, element, attrs) {  
       var include = /3|6|9|12/;  
       element[0].addEventListener('keydown', function(event) {  
         if (!include.test(event.key)) {  
           event.preventDefault();  
         }  
       });  
     }  
   }  
 });  

Demo:

https://plnkr.co/edit/oogjTylyl2MTS91nFyxk?p=preview

Also we can use the ng-pattern as follows,

 input name="numberField" type="number" data-ng-model="model.number" data-ng-pattern="/^(3|6|9|12|15)$/"/>  

Shift from Angular1 to Angular2 if you are an Angular 1.x fan

I am a big fan of AngularJS over the years and involved in developing enterprise applications using Angular1. To all the angular1.x developers out there, am going to write about my experience on migrating from Angular 1.x to Angular 2.

Let's find out the differences ,

(i) To those who think Angular2 is the updated version of Angular1, No it is not . Only the names are same,  Angular 2 is completely rewritten.

(ii) Angular1 is using javascript whereas Angular 2 is using Typescript which is super set of javascript

(iii) Most of us are familiar with the $scope in Angular1, one core concept was $scope, and you the saddest part is we don't find $scope in angular 2. Angular 2 use  zone.js to detect changes.

(iv) If you are a mobile developer Angular1.x does not provide much, where Angular 2 is mobile oriented.

(v) Angular 1.x use controllers to handle the logic part, which are gone. And  controllers are replaced with “Components” in Angular 2.

 ////Angular 1.x using Controller and $scope.........  

 var myApp = angular   
  .module("myModule", [])  
var prods = { name: "Prod1", quantity: 1 };  
.controller("productController", function($scope) {  
  $scope.products = prods;  
});  

 ///Angular 2 Components using TypeScript........  

 import { Component } from ‘angular2/core’;  
template: `{{prods.name}}`  
@Component({  
  selector: ‘prodsdata’,  
 })  
prods = { name: ‘Prod1’, quantity: 1 };  
export class ProductComponent {  
}  

(vi) One of the favourite directive for generating elements was ng-repeat with Angular 1.x

ng-repeat is replaced with *ngFor.

 ///Angular 1.x structural directives:........  

 <ul>  
{{item.name}}  
<li ng-repeat="item in items">  
///Angular 2 structural directives:.............  
</li>  
 </ul>  
 <ul>  
{{item.name}}  
<li *ngFor="#item of items">  
       </li>  
</ul>  

(vii) Declaring the local variables also changed with angular2  using hash(#) prefix.

(viii) Even though most of the concepts remains the same Two-way data binding: ng-model replaced with [(ngModel)] in angular 2.

(ix) Concept of bootstraping has changed too.Angular 1.x has 2 ways to bootstrap angular. One using ng-appattribute and other via code. In Angular 2, The only way to bootstrap angular is via code.

 import { bootstrap } from 'angular2/platform/browser';  
 import { ProductComponent } from './product.component';  
 bootstrap(ProductComponent);  

(x) Apart from all the above, main concepts such as ways of Routing and Depdency injects has been changed drastically with angular2.

In Angular 1.x, we use $routeProvider.when() to configuring routing. Where in Angular 2, @RouteConfig{(...}) is used. ng-view present in Angular 1.x is replaced with

One of the advantages of Angular1 Dependency Injection. In angular 2 everything is ‘class’ , so DI is achieved via constructors.

To begin with Angular 1.x you should be well versed with java script. Angular 1.x is simpler and easy to learn/coding based on Javascript, whereas Angular 2 just got released LIVE version and it is easy for Java developers to grasp the concepts of Angular 2.To begin with Angular 2 first start with the basic concepts of AngularJS to understand things in Angular 2 better. Happy Learning!

Look Back 2016 and Happy new year 2017

Year 2016 turned out to be awesome for me! A very slow start of the year with lot of challenges somehow accelerated into very convenient series of events.

Top 3rd user in Sri lanka on Stackoverflow:

I’m an addict about Stack Overflow for an year now. Before I start my work at office,or before i goto bed,or on a break,during lunch, Stack Overflow comes to my mind. I have few reasons because,

Willigness to learn:
Learning never stops, for sure. Every day, a new way to solve a problem coming out and Stack Overflow is a great way to be informed about them.
Willingess to teach:
It also increase your “writing” ability and teaching you better about the information that you think you already know.
Reputation and moderation:
Stack Overflow's model has made answering interesting with reputation, badges, privileges, leagues and stuff. And the community is too good. The people I know from Stack Overflow, are real good and are very friendly.

All the above reasons made me to be an addict on stackoverflow and made me to the top 3 users in srilanka with the reputation over 30k.

Became a lead and product owner
One of the life time achievement during the year was becoming an product owner and a tech lead. I got an opportunity to build a product of my own and leading a team of 10 members, and the things i learnt were countless. Working on a distributed team has many challenges but it's a very rewarding experience.

Got married to the person i truly loved
It feels amazing when you get married to the same person you loved for 10 years. But  it didn't come without some degree of effort, empathy, compromise, and sacrifice. Now, it's nice when the love and sacrifice comes easy, because you're so enamored and amazed by the person you are with, falling in love. It takes little effort. But the real rewards come from fighting through the tough times.  It's actively building something together, something you can be proud of, and want to protect. That happened to me during the year 2016.


Got National level award for the product
There is a top-secret recipe for success. Keep this secret mantra: "Work Hard".Another best thing that happened to me during 2016 was getting the merit award from NBQSA. It feels great when your hard work has been paid off. Later, the appreciation from the company and the CEO was one of the highlights of the year.

Finally, I could write a book on the year 2016 . The most of the good things had happen to me.Something I have prayed about all my adult life . I feel am so blessed and the search is over  for the year 2016.Now, the new year 2017 has arrived. Wishing all of you a very happy and prosperous New Year 2017. May this year bring joy, happiness and peace to all of you.All excited and looking forward to another challenging year of good work, positive vibes and exclusives