Showing posts from April, 2017

service designer guide for http status - check this out !!! :)


Angular2 - No http post or get until you call subscribe.

Sometimes rxjs can be so lazy. Nothing happens until you call 'subscribe'.

When you are making a http request get or post, you might find out that there's no outgoing http request. Does the code below looks familiar, well..... you will get it if you call subscribe.  :/ This is a gotcha for many people.

Javascript / Typescript rest and spread operators

To make it easier, rest and spread operator basically helps to merge all your function parameter together. In the past, we use something like

myfunction.apply(null, myAgumentList)

With rest and spread we can easily

function log(...a) {

log(1,2,3,4,5); // outputs [1, 2, 3, 4, 5] array

Notice we're assigning myArguments at the back. 

let myArguments = ['x', 'y', 3]

log(1,2, myArguments); // outputs [1, 2, ['x', 'y', 3]] 2 different array 

log(1,2, ...myArguments); // outputs [1, 2, 'x', 'y', 3] 1 array

Notice we're assigning myArguments at the front. 

log(...myArguments,1,2 ); // outputs [ 'x', 'y', 3, 1, 2] essentially a single array.

Angular2 providers with useClass purpose

Might be wondering what is the purpose the useClass construct as shown here
[{ provide:Logger, useClass:Logger}This provides a way for Angular2 to find and use the proper class / providers. Think of it as a key / value matching approach. Some people uses mock logger service by specifying useClass : BetterLogger.

Difference between NativeElement and DebugElement in Angular2 test

What is the difference between native element and debugElement in Auglar2 test?

Short answer :-

DebugElement contains method / function to query or test an Angular2 component html elements

NativeElement is the html itself.

Have a look at the diagram below. The first is debug element while the last item is native element itself.


Wanting to find out more about ESNext ....check this link out

typescript async and await

Typescript has it now... async and await.

SqlDependency not firing, you're not the only ones. :)

8 years old, i tried using SqlDependency and it failed badly. Today i have another go at it for some weird reasons.

Anyways, if you're having problem with SqlDependency, you're not alone. Try to use this solution instead.  The only thing I don't like about it is, change response is given in XML.

Try SqlDependencyEx instead.

Typescript allow initializer to create and instantiate an instance

The keyword partial transform fields into optional.

So we're able to initialize our object instance this way.

Pretty cool eh..

if your ngFor or ngIf not working - You might not have Common Module imported

import { CommonModule } from '@angular/common';

@NgModule({   imports: [     RouterModule.forRoot(appRoutes), HttpModule, ReactiveFormsModule, CommonModule   ],   declarations: [AddPersonComponent, SearchComponent, ListComponent],   providers: [PersonService],   exports: [     RouterModule   ] })

angular2 call service via OnNgInit

If you need to call a service, please do it via OnNgInit instead of using constructor. If you doing unit testing, your code might not work.
As shown in the code below :

classSomeServiceimplementsOnInit { constructor(privatehttp:Http) { } ngOnInit() { // this should hit mocked backendthis.http.get("dummmy url").subscribe(v=> { console.log('constructor subscribe hit'); }); } someMethod() { // this should hit mocked backendthis.http.get("anotherurl").subscribe(v=> { console.log('some method called subscribe hit'); }); } }

angularjs2 common stuff that i always forgets


   providers : []  // providers
providers array provide a dependency injection layer between ngmodule and other child components. A child component will typically traverse to the parent to look for a provider - a singleton service or in plain language a class with a tasks like news feed service or http service.

if you specify providers in a child component, this service will be instantiated as a separate instance.


This module provides services for running and opening browser. What type of services?
Always import BrowerModule in the root AppModule.ts.

@Input and @Output

Passing data using @Input  (Property passing with [] )  and @Output (event passing with ()  )

Custom Directive 

You essentially can still create custom directive in Angular2.


@Pipe - custom, stateless and stateful pipe

c# recursive Fibonacci implementation. Not a very efficient solution.

javascript function * declaration

Did you know that if you defined your javasscript function  like function *, you're basically creating a iterator function.

var myIterable ={} myIterable[Symbol.iterator]=function*(){ // i want a iterator here! :)yield1;yield2;yield3;};[...myIterable]// [1, 2, 3]

Awesome site for REST Api designs .... core security

Enable SSL in ASP.Net Core 

To enable SSL just add [RequireHttps] attribute on top of your controller or use the following code to secure your entire site with enableSSL.

    if (!_env.IsDevelopment())
                services.AddMvc(options =>

Reason we are defecting if environment is development is due to IISExpress who uses non standard https port for development purposes.


According to OWASP, Unvalidated Redirects and Forwards are one of the most common attacks n real life.

With just a single line of code we're able to stop redirection (must always appear after UseStaticFiles. When we're creating an API, we don't redirect  that often. By having this UseRedictValidation, we're able to monitor http redirection and throws an error if it arises.

First off, you need the following nuget packages :-

Install-Package NWebsec.AspNetCo…

dotnet core 1.0.1 upgrading from old xproj files

Did you know that to upgrade xproj to csproj in dotnet core, all you need to do is run

dotnet migrate

However, you need to use vs2017 to work with this new project.

I tried remove and added the new project using vs2015 but its throwing ms build errors.

vs2017 forcing migration -

If you ever wanted to force vs2017 to migrate exising .net core project, all you gotta do is, right click on the project and choose "reload project". It will automatically migrate all your .xproj to .csproj. Please install your sdk tho.

So the bottom line is,

1. no more xproj,  there is only csproj.

2. global.json becomes { "projects" : ["src", "test"] }