John Reilly

Standard.site Docusaurus with Sequoia

How to add Standard.site support to a Docusaurus site with Sequoia

ts-loader goes webpack 4... again!

TypeScript webpack loader `ts-loader@9.6+` now supports webpack 4.

Only Node.js subpaths with no-restricted-imports and perfectionist/sort-imports

This post will show you how to migrate to using Node.js subpaths and how to use the no-restricted-imports and perfectionist/sort-imports ESLint rule to help you sort your imports.

npmx.dev: with a little help from my friends

This post will show you how to contribute to npmx.dev and share my experience with the project.

Full-stack static typing with OpenAPI TypeScript and Microsoft.AspNetCore.OpenApi

This post will show you how to write full stack applications with static typing from back to front using OpenAPI, TypeScript and .NET.

Yargs: statically typed builder commands

This post demonstrates how to use Yargs to create statically typed commands with builders in TypeScript.

Where AI-assisted coding accelerates development — and where it doesn’t

AI-assisted coding has transformed software development. However, it also introduces challenges around code quality, architectural decisions, and maintaining foundational engineering skills. This post…

Keeping front end and back end in sync with NSwag generated clients

By generating clients from OpenAPI specs, it is possible to have integration tests that check your front end and your back end are aligned. This post will show you how to do that using NSwag.

Azure DevOps: merging pull requests with conventional commits

How to merge a pull request in Azure DevOps and maintain a git commit history of conventional commits, using the Azure DevOps API and build validations.

Azure DevOps: merging pull requests and setting autocomplete with the API

How to merge a pull request in Azure DevOps or set it to autocomplete using the Azure DevOps API Client for Node.js.

Azure DevOps: using DefaultAzureCredential in an Azure Pipeline with AzureCLI@2

How to use DefaultAzureCredential in an Azure DevOps pipeline in the same way as you can locally.

Azure DevOps: pull requests and dynamic required reviewers

How to have dynamically assigned required reviewers for a pull request in Azure DevOps using build validations and the Azure DevOps Client for Node.js.

TypeScript is going Go: Why it’s the pragmatic choice

TypeScript is being ported to Go. This is a reflection on the port, and what it means for the TypeScript ecosystem.

Microsoft Graph client: how to filter by endswith

Learn how to filter by endswith using the Microsoft Graph client. This is a common use case when working with Azure AD groups.

List Pipelines with the Azure DevOps API

Learn how to list the Azure Pipelines in a project using the Azure DevOps REST API with TypeScript and the continuation token.

Static Web Apps CLI: local authentication emulation with ASP.NET

The Static Web Apps CLI has a local authentication emulator. This is a useful tool for local development, and can be used with ASP.NET authentication. This post shows how.

Node.js, Azure Application Insights, and Fastify

Learn how to set up a Node.js with Azure Application Insights and Fastify.

Get Service Connections with the Azure DevOps API (REST and TypeScript)

Learn how to get service connections with the Azure DevOps REST API using both curl and TypeScript.

Slash command your deployment with GitHub Actions

Slash commands are a great way to interact with your GitHub issues. In this post, we look at how to implement a `/deploy` slash command to deploy an Azure Container Apps service with GitHub Actions.

Smuggling .gitignore, .npmrc and friends in npm packages

The npm publish command will not just package up .gitignore and .npmrc files. This post shows how to use zipping and unzipping with postinstall and prepare scripts to include these files into your npm…

npx and Azure Artifacts: the secret CLI delivery mechanism

By combining npx and Azure Artifacts, you can deliver your command line application to consumers in a way that is easy to use and secure.

Azure Artifacts: Publish a private npm package with Azure DevOps

Azure DevOps has a feature called Azure Artifacts that supports publishing npm packages to a feed for consumption. This post shows how to publish a private npm package with Azure DevOps.

Introducing azdo-npm-auth (Azure DevOps npm auth)

Azure DevOps npm auth eases setting up local authentication to Azure DevOps npm feeds, particularly for non Windows users.

Azure DevOps API: Set User Story column with the Azure DevOps Client for Node.js

It is possible to set the column of a User Story in Azure DevOps with the Azure DevOps Client for Node.js, but the mechanism is surprising.

module ws does not provide an export named WebSocketServer

Resolve the ws npm issue: SyntaxError: The requested module ws does not provide an export named WebSocketServer

Static Typing for MUI React Data Grid Columns

The MUI React Data Grid can be used with static typing to ensure the columns you pass to the component are correct. This post will show you how to do that.

typescript-eslint with JSDoc JavaScript

You can use typescript-eslint with JSDoc JavaScript to get the benefits of linting powered by type information in a JavaScript codebase; this post shows you how.

Using AZD for faster incremental Azure Static Web App deployments in GitHub Actions

Learn how to speed up deployments of Azure Static Web Apps in GitHub Actions using the AZD command.

Using AZD for faster incremental Azure Container App deployments in Azure DevOps

Learn how to speed up deployments of Azure Container Apps in GitHub Actions using the AZD command.

MUI React Tree View: pass data to TreeItem

Learn how to pass arbitrary data to individual nodes in the MUI treeview component so individual nodes can be customised; for instance implementing a loader.

Static Web Apps CLI: improve performance with Vite server proxy

The Static Web Apps CLI has a slow proxy server. This post shows you how to improve performance by using Vite server proxy instead.

Dual Publishing ESM and CJS Modules with tsup and Are the Types Wrong?

Learn how to publish a package that supports both ECMAScript modules (ESM) and CommonJS modules (CJS) using tsup and Are the Types Wrong?

MUI React Tree View: check children, uncheck parents

Learn how to use the MUI treeview component with behaviour that selects child nodes when parents are select and deselects parent nodes when children are deselected.

Serialising ASP.NET method calls for later execution

How can we take a method call, serialise it, perhaps store it in a database, and then later rehydrate and execute?

Large Language Models, Open API, View Models and the Backend for Frontend Pattern

To integrate LLMs with APIs, there is a need for the LLM equivalent of view models and the backend for frontend pattern. This discusses it in the context of Semantic Kernel.

Using Kernel Memory to Chunk Documents into Azure AI Search

To build RAG (Retrieval Augmented Generation) experiences, where LLMs can query documents, you need a strategy to chunk those documents. Kernel Memory supports this.

Overview of webpack, a JavaScript bundler

webpack is a JavaScript bundler that helps you bundle your code into a single file. It's a great tool for optimizing your code and improving performance.

Azure Cosmos DB: container items and generics

Learn how to use generics to store and retrieve different types of object in an Azure Cosmos DB Container. And how to deserialize the data property into a C# object of a specific type.

Text-first MUI Tabs

Learn how to use the MUI tabs component in a text first way that remains strongly typed.

Generate a Word document in ASP.NET

Learn how to generate a Word document using the Open XML library in ASP.NET.

Configure Azure connection strings and keys in Azure Bicep

Learn how to configure Azure resources like Azure Static Web Apps and Azure Container Apps with connection strings and access keys in Azure with Bicep.

Multiline strings in .env files

Learn how to use multiline strings in .env files.

ESLint no-unused-vars: _ ignore prefix

ESLints no-unused-vars is more flexible than TypeScript noUnusedLocals and noUnusedParameters. Here is how to make respect the TypeScript default of ignoring variables prefixed with _

Using Bun in Azure Pipelines

Bun is a fast JavaScript runtime which can be used to speed up the TypeScript / JavaScript you have. This post shows you how to use it in Azure Pipelines.

Bicep lint with Azure Pipelines and GitHub Actions

