Blog
-
How to Do JavaScript Unit Test with Node.js Test Runner and JSDOM
A simple example on how to do JavaScript unit test with Node.js test runner and JSDOM.
-
How to Use Importmap in a WordPress Website
I have been trying to work on a basic WordPress classic theme without build steps which I can use as a starter theme to maybe develop client sites in future. So I thought I write up a short tutorial on how to use importmap in a WordPress theme.
-
My first tech conference - CityJS Singapore 2024
I traveled to Singapore to attend a tech conference for the first time. As a remote developer, it was fun connecting with other developers face to face.
-
Do you use inline event handlers inside Web Components?
You can connect web components internal methods to elements declaratively with inline handlers. This might feel really good for beginners trying out web components after working with UI frameworks.
-
Prevent duplicated events returned from SQL query
What I learned from working with SQL query to find events that have one or more similar artists.
-
Accessibility Knowledge I Learned from Automatic Accessibility Testings with Cypress and cypress-axe
Accessibility knowledge I've learned from running automatic accessibility tests with Cypress with cypress-awe.
-
Migrate from Tailwind CSS to Web Components with Declarative Shadow DOM
Documenting my process of migrating my site from Tailwind CSS to Web Components with Declarative Shadow DOM.
-
An interesting fact on using removeEventListener() inside a web component
removeEventListener() does not work as expected when you register an event listener called with bind() method on it.
-
Web Accessibility: Add skip to main content link to my website
Skip to main content link can improve the experience for keyboard and screen readings users when navigating the web pages.
-
Web Accessibility: Checking color contract with Firefox Developer Edition
Firefox Developer Edition has some really cool features, one of them is we can easily check color contract with its dev tool.
-
10 Tips I learn from book "How To Make Any Website Better"
10 Tips I learn from book "How To Make Any Website Better."
-
Problem Details for HTTP APIs
HTTP status codes are sometimes not sufficient to convey enough information about an error to be helpful to developers. Problem Details object can carry finer-grained details of the problem to be used by API clients.
-
Sharing API endpoints across client and server
Sharing API endpoints across client and server to make life a bit easier and less error-prone.
-
Web Accessibility: banner role
Banner role is one of HTML landmark roles. It improves accessibility and the semantics of your HTML and making it easier to style your website.
-
Debounce input keyup event in React
Using JavaScript debounce technique inside React component to avoid sending excessive network requests.
-
How to implement dynamic routes in vanilla JavaScript?
If you're building a Single Page Web Application with vanilla JavaScript, you probably will need to implement dynamic routes like "/project/edit/:id". In this post, I will walk you through how to achieve that with vanilla JavaScript.
-
How to create a custom checkbox web component?
The `:host` selector in web components can be a bit tricky and confusing. However, fear not! In this post, I will cover all the different scenarios where you might use the `:host` selector, so you can become a pro at using it in your web components.
-
How to use web components :host selector?
The `:host` selector in web components can be a bit tricky and confusing. However, fear not! In this post, I will cover all the different scenarios where you might use the `:host` selector, so you can become a pro at using it in your web components.
-
Introduction of web components ::part pseudo-element
Web components ::part pseudo-element allows us to style elements inside shadow root with ease, really handy for some scenarios.
-
How to dynamic import web components to improve our application performance
If we're building single-page web application with vanilla web components, we can dynamic import web components to improve the performance.
-
Using JavaScript Debounce to Only Send Network Request When User Stops Typing
Using JavaScript Debounce to Only Send Network Request When User Stops Typing