Introduction to TypeScript Development

In this guide we'll walk through how to build a Hello World application in TypeScript on a Mac, including how to integrate a tsconfig file for running TypeScript code.

This guide walks through how to use variables in TypeScript, specifically we examine how to work with the: var, let, and const variable types and how they each have a specific role in development.

This guide examines how to work with string interpolation using back ticks in TypeScript.

In this guide we will walk through the key types that are used in TypeScript programs.

This guide walks through how to create a type alias in a TypeScript program.

In this guide you'll learn how to implement Union Types in TypeScript, which allow for variables and aliases to have multiple data types assigned to them.

In this course update video, I show how I utilize union types in a React JS eCommerce application. We'll walk through how union types allow the application to guide development.

This guide examines how to use arithmetic operators in the TypeScript programming language.

In this guide we'll walk through how to use conditionals in the TypeScript programming language.

This guide examines the full list of TypeScript conditional operators that allow for managing data flow in programs.

In this guide you'll learn how to use compound conditionals in TypeScript programs, including how to work with the: and, or and not programming mechanisms.

This guide explains how to work with loops in TypeScript, including: while loops, for in, and for of.

This guide provides an introduction to functions and specifically the syntax for how to create functions in the TypeScript programming language.

This guide analyzes how to work with function arguments in a TypeScript program. This includes a walk through of: optional, default, and rest arguments.

Learn how to work with arrow functions in the TypeScript programming language.

This guide explains the key differences between TypeScript function declarations vs function expressions.

This TypeScript tutorial walks through the concept and syntax for immediately invoked functions.

This guide explains how immediately invoked functions in TypeScript can work with arguments, along with a deeper dive into how to structure these types of functions.

This guide examines how to work with TypeScript closures, including three examples of how closures work, specifically discussing the idea of variable scope.

This guide walks through how to create and instantiate a class in TypeScript, including how to work with the constructor function.

In this guide you'll learn how to implement object oriented inheritance in TypeScript programs, including the proper syntax along with a practical example.

This guide walks through how to use objects in the TypScript programming language, including the syntax for creating a new object and how to call the object's values.

In this guide you will learn how to work with interfaces in the TypeScript programming language.

This guide examines how to create functions that follow an interface's set of rules.

In this guide we're going to examine how to implement interfaces in classes, including two processes that allow for class implementation.

In this guide you'll learn how to work with namespaces in the TypeScript programming language.

No matter your background, the concept of asynchronous behavior in applications can be a challenging topic. Seasoned programmers and new coding students alike can be intimidated by what it takes to work with asynchronous programs. In this guide I will walk through a dead simple explanation of asynchronous development. And by the end of the material hopefully the concept will be easier to understand.

Explanation of Asynchronous Development

Let's start off with a definition of what asynchronous development means.

What Does Asynchronous Mean?

If you Google asynchronous development you'll get a long list of convoluted explanations. So I'm going to give you the easiest definition I can think of:

Asynchronous development allows for you to run multiple processes at the same time.

That's pretty straightforward, right?

Essentially what takes place in a program that leverages asynchronous behavior is that they have code components that can run in the background.

Asynchronous Programs in the Real World

Let's examine a practical example of asynchronous behavior in a real world program. Imagine that you have a web app that does not utilize asynchronous processes. Now imagine that you need to render a page with a large database query. When a user accesses the page the header will load and then the screen will freeze while the database query is running. Once the query is complete the program will show the results and then it will render the other page components, such as the footer, sidebar, etc.

In an asynchronous application, if you have a large database query the entire page will load and the results from the database query won't hold up the rest of the page from loading. From that point, the query data will show up whenever the database query has completed.

Non Blocking Code

Implementing this type of functionality is typically accomplished through runtimes such as Node.js. Node is the traditional tool of choice because it utilizes what's called non blocking IO (where IO stands for input/output). And thankfully the term non blocking is pretty self descriptive. From a programming point of view it means that a process in one function doesn't have to block the processes in other functions.

Summary

And that is a dead simple explanation of asynchronous development along with a practical example of how it works in a real world scenario.

This guide walks through the issues with 'this' in TypeScript, along with examining how we can leverage arrow functions to fix scoping problems.

This guide walks through how to work with higher order functions and callbacks in TypeScript to build asynchronous applications.

This guide walks through how to configure your system to work with TypeScript promises. Specifically we update the compiler options in the tsconfig file to work with the ES6 runtime.

This guides examines how to work with Promises in TypeScript, including: what promises are, how to create a promise, and how to work with promises.

In this guide you'll learn how to work with TypeScript decorators with a basic code example that examines the core functionality.

This guide explains how to work with class decorators in TypeScript, including how to add custom behavior to classes.

In this guide you'll learn how to work with method decorators in the TypeScript programming language, including how you can customize function behavior by adding new behavior.

This guide reviews an Angular 2 code file and examines how the Component decorator is utilized in Angular 2 development.

This TypeScript programming tutorial goes into detail on how optional chaining can be utilized to streamline conditionals in an application. Practical ways that optional chaining can be used:

• Ensuring that data render attempts are only attempted after an application receives data from an API

• Allows for cleaner, more maintainable code since the conditionals can be built directly into the program instead of having to build 'guard' based conditionals.

• Preventing errors from occurring when a server sends unexpected data

In this tutorial, you'll learn how to build a function that capitalizes every word in a sentence using JavaScript / TypeScript. We break the problem down into two functions:

• A function to capitalize a single word

• A function that splits a sentence up into separate elements, capitalizes each word and then returns the formatted string

Configuring a React application that utilizes TypeScript can be challenging if you have never done it before. For that reason, I built out a node module that you can use that will generate a fully functional React application that already has TypeScript integrated. Some of the key features of the module are:

• Automatically configured to run TypeScript 4+ code

• Example React components that utilize hooks

• Webpack setup for development and production environments

• Loader integration for TypeScript, React, assets and Scss compilation

• Pre-configured to allow for deploying to React applications to Heroku

This guide walks through how to build React components that utilize TypeScript interfaces. This illustrates the power of using TypeScript with tools such as React since they can help guide the development process and document the rules that the application should follow.

This deep dive guide walks through a comparison between the map function compared with other types of loops. You will also learn how to add dynamic behavior into the iteration process. This will allow you to render a list of data on the screen using tools such as React.

This React tutorial explains how to iterate over an array and render each item on the screen. It teaches:

• How to render an array of items with React

• The importance of the key prop and React's performance based diffing engine

• How to define a set of types and interfaces with TypeScript to describe the rules that the application needs to follow

• How to implement inline styles with React