Bicep lint allows you to lint bicep files to ensure they conform to best practices. In this post we'll look at how to run bicep lint in Azure Pipelines and GitHub Actions.

Schemar: a GitHub Action to validate structured data

This post demonstrates how to use Schemar to validate structured data using a GitHub Action.

Snapshot log tests in .NET

This post demonstrates how to write high quality and low effort log assertions using snapshot testing.

Overview of Bun, a JavaScript runtime

Bun is a new, fast, TypeScript-first, npm compatible-first JavaScript runtime. This is a walkthrough of it!

How we fixed my SEO

In October 2022 traffic to my site tanked. Growtika collaborated with me to fix it. This is what we did. Read it if you're trying to improve your SEO.

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

Learn how to get the Azure Active Directory group names and ids from the Graph API using the C# SDK.

Migrating to v4 Azure Functions Node.js with TypeScript

Learn how to migrate a TypeScript Azure Functions app to the v4 Node.js programming model.

Bicep: Link Azure Application Insights to Static Web Apps

Learn how to link Azure Application Insights to an Azure Static Web App using Bicep.

Docusaurus 3: how to migrate rehype plugins

Learn how to migrate rehype plugins to Docusaurus 3.

Azure Open AI: generate article metadata with TypeScript

Use the TypeScript Azure Open AI SDK to generate article metadata.

TypeScript: The Movie

A documentary has been made about TypeScript and I feature in the story of how it came to be what it is today.

Azure Open AI: handling capacity and quota limits with Bicep

This post details how to control the capacity of an Azure Open AI deployment with Bicep so that you don't exceed your quota.

Azure Pipelines meet Vitest

This post details how to integrate the test runner Vitest with Azure Pipelines.

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

Azure Container Apps supports custom domains with "bring your own certificates" and this post demonstrates how to do it with Bicep.

TypeScript 5.1: declaring JSX element types

With TypeScript 5.1, it becomes possible for libraries to control what types are used for JSX elements. This post looks at why this matters.

Azure Container Apps, Bicep, managed certificates and custom domains

Azure Container Apps support managed certificates and custom domains. However, deploying them with Bicep is not straightforward. This post explains how to do it.

Azure Container Apps, Easy Auth and .NET authentication

Azure Container Apps support Easy Auth. However, .NET applications run in ACAs do not recognise Easy Auth authentication. This post explains the issue and solves it.

Private Bicep registry authentication with AzureResourceManagerTemplateDeployment@3

You can deploy Bicep to Azure with the dedicated Azure DevOps task; however authentication to private Bicep registries is not supported. This post shares a workaround.

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

With Node.js 18, the Static Web Apps CLI fails to connect to the API - there is a way to fix this.

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

TypeScript deprecated tsconfig.json option "importsNotUsedAsValues": "error" in 5. You can make type imports explicit with CommonJS if you use ESLint consistent-type-imports.

Migrating Azure Functions from JSDoc JavaScript to TypeScript

Azure Functions can be written in JavaScript or TypeScript. This post will demonstrate how to migrate an Azure Function from JSDoc JavaScript to TypeScript.

Teams Direct Message API with Power Automate

Teams does not have a public API for sending direct messages to people rather than channels. This post describes a workaround using Power Automate and the Teams Notification API.

Docusaurus: Structured Data FAQs with MDX

This demos how to make an MDX component that renders FAQs into a page, and the same information as Structured Data. It also shows how to use it with Docusaurus.

Bicep user defined types and Bash single item arrays

The error "Expected a value of type \'Array\', but received a value of type \'String\'", presents when wrestling with the AZ CLI, Bash single item arrays and Bicep.

Playwright, GitHub Actions and Azure Static Web Apps staging environments

Azure Static Web Apps staging environments allow you to test changes before they go live. This shows how to use Playwright against staging environments.

Migrating from ts-node to Bun

Migrating from ts-node to Bun is surprisingly easy - this post ports a console app from ts-node to Bun and compares performance.

Node.js 18, Axios and unsafe legacy renegotiation disabled

With Node.js 18, unsafe TLS legacy renegotiation was disabled. Some APIs still need it and SSL inspection can downgrade TLS. This post shows an Axios workaround.

In defence of pull requests

Some people feel that pull requests are a barrier to contribution. I disagree.

Docusaurus blogs: adding breadcrumb structured data

Docusaurus blogs can add breadcrumb structured data to their blog posts. This post shows how to add it using the JSON-LD format.

Migrating from GitHub Pages to Azure Static Web Apps

How to migrate from GitHub Pages to Azure Static Web Apps, using Bicep and GitHub Actions to deploy.

Docusaurus blogs: using the createFeedItems API with git commit date

The Docusaurus createFeedItems API can be used to tweak RSS feeds for your blog. This post shows how to use it with the git commit date.

Image Optimisation with the TinyPNG API

Image optimisation can be automated with the TinyPNG API. This post demonstrates how to do that.

Docusaurus: improving Core Web Vitals with fetchpriority

By using `fetchpriority` on your Largest Contentful Paint you can improve your Core Web Vitals. This post implements that with Docusaurus.

How I ruined my SEO

In October 2022 traffic to my blog dropped like a stone. What happened?

Azure Pipelines - Node.js 16 and custom pipelines task extensions

Support for Node.js 16 for Azure Pipelines custom pipelines task extensions has arrived. From a TypeScript perspective, this post documents how to migrate.

Using Application Insights with Bicep to monitor Azure Static Web Apps and Azure Functions

Application Insights are a great way to monitor Azure Static Web Apps and Azure Functions. But how do you deploy that using Bicep? Let's find out!

Serving Docusaurus images with Cloudinary

Cloudinary offers an image CDN which can improve performance of your site. This post details how to get Docusaurus to use Cloudinary to serve optimised images.

Azure Static Web Apps: dynamic redirects with Azure Functions

Azure Static Web Apps can perform URL redirects using the `routes` section in the `staticwebapp.config.json`. However it is limited. This post will demonstrate dynamic URL redirects with Azure Functio…

Azure Static Web Apps: build app externally

Azure Static Web Apps can generally build themselves with Oryx. If you need finer grained control of your build, you can with `skip_app_build: true`.

Publishing Docusaurus to dev.to with the dev.to API

The dev.to API provides a way to cross post your Docusaurus blogs to dev.to. This post describes how to do that with TypeScript, Node.js and the dev.to API.

Deep linking with Azure Static Web Apps and Easy Auth

Azure Static Web Apps does not support deep linking with authentication. This post describes how to work around this limitation.

Docusaurus: Using fontaine to reduce custom font cumulative layout shift

Custom font usage can introduce cumulative layout shift (or "jank") to your website. This post shows how to use fontaine to reduce this with Docusaurus sites.

Adding lastmod to sitemap based on git commits

This post demonstrates enriching an XML sitemap with `lastmod` timestamps based on git commits.

XML: read and write with Node.js

This post demonstrates reading and writing XML in Node.js using fast-xml-parser. We will use the Docusauruses XML sitemap as an example.

Azure AD Claims with Static Web Apps and Azure Functions

Authorization with Azure Static Web Apps linked to Azure Functions has an issue. Azure AD app role claims are not supplied; this post will demo a workaround.

Debugging Azure Functions in VS Code on Mac OS

The VS Code debugging mechanism for Azure Functions on Mac OS frequently breaks. This post documents an approach to get it working.

Getting started with the Web Monetization API

The Web Monetization API is a browser API streams payment from the browser to the website. This post walks through getting started adding it to a site.

