Skip to main content

Overview of Bun, a JavaScript runtime

· 14 min read
John Reilly
OSS Engineer - TypeScript, Azure, React, Node.js, .NET
Megan Lee
Content Marketing Manager

Like Node.js and Deno, Bun is a JavaScript runtime that provides a faster development experience while you’re building frontend applications. It’s gaining ground as a competitor to these widely used runtime environments — and for good reason.

In this evaluation guide, we’ll explore the features that make Bun an excellent choice for developing fast, performant, error-free frontend apps. By the end of this article, you’ll have a clear understanding of when and why you should use Bun in your projects.

title image reading "Bun overview: whats cooking" with the Bun logo

How we fixed my SEO

· 33 min read
John Reilly
OSS Engineer - TypeScript, Azure, React, Node.js, .NET
Growtika
A dedicated SEO and growth marketing firm for dev-focused, cybersecurity, fintech and deep tech startups

We might also call this:

I ruined my SEO and a stranger from Hacker News help me fix it

This is a follow up to my "How I ruined my SEO" post. That was about how my site stopped ranking in Google's search results around October 2022. This post is about how Growtika and I worked together to fix it.

As we'll see, the art of SEO (Search Engine Optimisation) is a mysterious one. We made a number of changes that we believe helped. All told, my site spent about a year out in the cold - barely surfacing in search results. But in October 2023 it started ranking again. And it's been ranking ever since.

I put that down to the assistance rendered by Growtika. What was the nature of that assistance? I'll tell you. This post is a biggie; so buckle up!

title image reading "How we fixed my SEO" with images of graphs trending upwards in the background

Graph API: getting users Active Directory group names and ids with the C# SDK

· 8 min read
John Reilly
OSS Engineer - TypeScript, Azure, React, Node.js, .NET

The Graph API is a great way to get information about users in Azure Active Directory. I recently needed to get the names and ids of the Active Directory groups that a user was a member of. Here's how to do it with the C# SDK.

I'm writing this post as, whilst it ends up being a relatively small amount of code and configuration required, if you don't know what that is, you can end up somewhat stuck. This should hopefully unstick you.

title image reading "Graph API: getting users AD group names and ids with the C# SDK" with the Azure Graph and C# logos

Migrating to v4 Azure Functions Node.js with TypeScript

· 9 min read
John Reilly
OSS Engineer - TypeScript, Azure, React, Node.js, .NET

There's a new programming model available for Node.js Azure Functions known as v4. There's documentation out there for how to migrate JavaScript Azure Functions from v3 to v4, but at the time of writing, TypeScript wasn't covered.

This post fills in the gaps for a TypeScript Azure Function. It's probably worth mentioning that my blog is an Azure Static Web App with a TypeScript Node.js Azure Functions back end. So, this post is based on my experience migrating my blog to v4.

title image reading "Link Azure Application Insights to Static Web Apps with Bicep" with the Bicep and Azure Static Web App logos

Bicep: Link Azure Application Insights to Static Web Apps

· 3 min read
John Reilly
OSS Engineer - TypeScript, Azure, React, Node.js, .NET

If you're looking into a Production issue with your Azure Static Web App, you'll want to be able to get to your logs as fast as possible. You can do this by linking your Static Web App to an Azure Application Insights instance. If you've used the Azure Portal to create your Static Web App, the setup phase will likely have done this for you already. But if you're using Bicep to create your Static Web App, you'll need to do this yourself.

This post will show you how to do that using Bicep.

title image reading "Link Azure Application Insights to Static Web Apps with Bicep" with the Bicep and Azure Static Web App logos

Docusaurus 3: how to migrate rehype plugins

· 13 min read
John Reilly
OSS Engineer - TypeScript, Azure, React, Node.js, .NET

Docusaurus v3 is on the way. One of the big changes that is coming with Docusaurus 3 is MDX 3. My blog has been built with Docusaurus 2 and I have a number of rehype plugins that I use to improve the experience of the blog. These include:

I wanted to migrate these plugins to Docusaurus 3. This post is about how I did that - and if you've got a rehype plugin it could probably provide some guidance on the changes you'd need to make.

title image reading "Migrating rehype plugins to Docusaurus 3" with the Docusaurus logos

Azure Open AI: generate article metadata with TypeScript

· 10 min read
John Reilly
OSS Engineer - TypeScript, Azure, React, Node.js, .NET

This post grew out of my desire to improve the metadata for my blog posts. I have been blogging for more than ten years, and the majority of my posts lack descriptions. A description is meta tag that sits in a page and describes the contents of the page. This is what this posts description meta tag looks like in HTML:

<meta
name="description"
content="Use the TypeScript Azure Open AI SDK to generate article metadata."
/>

