TypeScript for JavaScripties: Day Camp Edition
TypeScript is a wildly popular language in both industry and open source: • GitHub’s 2021 and 2020 State of the Octoverses have it at the platform’s fourth top language, up from seventh in 2019 and 2018 and tenth in 2017. • StackOverflow’s 2021 Developer Survey has it at the world’s third most loved language (72.73% of users). • The 2020 State of JS Survey shows TypeScript has consistently high satisfaction and usage amounts as both a build tool and variant of JavaScript. For frontend developers, TypeScript is well supported in all major UI libraries and frameworks, including Angular, which strongly recommends TypeScript, as well as Gatsby, Next.js, React, Svelte, and Vue. For backend developers, TypeScript generates JavaScript that runs natively in Node.js; Deno, a similar runtime by Node’s creator, emphasizes directly supporting TypeScript files. I've done a heck of a lot of research on the right way to teach TypeScript - first speaking at TSConfs, then helping design Codecademy's TypeScript content, and finally on the Learning TypeScript book. The curriculum on this workshop is what I believe to be one of the best ways to introduce learners to its concepts. We first cover context for why TypeScript exists, then the base foundations of how its type system works. Those foundations are then useful for explaining how it works with user code such as on functions and arrays.
Agenda
This workshop will hike campers through through the first half of the Learning TypeScript book table of contents - a battle-tested, intentional set of topics that build on each other to teach TypeScript. We'll cover each of the chapters: 1. From JavaScript to TypeScript: Why JavaScript is the way it is with respect to types (or lack thereof), and where TypeScript does or does not fit in 2. The Type System: Foundations of how TypeScript's type system fits in to JavaScript code and understands your values 3. Unions and Literals: How TypeScript understands values that can be one or multiple possible primitives, along with strict null checking (the "billion dollar mistake") and the powerful concept of "type narrowing" 4. Objects: How TypeScript's "structural typing" allows it to understand objects by their shape and intent, not just by their declaration forms 5. Functions: How TypeScript understands function inputs, outputs, and quirks around "void" and "never" types 6. Arrays: TypeScript's understanding of fixed type, evolving any, and fixed size ("tuple") arrays Each session consists of a 25-30 minute interactive lecture, with 5-10 minutes in-between for bio breaks and miscellaneous questions. We'll have a snack break in-between the two sections.
Prerequisites
Beginner-to-intermediate foundations of JavaScript: understanding closures, objects, functions, and arrays.
Take Aways
- How TypeScript's types and type system work to model JavaScript code
- Modeling JavaScript array, function, and object values with TypeScript types
- Narrowing TypeScript's understanding of types with "type narrowing"
- Using TypeScript to augment developer experience and catch bugs