Bicep: Static Web Apps and Linked Backends

Azure Static Web Apps can be linked to Azure Functions, Azure Container Apps etc to provide the linked backend for a site. This post provisions with Bicep.

TypeScript Unit Tests with Debug Support

Unit tests are an important part of the development process. This post will outline how to write unit tests using TypeScript and how to debug them as well.

Faster Docusaurus builds with swc-loader

This post demonstrates how to speed up your Docusaurus build by using SWC and the `swc-loader` for webpack.

React: storing state in URL with URLSearchParams

The React `useState` hook is a great way to persist state. This post demos a simple React hook that stores state in the URL querystring.

Reverse engineering the Azure Application Insights Transactions URL

This post reverse engineers the Azure Application Insights Transactions URL, showing how to make a link href, using both TypeScript and C#.

Swashbuckle and schemaId is already used

Swashbuckle can fail to generate a swagger / Open API document with the message "The same schemaId is already used...". This post offers a way forward.

Terry Pratchett and the Azure Static Web Apps

Terry Pratchett has a HTTP header: X-Clacks-Overhead. This post shows how we can make Azure Static Web Apps join in.

Get Build Validations with the Azure DevOps API

Use the Azure DevOps API to acquire the build validations a project uses. This post shows you how using curl and the Node.js API.

Azure Static Web Apps: Failed to deploy the Azure Functions

Azure Static Web Apps presently have an issue which blocks deployment of Azure Functions with the message "Failed to deploy the Azure Functions". What is it?

Azure Container Apps: dapr pubsub

This post shows how to build and deploy two Azure Container Apps using Bicep and GitHub Actions which communicate using daprs pubsub building block.

TypeScript 4.7 and ECMAScript Module Support

As part of the TypeScript 4.7 release comes a major upgrade to ECMAScript Module Support for Node.js. This post takes a look at what that means.

Azure Static Web Apps: Node.js 16 / 18 and Oryx

Azure Static Web Apps presently fixes to Node.js 14 when building. If you require a different version of Node to build, here is how.

Azure Static Web Apps: named preview environments with Azure DevOps

Azure Static Web Apps have just released a new feature for Azure DevOps users called "named preview environments". Let us have a look

Upgrading to React 18 with TypeScript

The upgrade of the React type definitions to support React 18 involved some significant breaking changes. This post the upgrade path.

Type annotations: strong types, weakly held

Type annotations is a proposal which would allow for the inclusion of types in JavaScript code. Here is a description of the proposal and some thoughts.

ESLint your C# in VS Code with Roslyn Analyzers

ESLint provides linting for TypeScript and JavaScript in VS Code. A similar experience is available for C# in VS Code through Roslyn Analyzers.

Azure DevOps: consume a private artifact feed

To build applications both locally and in an Azure Pipeline using Private Azure Artifact feeds with Azure DevOps, follow these steps.

Lighthouse meet GitHub Actions

This post illustrates how to integrate Lighthouse into a GitHub Actions workflow for an Azure Static Web App.

Swashbuckle & inheritance: Give. Me. The. Types

For API endpoints that return multiple types, you can use inheritance with Swashbuckle to get create a Swagger / Open API definition; here is how.

Azure Static Web Apps - a Netlify alternative

Azure Static Web Apps are a new offering from Microsoft. This post looks at what they are and how they compare to Netlify.

Lazy loading images with Docusaurus

Docusaurus websites can implement native lazy-loading of images, you can by writing a Rehype plugin.

Azure Container Apps: dapr, devcontainer, debug and deploy

Build and deploy two Azure Container Apps using Bicep and GitHub Actions, communicate using dapr, build, run and debug in VS Code using a devcontainer.

Preload fonts with Docusaurus (updated 03/11/2022)

Improve website performance by preloading web fonts in Docusaurus using `webpack-font-preload-plugin` or `headTags` API, as described in this tutorial.

Query deployment outputs with the Azure CLI

Discover how to query Azure deployment outputs using the Azure CLI, bash, and jq, and convert them to GitHub Action job outputs.

Azure Container Apps: build and deploy with Bicep and GitHub Actions

Learn how to deploy a web app to Azure Container Apps using Bicep and GitHub Actions. This post covers the configuration and deployment of secrets.

Azure Container Apps, Bicep and GitHub Actions

Learn how to deploy an Azure Container App to Azure with Bicep and GitHub Actions. A basic template is provided for deployment.

Open Graph: a guide to sharable social media previews

Create sharable social media previews with Open Graph tags. Learn the required tags, testing tools, and platform rendering issues in this guide.

Azure Static Web App Deploy Previews with Azure DevOps

This post describes a pull request deployment preview mechanism for Azure Static Web Apps inspired by the Netlify offering.

TypeScript vs JSDoc JavaScript

JSDoc annotations in JavaScript codebase add a new dynamic to the debate between JavaScript and TypeScript. It allows for type checking of JavaScript code.

Azure standard availability tests with Bicep

Learn how to deploy Azure standard tests using Bicep! This post goes through the process and includes a complete code snippet.

NSwag generated C# client: Open API property name clashes and decimal types rather than double

Generate C# and TypeScript client libraries from OpenAPI / Swagger definitions using NSwag while overcoming language conflicts and numeric types.

Docusaurus, meta tags and Google Discover

Boost your websites appearance in Google Discover with high-quality images and `max-image-preview:large` meta tag setting in Docusaurus.

Structured data, SEO and React

Add structured data to your website to help search engines understand your content & get it in front of more people. Example shown in a React app.

Permissioning Azure Pipelines with Bicep and Azure RBAC Role Assignments

Learn to permission Azure Pipelines to access resources through RBAC role assignments with Bicep. Includes examples and integration tests.

Google APIs: authentication with TypeScript

This guide shows how to use TypeScript to authenticate and access Google APIs with OAuth 2.0, specifically the Google Calendar API.

Bicep: syntax highlighting with PrismJS (and Docusaurus)

Learn how to write attractive code snippets about Bicep using PrismJS and Docusaurus. This post shows you how to add syntax highlighting for Bicep.

Publish Azure Static Web Apps with Bicep and Azure DevOps

Learn how to deploy Azure Static Web Apps using Bicep and Azure DevOps, including workarounds for common deployment issues.

TypeScript 4.4 and more readable code

TypeScript 4.4 introduces "Control Flow Analysis of Aliased Conditions" which improves code readability by more expressive and less repetitive code.

TypeScript, abstract classes, and constructors

TypeScript abstract classes cannot be directly instantiated, but only used as a base for non-abstract subclasses with specific constructor usage rules.

Directory.Build.props: C# 9 for all your projects

Learn how to use C# 9 with .NET Core by creating a `Directory.Build.props` file. All projects in the solution will support C#9 with no further steps.

webpack? esbuild? Why not both?

Using both webpack and esbuild for faster builds is possible with esbuild-loader. This post guides through using it with webpack and migrating to it.

Output connection strings and keys from Azure Bicep

Learn how to acquire connection strings and access keys in Azure with Bicep using the `listKeys` helper, and optionally consume them in Azure Pipelines.

C# 9 in-process Azure Functions

Learn to use C# 9 with .NET Core 3.1 Azure Functions in this step-by-step guide by adding new elements to your .csproj file.

React 18 and TypeScript

Upgrade React to `@next` and add new type definitions to use React 18 alpha with TypeScript. Use `ReactDOM.createRoot` API.

Azure Functions and .NET 5: Query params, Dependency Injection, Bicep & Build

