Use MUI (Emotion) sourcemaps with Vite
When running npm run dev, the project runs locally and everything works fine. The only thing that doesn't work out of the box, are MUI sourcemaps. For those of you who don't know,...
Read moreReact useImperativeHandle: Let the parent trigger functions of a child component
In React, the way of communicating between parent and child components is usually done in 2 ways; the parent sends `props` to the child and the child can send data back to the parent...
Read moreHow to fix "The AzureDevOps SDK is already loaded" for the azure-devops-extension-sdk package
I recently ran into an issue when developing an Azure DevOps extension. I was using the azure-devops-extension-sdk package get data from the Azure DevOps project I was running the...
Read moreConsuming multiple GraphQL endpoints using Apollo Client
View on GitHub Imagine this, you spent day and night working on the perfect web application. You worked together with the backend devs to craft the smoothest and most stable GraphQL...
Read moreNx + Apollo Server: Automatically generate Typescript types
I created a repository where I show how to automatically generate Typescript types from a GraphQL schema using Nx. This works both while running the 'serve' and the 'build' commands...
Read moreDeploy your Node.js Telegram bot as an Azure Function App
How to create and deploy a Node.js Telegram bot as an Azure Function App using GitHub Actions, and how to develop the bot in a local development environment...
Read moreFront-end development with mock APIs
NodeJS mock server: JavaScript client: --- If you've ever worked with APIs or backend developers these scenarios might sound familiar: - My front-end doesn't work because an API...
Read moreClient-side caching strategy and offline support for SSR websites using the Service Worker
How to cache your client-side assets using the Service Worker when working with a server-side rendered website...
Read morereact-redux-toolkit-starter: a jump-start for every hobby project
A simple React+Typescript+Redux starter project including a neat folder structure, fetching data and global state management...
Read morereact-context-mutex: lock a function and prevent it from running multiple times unwanted
I recently stumbled upon an issue I had to fix. I had created a React hook with a `useEffect` function in which I executed a fetch call. The data was then put into a Redux storage. All...
Read moreRun E2E JavaScript tests in Azure Devops
End-to-end tests are useful for simulating and validating a real user scenario. It is even more useful if you can automate these tests in a continuous integration service like Travis...
Read moreTesting your React components with Jest and @testing-library
There are several different ways of React component testing, but I chose for this particular combination because `create-react-app` uses Jest as their default test...
Read moreUse immer for state manipulation
Have you ever come across a situation where you have a deeply nested state and want you mutate a single property on the deepest level? You could do that using destructuring, but that...
Read moreCreate a simple API caching layer using Typescript
Caching API requests is something that's often forgotten, even though it can possibly improve performance and reduce use of resources. The implementation can be really simple, as I...
Read moreUse the Netlify CMS select widget with dynamic values
What I wanted to achieve was a custom select widget, filled with dynamic values, thus not set in the config.yml. The default select widget of the Netlify CMS is very useful though,...
Read moreGenerate your Netlify CMS config.yml using Typescript
Regularly while working with a Netlify CMS you need the config.yml file to configure your entire CMS. I found this to be suboptimal and wanted to use the power of Typescript to...
Read more