TypeScript and React

Start at 01. The first lesson names the types. The next one builds an object. Each sample is on the page.

1. Skill

   Basics

   The types, explained, then an object you can name and call.

   1. 01 TypeScript from zero: a name has a type Start here

      A TypeScript name can carry a type. name is a string, cents is a number, and ready is a boolean. The program prints latte $4.50 ready.

      Adds The types this course uses

      2 min read

   2. 02 TypeScript from zero: an object has fields

      An object type names the fields. Item has a drink and a price in cents. label takes an Item and the program prints latte $4.50.

      Adds An object you can name and call

      Builds on 12 min read

2. Practice

   Tips

   A rule that prevents a bug, then a program that uses the object.

   1. 03 TypeScript from zero: a class bundles the method

      A class holds the fields and the method together. new Item makes a latte. label prints latte $4.50.

      Adds A tip that prevents a bug

      Builds on 1 through 22 min read

   2. 04 TypeScript from zero: copy before you change a field

      An object spread copies the fields and replaces one. The original latte stays 450 cents. The tipped copy is 540. The program prints 450 540.

      Adds A program that uses the object

      Builds on 1 through 32 min read

3. Further

   A whole program

   One more idea, then a program that puts the pieces together.

   1. 05 TypeScript from zero: a union names the cases

      A union is a value that is one of several shapes. Paid is yes with the cents, or no. Reading yes prints paid 450. Reading no prints unpaid.

      Adds A program that puts the pieces together

      Builds on 1 through 42 min read

   2. 06 TypeScript from zero: an interface is a method list

      An interface lists the methods a function needs. Labeller asks for label. Item has label. show prints latte $4.50.

      Adds A program that puts the pieces together

      Builds on 1 through 52 min read