That ignited a spark of curiosity within me and I started reading and researching more about web components. Eventually, after realizing you can build and define custom HTML elements, I decided to build at least one of my own. [...]
Forms in React have always been not so easy to handle which often leads to messy React code. Ultimately, folks have to resort to form handling libraries which only add more abstraction in the process. [...]
For the most part, static-first sites are the go to thing if your application doesn't involve much complexity. However, you are free to choose the right tool for your application — but choose wisely. [...]
Recently, in version 121, Chrome started supporting CSS Scrollbar properties `scrollbar-color` and `scrollbar-width` and it broke my CSS. Here's what happened and how I fixed it. [...]
RSS a.k.a Really Simple Syndication is a great technology to subscribe to website content. Initially, I was into the habit of bookmarking blogs which I admire and used to visit them once in a while. But, that wasn't. [...]
Custom elements in HTML are a way to extend native HTML elements. Javascript frameworks simulate the behavior of components in a web page whereas [...]
Containerization in it's entirety is an incredibly useful concept. From being able to execute applications in isolation, to being able to port them easily with all of their dependencies and configuration is all a developer could ask for. [...]
Exploring builder.io's partytown and integrating it with 11ty! It is nothing but a library which uses web workers to separately execute third party scripts. [...]
DOM, also known as the Document Object Model, is a programmatic representation of the contents of a web page. In other words, the content of a web page is represented in the form of objects and nodes. [...]
For quite some time, I was searching for a way to self host google fonts because the google fonts API's network request increased the render blocking time more than I expected. [...]
You can specify the background color of body in a global stylesheet, but it's not easy to update the background color dynamically for different pages in your website. So, I went on to code a hacky but working patch using CSS custom properties. [...]
Terser is a javascript compressor and mangler supporting ES6+ specification. In this tutorial, you will get to know how to use terser to minify or compress javascript. [...]
Anchors are nothing but id attributes applied to an element to link to it using href attribute internally on the same page. [...]
Writing CSS from scratch along with adding vendor prefixes can be a daunting task if done manually. Vendor-prefixes can be easily added using the autoprefixer plugin of PostCSS. [...]
Shortcodes are used to invoke a particular function which returns some html or any other data based on the information that is passed. They are mainly used to reuse html templates which require some preprocessing. [...]
SASS/SCSS extends CSS which means that you can have all the features of CSS plus the features of SASS just like a cherry on top of a cake! [...]
Social media embeds take some time to load and render, hence the user experience is not so good! Here's an example of twitter embeds.. [...]
In this tutorial, we are trying to recreate Google's text input field animation and design from scratch with the help of CSS as well as JavaScript. [...]
Ever tired of writing multiple lines of similar HTML? If you are, then you can automate the process by using template literals in JavaScript. Let's see how we can do that. [...]
This tutorial will mainly focus on how to use transitions in CSS and make a toggle button for light as well as dark mode using little JavaScript. Let's dive into the world of transitions! [...]
Notification badges annoy me most of the times by popping up every now and then and I am pretty sure most of you experience similar thing, but anyways, let's see how we can create a notification badge using CSS. [...]