Rich Harris & the rest of the Svelte team have previously mentioned that they use TypeScript with JSDoc instead of .ts files. That gives TypeScript's safety benefits during development and on CI, without an additional build step.
There are a few nuances to this, Pascal Schilp did a great job reviewing the background and benefits behind this decision.
I can't count the amount of times I've defined an object type with unknown string keys and a specific value type.
type Scores = { [key: string]: number;}And despite using it all the time, I can't for the life of me remember the [key: string] syntax.
Today, my problems are solved. Apparently TypeScript has a built in Record type that does exactly that:
type Scores = Record<string, number>;2021-03-25 #laravel #vite-with-laravel #frontend #build-tools #typescript
How to set up TypeScript in Vite with Laravel.
Type inference is the ability to derive types from other pieces of code. TypeScript's type inference is very powerful, even a minimal amount of typing adds a lot of assertions.
Just because you don't need to add types, doesn't mean you shouldn't. This is how I decide when or when not to explicitly add types in TypeScript.
My colleague Ruben released a new Spatie package to generate type declarations in TypeScript from a Laravel application.
Confession: I don't write a lot of tests for my frontend code. This isn't something I talk about a lot because I'm scared of the pitchforks on the horizon.
I write React frontends with TypeScript. I don't don't write tests because I'm lazy, or because I don't have time, I simply don't see a lot of value in the amount of maintenance they require.
Gary Bernhardt wrote an article on how his apps are covered, and it hits the nail on the head.
We don't want tests covering most of our React components, though. That wouldn't help with the main difficulties in writing components:
- We might pass props around incorrectly. TypeScript already solves this problem for us almost completely.
- The components might use the API incorrectly. Again, we've solved this problem with TypeScript.
- The components might look wrong when rendered. Tests are very bad at this. We don't want to go down the esoteric and labor-intensive path of automated image capture and image diffing.
One thing I do write tests for is complex code that isn't coupled to components, like reducers. And the nail gets hit again:
Although we don't test components directly, there are some other parts of the frontend code that are tested directly. For example, we have some high-value tests around some React reducers because they're tricky and full of conditionals.
Read on Are Tests Necessary in TypeScript? executeprogram.com.
Since writing this post, TypeScript has become officially supported in Laravel Mix (version 0.12 and up). There's still some informative stuff in here if you're new to TypeScript, but use the official method if you're on a newer version of Mix!
In a recent Spatie project we decided to give TypeScript a shot for the business critical part of a new application. TypeScript provides static analysis to reduce the chance of introducing bugs, to have self-documenting code, and to improve our tooling (autocompletion!)