The upgrade of Azure Functions from .NET Core 3.1 to .NET 5 is significant. This post shows part of the upgrade: Query params, Dependency Injection, Bicep & Build

Azurite and Table Storage in a dev container

Learn to use Azurite v3 in a dev container to access the Table Storage API in preview for local development without a real database.

Create a Pipeline with the Azure DevOps API

Learn how to create an Azure Pipeline using the Azure DevOps REST API with a personal access token and JSON file, as detailed in this post.

Blog Archive for Docusaurus

Learn how to add a blog archive to your Docusaurus blog and browse through historic posts. Follow the articles steps to implement.

The Service Now API and TypeScript Conditional Types

Learn how to model ServiceNow REST API results using TypeScript conditional types to minimise repetition and remain strongly typed.

ts-loader goes webpack 5

TypeScript webpack loader `ts-loader` has released version 9.0.0, with support for webpack 5 and a minimum supported Node version of 12.

Hello World Bicep

Bicep simplifies Azure Resource Management through concise syntax. The "Hello World" example highlights how Bicep outperforms ARM templates.

Bicep meet Azure Pipelines 2

With Azure CLI, Bicep can be run in Azure Pipeline with minimal effort. Compile Bicep to ARM in a simple one-liner bash step.

Bicep meet Azure Pipelines

Bicep is a more readable alternative to ARM templates. Though no Bicep task is available yet, Azure CLI can still deploy Bicep.

RSS update; we moved to Docusaurus

A blogger migrated to Docusaurus and GitHub Pages, shares feed updates, with new Atom and RSS feeds and all historic links still working.

The definitive guide to migrating from Blogger to Docusaurus

Learn how to transfer a Blogger website to Docusaurus without losing content. Use a TypeScript console app to convert HTML to Markdown.

Managed Identity, Azure SQL and Entity Framework

Managed Identity provides secure, developer-friendly access to Azure SQL databases without the need for usernames and passwords.

NSwag: TypeScript and CSharp client generation based on an API

NSwag simplifies APIs by auto-generating OpenAPI specs and clients. Learn to create TypeScript clients from NSwag using a .NET console app.

Goodbye Client Affinity, Hello Data Protection with Azure

How to use ASP.NET Data Protection to remove the need for sticky sessions with Client Affinity

Making Easy Auth tokens survive releases on Linux Azure App Service

To prevent authentication issues during restarts or deployments, Microsoft is recommending Blob Storage for Token Cache to store and fetch tokens.

Azure App Service, Health checks and zero downtime deployments

Azure App Service enables zero downtime deployments using health checks and deployment slots. Automated swapping slots ensure constant service.

Azure RBAC: role assignments and ARM templates

ARM templates can help define Azure Role-Based Access Control. By creating role assignments, users can grant Managed Identities access to resources.

ASP.NET, Serilog and Application Insights

Learn how to integrate Serilog into Azures Application Insights for better diagnostic logging by following these steps and adding dependencies.

Azure Pipelines Build Info in an ASP.NET React app

Surface build metadata using Azure Pipelines and ASP.NET for both client and server builds in your app with this tutorial.

Azure App Service, Easy Auth and Roles with .NET and Microsoft.Identity.Web

The `Microsoft.Identity.Web` library has authorization issues with roles. A `IClaimsTransformation` can map claims to fix the problem.

Azure App Service, Easy Auth and Roles with .NET

"Easy Auth" in Azure App Service doesnt currently work with .NET Core and .NET due to discrepancies. Open-source middleware can help solve the issue.

react-query: strongly typing useQueries

Learn how to strongly type `useQueries` in `react-query` with `useQueriesTyped`. A wrapper function provides the strongly-typed API.

Create React App with ts-loader and CRACO

Create React App now supports TypeScript with React, using Babel webpack loader or `ts-loader`. You can use CRACO to customize configurations.

Azure Pipelines meet Jest

Learn how to integrate Jest with Azure Pipelines to run tests as a part of your pipeline and utilize results reporting in the Azure Pipelines UI.

dotnet-format: Prettier your C# with lint-staged & husky

Standardise C# formatting with `dotnet format` and `lint-staged`. Customise formatting and integrate with `husky` in this guide.

Make Microsoft.Identity.Web respond with 403 forbidden instead of a 302 redirect

The `Microsoft.Identity.Web` library redirects to AccessDenied with a 302 (redirect) status code. Learn to return a 403 (forbidden) status code instead.

Nullable reference types; CSharp's very own strictNullChecks

C# introduces nullable reference types similar to TypeScripts `strictNullChecks`. Enabling raises warnings and solves null reference risks.

azure-pipelines-task-lib and isOutput setVariable

This is a workaround for custom Azure Pipelines task extension to output variable since the library does not support "isOutput=true."

Visual Studio Marketplace: images in Markdown!

Publish your README/index.md and associated images to Visual Studio Marketplace.

Bulletproof uniq with TypeScript generics (yay code reviews!)

Code reviews provide opportunities for improvement. A developer shares how their colleagues comment led to the creation of a better “uniq” function.

Throttling data requests with React Hooks

A custom React Hook `useThrottleRequests` is used to solve the problem of loading large amounts of data gradually and displaying loading progress.

Azure DevOps Client for Node.js - GitApi / WikiApi limitations

The Azure DevOps Node.js client library has limitations and missing features. Workarounds are possible for using Azure DevOps REST API directly.

Safari: The Mysterious Case of the Empty Download

Safari requires a `Content-Type` header in responses to avoid empty downloads. Providing a `Content-Type` header resolved an authentication issue.

Autofac 6, integration tests and .NET generic hosting

Integration tests using Autofac have been affected by a long-standing issue in .NET Core 3.0. Alternative approaches may not last long.

Why your team needs a newsfeed

A newsfeed was built to narrow the gap between an online platform team and their users. It generates real-time stories in Markdown with links.

Devcontainers AKA performance in a secure sandbox

Speedy ASP.NET Core and JavaScript development is made possible by devcontainers, which isolate tools and code to improve productivity.

Devcontainers and SSL interception

Developers may need to overcome MITM certificate issues to use devcontainers, which can optimize productivity for new starters when developing software.

Task.WhenAll / Select is a footgun 👟🔫

The writer warns against LINQ code that causes concurrent API requests and shares plans for better metrics and a development container.

Autofac, WebApplicationFactory and integration tests

A bug in ASP.NET Core v3.0 thwarts swapping in Autofac as an IOC container in WebApplicationFactory tests. A workaround exists.

From react-window to react-virtual

Switch from `react-window` to `react-virtual` for simpler code, TypeScript support and improved perceived performance.

Up to the clouds!

Migrating ASP.NET Core app from on-prem to cloud with Kubernetes, Docker, Jenkins, Vault & Azure AD Single Sign-On for greater efficiency.

Offline storage in a PWA

Learn how to use IndexedDB for offline storage in your web app or PWA with the IDB-Keyval library and a React custom hook.

Dual boot authentication with ASP.NET

The article explains how to have different authentication methods for two classes of users accessing an app. Code snippets are provided.

Web Workers, comlink, TypeScript and React

Learn how to use Web Workers in a React app using Googles comlink library. Offload long-running calculations to a separate thread.

From create-react-app to PWA

Learn how to build a basic Progressive Web App with React and TypeScript, as well as how to add features like code splitting and deployment.

LICENSE to kill your PWA

Creating `.LICENSE` files caused issues for a PWA. The `terser-webpack-plugin` was changed to make `.LICENSE.txt` files instead.

