Why I Was Wrong About TypeScript • TJ VanToll • GOTO 2018

[Music] you'll be happy to know that I've been trying this these last few days have been in town for a few days now to sort of learn some of the Danish culture so I've been to this place and I saw this statue and I went to the City Hall that I didn't really fit in very well and I also discovered glug a might consent me tell me if I'm pronouncing that right okay I could see a couple shaking head which is actually my favorite discovery of this trip because in rhyme from in Michigan it's actually colder there than it is here so this was a strange like nice warm up trip for me so this discovery of like hot wine was actually a really something that I need to bring back because our winners are not very fun either so I am a developer advocate at progress I have a couple other facts about me I'm gonna come back to myself a little bit later in this talk because this is a talk that's actually about typescript and real quickly I just sort of want to gauge the room here I'm gonna ask you a number of questions today how many people use typescript today in projects Wow so I'd say that's something about roughly around half the hands in this in the crowd here how many people consider themselves like JavaScript or front-end developers here okay so that one's a little bit more like a third yeah I've actually found it interesting at this conference because there is not a whole lot of front-end related talks like when you go to the schedule I don't see much JavaScript or typescript out there so this is a talk about typescript but I do want to just set expectations spring from the start here this is not a talk where I'm gonna go over really advanced syntactical features of the typescript language we're not gonna dive into the the really deep stuff and in fact if you're paying attention closely to of these terms I just completely made up a structural detection and sequential piping are not actually real things although they really seem like they could be right like if you wanted to take that and run with it you're you're welcome to do that but instead I'm gonna tell a little bit of a story about why I personally was wrong about typescript so handful of years ago I had sort of an important decision to make I took a really strong stance against typescript and with the benefit of the hindsight that did not work out so well and so what I want to do is tell you a little bit of ice story by the background behind typescript and what I hope you get out of this from sort of a practical or a pragmatic perspective is really through these experiences and through some of the features of the typescript language that I'm gonna be pointing out and walking you through today I hope you'll get a sense of whether typescript is a good fit for your next project or if you're already using typescript maybe some things that you might want to choose to use or whether you want to continue using typescript into the future but I did promise a story about why I was wrong about typescript and so that's where I'm going to get started and things really start back with typescript was actually released back in 2012 if you can believe that and the line they sort of open with and this is the line that still appears in this website their website to this day is that typescript is a type superset of JavaScript that compiles to plain JavaScript now what I thought was interesting about this way back when I saw it back then is this bit about compiling to JavaScript because if you just think of typescript it's really a tool that compiles code into JavaScript it puts it into the same class as a number of other tools that have been around for a very long time in fact the origin of compiled to JavaScript tools dates back to really the beginning of the world wide web you know at this time thinking back to the sort of 90s the late 90s javascript was very much a toy language it was a language that people like me used to build things like this geo city sites and angelfire sites as well or sites that looked like this these by the way being actual real web sites I built that it explicably are on the web archive to live for all time so I get to you know relive these moments of my high school and university time til the end of time they will never die so I was using JavaScript at the time to do all the things that you needed to do with JavaScript which is start your flash animation to animations for your intros to your web sites you know you need that if you're building a final fantasy fan site how do you not have autopilot to drive this poll that you see on the right-hand side of the screen so I was doing some really super cool things with the language an interesting thing happened though over time JavaScript went from this toy that people like me were doing really nonsense things with to something that was becoming increasingly valuable and important to businesses and really important stuff now people like this were suddenly very interested in JavaScript and needing JavaScript for their important business processes now for people like me and for those of you that consider yourself JavaScript or front-end developers of course this was amazing right like suddenly I went from I'm building I'm building stuff like this and then suddenly people are willing to pay me to do that work this is how my career started this is the reason I'm standing up here on stage I went from building toy things to something that people considered very valuable so of course I love this but for a lot of other people this was a not a very great thing and javascript is considered especially if you look back one of the more hated languages of all time I mean a lot of developers that are more accustomed to writing its Java C sharp Ruby you know you name the languages have really historically and even to this day look down upon JavaScript so for these people this was not so great and you'd point out some of the weird edge cases of JavaScript you've probably seen memes like this or this one is happens to me my personal favorites this one is quite clever so I actually can along with this one but what this led to is that since developers wanted to be writing their code in some other language they keep switching back that wanted to be writing their code in some other language but needed to write JavaScript right for their important business applications it led to them trying to create a lot of compile to JavaScript tools they wanted to write their code and say Ruby or Python or Erlang or Java or whatever language that might be but they needed that code to actually compile into JavaScript code and so at some point the CoffeeScript team and I'll talk about CoffeeScript here in a minute just generated a giant list of these things just all these different compiled JavaScript tools that had been written over the over time and as you can see first of all there are hundreds of these right 300 some projects and I think they're more been written over time and what I find interesting about this is that virtually any language that's out there someone at some point has written some tool to compile that code into JavaScript code now you look through this entire list so that you wouldn't have to and I did pick out some of my favorites because not all of these are production ready tools right these aren't tools that are all used in important applications to write important things so there's things called Treehugger which I thought was quite clever because it deals with abstract syntax trees so I thought that was a little fun there's one called Jenga Roo there's called water bear which of course does actually have its own mascot which I thought was was pretty well done so there are some jokes on here there are some research projects a lot of these are you know somebody had a university project to make these sort of things possible and work but there are a number of extremely serious tools large companies spent a lot of time and a lot of effort building some of these projects some of these tools as serious efforts to replace JavaScript or giving developers some other way of writing web code using a language that wasn't JavaScript so what I want to do today is I want to talk about two of the tools that I personally feel have been the most successful so we're gonna look at CoffeeScript and we're also going to look at Dart and what I want to do is show you a little bit of just how those projects went over the last handful of years and use that to show why type scripts path has been different CoffeeScript and Dart ultimately we're not successful in that things that we're talking about today whereas typescript is so the first time I list is CoffeeScript and continuing to pull here how many people here written a line of CoffeeScript code that is more than I expected okay so I'd say that's something like 15 or 20 percent of people type script was written in 2009 and if you went to a conference like this in around 2011 or 2012 you absolutely would have heard a talk about CoffeeScript you would have heard about whether CoffeeScript was a good fit for your next project if you look at for example Google Trends data so just measuring you know raw search traffic for a given term over time you can see that CoffeeScript had quite a heyday around this time 2011 2012 where was actually quite popular and something that people were searching for and using in their projects I looked up for example a fluent conference which is a popular conference in the US as sort of a front-end developer related conference and their 2011 constant ernet and there was actually for talks on CoffeeScript so again conferences like this this was something that people cared about people a tool that people were considering using but ultimately the trend line of course went down over time CoffeeScript sort of fell out of favor it's not something that we're we're commonly talking about there are zero CoffeeScript talks that you can attend that go to conference I'm sorry if you were really looking forward to seeing that and there are a number of different reasons like we could discuss for a long time here why that happened because there's a multitude of reasons you know you could make an argument that javascript is a language has just gotten better a lot of the things that CoffeeScript used to do or just now part of JavaScript itself so there's less of a need to have a transpiler like this do this for you but personally I think it comes down to the code itself so if you look at CoffeeScript this is the very first code sample that you will see on their website this is what they used to show you what CoffeeScript code looks like and to me as someone that is done javascript for a long time most of this does not look familiar right like I don't really know what's going on here other than maybe so that the arrow functions in CoffeeScript actually were some of the inspiration behind arrow functions coming to JavaScript so I do in nowadays understand a little bit of what that's doing but you know this sort of thing and over here it's just stuff that feels unfamiliar to me as a JavaScript developer and this sort of thing just makes the learning curve for getting into a tool like this so much harder because suddenly you have to understand and learn some brand new concepts enable just to be able to write code with this new framework or this new library the thing is though these features would feel familiar if you are coming from a ruby background because CoffeeScript largely came out of the Ruby community and got integrated into a lot of ruby tooling for example the Ruby on Rails Project integrated CoffeeScript fairly early and used it throughout oh I keep losing that throughout a lot of the tooling that they built so CoffeeScript ultimately found a nice niche in the Ruby community but fair failed to take off sort of mainstream within the JavaScript world the next thing I want to talk about is Dart so I'm gonna ask the same question here how many people here have written a line of dart code at some point hey this one's this one's a little less I think I see about six hands coming up in the screen and actually I think for some reason I keep switching into this slide so real quickly I am just going I don't know what's up with this conference slide but it is going away there's a really weird effect we'll go back to dart players from the current slide and hopefully PowerPoint either that or this building is just possessed here's something I don't know why the slide that keeps doing that so this is Dart I'm gonna show the same Google Trends data from dart as well and this one's actually quite interesting right like there's you if you squint you might see a small change in the graph somewhere in here because you see dart actually had a lot of hype and a lot of interest in the tool right away and the reason for this is that dart was a tool that was built by Google and this time frame so this is late 2011 this is when Chrome's market share was starting to really skyrocket and really peak and chrome was really taking over at the browser market and so a lot of articles were written is dart a JavaScript killer people were conjecturing that maybe Google is building Dart specifically to try to replace JavaScript is the the thing we write browser code for and so this generated a lot of controversy that's why you see the Google Trends data up so high but of course ultimately dart was not something that that really succeeded in the JavaScript world actually just real quick one note I found as I was sort of researching this the dart was released at a go to camp in Denmark and it was actually part of a keynote in 2011 which I thought was interesting and then I also heard before this that typescript was actually announced a go to comp as well so apparently this event has quite the history of launching a number of these tools so just a quick note something I found fascinating I was looking through this but again dart ultimately did not have did not find success among the JavaScript community and again the story here is potentially quite complicated you can make the same argument that JavaScript just got better as a language which is one of the reason this tool fell off but I would again argue that a large part of it is deal due to the code itself so this is again sort of the hello world and dart this is one of the first things you'd see I again pulled this from one of the 2011 articles that I dug up and if you ask me as a JavaScript developer again I would say this does not look like JavaScript code right like I don't to me this looks more like c-sharp or maybe Java I'm some some things like that and remember this is 2011 so there is no class keyword in JavaScript yet so if you're a JavaScript developer looking at this this is gonna look even more unfamiliar to you than it does today there was also the small problem that HelloWorld in dart compiled into 17,000 lines of JavaScript code just sort of a minor oversight that the dart team would eventually optimize that away right that wasn't a long-term problem but it wasn't exactly the best you know but get off on when trying to appeal to the JavaScript development world now dart is still around you actually might have heard the talk before and this track about flutter dart is using the flutter project it's also used in a lot of other sort of Google related tools there's a dark conference happening next year but dart has removed their option of compiling into JavaScript the dart project now is exclusively used through their own sort of VM and they've sort of abandoned the notion from compiling to JavaScript altogether so it's another project that ultimately failed to find success at least as a JavaScript replacer in that market so that brings us up the typescript typescript was released in October of 2012 by Microsoft and typescript fate started to look like it was going to just sort of follow the exact same trend line so if you look at typescript and how it fared between say 2012 and it was announced and through the end of 2014 it looked like the typescript project was just going to be this tool that some people use it was available in Visual Studio but but it wasn't something that was gonna find you know mass adoption amongst the JavaScript community and this is really what brings us to my story and when I get involved in this project and why I was wrong about typescript so I work as a developer advocate for a company called progress and progress we we make software we sell software and we're a software development company and my job as a developer advocate or one of my responsibilities is to keep tabs on the development world what technologies are developers using what technologies do developers hate obviously we want to invest and build tools for things that are on the rise and we want to divest and get out of tools that are on the decline it's one reason that I go to sort of events like this and try to hear what developers are interested in in using so around that time at progress this is 2014 we're working on this really cool hip new project that we called native script some data script is our tool for allowing developers to build iOS and Android apps using JavaScript we were pretty excited about it there was you know years-long of internal engineering and we were getting ready to sort of build the final pieces like the final ap eyes and start to unveil and promote native script to the world and so me as a developer advocate I remember very vividly being given access to this repo like it was a real big you know internal thing that was being developed and I was being granted access to this to provide feedback yeah I was in there to say pretend you were just a generic JavaScript developer you're tossed into the repo you know tell us what you think tell us how successful you are what sort of feedback do you have so this was the feedback I used github to go back in time a little bit to 2014 around the time I went in there and I still remember one of the very first things I noticed because I wasn't familiar with this sort of layer of the native script stack the one developers would actually be using remember seeing these DTS files here's a sort of closer look at this which if you're not familiar are type scripts definition files it's basically some of the things that make the typing system in typescript work now to me when I saw this putting if you put yourself in my shoes now this was start red flags you know start screaming sirens going off because I'm thinking in my head right like typescript who's using typescript alright you look at the trends data no one's writing about typescript I go to conferences I don't hear there's no typescript talks you know people developers are gonna get in this repo and they're gonna be confused they're gonna go have to Google what the heck we're actually using to build this thing typescript was built by Microsoft and Microsoft of 2014 was not cool Microsoft hadn't started doing a lot of the things they've done recently to really appeal to the front end in the JavaScript community so Microsoft was a dirty word back in 2014 typescript stooling was also tied up with visual studio so typescript you can use it outside a visual studio but the really nice tooling experience that will look like in a minute was only available in Visual Studio so this is again a problem for me because Visual Studio it's if you say what you will about the editor but it's it's a niche market only a certain segment of developers are actually using Visual Studio and when native script we want to have broad appeal we want to appeal to the entire JavaScript community we want a lot of people to use native script so I did what's always a good idea and I decided to put my my thoughts down in an email that will never die and I said things to the native script team I said it's time to like you know I'm mr. dev'reaux I know what I'm doing here right like super confident I'm gonna swoop in here I'm gonna save the day I'm gonna make this product a lot better so I made this argument where I said things like we risk a lot by building our core on top of typescript I don't hear anyone talking about typescript again sightings how there's basically zero talks out of the the little Microsoft bubble about typescript and what typescript is doing at some point I wrote a public blog post that wants anti typescript where I use the phrase I like to keep my JavaScript here is God intended just sort of my view and the things like I'm very much a developer that does not like adding dependencies to anything I do right so the thought of adding anything to my JavaScript code Java scripts my Devi language its language I learned in why would I want to mess with pure JavaScript by by adding on this additional little tool so that was my thought back then and that was my argument in my sort of reasoning process but an interesting thing happened right after this so first of all my feedback was taken into consideration you know the the native script team does at least I feel that they value my feedback and they seriously considered this but at the end of the day I wasn't the one actually building the thing right I was working with the team that was working on developing these api's and ultimately they said that they thought typescript was a good tool and that it made them more productive and that they wanted to move forward with typescript and if you fast forward to nowadays you'll see that typescript is now associated very publicly with everything we do with native script if you google native script you'll have a hard time finding us not talking about our typescript support we talk about how you build great apps with native script and typescript we were one of the very first case studies on the typescript website so we proudly proclaim native script support for typescript so nowadays you know an interesting thing changed where we went from me trying to push against it so now we are very publicly Pro typescript and to show sort of visually what changed so I've been showing a lot of Google Trends data this is what happens if you put typescript dart and CoffeeScript into the same sort of chart and you can see so I'm going to this is in February of 2015 and you can see typescript has a little bit of a little bit of a push there at the end but they're all operating all three of these technologies are operating in the same spectrum of the chart nothing drastically is different darts a little bit lower but not super significantly now what I did is yesterday I took this exact same chart but I fast forwarded the end you know this month like the big beginning of November and there's gonna be a very small change that's gonna happen here so you know really focus hard on these lines cuz he might be hard to see the difference you'll see that something small happened between 2015 and 2018 you know the very very slight change to one of these frameworks to make it significantly more successful so I was wrong clearly but what I want to discuss is why I was wrong and I think some of the lessons I learned are something that you might be able to use as you evaluate your own technologies when you hear about things throughout this conference or had your job and whatnot as well now first of all some very good just sort of marketing things happen to typescript shortly after this around 2015 so one really big one is that Microsoft announced a partnership with Google that the next version of the angular framework would be built with typescript now this was big just straight-up really from a PR perspective just because angular angularjs has millions of users it did and it does to this day and all of a sudden all of those users now at the very least knew typescript exists they probably might not have even heard of the thing beforehand and they also knew that the next version of the framework that they're using and that they're probably depending on for their production apps was switching to this technology so there's a high chance that they're gonna at least check this thing out and you know run it through its paces and see if it's something that they can use for their next applications so this was a big deal for typescript the other one was this small little other editor called Visual Studio code I'm gonna pull the audience again how many code users do we have here so that is like I'd say just over half of the people when I asked this question at front-end like specific talks I swear it's crazy it's now like 80 or 90 percent like it's absolutely phenomenal to me how many people are using code and the success this editor has had and you can make a strong argument that a good part of typescript success is really just tied to code so what code did is I mentioned earlier that the really good typescript support and tooling was really tied to the visual studio editor so Windows only paid editor that only certain number of developers use code was designed as a cross-platform editor so all of a sudden this script cooling which is built directly into Visual Studio code as I'll show here in a minute was now available for not only windows but also Mac OS and Linux oh and it was also free as well so the barrier to actually trying this and to finding an editor that supports and shows off typescript really well suddenly went from very high to really nothing the basement you don't have to pay or really do anything to try these things out along this time you also started to see a number of people just sort of saying really glowing things about typescript so this is Tom Dale who's one of the people behind the Ember project saying he's sold on typescript this is Dave Herman who works on the JavaScript specification saying that typescript is quote a lovely piece of technology you also started to see a number of companies saying really nice things about typescript and specifically about typescript how typescript has helped them build applications at scale and working within their organization so this is probably my favorite one you could find it done medium about typescript is slack where they talk about how the slack app has benefited greatly from switching over to typescript if you're using a JavaScript framework there's a good chance that you're working with typescript in some fashion nowadays I talked earlier about how angular is now written with typescript the Vue framework has recently announced that the next version of YouView 3.0 is going to be written with typescript so that's a pretty big change to that ecosystem as well and react is still written with JavaScript but they did recently announced that the main react CLI the create react app will now have built in typescript support so you can easily generate react projects that let you use typescript out of the box so when we look at why I was wrong I think certain parts of this were related to sort of the the marketing aspect of this title the typescript name getting out there more I'm getting some more positive PR and such but there's a lot more to it than that and to explain it I want to tell you a little bit about how developer relations work just in case you're not familiar so if you ever want to apply for a dev real job do we have any deverel people in here i good i can tell you all the secrets about the dev real job so Deb rolls really in a nutshell our half engineering and half marketing that's basically what we do and I sort of like to think of this as having an angel on one of my shoulders and a devil on the other it's sort of like my mental model for this because I know the devil is here because I know marketing works to an extent there's a certain value from just having this information out there like having the type script name out in front of people I mean heck part of the reason I'm here today is because I work on the native script team and for those of you that haven't heard of native script before at least you now know the name and maybe if you're decide to build a mobile app you would consider using native script but I also know that the engineering part of the equation is actually far more important developers aren't stupid people and you can't make them use a tool that they don't like or that doesn't solve a problem for them or at least you have a really hard time making them use a tool that they don't like and they will not be happy with you if you make if you make them do that and so for example if I told you native script is a great tool and you went back to your office and went to build a native script depth and it sucked you're not gonna use native script right so ultimately the engineering aspect of this is actually far more important and when I look at why I was wrong about typescript it was because I was thinking of things more from a marketing perspective I was making arguments like typescript won't succeed because I don't see people using it or it's a tool by Microsoft my arguments weren't that this isn't a genuinely useful piece of technology that solves an important problem that developers have and when I did actually give typescript a fair chance and sort of evaluate it from a technical perspective I do think it does a couple of things very right and I think the technical bits are why it didn't suffer the same fate as projects like CoffeeScript and like Dart so this guy I'm gonna give you three reasons why I think from a technical perspective typescript has done quite well and while I think it's a pretty valuable piece of technology that you might want to use for your own applications so the first of these is that typescript made an important commitment to the JavaScript or the ACMA scripts standard and what I mean by that actually the typescript team says it quite well themselves so this is a quote that's from the original blog post when Microsoft first published typescript way back in the day and it's kind of long but I want to read it cuz I think it sets the foundation for why I personally bleed typescript was successful the quote says some examples have compiled the JavaScript frameworks so like dart and also like CoffeeScript that we talked about pretend that JavaScript has fundamental flaws into those scenarios requires the clean break from JavaScript in both syntax and runtime we disagree with this point of view we believe that with committee participant focus the standards runtime can be expanded and the syntactic features necessary to support JavaScript as scale can be built on top of the existing JavaScript standard now this is important think back to the dart example that I showed earlier and also the CoffeeScript example that I showed earlier as well there was a huge learning curve there because that code was not JavaScript code both of those projects made a decision early on that they weren't gonna build on top of JavaScript they were in good instead build a completely separate way of architecting and writing your code and compile into JavaScript typescript took a different approach and chose to build on top of javascript which i think is actually quite important there to show that I'm gonna show start to show a few code examples to you here now this is what's called the typescript playground so if you go to type scripts website which is a typescript leg org and this last tab is for the playground which takes you to this UI you see here it's a great place to just start tinkering with typescript especially if you're new to the tool because basically how it works is that you write typescript code on the left-hand side of the screen so this would be like your dot TS or your typescript file and what you see is the output or the JavaScript code the types grid generates and what's cool is that if you try this and you start off with some basic things like if you just write the world simplest for loop here you can see that typescript actually doesn't need to do anything with that it just takes that code that you write and just makes it your - a yes your just JavaScript implementation this essentially why I think this is important is it essentially takes the learning curve for JavaScript developers to zero right you could take your dot j/s files and just make them dot typescript files and just start writing your code as is and slowly add in other features of typescript as you become more comfortable with it it just makes getting started with the the framework and with the approach far more plausible now on top of this typescript actually because it's stuck with the JavaScript standards has become one of the leading ways that you can just use newer features of the javascript or the echo script standard in a way that's going to continue to work for whatever if say brow or JavaScript runtimes that you need to use so for example the class keyword is a newer feature of JavaScript but if you need to if you want to use the class keyword and the apps that you're building today but you need to support say for example older browsers you can rely on typescript to transpile that code into JavaScript that's going to work in that environment there are number of other features as well for example maybe you want to use the extends keyword which is actually a really new feature of JavaScript you could do that in typescript right away and let it deal with the sort of messy rendering or how it handles making that code work and the environment you need your JavaScript code to run him so I got a few more examples here like arrow functions if you want to use those in a safe way today you can do that multi-line strings which is a fun feature of JavaScript you can do that a template literals code that works like this is another one that you can do with typescript today and I started cherry picked a few more examples in here but typescript is actually extremely compliant to the standards and lets you use a lot of the really new features of javascript immediately and in a way that keeps your code running especially if you need to support you know older browsers or older runtimes now one thing that does come up when I show this quite a bit is people wonder well what if I don't need to support older browsers what if I'm using typescript to write a node app where I know exactly what my runtime is or maybe I know my users are going to be on your versions of browsers or maybe we don't support those older browsers so the typescript command-line interface which you can download from their website as well and really any time you're using typescript the typescript compiler has a flag or a way of configuring the target that you're using so by default it's going to render your code in es3 environments so a very old version of JavaScript it's essentially a way of making sure your javascript is gonna run virtually anywhere but you could if you want change that to run in something like es2015 or a yes 2016 and if you make your target a newer version of the JavaScript runtime essentially what it'll do is just take the code that you write here and again just poured it out exactly as is there'll be no need to transpile kind of like we looked at with a very simple for loop so really I think the main reason so again this is three reasons why I think typescript succeeded in did very well one is just because it committed to the ACMA script standard and because the framework is built on top of javascript it's been really familiar really comfortable really easy for JavaScript developers to use and has been a really successful way to just let people leverage newer features of the JavaScript language second reason is that the typing system in typescript so typescript has types it's sort of in the name of the framework but I think it's important that they made the types opt-in and to explain that of go back to a couple code examples here so the way you apply types in typescript is you use this syntax where you use a little colon then you apply the type that you want to use to the value you're using here but you could if you wanted to because you can see this has no effect on the generated code whatsoever it's just spitting out the exact same thing so you could actually just get rid of the type and your code is going to work exactly as is and why I think this is important is because it again lowers the learning curve and you're not forced to like you would be with some other frameworks as soon as you switch to typescript immediately start applying types to everything that you do you sort of have the choice as a developer to start as you learn the type system and as you become more familiar with it and as you want to leverage it more to slowly enhance your code with types that are just going to enhance your productivity as a developer and actually typescript as well is pretty smart the typescript compiler in many cases can infer types without an explicit declaration so for example typescript here knows that this value is a string and some of the tooling that we're gonna look at here in a minute can automatically you know suggest completions based off that string without you needing to explicitly tell the typescript compiler what type of value that this is now I started really hesitant about types this is one of the reasons I was super hesitant to use typescript even though I am a longtime JavaScript developer I did spend many years in the Java world I wrote a lot of Java applications and one of the things that was refreshing to me about writing JavaScript code is that I didn't have to write types right like I'd spent so much time in JavaScript Java driven Java job it sort of broke me right on types and it was just so clunky and it was refreshing to get out of that with JavaScript but typescript approaches work quite well and if you look at a lot of the the write-ups from companies that have used switch to typescript one of the things you'll see quoted a whole lot and this is the one that that slack put out there quote is we were surprised by the number of small bugs we found with converting our code type conversion is one of the most silly and common airs in JavaScript applications I can't tell you how many times I've had a cero that was supposed to be a string or some sort of weird string to number conversion and you see this line about finding bugs over and over again on the native script project I was actually just leaked last week talking with one of our plugin developers that's sort of tasked with converting alert making a lot of our native script plugins type script compatible and he mentioned the same thing to me that he was actually able to collect too close a number of github issues that he found simply by switching to type script and assigning types to the code he used so even if you're hesitant to switch into typing I think you'll find a lot of value from doing so so I mentioned three reasons why I thought typescript was successful the first was the commitment to the standards second was about the typing system and how things are opt-in the third item I have on my list is tooling and this is probably what I feel is the single most valuable or the single most important reason why typescript succeeded so the examples I've been showing so far have been fairly basic but you can do a whole lot with typescript so for example even in this simple playground environment that's browser-based you can see that typescript is quite good about providing intelligent suggestions for things like types and the methods that you can use it'll also do things like tell you when you do things you're not supposed to do right like try to use a function or a method that doesn't exist or try to assign a value of one type that you shouldn't be allowed to do it'll flag that sort of here as well now this gets more powerful when you switch out of the browser-based environment like this playground and into an editor that you'd probably use for your professional development so there are a number of different editors nowadays that have really good type scripts support but I find that most people at least myself personally use typescript through an editor like Visual Studio code and you can see that you get a pretty similar experience a nice autocomplete as you type your code a nice easy way to process through your application development and this is something by the way that if you are a JavaScript developer this is something that we're not traditionally used to the idea I've seen editors over the years try to provide this good of an experience and really fail to do so but in a way it brings a lot of the features that have really more server-side developers back-end developers have loved about their language into JavaScript in a pretty seamless way now they're just small thing like you can poke around your code like this is a feature of Java editors that I used to love that if you're in a file and vs code at least its command click and you can sort of pick around your files and poke around without having to manually open each of these files for the type system one nice thing about typescript being so popular today is that if you are using a library or a framework someone somewhere has almost certainly written types so those dot DDS files that I showed earlier that's essentially making the typing system work for the typescript compiler and the typescript tooling that you saw in Visual Studio code so for example if you're using node or you're using a reactor even if you're using something like jQuery these types are available there on NPM they're easily installable into your apps and you get some nice autocompletes and nice functionality for your editor as you develop your code and fun story too so you might have caught it earlier in one of my slides that I used to be a member of the jQuery team so back in the day I used to write an enormous amount of jQuery code and I can't tell you the number of times I'd actually be embarrassed if you knew the number of times I went to the jQuery API Docs to just look up the stupid syntax of the Ajax function or the animate function because it's amazing how little even with ap as you use every day how quickly that goes in your brain and immediately out when you no longer need to use this and actually one of the things I found most valuable about typescript is using these libraries because these aren't ap is that I'm super familiar with these aren't things that I wrote myself and so I've been doing some angular work recently and you can see some of the things that typescript provides for example if I go into this package and I just need to see what classes or what things are in here typescript knows and it's able to suggest and help me build these things it's going to know things about what properties are what attributes are required from the methods I'm using I get some nice inline documentation I get some suggestions of how I might want to use these api's it's gonna know what values are required which values are optional and if I don't provide required one that's going to yell at me and tell me what I need to do if I'm trying to provide optional attributes it'll offer suggestions values and if I try to pass in a string when the API wants a number this is another thing from jQuery sometimes you'd pass in numbers and it wanted strings and some bizarre things happens the browser just being able to catch these things kind of early it's not huge right but over time this is an enormous productivity boost for your development processes now a native script specifically we were actually doing some pretty fun things with typescript so one of our more compelling features with native scripts so again we're a framework that lets you build iOS and Android apps using javascript and most of the code you write with native script is cloth cross-platform so it's in a way that's gonna work across ios and android at the same time but we also recognize that when developers write native applications at some point they're going to need to do i OS or android specific things it's sort of inevitable maybe I want to do a quick tweak to the status bar on my iOS app maybe there's some IOT sensor that I need to use some Android SDK to use and so this is great but one problem is that we're primarily trying to make native script appeal to web developers and web developers tend not to be the people that have an encyclopedic knowledge of all of the iOS and Android API domain it's just just not a skill set that they possess so one thing we've done is we've created typescript definitions for the entirety of iOS and Android which this melts your mind just a little bit right because this is Visual Studio code this is a typescript project and what I'm doing here is I'm basically writing iOS code which is a little bit weird to think about but what's cool is that we're essentially providing more or less like an Xcode like experience or an Android like experience within a typescript app we've also found through doing this we've been able to appeal more to native app developers which is a market we didn't necessarily think we'd we'd appeal to but because we can make a cross platform framework feel a little more at home for those sorts of developers that are used to this sort of experience in frameworks like Xcode in Android studio that they actually find typescript development more appealing next I have a Java one in here too the Java one is even weirder in my head it's because something about typing Java dot laying that string and like a Visual Studio code typescript project just sort of messes with my head a little bit but it's something that is possible for you to do using native script so hopefully you've got an idea of why I was wrong and typescript before you've been able to learn a little bit about the Furion and some of the things that I've sort of went through and shown I do have a couple of sort of quick sort of lightening topics or lightening things that come up that I want to discuss before we we leave off today just things that come up commonly when I talk about typescript the first is how to get started so if you go to typescript website you're gonna see this section here about that's gonna help you get the typescript CLI and tell you how to convert your TS files into dot JavaScript files so this works and this is something that you could try out but it actually recommends heading to the sort of QuickStart section of the typescript documentation I think one of the challenges when getting started with typescript is dealing with the configuration so the typescript CLI makes it easy to convert say one file to another it's a little harder when you want to get to the point of I want to set up an entire typescript sort of system to compile all of my typescript files in my big app into JavaScript files or a set up for dealing with that but a lot of frameworks have provided solutions out-of-the-box for this so if you use for example the angular CLI to create a new app all that type scripts stuff gets taken care of for you and you don't really even need to know that it's happening react through it CLI now has that I believe view does as well for native script we definitely do if you use the native script CLI to create a new project you don't even need to know what's happening with typescript under the hood so because we take care of all that for you so I just suggest starting with one of those approaches especially as you're getting started just because it'll let you actually experience and try typescript without having to worry about some of the messy or configuration one other question I get a lot is is typescript similar to flow so if you're not familiar flow is a project from Facebook I think the react team hasn't been involved in this in some fashion as well and it's similar to typescript in that it's also a static type checker now flow takes an interesting approach whereas in typescript you write your code and dot TS files and the typescript compiler turns those files into dot JavaScript files or das files flow actually operates directly on the dot J's files so you don't need that added little bit of code that actually changes one file to another so you have less or fewer files in your project so I've spent less time with flow the one thing I will say is that it's kind of neat because some it's kind of nice having fewer files in your project and not having to worry about typescript versus JavaScript I do find that flow is a little bit slower and B cuz Flo doesn't have that separate type script file type script just tends to know more about your code because you're providing your types you're providing everything in line whereas Flo has to do a little more parsing to figure that sort of thing off figure that sort of thing out on the fly so we're not talking huge it's not like flow is really chugging and slower but one of the benefits of typescript for me is just how fast those inline suggestions are in editors like Visual Studio and Visual Studio code so if you're thinking about this sort of project like if you're studying a new app and you're debating one of these static type checker tools though I'd at least admit suggest kicking the tires trying it out and seeing what you feel about it so what are the downsides to typescript I think I've given a fairly glowing review of typescript was just sort of ironic giving my past with it one of the downsides I found is just in the configuration itself so this has come up especially as I work on bigger apps and bigger teams and typescript is just yet another thing to maintain which is probably its biggest downside if if you're like me and you're a person that does not like adding any dependencies to your apps whatsoever I mean typescript is just yet another thing for you to use their typescript will have new versions they will change things about their configuration files and I personally like I couldn't tell you I've used type for years at this point I couldn't tell you what like a third or half of these things are even doing at this point so it's just something to be aware of the other thing I would say is typescript especially if you let people that are coming from like a Java or C sharp background into your typescript code sometimes they can get a little nuts for the types like typescript has some pretty advanced features for doing things like unions and generics and stuff like that and in a way it takes it to me personally it takes away some of some of the the purity of building on top of JavaScript for the typescript code base yeah I've got something this is actually a real example that appears in the typescript documentation that I couldn't tell you for the life of me what this thing actually does it can get a little bit intense so finally what I think is sort of the most important topic and what I'm gonna wrap up with is should you use typescript you know if you're already using typescript that's great but if you're deciding I have a new app coming up I'm trying to decide should I use JavaScript app or should I use typescript for this application as a developer advocate I get asked this question quite a bit and so what I usually respond with the obvious answer is it depends but what I usually ask is a handful of questions things like are your apps big so the bigger your applications are I think the more you stand the benefit from a lot of the tooling the typescript provides if you have an app that's a few files the the sort of inline syntax checking and such is nice you still might find that valuable but if you have a lot of files and you don't remember you know what folder is this code even is what does it do what types that I'm using I think you'll find a suggestions the type script provides a little more valuable the second question I was asked is do you work on a team and especially as team size grow I grows I think the value of typescript grows as well if you look at a lot of the typescript sort of successful raise a lot of them are being used for large teams to build large applications I mean slack is not a small app for example and the same sort of thing is at work if you're writing a say a couple of small application just with yourself you're probably pretty familiar with the types that you're using for your applications and the message you're writing but if Jim and Sally and Joe and Bob are also on your team and working on your applications then you can stand to be a lot more productive if you know that you're using the API is that they wrote and you're not going to write something that breaks the approach that they have so as app size goes up typescript becomes more valuable as team size goes up the same thing is true as well the next thing I would say is if you work on unfamiliar code bases a lot and this one's a little bit personal to me because as someone that works on the native script team a native script developer advocate people sent me the random apps all the time like you know something something broke and I want you to take a look at what this is doing and over time I found I'm far happier when people send me type script applications just because it's a little easier for me to go in and start to tinker with their code if I make a change to a file I can tell instantly whether I broke something three folders over I don't have to wait to get some bizarre compiler error and try to reverse-engineer why that happened so in your organization and your project if you're the sort of person or your team has people that sort of jump around between apps and have number of different applications you might find the typescript is valuable and increasing your productivity and finally my very last note is what if you have non JavaScript developers that need to write JavaScript code so this one I think is interesting to me because for all that I've talked about things today from a JavaScript developers perspective and how type script is sorry trying to appeal to the JavaScript world what I've seen sort of out in the real world is that the people that like typescript the most are people that are coming from languages more like c-sharp and Java because a lot of what typescript is doing is providing a lot of the the hand-picked best features from those worlds and providing it for JavaScript developers so if you were in an organization where perhaps you know you're struggling to find front-end people to do work or you need more front-end form or more people to do front-end stuff you might find the typescript is an appealing way to bring in some people that are traditionally not front-end developers and make them more comfortable with sort of a front-end workflow by using typescript so that's really all I have as a couple last quick notes if you are interested in learning more about native script native script org is the place to be I have native scripts stickers in my backpack so if you want a cool blue sticker for your laptop or for whatever it is you want to come see me I have them up here and you can use them and that's really all I have so thanks [Applause]