Descriptions are important for search engine optimisation (SEO) and for accessibility. You can read up more on the topic here. I wanted to have descriptions for all my blog posts. But writing around 230 descriptions for my existing posts was not something I wanted to do manually. I wanted to automate it.

title image reading &quot;Azure Open AI: generate article metadata with TypeScript&quot; with the Azure Open AI / TypeScript logos

TypeScript: The Movie

· One min read
John Reilly
OSS Engineer - TypeScript, Azure, React, Node.js, .NET

I am excited to announce that a documentary has been made about TypeScript! It premiered on YouTube at 5pm British Summertime September 21st 2023.

I had the good fortune to be involved in the making of the documentary. In part this was thanks to my work on Definitely Typed. Another reason was my work on recording the history of DefinitelyTyped.

You can see it on YouTube here or hit play on the embedded video above. Thanks to the Keyboard Stories team for making this happen!

Azure Open AI: handling capacity and quota limits with Bicep

· 4 min read
John Reilly
OSS Engineer - TypeScript, Azure, React, Node.js, .NET

We're currently in the gold rush period of AI. The world cannot get enough. A consequence of this, is that rationing is in force. It's like the end of the second world war, but with GPUs. This is a good thing, because it means that we can't just spin up as many resources as we like. It's a bad thing, for the exact same reason.

If you're making use of Azure's Open AI resources for your AI needs, you'll be aware that there are limits known as "quotas" in place. If you're looking to control how many resources you're using, you'll want to be able to control the capacity of your deployments. This is possible with Bicep.

This post grew out of a GitHub issue around the topic where people were bumping on the message the capacity should be null for standard deployment as they attempted to deploy. At the time that issue was raised, there was very little documentation on how to handle this. Since then, things have improved, but I thought it would be useful to have a post on the topic.

title image reading &quot;Azure Open AI: handling capacity and quota limits with Bicep&quot; with the Azure Open AI / Bicep logos

Azure Pipelines meet Vitest

· 3 min read
John Reilly
OSS Engineer - TypeScript, Azure, React, Node.js, .NET

This post explains how to integrate the tremendous test runner Vitest with the continuous integration platform Azure Pipelines. If you read the post on integrating with Jest, you'll recognise a lot of common ground with this. Once again we want:

  1. Tests run as part of our pipeline
  2. A failing test fails the build
  3. Test results reported in Azure Pipelines UI

title image reading &quot;Azure Pipelines meet Vitest&quot; with the Pipelines and Vitest logos

Azure Container Apps, Bicep, bring your own certificates and custom domains

· 4 min read
John Reilly
OSS Engineer - TypeScript, Azure, React, Node.js, .NET

Azure Container Apps supports custom domains via certificates. If you're looking to make use of the managed certificates in Azure Container Apps using Bicep, then you might want to take a look at this post on the topic.

This post will instead look at how we can use the "bring your own certificates" approach in Azure Container Apps using Bicep. Well, as much as that is possible; there appear to be limitations in what can be achieved with Bicep at the time of writing.

title image reading &quot;Azure Container Apps, Bicep, bring your own certificates and custom domains&quot; with the Azure Container App logos

TypeScript 5.1: declaring JSX element types

· 6 min read
John Reilly
OSS Engineer - TypeScript, Azure, React, Node.js, .NET

A new feature arrives with TypeScript 5.1, it is described as "Decoupled Type-Checking Between JSX Elements and JSX Tag Types".

It's all about handing control of JSX type definitions to libraries. With this feature, libraries can control what types are used for JSX elements. Why does this matter? Great question! Until version 5.1, TypeScript did an imperfect job of representing what is possible with JSX. This feature allows libraries to do a better job of that, and we'll look into it in this post.

