OPEN TO WORK

Available for new opportunities! Let's build something amazing together.

Solutions Architect

Hi, I'm Elio Struyf — an Solutions Architect passionate about creating innovative solutions and sharing knowledge with the developer community. With expertise in Microsoft 365, Azure, End-to-End testing, and Developer Tooling, and Productivity. I help teams build better software and deliver exceptional results.

Latest articles

1

December 24, 2021

Taking the good out of the bad experiences, wrapping up 2021

Read more about my personal experiences in the year 2021. Merry Christmas and best wishes for 2022.

2

December 17, 2021

Use React in your VSCode WebView with hot module replacement

In this article I explain how you can integrate a React application into your VSCode webview and make sure Hot Module Replacement is working during development.

3

December 17, 2021

#DevHack: check how your VSCode extension is running

This article describes how you can check if your VSCode extension is running in development, production, or test mode.

4

November 29, 2021

Change is here - Rapid API here I am

Rapid API - The next step in my career. As of 29th of November 2021, I joined Rapid API to become a Lead DevTools Engineer.

5

October 19, 2021

Can an AI be used as a ghostwriter for your articles?

Is an AI able to write the contents of your article? Well, that was a question I had and wanted to find out. In this article I tell you all about it.

6

October 15, 2021

Reviewing Cloudflare Pages to show what it has to offer

In this article I review Cloudflare its Pages service. A service that allows to host your Jamstack websites fast, secure, and easily.

7

October 8, 2021

A look at the features and benefits of the Front Matter CMS

Front Matter has been created with the intention of becoming a simple and easy-to-use CMS. Read more about the features and benefits of the Front Matter CMS.

8

September 24, 2021

How a broken vertebra got me healthier working from home

In June 2021, I broke a vertebra and was only allowed to walk or rest. While sitting was painful, I bought a treadmill and started working while walking.

9

September 2, 2021

Integrating Algolia DocSearch into Next.js like Docusaurus

Learn more about using Algolia's DocSearch documentation scrapper and component in your Next.js website.

10

August 20, 2021

Demystify Microsoft Viva Connections its extensibility model

Are testing out the extensibility model of Viva Connections but are a bit confused about all the components? Read this article to get a better understanding.

11

August 18, 2021

#DevHack: language-specific settings in a VSCode extension

Get to know how you can set language-specific settings straight from within the code of your Visual Studio Code extension.

12

August 16, 2021

#DevHack: How to rename a file from a VSCode extension

In this DevHack we will learn how to rename a file from a vscode extension. If you are looking for a simple appraoch, this will be the one to use.

13

#DevHack: Check if a VSCode extension is running in WSL

Are you developing a Visual Studio Code extension and do you need to know when it is running in WSL? In this article I explain how you can see when this happens

14

Generate open graph preview image in Code with Front Matter

Get to know how you can generate a preview image for your articles by using a custom script and the Front Matter Visual Studio Code extension.

15

#DevHack: Installing Hugo on Windows with WSL

Get to know how you can install Hugo io on Windows by using Windows Subsystem for Linux (WSL) in combination with Homebrew.

16

#DevHack: Authenticate Azure Web PubSub with Azure Functions

Get to know how you can use an Azure Function to retrieve an authentication token for your Azure Web PubSub service.

17

Creating a PWA for your Microsoft Teams app

Progressive Web Apps (PWA) are nothing new, but you see more and more websites implementing them. PWA provides you a way to bring your site as an app to your desktop/tablet/mobile. For Squarl, I first thought of creating a mobile app, but at the beginning of a new product. There is a lot to take care of, which made me

18

#DevHack: Get the shared file info with Microsoft Graph

When you copy and share links from files, it creates a URL from which you cannot determine which file it is. For Squarl, I wanted to find out which file was behind a shared link to show the information about the file. First of all, the shared links look like this: 1https://squarl.sharepoint.com/:x:/s/Squarl/<file-id>"> First, I thought it would be a combination of splitting the

19

Let us go back to the basics. Why I started building Squarl.