Channel: GOTO Conferences

Views: 62,496

Rating: 4.3781095 out of 5

Keywords: GOTO, GOTOcon, GOTO Conference, GOTO (Software Conference), Videos for Developers, Computer Science, GOTOcph, GOTO Copenhagen, TJ VanToll, Progress, TypeScript, Advanced Mobile, Mobile, Programming Languages, CoffeeScript, Dart

Id: AQOEZVG2WY0

Length: 47min 59sec (2879 seconds)

Published: Fri Feb 22 2019

Reddit Comments

[u/goto-con]

FYI, here's the talk Abstract

In 2014, I made a strong argument that TypeScript was destined to be irrelevant and that my company should not use it in any of our projects.

Fast forward to 2018 and we use TypeScript for, like, everything we build at Progress, and I am no longer a source of trustworthy information.

In this talk we’ll discuss why I was wrong. Specifically, we’ll take a look at why TypeScript succeeded where other compile-to-JavaScript languages like CoffeeScript and Dart have languished, and what that means for future of the technology. Come to learn the basics of TypeScript, and whether TypeScript is a good fit for your next project.

[u/garrehsponges]

tldr;

• TypeScript compiles into Javascript - it can target ES3-ESNext
• Improved IDE support for editors that support Typescript - e.g. autocompletion, code navigation, various documentation hints, etc
• Compile time errors / static analysis
• Most common competitors are Dart (Google) and Flow (Facebook) - both not as widely used

