Notes

in JavaScript operator

JavaScript

in JavaScript operator

The in operator in JavaScript return true if the specified property is in the specified object or its prototype chain.

Note that it cannot be used to search for values in other collections.

This can come in handy when narrowing types in TypeScript.

react-router middleware

react-router

React router middleware

Framework mode has "default" mode and SPA mode. In SPA mode server side rendering is disabled and genrates index.html at build time.

There are difference in these two modes, but let's focus on middleware usage.

Server Middleware

Runs on the server for every request. Because it runs on the server it returns an HTTP Response back up the middleware chain via the next function.

Server middleware is disagned such that it prioritzes SPA behavior and doe not create new network activity by default. Middleware wraps existing requests and only runs when you need to hit the server.

Client Middleware

Runs in the browser for client-side navigation and fetcher calls. It does not have a Response to bubble up the middleware chain.

Since we are already in the client and are alwasy making a "request" to the router when navigating. Client middleware will run on every client navigation, regardless of whether there are loaders to run.

tsconfig extra strictness

TypeScript

TypeScript strictness

TypeScript strict mode enables a set of stricter type checking options. However there are additional flags that can help improve code quality, here are few of them.

  • noImplicitReturns: Ensures all code paths in a function explicitly return a value

  • noUnusedLocals: Flags unused local variables

  • noUnusedPararmetes: Flags unused function parameters

  • noUncheckedIndexedAccess: Makes indexed access return T | undefined instead of T

  • exactOptionalPropertyTypes: Distinguishes between undefined and missing properties