TypeScript For SharePoint 2013

Posted: July 20, 2014 in SharePoint2013

Introduction

SharePoint 2013 is all about JavaScript. JavaScript CSOM is greatly improved and enhanced, SharePoint Apps are essentially JavaScript-based, Client-Side Rendering is now the main rendering technique for all SharePoint lists (well, except for Survey and Calendar lists), JSGrid is used for list edit mode, and many many other things.

Yes, JavaScript won, so now we, SharePoint developers, need to deal with it much more often than we used to.

Script#

People noticed drawbacks of JS long ago. To smooth them out, projects like Script# and GWT were created. The idea is basically to compile a normal language like C# into JavaScript code; this is exactly what Script# does.

And it works well enough! Script# has been used by Microsoft itself for some big projects, like Office Web Apps, Bing Maps, and by pure happenstance, for SharePoint JavaScript Object Model (JSOM)! Can you believe that? But yes, it’s true, the majority of js files you will find in hive 15 were generated by Script#.

Yes, Script# works very well, unless you must use some existing JS libraries. In this case, you need definitions that would contain information about types of variables, parameters, methods, and so on. Unfortunately, no Script# definitions for SharePoint is available. And creating them by hand is a very tedious work, trust me. But wait, if SharePoint JSOM is written in Script# then something.

TypeScript

Not so long ago, another project has been started by Microsoft, TypeScript. Unlike Script# and GWT that use existing languages (C# and Java) as the source, TypeScript is a new language. But the thing is, TypeScript is a superset of JavaScript! So any existing JS can be compile into TypeScript without errors (at least this is the theory, in practice I know there are some exceptions to this rule).

Support of TypeScript is broad, the community is passionate and TypeScript definitions for many and many JS libraries have already been created. The largest collection of them (the DefinitelyTyped project) includes definitions for 130 libraries!

The TypeScript compiler is opensource and is written in JavaScript, and this means that we can have TypeScript intellisense right in the browser.

In sum, TypeScript is definitely promising. And even better, now you can use it with SharePoint!

Create high-quality strongly-typed and even half-documented definitions that cover a great deal of the SharePoint JavaScript API (and we plan to add even more definitions in the next releases).

Currently, we have the following things covered:

  1. Client-side Object Model (CSOM) core classes
    • SP namespace (ready)
    • SP.WebParts (ready)
    • SP.SOD (ready)
  2. Social object library
    • SP.Sharing (ready)
    • SP.UserProfiles (ready)
    • SP.Social (ready)
  3. SharePoint Client-side Rendering (CSR)
    • SPClientTemplates (ready)
  4. Workflows
    • SP.Workflow (ready)
    • SP.WorkflowServices (ready)
  5. SharePoint UI elements:
    • SP.UI.Notify (ready)
    • SP.UI.Status (ready)
    • SP.UI.Menu (ready)
    • SP.UI.ModalDialog (ready)
    • SP.UI.ApplicationPages: some useful stuff here nobody knows about, for example ClientPeoplePickerWebServiceInterface! (ready)
    • CalloutManager (ready)
  6. SharePoint Search
    • Microsoft.SharePoint.Client.Search (ready)
  7. Business Connectivity Services
    • SP.BusinessData (ready)
  8. SharePoint Managed Metadata
    • SP.Taxonomy (ready)

Basically this means that now you and we, all of us, can use TypeScript when working with SharePoint JavaScript, and benefit from strong typing and intellisense.

The project also includes many examples written in TypeScript and a couple of extensions. Please, visit the project site on CodePlex to determine more:

SharePoint 2013 TypeScript Definitions

TypeScript Important Links

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s