Murtuza's Posts

Setting Background Color of Body Dynamically in React

In a single page application, you only have one body element and although you can specify the background color of body in a global stylesheet, it's not easy...

Minify JavaScript Using Terser

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 java...

Deploying React App to Netlify

In this tutorial, I am going to show you how you can deploy a react app on netlify from an existing git repository of yours....

Adding Custom Anchors to Headings in Markdown - Eleventy

Anchors are nothing but id attributes applied to an element to link to it using href attribute internally on the same page....

Creating a Notification Template in React with Novu: A Step by Step Guide

In this tutorial, you will learn how to create a notification template using novu web, how to add a subscriber (user), and how to trigger a notification and sen...

How to vendor-prefix and minify CSS?

Writing CSS from scratch along with adding vendor prefixes can be a daunting task if done manually. Vendor-prefixes.....

How to Localize your Next.js Application with Tolgee?

Ever wondered how to translate your web pages into different local languages of visitors visiting your website? That’s where the concept of localization comes i...

Eleventy - Shortcode for Embedding Codepen

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 r...

5 VSCode Extensions You Must Use

Here are the 5 most useful Visual Studio Code extensions to improve your workflow!...

How to deploy an express app on Vercel

Vercel is a platform to host frontend applications and static sites but you can also host an express app using serverless functions. In this tutorial, we will s...

Optional Chaining in JavaScript

Optional Chaining in JavaScript is used to return undefined for accessing an object property that doesn't exist and whose parent property is nullish (null or un...

How to compile SASS into CSS and watch for changes?

Browsers don't understand SASS , just like they don't understand JSX  (which is compiled into valid javascript) in React. Which is why we need to compile SASS i...

IIFE in JavaScript

You might be familiar with functions in JavaScript. An IIFE (Immediately Invoked Function Expression)  is a special type of function which is invoked implicitly...

How to make a QR Code generator using Vanilla JavaScript?

While you can generate QR codes for URLs in browsers such as Chrome, it's always interesting to learn......

How to use git reflog to recover deleted branches or commits?

Managing branches or commits in Git can be quite cumbersome. Issues ranging from merge conflicts to accidentally deleting branches are a nightmare for many deve...

How to build a chatbot for websites using chatwoot

A chatbot is a virtual robot that can simulate a conversation with humans. It’s just a computer program that follows a predefined set of rules and acts accordin...

Skeleton Loading for Social Media Embeds using CSS and JavaScript

Note: This post is inspired by Web Dev Simplified. Social media embeds take some time to load and......

The Fixed Background Attachment Hack

What options do you have if you want the body background in a fixed position where it stays put on scroll? background-attachment: fixed in CSS, at best, does no...

Typewriter Animation That Handles Anything You Throw at It

I watched Kevin Powell’s video where he was able to recreate a nice typewriter-like animation using CSS. It’s neat and you should definitely check it out becaus...

How to create Google's Material Design Text Input Field Animation?

In this tutorial, we are trying to recreate Google's text input field animation and design from......

How to create an HTML generator with JavaScript?

Before you proceed: This post is not about creating a safe or the best HTML generator rather it's......

Dark mode toggle animation using CSS

This tutorial will mainly focus on how to use transitions in CSS and make a toggle button for light......

How to create a spotlight in CSS

CSS can be weird sometimes, but it can be pretty awesome too. Let’s create a spotlight effect with some CSS....

How to create a notification badge in CSS?

Notification badges annoy me most of the times by popping up every now and then and I am pretty sure......

Programming Paradigms: Imperative vs Declarative

In the world of programming, there is not one way for writing programs, instead there are ‘ways’ in which you can write a program or simply put, instruct a comp...

Why do we need End-to-End Encryption?

Encryption is the one of the things which are essential for securing a system. End to end encryption is a pretty good way to secure the channel of communication...

WhatsApp's updated privacy policy: What it's all about?

UPDATE : – You will still be able to use WhatsApp but if you don’t accept it’s privacy policy, then you will be deprived of WhatsApp’s features slowly and gradu...

