Typescript - waow!
-
I've been using Typescript over the past couple of days to build a new AngularJS app, and waow! It is amazing! If you work a lot with Javascript, and you haven't had a chance to play with Typescript, please check it out. That is all!
-
I've been curious about Typescript, but have some colleagues that are against it based on what they know. Can you elaborate more on the "waow" factors, and arguments that you might make to someone who is skeptical or outright against using it?
Sure. Well, first of all I am working with a .net back-end, so doing all of my coding in Visual Studio (2015 RC). Visual Studio 2015 + ReSharper + Web Essentials which provides a really nice environment for working with Typescript. For my API, server side, I am using ServiceStack. ServiceStack have created a Visual Studio plugin to generate a DTO in Typescript based on your API. You write your API, run this program, and you have an interface for every Request and Response object in your API. There is a Typescript project called DefinitelyTyped. It provides type definitions for all of the frameworks I am using, which for this project are: - AngularJS - Angular UI Router - Angular UI Directives for Bootstrap - AngularJS Toastr This means that you can write your client side code in Typescript, and everything is strongly typed. Here is an AngularJS service I wrote earlier today in Typescript:
import CreateAdjustmentRequest = JobManager.Model.CreateAdjustmentRequest;
import AdjustmentResponse = JobManager.Model.AdjustmentResponse;
import HttpPromise = angular.IHttpPromise;
import GetAdjustmentRequest = JobManager.Model.GetAdjustmentRequest;
import GetAdjustmentsRequest = JobManager.Model.GetAdjustmentsRequest;
import UpdateAdjustmentRequest = JobManager.Model.UpdateAdjustmentRequest;
import DeleteAdjustmentRequest = JobManager.Model.DeleteAdjustmentRequest;export class AdjustmentService {
httpService: angular.IHttpService; constructor(httpService: angular.IHttpService) { this.httpService = httpService; } getAdjustment(request: GetAdjustmentRequest):HttpPromise<AdjustmentResponse> { return this.httpService.get('/adjustments/' + request.Id); } getAdjustments(request: GetAdjustmentsRequest): HttpPromise<AdjustmentResponse\[\]> { return this.httpService.get('/adjustments/all/' + request.JobId); } createAdjustment(request: CreateAdjustmentRequest): HttpPromise<AdjustmentResponse> { return this.httpService.post('/adjustments/create', request); } updateAdjustment(request: UpdateAdjustmentRequest): HttpPromise<AdjustmentResponse> { return this.httpService.post('/adjustments/' + request.Id, request); } deleteAdjustment(request: DeleteAdjustmentRequest): HttpPromise<boolean> { return this.httpService.delete('/adjustments/' + request.Id); }
}
-
Sure. Well, first of all I am working with a .net back-end, so doing all of my coding in Visual Studio (2015 RC). Visual Studio 2015 + ReSharper + Web Essentials which provides a really nice environment for working with Typescript. For my API, server side, I am using ServiceStack. ServiceStack have created a Visual Studio plugin to generate a DTO in Typescript based on your API. You write your API, run this program, and you have an interface for every Request and Response object in your API. There is a Typescript project called DefinitelyTyped. It provides type definitions for all of the frameworks I am using, which for this project are: - AngularJS - Angular UI Router - Angular UI Directives for Bootstrap - AngularJS Toastr This means that you can write your client side code in Typescript, and everything is strongly typed. Here is an AngularJS service I wrote earlier today in Typescript:
import CreateAdjustmentRequest = JobManager.Model.CreateAdjustmentRequest;
import AdjustmentResponse = JobManager.Model.AdjustmentResponse;
import HttpPromise = angular.IHttpPromise;
import GetAdjustmentRequest = JobManager.Model.GetAdjustmentRequest;
import GetAdjustmentsRequest = JobManager.Model.GetAdjustmentsRequest;
import UpdateAdjustmentRequest = JobManager.Model.UpdateAdjustmentRequest;
import DeleteAdjustmentRequest = JobManager.Model.DeleteAdjustmentRequest;export class AdjustmentService {
httpService: angular.IHttpService; constructor(httpService: angular.IHttpService) { this.httpService = httpService; } getAdjustment(request: GetAdjustmentRequest):HttpPromise<AdjustmentResponse> { return this.httpService.get('/adjustments/' + request.Id); } getAdjustments(request: GetAdjustmentsRequest): HttpPromise<AdjustmentResponse\[\]> { return this.httpService.get('/adjustments/all/' + request.JobId); } createAdjustment(request: CreateAdjustmentRequest): HttpPromise<AdjustmentResponse> { return this.httpService.post('/adjustments/create', request); } updateAdjustment(request: UpdateAdjustmentRequest): HttpPromise<AdjustmentResponse> { return this.httpService.post('/adjustments/' + request.Id, request); } deleteAdjustment(request: DeleteAdjustmentRequest): HttpPromise<boolean> { return this.httpService.delete('/adjustments/' + request.Id); }
}
:thumbsup:
#SupportHeForShe
If your actions inspire others to dream more, learn more, do more and become more, you are a leader.-John Q. Adams You must accept 1 of 2 basic premises: Either we are alone in the universe or we are not alone. Either way, the implications are staggering!-Wernher von Braun Only 2 things are infinite, the universe and human stupidity, and I'm not sure about the former.-Albert Einstein
-
Sure. Well, first of all I am working with a .net back-end, so doing all of my coding in Visual Studio (2015 RC). Visual Studio 2015 + ReSharper + Web Essentials which provides a really nice environment for working with Typescript. For my API, server side, I am using ServiceStack. ServiceStack have created a Visual Studio plugin to generate a DTO in Typescript based on your API. You write your API, run this program, and you have an interface for every Request and Response object in your API. There is a Typescript project called DefinitelyTyped. It provides type definitions for all of the frameworks I am using, which for this project are: - AngularJS - Angular UI Router - Angular UI Directives for Bootstrap - AngularJS Toastr This means that you can write your client side code in Typescript, and everything is strongly typed. Here is an AngularJS service I wrote earlier today in Typescript:
import CreateAdjustmentRequest = JobManager.Model.CreateAdjustmentRequest;
import AdjustmentResponse = JobManager.Model.AdjustmentResponse;
import HttpPromise = angular.IHttpPromise;
import GetAdjustmentRequest = JobManager.Model.GetAdjustmentRequest;
import GetAdjustmentsRequest = JobManager.Model.GetAdjustmentsRequest;
import UpdateAdjustmentRequest = JobManager.Model.UpdateAdjustmentRequest;
import DeleteAdjustmentRequest = JobManager.Model.DeleteAdjustmentRequest;export class AdjustmentService {
httpService: angular.IHttpService; constructor(httpService: angular.IHttpService) { this.httpService = httpService; } getAdjustment(request: GetAdjustmentRequest):HttpPromise<AdjustmentResponse> { return this.httpService.get('/adjustments/' + request.Id); } getAdjustments(request: GetAdjustmentsRequest): HttpPromise<AdjustmentResponse\[\]> { return this.httpService.get('/adjustments/all/' + request.JobId); } createAdjustment(request: CreateAdjustmentRequest): HttpPromise<AdjustmentResponse> { return this.httpService.post('/adjustments/create', request); } updateAdjustment(request: UpdateAdjustmentRequest): HttpPromise<AdjustmentResponse> { return this.httpService.post('/adjustments/' + request.Id, request); } deleteAdjustment(request: DeleteAdjustmentRequest): HttpPromise<boolean> { return this.httpService.delete('/adjustments/' + request.Id); }
}
-
Sure. Well, first of all I am working with a .net back-end, so doing all of my coding in Visual Studio (2015 RC). Visual Studio 2015 + ReSharper + Web Essentials which provides a really nice environment for working with Typescript. For my API, server side, I am using ServiceStack. ServiceStack have created a Visual Studio plugin to generate a DTO in Typescript based on your API. You write your API, run this program, and you have an interface for every Request and Response object in your API. There is a Typescript project called DefinitelyTyped. It provides type definitions for all of the frameworks I am using, which for this project are: - AngularJS - Angular UI Router - Angular UI Directives for Bootstrap - AngularJS Toastr This means that you can write your client side code in Typescript, and everything is strongly typed. Here is an AngularJS service I wrote earlier today in Typescript:
import CreateAdjustmentRequest = JobManager.Model.CreateAdjustmentRequest;
import AdjustmentResponse = JobManager.Model.AdjustmentResponse;
import HttpPromise = angular.IHttpPromise;
import GetAdjustmentRequest = JobManager.Model.GetAdjustmentRequest;
import GetAdjustmentsRequest = JobManager.Model.GetAdjustmentsRequest;
import UpdateAdjustmentRequest = JobManager.Model.UpdateAdjustmentRequest;
import DeleteAdjustmentRequest = JobManager.Model.DeleteAdjustmentRequest;export class AdjustmentService {
httpService: angular.IHttpService; constructor(httpService: angular.IHttpService) { this.httpService = httpService; } getAdjustment(request: GetAdjustmentRequest):HttpPromise<AdjustmentResponse> { return this.httpService.get('/adjustments/' + request.Id); } getAdjustments(request: GetAdjustmentsRequest): HttpPromise<AdjustmentResponse\[\]> { return this.httpService.get('/adjustments/all/' + request.JobId); } createAdjustment(request: CreateAdjustmentRequest): HttpPromise<AdjustmentResponse> { return this.httpService.post('/adjustments/create', request); } updateAdjustment(request: UpdateAdjustmentRequest): HttpPromise<AdjustmentResponse> { return this.httpService.post('/adjustments/' + request.Id, request); } deleteAdjustment(request: DeleteAdjustmentRequest): HttpPromise<boolean> { return this.httpService.delete('/adjustments/' + request.Id); }
}
You should expand that into a tip, or even an article. That was good info.
Wrong is evil and must be defeated. - Jeff Ello
-
I've been using Typescript over the past couple of days to build a new AngularJS app, and waow! It is amazing! If you work a lot with Javascript, and you haven't had a chance to play with Typescript, please check it out. That is all!
I've been wanting to look into TypeScript! First check it out, then write a little blog about it and then last, but not least, convince the guys at work :) Looking forward to the day my pure JavaScript days are over ;p
Visit my blog at Sander's bits - Writing the code you need. Or read my articles at my CodeProject profile.
Simplicity is prerequisite for reliability. — Edsger W. Dijkstra
Regards, Sander
-
You should expand that into a tip, or even an article. That was good info.
Wrong is evil and must be defeated. - Jeff Ello
I second this!
What do you get when you cross a joke with a rhetorical question? The metaphorical solid rear-end expulsions have impacted the metaphorical motorized bladed rotating air movement mechanism. Do questions with multiple question marks annoy you???