What are these pseudo-classes and how does each differ from the other

Photo by AbsolutVision on Unsplash

Today, we will be discussing focusable pseudo-classes supported by modern browsers, but before we dive deeper, it’s worth understanding what focusable and tabbable means in the context of CSS.

The element will be focused by the script (element.focus()) and possibly the mouse (or pointer), but not the keyboard.

The element will be keyboard focusable (“tabbable”), as it is part of the document’s sequential focus navigation order. Also focusable by the script and possibly the mouse (or pointer).

These pseudo-classes are triggered when the user focuses on an element in different ways.

Triggered when the user clicks or taps on an…


Learn how to publish NodeJS CLI application on the popular Homebrew package manager using Github

Homebrew is the de-facto package manager when it comes to macOS. It is quite easy to publish your projects on Homebrew without any ruby knowledge.

Photo by Jonathan Sanchez on Unsplash

A couple of years ago, I developed a small CLI utility called getfilesize-cli. It displays the file size in a human-friendly way. This package is published under npm registry but to use this tool the user has to have NodeJS runtime installed in the system. As an author, I should make the application easier to install and consume by the users. Therefore, I consider publishing it apart from npm registry.

In this article, I will…


GitHub Actions allows you to automate, customize and execute your software development workflows inside your repository.

Photo by James Harrison on Unsplash

Let’s say we have two branches master and develop in our repositories following GitFlow methodology. We often encounter a situation when a hotfix is merged directly to master then those changes has to be reverse merged to develop else they will not get reflected in the `develop` branches thereby creating an inconsistency.

We can set up a workflow using Github Actions to keep two branches in sync. To do so, we only need repositories enabled with GitHub Action workflows.

At the time of write…


Learn how to scaffold a new project using git template repository

As a developer, in this open-source era, we often try to explore the code base of libraries/frameworks/projects or mostly starter template for kick-starting projects. The most common way is to clone the repository using the `git clone` CLI command.

Github GUI

But cloning a repository will download its entire git history with all the branch details which are not needed and it takes time to clone it as well.

So how can we quickly download a GitHub repository?

Well, there are a couple of ways we can do it,

  1. Download as a zip file via GUI

The easiest way from GUI. The…


Today we will be focusing on how to keep our local node_modules up to date whenever the package.json is modified when we pull from remote or switch between branches.

Photo by Thomas Kelley on Unsplash

As JS developer, when we work on projects we frequently need to run npm install command whenever we pull or checkout to a different git branch where package.json is modified.

In majority of the cases, the dependencies won’t cause any issues, but if there any breaking change introduced by the dependency package then we need to reinstall. We somehow forget to run the command (I mostly forget it at least 😛).

How do we automate this?

Well, it quite simple. Hooks!!!

Yes. Git hooks.

We can make use git hooks to trigger npm install command if a package.json


Patchwork or “pieced work” is a form of needlework used mostly in quilts that involves sewing together pieces of fabric into a larger design. The larger design is usually based on repeating patterns built up with different fabric geometric shapes (which can be different colors).

Photo by Raul Cacho Oses on Unsplash

Did you ever think about how these designs are being generated? Today we are going to generate our own geometric patchwork using p5.js. One good reason for me to choose p5.js is, it just abstracts away the low-level implementation and helps the developer focus only on the design part and has better documentation.

In order…


Google Homepage

Google is quite possibly the more powerful search engine used today and even used sometimes to check our connectivity. It has become a source of concern for many, and if not they should and we will see why!

Surprisingly, it can be used to find much more than what we even should find. It can find things like sensitive data, web vulnerabilities, etc. which means these things are exposed to everyone on the internet.

In this blog, we will be discussing Google Indexing and Caching from a technical point of view and also how to use Google Search to find…


Building a real-time web application is a bit challenging one, where we need to consider how we are going to send our data from the server to the client. Technologies that enable this “proactively” have been around for quite some time and are limited to two general approaches: client pull or server push.

A few ways to implement these:

  • Long/short polling (client pull)
  • WebSockets (server push)
  • Server-Sent Events (server push)

Client pull — client asking server for updates at certain regular intervals

Server push — server is proactively pushing updates to the client (reverse of client pull)


Note: The vulnerability has been reported and is now fixed.

AGS Cinemas is one of the famous theatres in Chennai, Tamil Nadu. They launched their own movie ticket booking website and apps last year.

“Two CCTV cameras on a gray wall” by Scott Webb on Unsplash

This post is about a simple vulnerability I discovered on AGS Cinemas which I could have used to hack into other users’ accounts easily and without any user interaction.

This gave me full access to other users account by setting a new password. I was able to view ticket history, their credit wallet, and other private information.

Suresh Kumar, the CEO of MacAppStudio (Technology partner for…


It all started with this blog about how Kanishk Sajnani (an Ethical Hacker) booked a flight ticket to USA for 1₹. As usual, I started collecting a list of food ordering websites in Chennai and ruled out the mature ones since the probability of vulnerabilities are less when compared to new ones. So I targeted a pretty new website that has good traffic. I am a freelance JavaScript Developer and I’ll be sharing my experience on how did I ordered food for 1₹ and steps to seal the vulnerability.

Let’s dig in

I opened an account and checked the flow of the app…

Bharathvaj Ganesan

Fullstack JavaScript Developer | Cybernaut | InfoSec Enthusiast | https://bharathvaj.me

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store