How do manage environment based configuration node js/typescript

Any application needs configuration settings, the programming language like ASP.NET we typically use Web.config for configuration, for different environment we have separate files like

Web.Production.Config, etc.

In nodejs app I could not find any specific standard for this but there is a multiple option to setup this configurations, below I used .json file for different environment.

Folder Structure.

default.json – this will hold all the base configuration and common to all the environment

<environment>.json – for every environment there will be a separate  .json file, this contain configuration specific to that particular environment, this will override our base default values if same key exist.
Sample: development.json

How its works?
In the index.js we getting  configuration files using require and merging default and respecting environment file then doing export.

process.env.NODE_ENV is environment value, we can set on respective server, for testing I used npm script to set this value in my package.json

Note: I tried with mac system, so setting environment value using “export NODE_ENV=production”, If you trying with windows may be need to change the command slightly like  “SET NODE_ENV=production”.

I used Typescript on the server, so during build copied all my configuration to deployment folder.

Okay, how to access these configuration inside application?

import the config and use wherever needs across the app, below snap  getting mongo db connection value using key “config.db.connection”


sample available on following path:


WordPress SEO Keyword and Description without any Plugin

I don’t like much third party plugins, below I described how to add  SEO basic description and keywords meta tags without any additional plugin load.

  1. Login to WordPress admin and  create new post/page, below snap I am creating new page.                                                                    create-page
  2. In the right top , click screen options button and enable custom fields option. custom-field
  3. Create new custom field description and keywords  for the page then save and publish the page.                                                                     description-keywords
  4. Go to theme  function.php file through ftp or admin theme editor and add below function

that’s it enjoy basic SEO without additional plugin, see below page source code in the browser, our description and keywords meta tags added successfully.


For advance you can extend the same function by adding more tags like below (added for social media).

AtScript in the context of an Angular 2.0

What is AtScript ?

Google revealed AtScript at ngEurope in Pari. This is a superset of Microsoft TypeScript , ES6 and ES5. TypeScript adds types to JavaScript code and AtScript extends this idea further by adding annotations and introspection.

Google team  writing Angular v2 on top of the AtScript syntax

Is it new language?

No, Its not a new language just influenced by TypeScript and Dart. Like how typescript is superset of javascript. Atscript also using similar kind of syntax but it’s a enhancement with what is lacking in previous. so it’s called superset for rest.

What is lacking in existing TypeScript?

Types are analyzed only statically, once you build the source it’s nothing but a java script you cannot check the types thereafter. Example  in run time you are receiving JSON object from the server end you cannot do the type checking, this is the limitation from typescript.

Why AtScript use a runtime type system?

it allows free mixing of existing libraries which don’t have type and new code which can take advantage of types in the run time, it overcomes  typescript limitations. So the type errors can be caught and resolved before pushing to the production and all the assertions can be removed from the production builds.

Who all working  this Concept ?

Below three top people are working together in this concept, adding type system to javascript to making as standard.

       Google AtScript.

       Microsoft TypeScript

       Facebook Flow

When will be AtScript release?

Angular team started working on AtScript over a year,most probably it may come to market 2015 starting.


Microsoft TypeScript and Its Roadmap :

AtScript primer doc :

RealTime Dashboard with ASP.NET Signalr, AngularJS and D3JS

About Signalr :

Asp.NET SignalR is a library for ASP.NET developers to push the content from server to connected clients and vise versa.

Reference Link: ,

About AngularJS :

AngularJS is an opensource web application client side framework, maintained by Google and community.

Reference Link:

About D3js :

D3.js is a javascript library for manipulating document based on data. It helps in bringing data to visualization using HTML,SVG and CSS.

Reference Link:

Okay We can start now. In this article we are going to see how to build real-time dashboard application using above technologies, for sample I took scenario of available waiting calls in the call centre  (contact center) on each department. so this sample real time dashboard will be benefit for contact center manager and supervisor to monitor how many customers are waiting in the queue to get the agent transfer.

Server Side Implementation:

SignalR is an abstraction over some of the transports (WebSoket,Server Sent Event ,Forever Frame,Ajax long polling ). It will also support  fallback. For example if we take WebSocket transpor,it should meet some of the system requirement from both server and client end.

Server end: Windows Server 2012 or Windows 8

Client  end: Html5 supported browser(IE 10+, chrome,etc..)

If any one of the requirement gets failed, obviously websocket will not work. Here  Signalr will do magic, automatically it will look for alternative supported transport.(Forever or Ajax). So developer don’t want to worry  about anything.

To Learn more about SignalR please visit following link In below we are going to see only how these technologies makes our Job easy to build real time solution.

The Server side Hub:

This will push content to clients.

Client Side Hub connection with (angularJS) :

Reference file require in HTML page.

We having  our client connection inside angular JS service because Service are singleton and easy to take control for callback.