EF Core 3.1 breaks left join with no navigation property

When upgrading from .NET Core 2.2 to 3.1, an invalid LEFT JOIN error was encountered. The issue was resolved by adding Navigation property.

Teams notification webhooks

Learn how to automate notifications using Microsoft Teams and Markdown webhooks, and discover how to use ASP.Net Core to send notifications.

Definitely Typed: The Movie

The history of the TypeScript GitHub project Definitely Typed. And some TypeScript history as well

Start Me Up: ts-loader meet .tsbuildinfo

TypeScript 3.4 introduced `.tsbuildinfo` files for faster compilations. With TypeScript 3.6, APIs landed to enable third party tool integration.

Coming Soon: Definitely Typed

The story of Definitely Typed, a project aiming to provide type definitions for JavaScript libraries, from creation to top 10 in GitHub in 2018.

Symbiotic Definitely Typed

New approach by `react-testing-library` improves TypeScript experience. Type definitions are maintained separately for `@testing-library/react`.

ASP.NET Core authentication: hard-coding a claim in development

The DevelopmentModeAuthenticationHandler allows ASP.NET Core developers to hard code user authentication claims during development, easing testing.

Using TypeScript and ESLint with webpack (fork-ts-checker-webpack-plugin new feature!)

The `fork-ts-checker-webpack-plugin` adds support for ESLint. Replace TSLint with related packages in `package.json` and configure with `.eslintrc.js`.

TypeScript / webpack - you down with PnP? Yarn, you know me!

Yarn PnP speeds up module installation and eliminates node_modules. Converting to it is easy but some rough edges exist.

TypeScript and high CPU usage - watch don't stare!

High CPU usage in watch mode on idle due to TypeScripts fs.watchFile. fs.watch recommended instead. Env variable controls file watching.

react-select with less typing lag

Fix lagging in `react-select`. Change `filterOption` to `ignoreAccents: false` for faster typing experience with 1000+ items.

Template Tricks for a Dainty DOM

Wrapping data in HTML templates can help with performance. This trick kept rendering server-side but only rendered content when necessary.

Google Analytics API and ASP.Net Core

Accessing Google Analytics API from ASP.Net Core can be tough due to lack of examples. This article provides an example code to get page access stats.

fork-ts-checker-webpack-plugin v1.0

`fork-ts-checker-webpack-plugin` released v1.0.0 with TypeScript 3+ support, incremental watch API by default, and compatibility with webpack and TSLint.

ASP.NET Core: Proxying HTTP Requests with an AllowList

ASP.NET Core can proxy HTTP requests selectively, allowing only acceptable traffic via a middleware for specified paths.

TypeScript and webpack: Watch It

TypeScripts "watch" API shortens time between incremental builds for quicker development; updates are available for fork-ts-checker-webpack-plugin.

GitHub Actions and Yarn

Automate npm publishing using GitHub Actions; use `npm` GitHub Action with yarn or any Docker container with Node/npm installed.

You Might Not Need thread-loader

Jan Nicklas, the creator of webpack-config-plugins, suggests limiting the use of thread-loader for costly operations via `poolTimeout: Infinity`.

IMemoryCache and GetOrCreateForTimeSpanAsync

IMemoryCache is a tremendous caching mechanism for .NET. This post demonstrates how to write a helper to allow you to get or create an item for a given TimeSpan.

Snapshot Testing for C#

Snapshot testing is an efficient test technique for comparing outputs with JSON. Its applicable to C# too, using Fluent Assertions and a helper tool.

Making a Programmer

Learn programming in a relaxed atmosphere with a coding bootcamp that values repetition, feedback and team facilitation.

Brand New Fonting Awesomeness

Learn how to use brand icons with Font Awesome 5 in React with these helpful instructions on @fortawesome/free-brands-svg-icons.

ts-loader Project References: First Blood

ts-loader now supports TypeScripts project references. However, composite projects built with `outDir` on Windows cannot be consumed by ts-loader... yet

Semantic Versioning and Definitely Typed

Definitely Typed lacks semantic versioning, causing build failures. Use specific package versions, and breaking changes can be positive.

Using TypeScript and webpack alias: goodbye relative paths

Use TypeScript with webpack alias to avoid long relative paths in imports. Try `path mapping` or `resolve.alias`. Use `tsconfig-paths-webpack-plugin`.

Azure App Service: nested configuration for ASP.NET running in Web App for Containers using Application Settings

Learn how to configure an ASP.NET application in Azure App Service Web App for Containers without colons. Use a double underscore instead.

Cypress and Auth0

The article explains how to automate Auth0 login using Cypress, by using the auth0-js client library, and creating a custom command.

VSTS and EF Core Migrations

Learn how to migrate Entity Framework database migrations during an ASP.NET Core project deployment with a console app using VSTS and Azure.

VSTS... YAML up!

Visual Studio Team Services now has a YAML build definition preview feature that enables users to keep their build scripts with their code.

Compromising: A Guide for Developers

Weighing opinions with a voting system can reduce friction and boost productivity when working with developers of different opinions.

Using Reflection to Identify Unwanted Dependencies

Learn how to identify unwelcome dependencies in complex web apps by walking a dependency tree using reflection-based tests.

It's Not Dead 2: mobx-react-devtools and the undead

Using `mobx-react-devtools` with `process.env.NODE_ENV` caused problems with webpack production mode. A different approach fixed the issue.

Uploading Images to Cloudinary with the Fetch API

Learn how to handle image uploads to Cloudinary using Fetch instead of SuperAgent with a sample code demonstrating the replacement of FormData.

It's Not Dead: webpack and dead code elimination limitations

webpack eliminates dead code through DefinePlugin. Directly use `process.env.NODE_ENV !== production` for smarter code elimination by UglifyJSPlugin.

ts-loader 4 / fork-ts-checker-webpack-plugin 0.4

webpack 4 has been released, along with updates for ts-loader and fork-ts-checker-webpack-plugin. See links for details and examples.

Finding webpack 4 (use a Map)

webpack 4s new plugin architecture requires migrating from "kebab-case" to "camelCase". A migration guide for plugins and loaders is available.

webpack 4 - ts-loader / fork-ts-checker-webpack-plugin betas

The TypeScript ts-loader beta to work with webpack 4 is now available, along with the fork-ts-checker-webpack-plugin, which complements ts-loader.

Auth0, TypeScript and ASP.NET Core

Auth0 makes authentication and authorization simple. They offer Auth-As-A-Service, quick start and easy customization of settings.

ts-loader 2017 retrospective

ts-loader has improved in 2017, now sitting at v3.2.0 and supporting webpack 2 and 3. Future plans include using the new watch API.

The TypeScript webpack PWA

Learn how to turn a TypeScript, webpack setup into a PWA using Workbox. With service workers, build offline-capable web apps.

TypeScript Definitions, webpack and Module Types

Inconsistent module exports cause confusion while using the npm package big.js, leading to `one definition to rule them all.`

Working with Extrahop on webpack and ts-loader

John shares his excitement for working with talented individuals on open source software - its everywhere and a privilege to work on.

fork-ts-checker-webpack-plugin code clickability

The `fork-ts-checker-webpack-plugin` can speed up builds, but TypeScript errors in the terminal are not clickable. The cause and solution are explained.

TypeScript + webpack: Super Pursuit Mode

Learn how to improve build speeds with TypeScript and webpack using fork-ts-checker-webpack-plugin, HappyPack, and thread-loader/cache-loader.

Oh the Glamour of Open Source