Pen and paper, that is all that we needed years ago to start send messages or information from one person to another. This way of communication is still available, as it is effective. People like to go to their mailbox to see if some envelopes are waiting to be opened. At least, that is when we are not expecting bills. When

20

Deploy your Azure Functions as a package from GitHub Actions

For Squarl, I started to implement a couple of improvements for the back-end running on Azure Functions. I created these functions with TypeScript. In the past, I used webpack and later Azure Funcpack to bundle my functions to one file per function. That way, the host does not have to do all those read actions for retrieving the dependencies. As I

21

Deploy your site to Vercel using GitHub Actions and Releases

One of my favorite hosting companies is Vercel as they can provide simplicity and flexibility at the same time. I wanted to control my site’s deployment process on Vercel entirely for a new product I am building. Usually, when you use Vercel in combination with GitHub. It will automatically trigger new deployments when you push code. You can configure it to

22

Securing your Azure Functions with an existing Azure AD app

This article continues the previous article about using the OAuth On-Behalf-Of flow in your Azure Functions. In the last article, the Azure Function only verifies the JWT Token, and if valid, uses it to request an access token and get data on your behalf. infoLink to the previous article about Using OAuth On-Behalf-Of flow in a Node.js Azure Functions. Now you can

23

Using OAuth On-Behalf-Of flow in a Node.js Azure Functions

While implementing a couple of Azure Functions, I needed to use the OAuth 2.0 On-Behalf-Of flow. With this flow, you can allow, for instance, an API to perform tasks on your behalf. This flow is great when you want to offload some of the work from the front-end or perform additional calls on the back-end when processing data. For this type

24

#DevHack: Using Raycast to speed up my productivity

It does not happen often I write an article about a tool, but this time, I felt this tool deserved some extra attention. Raycast is a tool that you can compare to Spotlight from macOS and Alfred, and yes, it is macOS only. Many people use Alfred, and I have been using Alfred since I had my first Macbook. The biggest advantage

25

Microsoft Graph Essentials extension released for VSCode

Recently I started working more and more with the Microsoft Graph again and the related toolkit. While I began to use a couple of the Microsoft Graph Toolkit (MGT) components, I wanted to change the styling a bit and add some custom templates. I noticed that there was not yet a Visual Studio Code extension that helps you with building

26

#DevHack: Caching data for your VSCode extension

For my Visual Studio Code extension to autocomplete the Microsoft Graph APIs, I wanted to improve the speed of the suggestions by implementing a cache. That way, you would not have to do the same API calls each time. In-memory cache has its limits Initially, I started with just an in-memory cache. An in-memory cache is easy to establish, but whenever you

27

VSCode extension for autocompleting your Microsoft Graph API

While working on a project which uses Microsoft Graph APIs, I found myself opening the Microsoft Graph Explorer a lot to check which paths/parameters were available. The Microsoft Graph Explorer is a great tool, but I love not to change context too much. As I like to create Visual Studio Code extensions, I did not have to think long to start

28

Publishing your VSCode Extensions from GitHub Actions

Automation is key! That is how I think anyway. I’m not too fond of repetition, but for some reason, I had not yet automated my Visual Studio Code extension publishing. I always did this manually from my terminal by running vsce publish. With my latest extension, I thought, now is the time to automate this as well. Setting up your workflow When publishing

29

#DevHack: Skip GitHub Actions on specific commits messages

In the doctor project, I try to do as much as possible in one GitHub Actions workflow. Having all logic in one workflow makes it more convenient but comes with a couple of complexities. Like, do you want to run each action for every type of commit/PR/…? Show image

30

DIY: Building a busy light to show your Slack presence

Going back a year in time, I created a post about building my Busy Light, which I connected to the Microsoft Graph. Homebridge is used to control the busy light, its colors, and statuses. Show image

31

Goodbye Valo World it is time to explore something new

For the last 3,5 years, I have been working at Valo. I started as a developer and eventually became the Engineering Lead. Every single day I enjoyed working at Valo. It has been an exciting ride. Oh, and we all change over the years. That is what you can see in the following pictures.

