background preloader


Facebook Twitter

Getting started with TypeScript and React. I’ve recently been getting into TypeScript following a lot of positive blogs about it from Tom Dale and others.

Getting started with TypeScript and React

Today I’ll show you how I’ve set up a TypeScript project from scratch that uses React, and Webpack for managing the build process. I’ll also discuss my initial impressions of TypeScript and in particular working with TypeScript and ReactJS. I won’t be going into detail on the specifics of TypeScript’s syntax, but you can read either the TypeScript handbook or the free book TypeScript Deep Dive which will also give you a great introduction to the language. Installing TypeScript and configuring it The first thing to do was install TypeScript locally into my node_modules directory, which I did using Yarn, first using yarn init to create a new project: yarn init yarn add typescript When you install TypeScript you get the tsc command line tool which can compile TypeScript but also create a starting tsconfig.json for you to edit.

Note: I have the . allowSyntheticDefaultImports ERROR in . TypeScript at Slack – Several People Are Coding. When Brendan Eich created the very first version of JavaScript for Netscape Navigator 2.0 in merely ten days, it’s likely that he did not expect how far the Slack Desktop App would take his invention: We use one JavaScript code base to build a multi-threaded desktop application, routinely interacting with native code, targeting Windows, macOS, and Linux.

TypeScript at Slack – Several People Are Coding

Managing large JavaScript codebases is challenging — whenever we casually pass objects from Chrome’s JavaScript to Objective-C just to receive a callback on a different thread in Node.js, we need a guarantee that the individual pieces fit together. In the desktop world, a small mistake is likely to result in an application crash. To that end, we adopted TypeScript (a statically typed superset of JavaScript) and quickly learned to stop worrying and love the compiler. It’s not just us, either: In the 2017 StackOverflow Developer Survey, TypeScript was the third most-loved programming technology.

Static Analysis to the Rescue Giving Back. TypeScript: the missing introduction. The following is a guest post by James Henry (@MrJamesHenry).

TypeScript: the missing introduction

I am a member of the ESLint Core Team, and a TypeScript evangelist. I am working with Todd on UltimateAngular to bring you more award-winning Angular and TypeScript courses. The purpose of this article is to offer an introduction to how we can think about TypeScript, and its role in supercharging our JavaScript development. We will also try and come up with our own reasonable definitions for a lot of the buzzwords surrounding types and compilation.

There is huge amount of great stuff in the TypeScript project that we won’t be able to cover within the scope of this blog post. Table of contents Background TypeScript is an amazingly powerful tool, and really quite easy to get started with. It can, however, come across as more complex than it is, because it may simultaneously be introducing us to a whole host of technical concepts related to our JavaScript programs that we may not have considered before. Static typing: the good parts - Jos de Jong. Tl;dr So far I’ve been hesitant to embrace static type checkers like TypeScript.

Static typing: the good parts - Jos de Jong

It’s because I associated static type checking with the restrictions and interoperability issues that I know from Java and C++. However, it turns out that TypeScript is different: it uses a structural type system rather than a nominal one, which eliminates these downsides. It gives us a way to describe data types without sacrificing flexibility, interoperability, or scalability.

An uneasy feeling Sometimes I have the feeling that I’m supposed to be averse of static typing in order to be a proper JavaScript citizen. The smell of static typing gives me an uncomfortable feeling. My first thought was: when I feel I need static typing in my application… it’s probably a code smell. However, there is more to it. The bad parts Let me try to explain the problem with static typing with a Java example. We can use it like: However, suppose we are using an external library which deals with points too. The good parts. Flow vs TypeScript. Type Systems for JavaScript Oliver Zeigermann / @DJCordhose Why using type systems?

Flow vs TypeScript

IMHO type systems make code easier to maintain type annotations can make code more readable can make code easier to analyse can allow for reliable refactoring can allow for generally better IDE support can catch errors early Most important single use case for me JSON style data structures REST payload config files objects from and to database as a close second place: find usages TypeScript ease of use and tool support over soundness By Microsoft (Anders Hejlsberg) Based on ES6 (probably ES7/ES8) Adds optional type annotations, visibility, and decorators Compiler checks and removes annotations Latest 1.8 release adds more general sane checks External declarations can add type information to pure JavaScript Extensive support in WebStorm and Visual Studio Code Flow.