Skip to main content

Posts

Showing posts with the label TypeScript

Strongly typed SingalR on server and client end through TypeScript.

SignalR is a very flexible framework to create bidirectional communication between client and server. The general process that is followed won't allow to have strongly typed calls on the server and also in client code. We will look into how to make strongly typed calls on the server through interface and client end through TypeScript. SignalR - making strong type on server side code Since client-side methods are very dynamic in nature, so calling those from server side behaves similarly to allow any calls. SignalR Hubs are derived from Microsoft.AspNet.SignalR.Hub class, there is also a generic version available to follow typed items. Ex: The interface is the replication of possible calls that would be received on the client end and calling of client-side methods on server code. /// <summary> /// Client(JS) side chatting interface callbacks. /// </summary> public interface IChatHub { /// <summary> /// Gets the online users...

Strong typed MVC routing on TypeScript/JavaScript

Very often we mess up with routing by giving path which does not exist due to various reason like spelling mistake, name confusions etc. for forming correct URLs . This happens on both server side codes and client side code. There are few strong typed routing provider library present for server side but none is present on the client side. We will look into creating a classes and function to set up our routing paths which will help us to give correct URL based on MVC routing. The idea is to create T4 template file which will be generating client side codes based on MVC routing. I have tried to keep it simple in this version which reads up MVC controllers and public function. The end result looks like this, which is TypeScript code. Makes it pretty simple to use these classes directly without worrying about correct URLs. module Routing { export declare var DomainName: string; export function GetDomainName(): string { return (DomainName != undefined && ...

Basic OOPS concept with TypeScript

Some time back I had written article on Introduction of TypeScript . We already know that OOPS concept can be used on JavaScript, but with TypeScript we can achieve in much simpler way. In this particular article we will check interaction of object in different way to handle HTML interaction situations in cleaner way with the help of objects and functions. We will check out by creating TS interface and passing it to some other function which will change some of the object properties and same can be communicated back to the source. I am trying to keep things simple only by using simple approach interface ICar { Model: string Speed: number; SpeedChange: (speed:number) => void; } Let's consume the above to other class which can be initialized be calling constructor. It is having simple method which is defining the SpeedChange body. class Main { constructor(private option: ICar) { option.SpeedChange = (speed) => { console.lo...

TypeScript introduction

In newer web application development we are more and more diving into client side scripts. Slowly AJAX calls are completely or at least mostly replacing regular post backs for rich user experience. Somewhere we are dealing HTMLs returns or just interacting with model but with time we are ending up writing lot of JavaScript on pages or dedicated JavaScript files. After starting project, in short of span of time we are ending up with lot of scripts. Writing those script itself is problematic process as we do not get any type safety and on execution only we can know we have missed typed or added some variable in place of some other type. Mostly through comments only we are understanding the code association with pages unless we put JavaScript in respective pages or with naming JS according to respective page names. I know we can use some OOPS concept or JS framework like Backbone, Knockout etc. to manage things through MVC or MVVM approach. Those are really good way to handle JavaScr...