32

Restart your GitHub Actions workflow when something failed

Sometimes it happens that your GitHub Actions workflow fails. When this happens, it is appropriate to check what exactly went wrong before you restart it. Sometimes it could be a timeout or something that was incorrectly configured on the site to test. This issue is precisely the case for my doctor build/test/release GitHub Actions workflow as I do so many changes

33

Use environment variables in Hugo to show branch information

For the new documentation website of Doctor, I wanted to do something similar like I did for Pimp Your Own Bike to show a message depending on the version/branch of the site I am using. For the doctor documentation, I wanted to use this method to show a beta message when using the beta site (beta.getdoctor.io). {{< blockquote type="Related Article" text="#DevHack:

34

To write code comments or not, it should not be a question

Comments, just do it. I write this post because I read a couple of articles, and messages on social platforms about stop using comments in your code. In some cases, there is good reasoning behind it, but even with this reasoning, I believe that comments are too valuable for your DEV team. To start this article, I want to tell you

35

February 26, 2021

#DevHack: Open your VSCode extension settings from the code

For my VSCode Front Matter extension, I wanted to implement a link that allows you to open the VSCode settings to the extension quickly. Show image Front Matter - Quick link to settings I could

36

February 26, 2021

Using Doctor on Azure DevOps to generate your documentation

GitHub Actions is hot these days, but still, Azure DevOps is being used in many companies, and I do as well. Doctor a tool for publishing your markdown documentation on SharePoint, works nicely on Azure DevOps as well. infoI will use the doctor sample as the blueprint for this article. The credentials To start, you need to choose how you will publish your

37

February 25, 2021

#DevHack: GitHub Actions do not run step on schedule

When creating a whole new Github Actions workflow for Doctor, I wanted to do as much as possible from one workflow and be able to limit specific actions depending on how it triggered. I wanted my GitHub Actions to run on each push to the dev and main branch and run the tests on a schedule. Instead of creating two workflows,

38

February 25, 2021

#DevHack: Using Azure CDN with SAS on Verizon Premium

In the previous article, I explained how you could use the Shared Access Signature (SAS) in Cloudflare. The reason that I use this approach is to make sure the Azure Storage cannot be publicly accessed. Only via a SAS token blobs can be retrieved or updated. If you want to do this for Azure CDN, I pointed to the documentation

39

February 22, 2021

Using Cloudflare to serve your private Azure Storage Blobs

Recently I wrote about how to use Cloudflare as a CDN for your Azure Storage Containers/Blobs. The process for setting up Cloudflare for Azure Storage is straightforward. {{< blockquote type="info" text="Use Cloudflare CDN for your Azure Storage caching Now to make this work, you need to configure the Azure Storage to be anonymously accessible. This setting is the default when creating a

40

February 19, 2021

Using Doctor in GitHub Actions for your documentation

Doctor is a tool that you can use to write your documentation in markdown and push it to your SharePoint. That way, you have one location to use and share the documentation in your company. In this article, I want to tell you more about how you can set up GitHub Actions to do automated documentation deployments. infoI will use the

41

February 15, 2021

#DevHack: CORS for Cloudflare cached Azure Storage blobs

In the previous post, I told you why we moved to Cloudflare CDN to serve our Azure Storage files instead of Azure CDN. During the testing of Cloudflare, I found out that CORS headers were not present for the files. Usually, this is not needed if you only retrieve one file, but if you want to retrieve another file, for

42

January 20, 2021

#DevHack: Use Cloudflare CDN for your Azure Storage caching

Getting your files faster to your clients is very important. There are various options for this. Last year, we started to look into Azure CDN to quickly and reliably provide our source files to our customers. The Azure CDN is put in front of an Azure Storage account on which we host the files in different blob containers. Azure CDN is

Elio Struyf

Elio Struyf

Solutions Architect & Developer Expert

Loading...

Struyf Consulting

Let's build together

Front Matter CMS

Manage content in VS Code

Present from VS Code

Support Buy me a coffee