SPUnite17 TypeScript for SharePoint Developers

ElioStruyfWaldek MastykarzOctober26th,2017

TypeScriptforSharePointDevelopers

WhatisTypeScript?

It’sastrongly-typedsupersetofJavaScript

BenefitsofusingTypeScript

• Allowsforlarge-scaleJavaScriptapplications

• FollowsECMAScriptfutureproposal

• Supportsplain-oldJavaScript• NotexcludinganyJavaScriptfeature

• Improvedconsistency

• IDEsupport(e.g.Intellisense)

• Compile-timetypechecking

BenefitsofusingTypeScript

Hey,showussomecode!

HowtouseTypeScriptinSharePointprojects

Wheretouseit?

• SharePointFramework

• JSLink

• Displaytemplates• CEWP/SEWP

• Customactions

• SinglePageApplication

• Add-ins

Prerequisites

VSCode• Node.js• npm• TypeScriptcompiler

VisualStudio• TypeScriptadd-inforVS• NuGet• MSBuild targetsconfiguration

Whentousewhat?

VSCode• SharePointFramework• JSLink• Displaytemplates• CEWP/SEWP• Customactions• SinglePageApplication

VisualStudio• SharePointFramework• Add-ins

UsingTypeScriptinVSCode

- Install:npm install-gtypescript- CreateaTSfile- Run:tsc index.ts --targetES5- UsetheJSfile

Stepstostartwriting

Tip:useatsconfig.jsonfiletosimplifythings

But,howdoyougetintellisense?

Bydeclaration/definitionfiles:*.d.ts

npm install@types/<module>--save-dev

DisplayTemplates

Demo

UsingTypeScriptinVisualStudio

But,howdoyougetintellisense?

UseNuGet toinstalldefinitions

Add-inDemo

Questions?