A programmer recounts a sleepless night spent fixing a gap in an open source project, but accidentally deletes the repo and eventually seeks help.

Karma: From PhantomJS to Headless Chrome

Replace PhantomJS with new Chrome Headless to run Chrome without a UI. Migrate a test and add Chrome to your build environment.

A Haiku on the Problem with SemVer: Us

A Haiku on the Problem with SemVer: Us

Dynamic import: I've been awaiting you...

TypeScript 2.4 gains asynchronous, dynamic import expression for modules with no browser support. Webpack2 supports this feature.

Windows Defender Step Away From npm

A bug causing issues with Windows Defender has been fixed with the release of VS Code 1.14. The bug was causing problems with the program open.

TypeScript: Spare the Rod, Spoil the Code

TypeScript settings catch bugs. Use compiler options to increase strictness gradually & catch errors such as unused variables with VS Code.

Setting Build Version Using AppVeyor and ASP.Net Core

AppVeyor doesnt have support for setting version of a binary in dot net core, but it can be done easily through PowerShell.

I'm looking for work!

Full stack developer John Reilly seeks new work after finishing recent contract. 15 years’ experience includes telecoms, advertising, tech and finance.

Debugging ASP.Net Core in VS or Code

Learn how John became a fan of VS Code for TypeScript and how they managed to debug ASP.Net Core using the extension for C#.

Under the Duck: An Afternoon in Open Source

A minute-by-minute account of how open source developers fixed an issue with ts-loader and webpack, demonstrating the collaborative nature of the community.

@types is rogue

Type definitions from Definitely Typed under @types namespace on npm cannot be trusted to follow semantic versioning, leading to breakages.

Hands-free HTTPS

CloudFlare provides free HTTPS certificates. As HTTPS becomes the web default, it is essential for search engine ranking and service workers.

webpack: resolveLoader / alias with query / options

Webpacks enhanced-resolve has a bug with aliased loaders. A workaround involves suffixing the aliased path with query options.

webpack: configuring a loader with query / options

webpack 2 now enforces a strict schema for `webpack.config.js`. Loaders should be configured using `query` or `options`.

Using ts-loader with webpack 2

TypeScript loader ts-loader has made its loader compatible with webpack 2. The update allows greater compatibility between the two applications.

webpack: syncing the enhanced-resolve

How to create a sync webpack resolver instead of the default async resolver using `enhanced-resolve`.

My Subconscious is a Better Developer Than I Am

In which I wonder if my subconscious is a better developer than I am, as solutions seem to come to mind, bypassing the work I consciously put in.

But you can't die... I love you!

How John Reilly becomes main caretaker of ts-loader, fixing bugs and actively maintaining the project to encourage communal contributions.

React Component Curry

React 0.14 introduces stateless functional components to reduce code for components where state isnt required, while also allowing for currying.

TypeScript 2.0, ES2016 and Babel

Upgrading from ES2015 to ES2016 using TypeScript compiler and Babel can be done in a few steps, including a change to tsconfig.json.

Integration Tests with SQL Server Database Snapshots

Discover the benefits of using database snapshots for integration tests to reduce complexity & errors in this informative article.

The Ternary Operator <3 Destructuring

ES2015 destructuring allows setting multiple variables using the ternary operator. Change the return type of each branch to an object for this to work.

Understanding webpack's DefinePlugin (and using with TypeScript)

webpack's DefinePlugin allows you to create global constants which can be configured at compile time; here's how to use it with TypeScript

Creating an ES2015 Map from an Array in TypeScript

TypeScript `Map` initialization from an `Array` is discussed with a workaround using a type assertion of ` as [string, string]`.

The Mysterious Case of webpack, AngularJS and jQuery

Angular can use jQuery instead of jQLite, but this becomes complicated when using webpack. We need to use the ProvidePlugin function in webpack.config.js.

Inlining Angular Templates with WebPack and TypeScript

`raw-loader` package in webpack configuration for Angular 1.x projects preloads templates and enables compile-time error checking.

Instant Stubs with JSON.Net (just add hot water)

A utility class can create stubs to test an untested system with complex I/O. Serializing complex data to JSON files eases the process.

Concatting IEnumerables in C#

Author proposes clean alternatives to `IEnumerable`s concatenation which entail creating custom extensions & using nulls for null-conditional operator.

Atom - Recovering from Corrupted Packages

Atom packages corrupt? Locate `.apm` folder at `[Your name]/.atom`, then delete. On reopening Atom, packages will be restored.

TFS 2012 meet PowerShell, Karma and BuildNumber

This guide explains how to run PowerShell scripts for TFS 2012 build processes and how to publish Karma test results in the platform.

Creating Angular UI Routes in the Controller

Dont let your Angular UI Router link get too big - move the URL generation to the controller! Use the $state.href() method instead of ui-sref.

Visual Studio, tsconfig.json and external TypeScript compilation

Visual Studio will not gain support for tsconfig.json until TypeScript 1.8, so using external compilation may be preferable.

TFS 2012, .NET 4.5 and C# 6

Use C# 6 features on .NET 4.5 with Visual Studio 2015, set MSBuild Arguments and install Microsoft.Net.Compilers on the old build server.

Coded UI and the Curse of the Docking Station

Coded UI tests struggle with docking stations due to resolution changes, causing the mouse to miss the element its aiming for.

UseStaticFiles for ASP.Net Framework

Learn how to prevent exposing static files to the public when working with ASP.Net Framework. Discover how to implement an allowlist approach.

Live Reload Considered Harmful

Live Reload is a popular development tool that refreshes web pages automatically, however, its usefulness is questionable. It can disrupt app design.

ES6 + TypeScript + Babel + React + Flux + Karma: The Secret Recipe

Learn how to set up a powerful TypeScript-React workflow with webpack, gulp, Karma, and inject in this comprehensive article.

IQueryable... IEnumerable... Hmmm...

The debate surrounding passing IQueryable<T> as IEnumerable<T> is discussed. Changing the method signature is proposed as a solution.

The Names Have Been Changed...

John changes the domain name of his blog from .io to .com to save money and has set up a redirect from old site to new one.

jQuery Validation Globalize hits 1.0

jQuery Validation Globalize plugin now supports Globalize 1.x, with minor code changes. Users can customize date parsing format.

Definitely Typed Shouldn't Exist

Using TypeScript definition files with npm packages can produce accurate typing information. Making npm a first class citizen may replace Definitely Typed.

Things Done Changed

Embracing change is key to being a developer; John discusses some of the tools that have taken his fancy, including React and ES6.

(Top One, Nice One) Get Sorted

John creates a way to use .NETs LINQ feature to sort JavaScript arrays. The tools allow sorting by one or more criteria.

Upgrading to Globalize 1.x for Dummies

Migrating to Globalize 1.0, which modularized the code, requires a significant amount of work, as shown by John Reilly’s examples.

npm please stop hurting Visual Studio

Windows handling of long paths can be problematic when using Visual Studio with npm; using rimraf for deletions can help until npm 3.0 comes out.

Back to the Future with Code First Migrations

Code First Migrations order is determined by file name, not renaming, and requires changing the IMigrationMetadata.Id property to match.

Angular UI Bootstrap Datepicker Weirdness

Add a calendar glyph to your Angular UI Bootstrap Datepicker popup by passing along $event and calling stopPropagation() to avoid an issue.

NgValidationFor Baby Steps

The NgValidationFor project translates data annotations to Angular validation directive attributes while minimising dependencies.

A tale of Angular, html5mode, ASP.Net MVC and ASP.Net Web API

