In this article I’ll explain how Redux Toolkit simplifies building Redux based apps and combines beautifully with React and TypeScript for an all-round great stack.

NOTE: This article was originally written here in October 2020 but was updated for the 2020 release of The State of JavaScript.

Why am I talking about this?

I wanted to evangelize a stack that we’ve enjoyed and had great success with here at Instil — React + TypeScript + Redux Toolkit. But I wasn’t sure of what aspects to talk about or who to pitch it to. …

In celebration of TypeScript 4.2’s recent release and the language’s continued evolution, let’s take a look at tuple types and some advanced type manipulations we can do with them.

Fundamentals

A Tuple (rhymes with ‘couple’, not ‘pupil’) is a simple container of data. A tuple object has a fixed size, and the type of each element is known but the types don’t need to be the same.

A basic tuple definition is:

This movie tuple has exactly 3 elements and they must be string, number and Date in that order. These structures can be easily destructed into their component parts:

In this tutorial we continue the step by step guide for creating a weather app using React and TypeScript.

Welcome back to this tutorial on using React and TypeScript to build client-side web apps. In Part 1 we covered:

• Boot-strapping an app with create-react-app
• Using React with TypeScript
• React Hooks

In this post we will complete the tutorial by:

• Integrating the Open Weather API
• Using asynchronous communication
• Applying more hooks

You can find the code on GitHub.

Step 4: Integrate Open Weather API for Search

To get real weather data we will need to talk to a service. For this tutorial we’ll use the Open Weather service. The…

In this tutorial I’ll provide a complete introduction to using React and TypeScript to build a client-side web app. Together we’ll create a simple Weather App that allows you to search for locations and displays its current weather and 24 hour forecast.

Along the way, you’ll learn:

• Bootstrapping an app with create-react-app
• Using React with TypeScript
• React Hooks
• Async Communication to the Open Weather API
• Basic Styling

You can find the code here on GitHub. The tutorial is broken up into 6 steps spread over 2 blog posts and the code repository contains the end result of each step in…

A look at how both statically and dynamically typed languages have pros and cons and how we should identify the benefits and choose languages that provide the best of both worlds.

I coach developers in both statically and dynamically typed languages. Several of the courses I teach can be delivered equally well in JavaScript or TypeScript. Python and Java courses are both very popular.

Internally as well we have good debates over the relative merits of dynamic vs static languages. My colleague Ryan Adams made great points about choosing good software development practices over relying on static typing and showed…

In this article I’ll take a look at some new features in TypeScript 4.1 — namely Template Literal Types, Key Remapping and Recursive Conditional Types. At the end I’ll show some crazy examples of using these features to do a bit of meta-programming.

New Features in TypeScript 4.1

I’ve always loved TypeScript and the language just keeps getting better with each evolution. 4.1 has lots of interesting new features. Here I’m going to look at:

• Template Literal Types
• Key Remapping in Mapped Types
• Recursive Conditional Types

Template Literal Types

TypeScript has supported string literals types since 1.8.

type Beatles = "John" | "Paul" | "George" | "Ringo"

These…