Using the NX Web Plugin to Scaffold a Static HTML Site

Introduction Nx is a tool that manages monorepos and standardises tooling within that monorepo. As part of these standards, Nx provides a set of tools that allow users to quickly generate a static vanilla HTML website, without any complicated tooling. Prerequisites To begin, make sure we have an Nx workspace setup. npx create-nx-workspace@latest <workspace-name> ✔ Which stack do you want to use? · none ✔ Package-based monorepo, integrated monorepo, or standalone project?...

May 25, 2024 · Joel Tok

The Benefits of a Component Library, for Non-Technical Readers

Introduction Component libraries are a tool that have been around for nearly a decade in the frontend world, yet it is still not a tool widely adopted in many organisations. Software engineers who work directly on the frontend have a better opportunity to understand – with nuance – the usefulness of component libraries in terms of longer-term productivity. This article is an attempt to convince non-technical folk of the same. The comes with the belief that with more understanding, comes more willingness to bite the bullet, and see the use of component libraries as an investment, more than a cost....

May 13, 2024 · Joel Tok

Solar-powered Lights – Do They Really Pay For Themselves?

Introduction to Our Problem I recently went to a grand uncle’s house. Evening hit as we were sitting on the patio, and a string of solar-powered lights lit up. It was a cool idea. Just hang up a bunch of solar lamps where there was sun, and voila! Free light at night. But it also got me curious: do these solar lamps actually pay for themselves in cost savings? Is the light that they produce really free?...

April 27, 2024 · Joel Tok

A Guide to Understanding Unfamiliar Nx Plugins

Introduction This is a short guide to help us understand how we can deciper an existing Nx plugin, to figure out what it does. A basic understanding of Nx plugins will be useful to the reader. Understanding the Plugin’s Behavior Entrypoint The best place to start our investigation is with a few files at the root of the plugin. generators.json migrations.json executors.json These are the entrypoints that define all tasks that the plugin will be able to undertake....

April 14, 2024 · Joel Tok

Does an off-peak Battery Make Sense for Me?

Introduction The basic idea behind an off-peak battery is to use cheaper power during an off-peak period to charge up a battery, then use that power during a peak period when such power would be more expensive. This article is meant to provide back-of-the-envelope calculations to help you decide if such a battery setup makes sense for you. Marginal Savings – A Litmus Test Given transfer and battery efficiency losses, we want to make sure that the difference in price makes up for the efficiency losses of storage....

April 8, 2024 · Joel Tok

How to Search for a File by its Name in VS Code

The Problem Over the years I’ve often needed to search for specific files by their name in Visual Studio Code, but never figured out how to do it. I had always assumed that a Command F would reveal the file to me, but nope, that always only searched within files. So I’ve had to always resort to using complicated bash commands from search engine results (searching a new method each time I needed to do this), or literally trying my luck poking at folders in a random search....

April 7, 2024 · Joel Tok

Nx is a Standardisation Tool

The way Nx is Marketed Nx is a build system with built-in tooling and advanced CI capabilities. It helps you maintain and scale monorepos, both locally and on CI. The above is a description of Nx taken directly from the nx.dev homepage. To me the keywords in this mission-statement-like paragraph are “build system” and “monorepo”. When I first read this, I came away with the idea that it was a way to create and enable monorepos, and automatically handle CI/CD....

March 17, 2024 · Joel Tok

Understanding Power Density

Introduction When trying to figure out the Power Density of different batteries and fuel sources, the resources encountered both on the web and in scientific papers seemed confused. Definitions were presented in terms of power per unit volume, power per unit mass, some even unique measures like in terms of volume per unit time. Which is correct? I explore this question in this article. Foundational Knowledge Let’s begin with something foundational and likely more familiar to the general reader: Energy Density (more familiar) and Specific Energy (less familiar)....

March 4, 2024 · Joel Tok

Setting HTML Standards Compliant Boolean Attributes with different Frameworks

Problem Many component libraries, especially those built with vanilla Web Components, follow a specific way of dealing with boolean attributes, specified by the HTML Living Standard. Many Frameworks however do not apply the same standards and patterns in their approach, including but not limited to, frameworks that rely on JSX. We try to reconcile these two, by showing how we can use standards compliant syntax in some JavaScript frameworks. What does the Standard say The HTML Living Standard states that...

March 2, 2024 · Joel Tok

Exposing Lit Element Attribute and Properties for Outside Use

Problem Building a Lit Element component, and defining their properties for internal consumption is very well explained. However, in this article we are interested more with how to define the interface between our lit element and its consumer. In other words, we want to examine how to set lit element attributes and properties from outside of the component, and use these in the component. We also want to understand some of the intricacies and quirks associated with this process....

February 24, 2024 · Joel Tok