Controller will  receive the data from service then pass to $scope variable  to update the user interface.

angular JS is two way binding, once the data updated in the controller, view automatically re-rendered based on updated values.

Inside view we have custom directive to  draw simple bar chat based on myData value. This custom directive we build with the help of D3.JS .

Now again we can go to server end. We have to pull the real time data from  database or some back end system with some specified interval  then push the data to all our subscribed client.

Really running scheduled background work in I will not suggest, Even this example we used official recommended approach  IReggisteredObject with the ASP.NET runtime and hook it up at application start.

For more robust solution even we can host the signalR explicit windows service.

In Application_Start method simply we can start our background thread.

Here we are simply pushing the data to all the connected clients, But real time we can do lot more,  maintain active client, identifying particular user and  pushing to only logged in clients, etc…


Snapshot :



Angular JS – Nested array data and cascading dropdown lists binding

The Requirement is very simple.We have to display data with cascading drop down from the collection.

We have some collection of books. I took a sample of book for initial page mapping.

Nested Angular Drop down

Each row contains dropdowns for books,chapters and titles. By choosing the drop down under book(specify the name of the book), relevant chapter will be loaded. And based on the selection of the chapter, title information will be loaded for that specific book title.


From above example each drop down “on change event”,we are passing the current book object to our method and creating variable dynamically for the selected subsequent item.

You can write any logic inside this method like ajax call to pull out sub drop down values, here we will take from same instance.

Plunker Demo:

ASP.NET MVC Developer Friendly CMS

BetterCMS is one of the friendly and creative MVC developer.NET. It is an Open Source CMS. We can bring the entire CMS feature inside the website just using one line  command in visual studio.

Install BetterCMS inside Visual studio using NuGet console:



More Detail Doc:

Demo Site:

Object-Oriented Programming Basic

        This article is for people who want to learn basic before entering into programming life or who want to learn the foundation for programming. Any language  can be chosen only if you are strong in the concept before writing your code and automatically your code will be more powerful and reusable. Below are my examples which I  used for C# Language.

What is Oops?

Oops is a paradigm that is used while designing the application and computer programs. C# also provides full support for , Oops.

Basic Oops Concepts:

    • Classes and Object
    • Data Abstraction and Encapsulation
    • Inheritance
    • Polymorphism

Classes and Object


Class is a type of object or you can call it as a blueprint for the object instance, as how blueprint is created before building the house.




Objects are usable instance of classes. It’s a building made from the blueprint called class. Its not logical rather it’s a physical existence that you can enter inside home and use all the properties that belong to it.



myHome is the instance of class type DreamHome. So myHome is built based on DreamHome blueprint.


class is a logical and object is a physical existence.

Member of Class:

  • Properties and Fields (To describe class data)
  • Methods(To describe class behavior)
  • Events(To Provide communication b/w different class and objects)

Data Abstraction and Encapsulation

Data Abstraction:

It’s a technique that is designed to separate interface and  implementation, i.e, providing essential information to outside world and hiding the background implementations.


       In the above picture, smart TV  is controlled by remote, so remote is the interface for remote user and TV. Here actual implementation is hidden from user and thereby user takes control of TV with limited facility that is available on remote, but user can’t control TV’s hardware which is present inside TV.

Encapsulation :

It’s a group of related properties, methods and other members that acts as a single unit or object.


Interface Example: 

It’s a communication point to the outside world.


In the above example we have interface called IGuest, that was implemented in Home class. When guest comes to our home they have only limited access to our home. We will not allow them to access private areas(bed room) and only limited facility is exposed for them. From above example we have more methods but for the guest, they have access  only to CallingBell, OpenMainGate, EnterHall. So guest can’t enter bedroom.


Inheritance enables us to create new classes that can be reusable, extend, and modify the behavior that is defined in the base classes.


In the above example DreamHome class is inherited from the OldHome. So all the properties and members that belong to OldHome are accessible for the DreamHome. For example, we are re-using the fridge that we already used in our old home to our new DreamHome, which directly means that there is no requirement to buy a new one.

Types of Inheritance

  1. Single Inheritance
  2. Multilevel Inheritance
  3. Hierarchical Inheritance
  4. Hybrid Inheritance
  5. Multiple Interface


Polymorphism is a third pillar of object-oriented programming, after encapsulation and inheritance. It gives ability of an object or reference to take many different forms at different instances.It has two category: compile time and run time

Compile Time Polymorphism:

The decision will be made at compile time.


Method overloading:

In the example we have two methods with same name, but the parameter is different so compiler will decide which method has to invoke in the compile time itself based on the input method param.

Run Time Plymorphism:

The decision made at Run time.

In the above example “Watch TV” method will be invoked in run time based on the instance created. If you enter DreamHome you can watch the TV Program in new LED Tv or if you enter Old home you can watch the program in old black and white TV. It’s the same method we implement here. But based on instance the decision will be made at application run time.