This article offers tips on how to preserve specific routes while redirecting non-specified URLs to the root angular app page for ASP.Net MVC and Web API.

Tonight I'll Start an Open Source Project...

A new AngularJS validation mechanism aims to propagate data annotations on ASP.NET MVC server models into ng-* directive attributes in HTML.

How to activate your emoji keyboard on Android 5.0 (Lollipop)

Learn how to get emoji on your Android phone by activating the "iWnn IME Japanese" keyboard and selecting the "Emoji" option.

PartialView.ToString()

Learn three ways to turn a `PartialViewResult` into a `string` to reuse the result returned by a controller in a JSON payload.

Hey tsconfig.json, where have you been all my life?

The creation of a "tsconfig.json" file will eliminate the need for "reference" comments when using TypeScript, reducing barriers between IDEs.

Using Gulp to inject scripts and styles tags directly into your HTML

Learn how to use Gulp to directly inject scripts and styles into your HTML, which speeds up app times and makes the setup simpler.

The Convent with Continuous Delivery

Programmer has open-sourced the Poor Clares Arundel website, making tweaks and site updating easier, with continuous delivery and collaboration.

TypeScript: In Praise of Union Types

TypeScript 1.4s Union Types offer a way to specify a value that is of one of many different types and results in a much terser definition file.

Deploying from ASP.Net MVC to GitHub Pages using AppVeyor part 2

To save time, automating open source projects is key. Using AppVeyor and creating static sites with tools like Wget can help update documentation.

Deploying from ASP.Net MVC to GitHub Pages using AppVeyor part 1

John (creator of jQuery Validation Unobtrusive Native) found a way to use GitHub Pages and automate deployment by creating a static version of the app.

Gulp, npm, long paths and Visual Studio.... Fight!

Installing gulp-angular-templatecache plugin caused issues with Visual Studio. A temporary solution is to install lodash.bind at root level.

What's in a (Domain) Name?

"icanmakethiswork" blog has a new domain due to Johns concern about potential changes in Google hosting, now "blog.icanmakethiswork.io".

Pretending to be someone you're not and the dark pit of despair

Workaround for issues with Coded UI impersonation feature. Tests can be unreliable, but the fix works well.

Using Gulp in Visual Studio instead of Web Optimization

The ASP.NET team may replace Web Optimization with Grunt or Gulp. John Reilly tried out Gulp, which concatenates, minimises & version-numbers files.

He tasks me; he heaps me.... I will wreak that MOQ upon him.

Use Moq to simplify async testing, with ReturnAsync method. For testing a class that consumes async API, mock it using Task.Delay with Moqs Returns.

Journalling the Migration of Jasmine Tests to TypeScript

John describes issues migrating Jasmine tests from JS to TypeScript, including tooling, typings, and missing dependencies.

Unit Testing an Angular Controller with Jasmine

John shares how they wrote unit tests for an Angular controller in Proverb using Jasmine 2.0, with heavily annotated JavaScript tests.

Running JavaScript Unit Tests in AppVeyor

AppVeyor and Chutzpah were integrated to run C# and JavaScript unit tests in a single PowerShell script for CI purposes.

My Unrequited Love for Isolate Scope

A new version of the serverError directive is presented without isolated scope after discovering directives can only create one isolated scope.

Getting more RESTful with Web API and IHttpActionResult

Learn how to use HTTP status codes in Web API methods to return successful or failed requests without wrapping the outcomes.

AngularJS meet ASP.Net Server Validation

Learn how to perform server-side validation in your AngularJS and ASP.Net project using a `serverError` directive and server response error messages.

HotTowel-Angular meet TypeScript

Johnny Reilly creates a bare-bones port of the Hot Towel Angular SPA Template to TypeScript in order to demonstrate the ease of transition.

A folk story wherein we shall find dates, DataAnnotations & data impedance mismatch

This article offers developers an attribute-based solution to prevent datetime errors, ensuring that DateTime properties only include dates.

Migrating from AngularJS to AngularTS - a walkthrough

Learn how to migrate an AngularJS app from JavaScript to TypeScript in this walkthrough on a simple website/app for sending prayer requests.

Team Foundation Server, Continuous Integration and separate projects for JavaScript unit tests

Learn how to run JavaScript tests on TFS/VSO by creating a separate unit test project to house tests, and installing Chutzpah on TFS/VSO.

TypeScript, JSDoc and Intellisense

Transforming API documentation into JSDoc for TypeScript: author explains how he enriched popular `jquery.d.ts` file with comments.

TypeScript this is what I want! (the unfortunate neglect of Instance Methods / callback functions)

TypeScripts "Instance Methods" feature solves the `this` keyword issues in classes, unlike prototype methods. It suggests using a combination of the two.

The Surprisingly Happy Tale of Visual Studio Online, Continous Integration and Chutzpah

John recounts his experience with JavaScript unit testing using Jasmine and Chutzpah for integration with Visual Studio and Team Foundation Service.

Knockout + Globalize = valueNumber Binding Handler

Learn how to use Globalize and Knockout to create a "valueNumber" binding handler that makes numeric validation and localization easy.

Caching and cache-busting with RequireJS

Learn how to use "urlArgs" in RequireJS to manage caching and offer a reusable solution for both development and production environments.

TypeScript and RequireJS (Keep It Simple)

This article explains how to mix TypeScript and RequireJS, gives examples of the code changes needed, and shows how to create a demo.

WPF and Mystic Meg or Playing Futurologist

Native client apps will eventually be replaced by rich web apps/SPAs. WPF will become more niche, but wont die, predicts John.

Integration Testing with Entity Framework and Snapshot Backups

The article shows how to use SQL Servers snapshot backups for creating effective integration tests that dont affect production data.

Upgrading to TypeScript 0.9.5 - A Personal Memoir

Upgrade to TypeScript 0.9.5 worth it despite Visual Studio issues. Declaration merging glitches resolved by interface-driven approach.

NuGet and WebMatrix: How to install a specific version of a package

WebMatrix lacks NuGet command line, but users can still install a specific version manually by following the necessary steps - a bit of a challenge.

Simple fading in and out using CSS transitions and classes

Learn to create a fade effect with CSS transitions for improved animation and battery life. Warning: display: none behaves differently than jQuery.

Rolling your own confirm mechanism using Promises and jQuery UI

Learn how to create a custom confirm dialog using jQuery UI’s dialog and promises. The custom dialog is more configurable than the default `window.confirm`.

TypeScript: Don't forget Build Action for Implicit Referencing...

TypeScript files in Visual Studio now implicitly reference each other. This caused problems for some projects and its important to check file settings.

Getting TypeScript Compile-on-Save and Continuous Integration to play nice

Learn how to compile TypeScript in Visual Studio without making TypeScript compilation part of the build process on the server.

Migrating from jquery.validate.unobtrusive.js to jQuery.Validation.Unobtrusive.Native

Migrating from jquery.validation.unobtrusive.js to jQuery.Validation.Unobtrusive.Native is easy, with only minor tweaks to HTML and JS needed.

Using Bootstrap Tooltips to display jQuery Validation error messages

Using tooltips can be a better approach than displaying validation messages next to the element being validated in jQuery Validation.

Announcing jQuery Validation Unobtrusive Native...

jQuery Validation Unobtrusive Native bridges data attributes and jQuery Validations native support. The ASP.Net MVC HTML extension is available on GitHub.

How I'm Using Cassette part 3:Cassette and TypeScript Integration

jQuery Validation - Native Unobtrusive Validation Support!