It's probably worth saying, that this is a complicated feature. If you don't understand it (and as the author of this post I'll confess that I had to work quite hard to understand it), that is okay. This is a low level feature that is only likely to be used by library / type definition authors. It's a primitive that will unlock possibilites for people writing JSX - but it's something that people will mainly feel the benefit of, without directly doing anything themselves, or necessarily noticing that things have changed for the better.

title image reading &quot;TypeScript 5.1: declaring JSX element types&quot; with the TypeScript logo

Azure Container Apps, Bicep, managed certificates and custom domains

· 6 min read
John Reilly
OSS Engineer - TypeScript, Azure, React, Node.js, .NET

Azure Container Apps support managed certificates and custom domains. However, deploying them with Bicep is not straightforward - although it is possible. It seems likely there's a bug in the implementation in Azure, but I'm not sure. Either way, it's possible to deploy managed certificates and custom domains using Bicep. You just need to know how.

If, instead, you're looking to make use of the "bring your own certificates" approach in Azure Container Apps using Bicep, then you might want to take a look at this post on the topic.

I've facetiously subtitled this post "a three pipe(line) problem" because it took three Azure Pipelines to get it working. This is not Azure Pipelines specific though, it's just that I was using Azure Pipelines to deploy the Bicep. Really, this applies to any way of deploying Bicep. GitHub Actions, Azure CLI or whatever.

If you're here because you've encountered the dread message:

Creating managed certificate requires hostname '....' added as a custom hostname to a container app in environment 'caenv-appname-dev'

Then you're in the right place. I'm going to explain how to get past that error message and get your custom domain working with your Azure Container App whilst still using Bicep. It's going to get ugly. But it will work.

title image reading &quot;Azure Container Apps, Bicep, managed certificates and custom domains&quot; with the Azure Container App logos

Azure Container Apps, Easy Auth and .NET authentication

· 8 min read
John Reilly
OSS Engineer - TypeScript, Azure, React, Node.js, .NET

Easy Auth is a great way to authenticate your users. However, when used in the context of Azure Container Apps, .NET applications do not, by default, recognise that Easy Auth is in place. You might be authenticated but .NET will still act as if you aren't. builder.Services.AddAuthentication() and app.UseAuthentication() doesn't change that. This post explains the issue and solves it through the implementation of an AuthenticationHandler.

title image reading &quot;Azure Container Apps, Easy Auth and .NET authentication&quot; with the Azure Container App logos

Private Bicep registry authentication with AzureResourceManagerTemplateDeployment@3

· 3 min read
John Reilly
OSS Engineer - TypeScript, Azure, React, Node.js, .NET

If you deploy Bicep templates to Azure in Azure DevOps, you'll likely use the dedicated Azure DevOps task; the catchily named AzureResourceManagerTemplateDeployment@3. This task has had support for deploying Bicep since early 2022. But whilst vanilla Bicep is supported, there's a use case which isn't supported; private Bicep registries.

title image reading &quot;Private Bicep registry authentication with AzureResourceManagerTemplateDeployment@3&quot; with the Bicep, Azure and Azure DevOps logos

Static Web Apps CLI and Node.js 18: could not connect to API

· 3 min read
John Reilly
OSS Engineer - TypeScript, Azure, React, Node.js, .NET

I make use of Azure Static Web Apps a lot. I recently upgraded to Node.js 18 and found that the Static Web Apps CLI no longer worked when trying to run locally; the API would not connect when running swa start:

[swa] ❌ Could not connect to "http://localhost:7071/". Is the server up and running?

This post shares a workaround. This works for v1.1.3 or earlier of the Static Web Apps CLI. If you're using v1.1.4 or later, you should not need this workaround. But in that case you might find this post helpful on improving performance with 1.1.4 or later.

title image reading &quot;Static Web Apps CLI and Node.js 18: could not connect to API&quot; with the Static Web Apps CLI and Node.js logos

TypeScript 5: importsNotUsedAsValues replaced by ESLint consistent-type-imports

· 7 min read
John Reilly
OSS Engineer - TypeScript, Azure, React, Node.js, .NET

I really like type imports that are unambiguous. For this reason, I've made use of the "importsNotUsedAsValues": "error" option in tsconfig.json for a while now. This option has been deprecated in TypeScript 5.0.0, and will be removed in TypeScript 5.5.0. This post will look at what you can do instead.

title image reading &quot;TypeScript 5: importsNotUsedAsValues replaced by ESLint consistent-type-imports&quot; with the ESLint and TypeScript logo

Teams Direct Message API with Power Automate

· 10 min read
John Reilly
OSS Engineer - TypeScript, Azure, React, Node.js, .NET
Chris Tacey-Green
Engineer, Architect, Human

I've written previously about sending Teams notifications using a webhook, and it's a technique I've used a lot. But I've always wanted to be able to send a direct message to a user, and that's not possible with the webhook approach. I work with a marvellous fellow named Chris Tacey-Green, and he's figured out a way to do this using Power Automate and the Teams Notification API. I'm going to describe how he did it here, with a little help from him.

It's probably worth saying, both Chris and I work for Investec, and we're going to share some of the things we've learned about using Teams and Power Automate in the hope that it's useful to others. But we're not speaking on behalf of Investec, and we're not suggesting that this is the best way to do things. This is likely in the "do things that do not scale" category. Significantly though, it works!

You will see some screenshots of our internal Teams environment, but we've tried to keep them to a minimum, and we're not going to share any sensitive information.

title image reading &quot;Teams Direct Message API with Power Automate&quot; with a Teams logo