Recovering Sound from Images

Let’s talk about sound and microphones for a second. Microphones are embedded in nearly every single digital device nowadays and their primary purpose is to det...

Are we running out of internet storage?

In 1 second of you reading this blog post, nearly 2,980,893 emails have been sent worldwide of which 67% are spam emails according to internetlivestats. There a...

Multiple Cameras in a Smartphone. Do you really need them?

Nowadays, almost every smartphone comes with at least three cameras baked right into it. It includes two rear cameras and one front-facing camera. The mid-range...

How to Improve Battery Life of a Smartphone?

Do you know why your smartphone’s battery performance degrades over a long period of time? Ever wondered whenever you buy a new smartphone, and when you switch ...

Wireless Charging in Smartphones

Battery has been the most crucial part in smartphones for all of us. Smartphone batteries have gone through some decent improvements in the past couple of years...

What’s CAPTCHA & How Does It Work?

Ever wondered what’s the purpose of that checkbox which says ‘I’m not a robot’ whenever you are filling a contact form on a website or while entering a zoom cal...

Everything You Need To Know About 5G

1G, 2G, 3G, 4G and now 5G are basically the names of different generations of mobile networks. The first ever generation of mobile networks, which made wireless...

A Camera Which Can See Hidden Objects Around the Corner!

We have come a long way since the first camera was introduced in the year 1816. Meanwhile, we got to see some pretty interesting camera generations which worked...

Smartphones Causing Cancer?

In this age of information and technology, it’s almost impossible to imagine your life without smartphones and other digital devices. But, are we using smartpho...

Neuralink: Do Cyborgs Really Exist ?

Human Brain is undoubtedly the most sophisticated and powerful tool of all time. With over 86 billion neurons packed together, it’s larger than any other networ...

This is how Disney’s ‘Mary Poppins’ stands out in the history of filmmaking!

Disney’s Mary Poppins is an American musical classic which was released in the year 1964, directed by Robert Stevenson. This movie won Oscar awards for 5 catego...

‘IRON MAN’ Tech in Reality: Holograms

Technology dependence has changed our lives drastically in recent years, but there is more to come. Technology has become an integral part of our lives. Now thi...

Basic Difference between WORLD WIDE WEB & The INTERNET

Most of us think that the Internet and World Wide Web (WWW) are one and the same, but there are some key differences between them. To understand the basics, let...

How the Internet ‘Hacks’ your Brain!

If you feel that what social media or internet can do to your brains or steal information of your behaviour, then this blog post is for you. Just like hackers s...

‘IRON MAN’ Tech in Reality: Arc Reactor

In the first part we discussed about the thrusters of Iron Man. If you haven’t read the first part yet, then go check it out here. Okay, so now that you have do...

‘DELETED’ files are still there on your Smartphone!

It’s weird to know that when you click the ‘delete’ button on your ‘Smartphone’, the files are not actually deleted or completely vanished! So, where do they go...

Generating ‘PLASMA’ from Grapes? Explained.

This experiment which I am gonna talk about is done by so many people since decades. But no one had a correct or accurate explanation. Now, scientists know that...

‘IRON MAN’ Tech in Reality: Thrusters

I watched Iron Man series recently and I thought what if we could see something like this in reality using some math and physics. The answer came pretty quickly...

Game-changing ‘STAGECRAFT’ Technology by ILM

Ever wondered how the realistic backgrounds and scenes are accomplished using technology in movies and TV shows? Now, it’s time to discover the secret that led ...

LIGHT FIELD PHOTOGRAPHY (Future of Photography?)

You should’ve probably heard of photography which is quite popular and creative field. It exists in many forms and types but on the technical level they are sim...

Role of Technology to contain COVID-19(Coronavirus)

COVID-19(COronaVIrus Disease 2019) got this name because of the structure of proteins that are attached to the virus. The structure of those proteins resembles ...

Your Journey Begins in the Thrilling World of Technology!

Hey, I am Murtuza and I am a tech enthusiast. This is the first blog post that I’ve written and today I’m going to tell you what really drives me to write blogs...