---

As a non TypeScript user, I'm personally still trying to find a convincing argument to use it. The extra tooling and dependency + reliance on Microsoft to continue support what is essentially a new language & syntax just doesn't bring me much joy.

I too, like the speaker, find joy in purity of a language without a wrapper ontop of another wrapper ontop of another wrapper - at some point you have to ask yourself whether it's worth that additional dependency. In the case of TypeScript, it seems to me it would only appeal when:

• You use an IDE (and use autocompletions, code navigation, etc)
• Large, complex code bases (types may help bring cohesion to understanding the business logic and help prevent type errors)
• Operate with many developers

It kind of frustrates me to see libraries on npm, even the most basic ones, use TypeScript for this reason. A tool should add significant value to your application in order for it to be worth it.

I do think that types will eventually become native to Javsacript though - tools like TypeScript are modelling effective ways it can be achieved.

[u/scienceram]

In my experience, typescript is often a impediment to using non-typed libraries since it takes quite a while to type every variable or object (I'm aware you can configure this). I'm still not convinced of the benefits over using something like flow.

[u/Keristero]

I love using typescript... type checking for my javascript.

[u/Renive]

We had a very bad JS training at work and the teacher said that TS will be dead in a year and is a fad. He thought that types will be introduced in another EcmaScript spec. I had to correct him even on things like people tried to do it in ES4 and it failed and nothing is gonna change...

[u/daleadil]

I'm really new to coding in general, so I must be out of the loop. But, why is Microsoft-support a bad thing?

Wouldn't support from an entrenched / well funded source with tons of talent make a tool more reliable to use?

​