TypeScript Readings

Introduction to TypeScript

Goal: Understand what is TypeScript and why it's useful
The TypeScript Handbook Intro!
https://www.typescriptlang.org/docs/handbook/typescript-from-scratch.html https://www.typescriptlang.org/docs/handbook/typescript-in-5-minutes.html

Quick Overview Video
https://www.youtube.com/watch?v=zQnBQ4tB3ZA

Knowledge Check:

• What does it mean that TypeScript is a “superset” of JavaScript?
• What does it mean that TypeScript “compiles” to JavaScript?
• Why is TypeScript useful? Why do developers choose to use TypeScript even though it involves writing MORE code than you would with vanilla JavaScript?

Syntax of Types

Goal: Begin to navigate TypeScript syntax
https://www.typescriptlang.org/docs/handbook/2/basic-types.html

• Read the following sections

  • Static type-checking
  • Non-exception Failures
  • Types for Tooling
  • Emitting with Errors
  • Explicit Types

https://www.typescriptlang.org/docs/handbook/2/everyday-types.html

• Read the following sections
  • The primitives: string, number, and boolean
  • Arrays
  • any
  • noImplicitAny
  • Type Annotations on Variables
  • Functions
  • Parameter Type Annotations
  • Return Type Annotations
  • Anonymous Functions
  • Object Types
  • Optional Properties
  • Union Types
  • Defining a Union Type
  • Working with Union Types
  • Type Aliases
  • Interfaces

Take a look at the following; https://github.com/uCredit-Dev/ucredit_frontend_typescript/blob/master/lib/resources/commonTypes.tsx

• Does the formatting make sense?

React and TypeScript

https://react-typescript-cheatsheet.netlify.app/docs/basic/getting-started/function_components

Note how in a function components, props, and useState hooks are typed are typed. This should look familiar!

https://react-typescript-cheatsheet.netlify.app/docs/basic/getting-started/hooks

Look at the useState hook in particular

TS Playground Code Snippets