- Typescript improves on JavaScript by adding optional static typing, classes, interfaces and other features to address issues like lack of block scope and type safety.
- It compiles to plain JavaScript that runs on any browser or platform, allowing use of type checking without limiting deployment targets.
- Many companies have adopted Typescript for its readability, code navigation, refactoring and ability to scale to large codebases with many developers.
2. ABOUT ME
Amit Bezalel
⢠UFT & SRF System Architect
⢠Wrote: C++, Java, C#, JavaScript, now Typescript
⢠Recently read up on a ton of cloud architecture
⢠Some articles on codeproject and HP Blog
Amit.Bezalel@hpe.com
3. JAVASCRIPT
On May 1995 a Netscape dev created a new programming language
It took him 10 days
It was called Mocha internally
Then LiveScript
And eventually JavaScript
20 years later itâs the hottest language on the planet !
4. JAVASCRIPT IS HERE TO STAY
Good things in JS:
⢠The language of the browser
⢠Widely used for Micro-Services
⢠A Large community
⢠A full stack language (Server + UI)
⢠Very flexible
⢠Asynchronous
Stack
overflow
2016
5. JAVASCRIPT IS HERE TO STAY
Some bad things:
⢠No block scope
⢠Over-flexible function definitions
⢠No interfaces
⢠Typing confusions
⢠Performance pitfalls
⢠The âthisâ variable
⢠Semicolon auto completion
6. TS IMPROVES JS
TS Solutions:
⢠[â] No block scope
⢠[â] Over-flexible function definitions
⢠[â] No interfaces
⢠[â] Typing confusions
⢠[â] Performance pitfalls
⢠[â] The âthisâ variable
⢠[x] Semicolon auto completion
7. WHY NOT TYPESCRIPT?
Common complaints I heard:
⢠Adds a compilation step
⢠you will have a build process anyway
⢠Relies on Microsoft
⢠MS proved itself with C#
⢠Doesnât prevent JS pitfalls
⢠Many of them are prevented (as we saw)
⢠The price of keeping JS flexibility
⢠The illusion of safety, but still JS
⢠IMHO it is actually more safe given that you use types
⢠OO constructs may be abused
⢠This also goes for Java / C#
8. ITâS TRENDY
⢠TS surpasses all other
JS pre-compilers
⢠TS also passed SASS
which is widely used.
⢠Fast growing trend line,
indicating exponential
growth in 2016
10. SOME QUOTES
There are Many blogs about TS, here are some quotes:
⢠Angular 2.0: âtypescript makes code easier to read and
understandâ
⢠Telerik: âTypeScript may be the best of the many JavaScript front
endsâ
(even though he didnât want to use it at the end)
⢠Wix: âTypeScript generates JavaScript code that is easy to read
and debugâ
⢠Asana: âstatic typing allows us to skip checks that would
otherwise be required at runtimeâ
⢠Microsoft:
⢠VS Code â An IDE Written in Typescript for Typescript
⢠The TS compiler itself is also written in TS (wikipedia)
11.
12. WHAT IS ADDED TO JS?
⢠Features:
⢠An optional type system
⢠ES6, ES7 features
⢠Adds missing OO features
⢠Compilation
⢠Compile to any ES flavor (ES3 / ES5 / ES6)
⢠Fast compilation
⢠IDE Support:
⢠Good Code completion (Intellisence)
⢠Wide adoption in modern IDEs
⢠Better navigation and readability (jump to def, refactoring)
13. THE TS PROJECT
⢠Opensource (github)
⢠Apache 2.0 license
⢠https://github.com/Microsoft/TypeScript
⢠TS is Written in TS:
⢠https://github.com/Microsoft/TypeScript/tree/master/src/compiler
⢠Live community (bugs / suggesstions / pull requests)
⢠https://visualstudio.uservoice.com/forums/293070-visual-studio-code
17. TYPESCRIPT IDE SUPPORT
TS Code
completio
n
TS
Debugger
IDE
Performan
ce
Cross
platfor
m
Maturity Release &
activity
Needs
proj /
sln files
VS Code Excellent Good Excellent Yes v1.0 Monthly no
IntelliJ
14+
Webstor
m
Ok Good Ok (high
RAM)
Yes Mature Every
Several
months
no
Visual
studio
2013+
Good Good Bad (For
large TS
projects)
No Mature 3 months yes
Eclipse
TypEcs
Ok Ok Ok Yes v1.0 no recent
activity, 6
months
no
18. WHAT IS VSCODE?
⢠A new fully featured IDE from Microsoft
⢠Very lightweight
⢠MIT licensed opensource in GitHub
⢠Cross platform (mac/ linux /windows)
⢠Written over electron (V8 desktop platform)
⢠Everything is code (including project settings)
⢠Released v1.0 five days ago!
⢠A new release each month
⢠Huge amount of features in each release
⢠500,000 users and counting
Releases blog:
https://code.visualstudio.com/blogs
19. COMMONJS & TYPINGS
⢠Importing npm modules
⢠Using import / var with require
⢠Getting type information for npms
⢠d.ts files
⢠Definitely typed git repo (ambient)
⢠Old reference comments (tsd) vs. new (typings) method
⢠Keeping types across files / modules
⢠Auto generated typing files (d.ts)
⢠Installing types from original repo
⢠The typings install commandline
20.
21. OUR STORY
⢠Started out with Pure NodeJS 2~4
⢠Added some more people ~6
⢠JS Code is hard to understandâŚ
⢠Moved to TS
⢠Now we are ~18 and growing!
⢠Using typescript in UI side as well as backend
⢠20+ micro services in our architecture
⢠Using both intelliJ 15 & VSCode (devâs choice)
22. OUR CONCLUSIONS
Our Cons:
- Smallish learning curve
- Mixing JS / TS possible, problematic inheritance
Our Pros:
+ Readability and code navigation increased
+ Refactoring & Code completion
+ Types are important
+ Classes and interfaces give structure
+ TS Scales, new team members benefit
23. MICRO SERVICES
⢠Decoupled, services
⢠Single responsibility
⢠Independent technology stacks
⢠Communication via Rest / WS APIs
⢠Swagger definitions
Typescript benefits:
⢠Swagger definitions can be generated from classes (including
types)
⢠Function signature checking adds interface enforcement
24. TS WITH NODEJS
Benefits:
⢠Rest body definitions can be generated from object definitions
⢠Code completion helps keep the correct structures
⢠Types are enforced for incoming data
Stack
overflow
2016
25. WEB UI & TYPESCRIPT
⢠Angular 2.0 is written in TypeScript
⢠You get up to date definitions
⢠Angular tools are ready for TS usage
⢠Typescript debugging in browser (via mapping & IDE extension)
⢠A short learning curve (close to JS)
26. WHATâS NEXT
The future of typescript (v2.0):
⢠ReadOnly & abstract Properties
⢠Async / await support for ES5/ES3 generation
⢠Private/protected constructors
⢠Type definition for âthisâ
⢠Runtime Type checking for properties
⢠Much moreâŚ
Links:
⢠https://github.com/Microsoft/TypeScript/wiki/Roadmap
Hinweis der Redaktion
Command line compilation (tsc)
Intellisence demo (Vscode completion)
Typings system + Ambient for JS projects
Code intellisence
JS interoperability, and optionality of types
Debugging in TS
IDE parsing & Compilation Errors
Debugging the *.ts files via mapping