Blog articles by Jonathan Conway
> Summary: Core concepts in the AI landscape include: > - **Prompts** and **Commands** issued by humans to Assistants > - **Assistants** that use LLM technology to provide useful output > - **Models** (LLM) that Assistants query > - **Skills** and **Tools** that augment Assistants with useful capabilities > - **Commands** issued by humans to Assistants for immediate action > - **Agents** and **Sub…
> Summary: AI, when used by developers, can assist code writing with autocomplete, provide helpful information for diagnosing error messages and technical problems, generate code such as bash scripts and unit tests, summarise technical conversations and provide helpful summaries for code reviews. Over the last couple of years, I've sprinkled AI usage through various typical software engineering…
> Summary: AI-enabled capabilities can be surfaced in user interfaces in a variety of ways, including inline suggestions, single and multi-agent chat, providing hints for filling in inputs and through controls that allow the user to nudge a preview until it matches what they want. As AI capabilities become increasingly available to everyday development teams, it might be useful to explore way to…
 I recently [finished a contract](/work/anz) and updated my job seeker profile. I didn't mark myself as available or make any job applications – I simply updated my profile. Within days I had received many phone calls from internal and external recruiters and scheduled many job interviews. In those job interviews, I deliberately avoided any…
I prefer to avoid anonymous tuples in code. There are 2 main forms of these I see in Javascript/Typescript code: 1. Anonymous function parameters: `fn(param1, param2, ...)` 2. Anonymous function return values: `const [value1, value, ...] = fn()` The reason I avoid them is that that they allow for call-sites where the identities of the values are not clear, making the code at those call-sites less…
> Summary: Code reviews can be made easier and more efficient by following a repeatable process. The process I found useful is: 1. context: gain a high level understanding of the context of the change, 2. scan: read all the code and mark out any immediate issues and questions and follow them up, 3. checklist: rigorously review the code against a code review checklist and leave prioritised…
Have you ever posted a code sample in a discussion thread and wanted to focus the reader on some important parts? You want to emphasise the important parts while "blurring out" the other parts? For example, maybe you want the reader to focus on usage of a particular variable or a particular branch of a conditional. Here I find "code sketches" can be useful. We take a piece of code, keep its…
> Summary: Combinators (from functional programming) can be used to generate data-driven tests that cover many combinations of inputs, without having to spell out every possible combination in code. Have you recently tried to unit test a function which has many combinations of possible inputs and expected outputs? An increasingly common way of writing such a test is to utilize a data-driven test.…
It's best practice to keep an eye on dependency updates, especially where security fixes are needed. This can help us to avoid [software supply chain vulnerabilities](https://owasp.org/Top10/2025/A03_2025-Software_Supply_Chain_Failures/), which often feature in the OWASP Top 10. Many organisations use an automated pipeline tool, such as [Dependabot](https://github.com/dependabot), to continuously…
As a Front End Engineer – a weird yet oddly common cross between software engineer and designer – I made three self-discoveries early on: 1. I am often looking for work 2. I care about aesthetics 3. I can hack almost anything Thus, necessity proved the mother of invention, and I found myself striving to produce a CV worthy of my profession. ## Selecting a word processor This might seem like a…
> Summary: React components can be diagramming in a UML-like format, depicting Components, Component calls (with props and render props), Functions and Types or Interfaces. After working on a [Typescript diagram format](/articles/diagramming-ts) I wanted to focus on a React equivalent. Diagrams can be useful for various purposes: - Designing a solution at a high-level before writing any code -…
> Summary: Typescript structures can be diagramming in a UML-like format, depicting Interfaces and Types (including inheritance and composition), Enums and Functions (including parameters and return types) as rectangles, with suitable connecting lines. As the practice of front-end development grows and evolves, front-end developers find themselves working with increasingly complex problem domains,…
> Disclaimer: The information and the links provided here are for general information only and should not be taken as constituting professional advice. You should always seek professional advice and do your own research when making any financial decisions. > Summary: eTIBs, bought directly and held to maturity, can help to protect you against medium-to-long-term inflation in Australia, sitting…
Flaky tests are tests that produce inconsistent and non-deterministic results, sometimes passing and sometimes failing. They can undermine the reliability of testing processes and complicate software development by masking real issues and wasting time. Flaky tests are particularly difficult to debug and fix because of their non-determinism. We cannot simply go through the usual development cycle…
I thought I would share my front end development checklist. ## Why I use a checklist Many who worked with me will know I'm a big fan of checklists. I think a good checklist can benefit you in several ways. - **It helps you get started.** When the task ahead seems overwhelming, such as reviewing a giant pull request, you can just start with the first checklist item and keep going from there. - **It…
> Summary: Observability can be applied to front end code, specifically: user events, HTTP events and browser events. Tracing can reveal all the events in a particular user-system interaction, while querying across events can identify patterns and anomalies or just learn more about how the system functions. Observability can be surfaced in documentation, empowering all members of a…
> Summary: Interaction wireframes depict a user interface at low fidelity including additional information on each component and interactions – how the interface responds to user activity. It’s nearly 2021, so I thought I’d share a small achievement of 2020: **A way of depicting interactions in UI wireframes!** Background: I've been doing a lot of complex UI work lately. In the process I've been…
In this article I want share the keyboard shortcuts that I use on a daily basis, in various environments. Advantages of using shortcuts: - Shave off a few seconds or milliseconds, hundreds of times over. The time savings really add up. - Make you look smarter in screen sharing sessions, live demos and pairing. - They're just fun to use! ## Visual Studio Code…
Imagine you're a new joiner in a corporate environment. You are faced with a complex network of systems: databases, servers, platforms, logs, etc. They're all scattered around various wiki pages, chat messages, etc. You have the challenge of trying to get your head across everything fast enough to be useful to the team. **You need a map of where to find everything.** When you get hit with a new…
> Summary: To lose unwanted fat in a healthy, sustainable, frugal and environmentally-friendly way, follow a whole-food plant-based low-fat diet and perform steady fasted cardio and strength exercises on a daily basis. Over the last few years I've been making steady progress toward getting in better shape. It's not been a straight path, but I'm pleased to report that I've been able to get very…
> Summary: Manual testing offers distinct and powerful benefits such as understanding system behaviour with minimal documentation, verifying changes rapidly in multiple environments and empathising with end-users. Structuring your manual test efforts compounds these benefits. While automated testing methods have been established for a long time in the software development process (e.g. unit,…
> Summary: Recently I started the habit of practicing mindfulness-meditation daily. This resulted in some unique experiences and personal transformation including positive orientation, enhanced awareness and reduced stress. > “Let all those beings which exist -- > without enemies, without obstacles, overcoming their grief > and attaining happiness, be able to move freely, > each in the path…
> Summary: Rigorous use of mock data can benefit complex, long-term software projects by thinking about examples during modelling, providing unit test inputs, quickly simulate any desired application state and decouple immediate inter-team dependencies. The costs including the need to structure the application in a suitable manner and the time/effort to add mock data. Mock data, dummy data, fake…
> Summary: The problem was: how to load a list of items, then load details of each item, then combine all of this information and render it to the user, all within one component. This could be done more easily by splitting details into a separate component, rendered in a `map` loop, and having each instance of that component make its own request. Recently I had to build a React component that…
> Summary: Using a generic HOC creator pattern, I can compose two React components together in a highly decoupled way. The pattern is to create a HOC (Higher-Order Component) creator function, which can be applied to a general component by a combined components and exported for re-use by consumer components. Examples of applications include Tooltips and Form controls. I've recently developed a…
> Summary: Understanding and documenting existing systems and code can be a better use of time than large-scale refactoring. This is particular the case in fast-growth businesses, where time is limited and pragmatic concerns outweigh code aesthetics. Most of the software projects I've worked on involved complex and poorly structured code. This can happen for various reasons, even with the most…
> Pull-quote: “The word 'isomorphism' applies when two complex structures can be mapped onto each other, in such a way that to each part of one structure there is a corresponding part in the other structure, where "corresponding" means that the two part play similar roles in their respective structures.” > > – Douglas HOFSTADTER > > [Gödel, Escher, Bach](/books/godel-escher-bach) • Meaning and…
## Motivation Engineers are increasingly called upon to provide on-call support for complex software running in production. To ease the diagnosis and resolution of issues in these systems, it can be beneficial to be able to ***simulate*** – at will – any of the important states the system can be in. This article covers what I've learned thus-far about simulation for the purposes of easing…
> Summary: Completing an Introduction to Calculus taught me a range of interesting lessons including lessons about learning, such as the importance of understanding fundamentals, visualisation, geometric analogies, parts vs. whole, focussing on correcting mistakes and thinking deeply about small things. > Pull-quote: “I never regretted the time I spent on history and on math. Math sharpens > your…
> Summary: Subformats is a technique by which I extend an established format (such as Markdown), to add my own custom features, while remaining backwards-compatible, so I can re-use the content with third-party tools. Let's face it: even the most versatile formats can become limiting. For example, Markdown seems to support every kind of textual element we could ever want. Yet there will always be…
I have mixed feelings about Tailwind, having used it on a [client project](/work/optus), built a [Typescript adapter](/projects/tailwindjs) for it and my own website for a while (before switching to [Vanilla Extract](https://vanilla-extract.style/)). On one hand, it seems to have been overhyped and targeted to developers who want to throw stuff together fast, with the predictable result of messy,…
> Summary: The BDD-style "Given/When/Then" syntax adds an additional learning curve and can be cumbersome for long flows. I suggest an alternative: numbered lists of steps and expectations marked out with an "Observe" prefix. ## Introduction Over the years several [acceptance testing frameworks](https://en.wikipedia.org/wiki/Acceptance_testing#List_of_acceptance-testing_frameworks) have risen and…
There are many good reasons to make our software applications accessible. But to achieve this goal, we must undertake rigorous accessibility testing. This presents what may look like an overwhelming challenge: given that there are so many criteria for good accessibility, and that the application itself may be complex in many ways, **how do we verify that all parts of the application are…
> Summary: Using a checklist, and a mindset of expecting and seeking out bugs, we can eliminate bugs from our code before going to production. Software with zero bugs may seem like an ambitious goal. Over time, defects in software have increased and have become so normalised that some developers and users even expect them. But while it's difficult to get to zero bugs, I think it's worth trying…
What do we need assertions for? Doesn't the type system in Typescript already enforce our data types? The answer is: yes, the type system protects us at compile type, **but not at runtime**. Assertions can help us catch and handle *unexpected* bad data types. Error messages from failed assertions can be better than the default type errors (from our framework, language run-time, etc) in two…
> Summary: Typescript's built-in enum structure can be replaced with better patterns. These include an object constant pattern or a class-based pattern. The advantages of these patterns include flexibility over value types, IDE auto-suggest features and encapsulation of methods. Typescript's built-in `enum` structure is woefully inadequate, to the point that even the Typescript team saw fit to…
> Summary: User flows help digital teams get on the same page and view the user interface and interactions holistically. User flows are typically made up of screens and components, nodes and connectors and notes and links. Collaboration can take the form of comments and annotation sessions. When building a digital product on a team of almost any size and composition, I've found it helpful to get a…
> Summary: To understand how a code-base is connected and functions at runtime, we can use execution flows. These map the paths through the code as it executes the code in real life. A rigorous format can map directly to the code-base, enabling an accurate depiction. An appropriate format can be fed into a tool such as Mermaid, to generate a visual flowchart. Anyone who has spent some time…