Use HTML5 data attributes with jQuery Validation to simplify code and achieve validation unobtrusively. Ideal for dynamically added DOM elements.

How I'm Using Cassette part 2:Get Cassette to Serve Scripts in Dependency Order

Cassettes script dependency order feature is the most useful, managing script order manually is tedious. Use server-side or JavaScript asset references.

How I'm Using Cassette part 1:Getting Up and Running

Learn how to serve JavaScript assets efficiently in ASP.Net MVC with Cassette to avoid duplicate scripts and ensure speedy loading.

A navigation animation (for your users delectation)

Adding a CSS animation or GIF can help users navigating an app in an iframe get visual feedback despite the lack of browser feedback tics.

IE 10 Install Torches JavaScript Debugging in Visual Studio 2012 Through Auto Update (Probably)

Learn how to fix missing Script Documents when debugging JavaScript in Visual Studio 2012, likely caused by auto-updating from IE9 to IE10.

Making IE 10's clear field (X) button and jQuery UI autocomplete play nice

IE 10 installed w/o notice on Johns machine, causing issues with jQuery UI auto-complete loading gifs which have been resolved with a CSS fix.

Death to compatibility mode

John discusses compatibility mode in Internet Explorer and suggests using custom HTTP headers or meta tags to prevent rendering and CSS issues.

DecimalModelBinder for nullable Decimals

John forgot that MVCs ModelBinding doesnt handle regionalised numbers well. Provides solution found on Phil Haacks post.

Unit testing ModelState

Testing Model validation in ASP.NET MVC can be accomplished by making use of ModelStateTestController class which simulates the functional tests.

Unit testing MVC controllers / Mocking UrlHelper

This article presents a solution for testing ASP.net MVC controllers, including how to test controllers using UrlHelper.

Using Expressions with Constructors

This article explains how John used LINQs expression to extend a validation class and automatically change the property name.

Twitter.Bootstrap.MVC4 meet Bootstrap Datepicker *and* get your Internationalization on...

Learn how to internationalize ASP.NET web apps using Globalize and Bootstrap Datepicker in this developers comprehensive step by step guide.

Twitter.Bootstrap.MVC4 meet Bootstrap Datepicker

Learn about responsive web design and how to incorporate Twitter Bootstrap and Bootstrap Datepicker into ASP.Net MVC projects in this beginner’s guide.

HTML to PDF using a WCF Service

This ASP.NET WCF service creates PDFs from HTML and is remotely fired with wkhtmltopdf, using `webHttpBinding` for simple service calls.

Getting up to speed with Bloomberg's Open API...

John documents his experience investigating Bloombergs Open API. He includes a simple C# console application wrapper for the API.

XSD/XML Schema Generator + Xsd.exe:Taking the pain out of manual XML

Discover how to use XSD for validating XML and generating C# classes from XSD files, including an online tool to simplify the task.

MVC 3 meet Dictionary

MVC 3 has a Dictionary deserialization bug resolved in MVC 4. Workaround includes using JSON stringify and manual deserialization.

Using Web Optimization with MVC 3

Optimize JavaScript/CSS in MVC 3 through Microsofts NuGet package, bundling jQuery, jQuery UI, jQuery Validate and Modernizr.

Unit Testing and Entity Framework: The Filth and the Fury

Controversy arises over Unit Testing with Entity Framework & MOQ. A simple class could be used to wrap all Entity Framework code.

Giving OData to CRM 4.0

The article explains how to create an OData service to access Dynamics CRM 4.0 by using LINQ to CRM provider and WCF Data Services.

Globalize and jQuery Validation

A jQuery plugin has been replaced by Globalize and makes locale specific number and date formatting easy with Javascript; a tutorial on how to use it.

How to attribute encode a PartialView in MVC (Razor)

Find out how to attribute encode PartialView HTML in Razor/ASP.Net MVC with the HTML helper method `PartialAttributeEncoded`.

ClosedXML - the real SDK for Excel

Closed XML simplifies Excel document creation for developers with its straightforward API, sitting on top of Open XML. A frustration-solver for many!

jQuery Unobtrusive Validation (+ associated gotchas)

Implement unobtrusive jQuery validation in your MVC application using HTML 5 data attributes to simplify code maintenance and reduce mistakes.

Rendering Partial View to a String

John solves a problem with Partial Views in ASP.NET MVC, allowing simplified code and multiple view nesting.

Optimally Serving Up JavaScript

John describes his "JS second" approach to structuring JavaScript and using HtmlHelper to control the order of scripts in web apps for internal use.

Reasons to be Cheerful (why now is a good time to be a dev)

Easy access to information via Google and the rise of JavaScript, as well as blogs, screencasts, and podcasts have made learning coding easier.

Dad Didn't Buy Any Games

Growing up in the 80s, John didnt have a computer until his father gave him one but with no games, encouraging him to learn programming.

Globalize.js - number and date localisation made easy

Globalize.js is a JavaScript library allowing developers to format and parse numbers and dates in a culture specific fashion for better user experience.

Beg, Steal or Borrow a Decent JavaScript DateTime Converter

ASP.NETs JavaScriptSerializer class is improved through ISO 8601 and a custom converter for better DateTime serialisation.

JSHint - Customising your hurt feelings

JSHint is a tool for evaluating JavaScript code quality. Its configurable, has an extension for Visual Studio and is better than JSLint.

A Simple Technique for Initialising Properties with Internal Setters for Unit Testing

Refactoring a legacy app includes adding unit tests, but properties with internal setters pose a problem. John explores various approaches.

Making PDFs from HTML in C# using WKHTMLtoPDF

Create PDF reports from HTML with WKHTMLtoPDF, an open source tool that renders web pages to PDF, using a simple wrapper class.

WCF - moving from Config to Code, a simple WCF service harness (plus implementing your own Authorization)

John describes his approach to developing a Windows Service-hosted WCF service/client harness, including locking down WCF authorization.

Using the PubSub / Observer pattern to emulate constructor chaining without cluttering up global scope

Pass objects between JavaScript files using PubSub interface to achieve code reusability without global scope pollution. No prototypes needed.

Striving for (JavaScript) Convention

Visual Studio 11 beta resolved issues. John has moved away from Hungarian Notation but retained using "$" as a prefix for jQuery objects.

jQuery Unobtrusive Remote Validation

Learn how to do remote validation with unobtrusive data attributes in ASP.NET MVC. Block validation and re-evaluate it with this hacky solution.

The Joy of JSON

JSON is a lightweight data format that helps create and read JavaScript objects. This article traces its discovery and explains its usefulness.

WCF Transport Windows authentication using NetTcpBinding in an Intranet environment

John explains authentication issues when migrating from .NET Remoting to WCF. The post highlights a security feature and suggests solutions.

A Potted History of using Ajax (on the Microsoft Stack of Love)

Discovering Ajax and JSON transformed Johns approach to programming by lifting limitations and improving performance.

JavaScript - getting to know the beast...

Discovering jQuery and advice from Elijah Manor and Douglas Crockford changes Johns initial dislike of JavaScripts quirks.

What on earth is jQuery? And why should I care?

What is jQuery? Discover the truth about the JavaScript library thats taking the web development world by storm - its simply brilliant!

jqGrid - it's just a far better grid

jqGrid is a sleek & efficient grid component for ASP.NET projects. Its minimal data exchange between client and server impressed John no end.

Standing on the Shoulders of Giants...

John starts a blog inspired by Scott Hanselman to share useful tools and techniques for web development.