typescript - MakerX

Sign in Subscribe

typescript

A collection of 15 posts

Catch up on the new NPM Trusted Publishing feature

Catch up on the new NPM Trusted Publishing feature

NPM Trusted Publishing replaces risky long-lived tokens with secure OIDC authentication. Learn how this new feature eliminates token exfiltration attacks and makes publishing packages safer with zero token management overhead.

Running TypeScript Directly with Node.js: No Build Step Required!

Running TypeScript Directly with Node.js: No Build Step Required!

Node.js now supports running TypeScript directly by stripping types at runtime, eliminating the need for a build step. TypeScript 5.8 introduces the erasableSyntaxOnly flag to ensure compatibility. This may streamline workflows and speed up development, although there are limitations to be aware of.

Ensure Node.js OpenTelemetry instrumentations are compatible with installed packages

Ensure Node.js OpenTelemetry instrumentations are compatible with installed packages

Telemetry is a core aspect of monitoring and observability; it helps making sure systems run smoothly, troubleshooting issues after the fact, or being alerted when things go pear-shaped. Losing telemetry seriously hinders those capabilities and it is what happened to me on my most recent project. I was lucky enough

Building a typesafe multi-form action handler in Remix Series - Hooks, proxy and Dispatcher to the rescue

Building a typesafe multi-form action handler in Remix Series - Hooks, proxy and Dispatcher to the rescue

In this series, I build a small Todo application. To begin, I use a combination of Remix, TypeScript, Tailwind CSS, and React. It'll be functional but fragile to change. To address the fragility, I introduce and use Remix Validated Form, a React form library, Zod, a TypeScript-first schema

Building a typesafe multi-form action handler in Remix Series - Remix validated form and Zod

Building a typesafe multi-form action handler in Remix Series - Remix validated form and Zod

In this series, I build a small Todo application. To begin, I use a combination of Remix, TypeScript, Tailwind CSS, and React. It'll be functional but fragile to change. To address the fragility, I introduce and use Remix Validated Form, a React form library, Zod, a TypeScript-first schema

Building a typesafe multi-form action handler in Remix Series - The problem

Building a typesafe multi-form action handler in Remix Series - The problem

In this series, I build a small Todo application. To begin, I use a combination of Remix, TypeScript, Tailwind CSS, and React. It'll be functional but fragile to change. To address the fragility, I introduce and use Remix Validated Form, a React form library, Zod, a TypeScript-first schema

Resizing a cartoon face

Resizing User-Provided Images in the Browser

Many web sites allow users to upload images for later display, for example a company logo or a profile photo. To enable this functionality while also making it easy to use and protecting other users there are some issues that need to be solved: * What if a very large image

You might not be using typeof as much as you could

You might not be using typeof as much as you could

Here I show a handy little trick using the typeof operator in TypeScript to reduce the number of concrete types one might have to create

Build a type-safe event emitter in Node.js using TypeScript

Build a type-safe event emitter in Node.js using TypeScript

How to build a type-safe event emitter in Node.js using TypeScript

Meta-programming magic with Type Script and JavaScript Object Proxies

Meta-programming magic with Type Script and JavaScript Object Proxies

Way back in 2015, ECMAScript 2015 (ES6) introduced amongst a host of other new features, Object Proxies [https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy/Proxy] . An Object Proxy allows you to take an JavaScript object, and wrap it in a proxy type which allows you

Polymorphic, typesafe UI components with React (and Tailwind and Radix Slot)

Polymorphic, typesafe UI components with React (and Tailwind and Radix Slot)

Sometimes you want your buttons to be buttons. Sometimes you want them to be links.

Extracting reusable Tailwind CSS / React components

Extracting reusable Tailwind CSS / React components

A collection of opinions on creating maintainable, reusable and extendable React components using Tailwind CSS

Empowering Event-Driven Architecture using AWS EventBridge

Empowering Event-Driven Architecture using AWS EventBridge

Context Data has become the centre of our lives. We consume many sources of data and handle notifications (i.e. events) from different devices in order to live and work such as requesting Uber or receiving an SMS to pick up your partner. The same is becoming true of many

Next.js code for creating React applications with functional components and React hooks for managing life-cycles

Optimizing React Components with useCallback() hook

Optimization is a crucial part of any application. In React applications this include to mitigate unnecessary renders as well as reducing the rendering time itself. In this article, we'll see how the React useCallback hook can help us to make our application to preform better. Memoization Let'

Pattern: Secure AWS secret handling with TypeScript CDK

Pattern: Secure AWS secret handling with TypeScript CDK

Pattern with code examples for securely handling secrets management and use when using AWS CDK and Lambda.