Part I

Building a ReactJS app is like building with LEGO blocks. We build larger components out of smaller components and keep repeating that until we have something like an Admin Panel/Dashboard-like UI below:

To do quickly, we will use the Admin Panel template built on Tailwind CSS by tailwindadmin. Instead of taking the traditional approach like those Counter or Todo tutorials, we will get this application, just like what you see above, up and running first. At first, everything is in 1 big JS file that contain 1 big ReactJS component. …

Cross posted on dev.to

Capturing the Device Tokens is necessary for push notification to work. A Device Token is nothing but an ID that uniquely identifies a combination of a device and an app. So if we have 2 apps running on the same device, they will have different Device Tokens. Likewise, if the same app runs on 2 different devices, they will also have different Device Tokens. This is obvious because Apple Push Notification service (APNs) must know where to correctly push the notifications to.

To receive the Device Token, an app must register with APNs. I copied the following code from honestly-I-do-not-remember-where and paste in the AppDelegate…

There are use cases, commonly related with passwordless authentication or second-factor authentication where iOS users are required to enter some 4-digits or 6-digits numeric code that they received in an email or text to their phones.

Here are the requirements of what we are going to build:

1. There are 6-digits numeric code, so there are 6 large 'boxes’. Each box can only contain 1 single digit.
2. After the users enter a digit in a box, the cursor automatically jumps to the next.
3. The users can place the cursor at any box to make a correction. As soon as they tap on a box, the box goes empty. …

Step by step guide using a light weight approach

1. Introduction

Learning how to correctly write and deploy with Azure Function beyond a “Hello Azure Function” is difficult. It is that way because although Azure documentation is plentiful but just not well organized. Conceptually it’s actually easy, if the documentation is not such a big mess. Recently I had to re-architect some code by taking the Azure Function approach. Originally these code were in the StartUp.cs of an ASP.NET WebAPI like so (simplified for illustration purpose):

public void Configure(...) {
    //...
    Task.Factory.StartNew(() => {
        while (true) {
            //Capture some data
            //...
            //Now waits for 15 minutes or so
            Thread.Sleep(new …

This article was cross-posted on dev.to

In this article, I will show how to implement and secure a C#/.NET (hereinafter I will only say C#) WebAPI. To secure the WebAPI, we will use JWT. The JWT is signed by a NodeJS backend using Private Key. The WebAPI will verify the JWT using the Public Key.

I’d like to be clear so let me clarify some the terminologies that I prefer to use. When I say client, I mean a client application such as mobile app, a web application, Postman, etc. On the other had, a user is a human who uses those clients. …

…without saying the words “close over”

There are plenty of articles discussing about the closure, too many to be listed here. They all eventually incorporate long code examples in various languages into the explanation, which is fine. Many articles choose to use the word close over to describe about closure, which does not really mean a whole lot, at least to me.

I attempt here to explain about closure here without showing any code, hence “in an elevator”.

A closure is simply a function defined inside another function. This inner function naturally has access to variables and constants defined in its outer function. This inner function can even modify the value of these variables (of course, the inner function cannot modify any constant, no matter where the constant is defined). That’s not all, this inner function also has access to arguments that get passed to the outer function. All of these facts are neither surprising nor interesting. But that’s all. That’s the definition of a closure. It’s easy to visualize. It’s easy to understand. …

The following code runs perfectly fine on a NodeJS server that’s hosted outside of Azure App Services:

During development, running NodeJS on a local server, the environment variable API_AI_ACCESS_TOKEN are set in package.json file. Just for completeness, let me show the constants.js file, since it only takes a few lines:

On Azure, the environment variables such as API_AI_ACCESS_TOKEN has to be set in the Application Settings blade. That’s the UI way of doing it. We can also set it using a command line. Either way, the setting of environment variable has to be done first.

But even then, when we try to access the web application, it gives an error page that looks something…

You might find this article helpful if you work on Xamarin Forms in a situation similar to the one I’m about to describe. You have no problem writing the code but it seems like you always struggle every time you have to deal with Certificates and Provisioning Profiles on iOS. It’s hard for anyone to remember what they did months ago. That’s understandable because writing code happens every day whereas dealing with Certificates and Provisioning Profiles only occurs occasionally.

Unfortunately, all the documentation that’s available out there right now are just too damm hard to follow. Some docs or articles contains links inside links inside links (that’s like pointers to pointers to pointers). Some are not written specifically for Xamarin. …