JavaScript: Change The Behavior of A Class Method At Runtime

Useful Strategy To Perform Different Operations Without Repeated If Else Or Switch Statements

Recently I came across a problem where I needed to perform two different sets of operations throughout the application for two types of users. The trouble was:

  1. I needed to turn on or off an operation based on certain condition, which would only be known once the user was logged in, not at the beginning.
[Read More]

React JS Code Review Checklist

A handy guide to review a pull request

This post provides a checklist to review a React JS application code. For many issues, especially related to personal taste like semicolon or arrow vs traditional function, and things like propTypes, we can simply configure linters such as ESlint and Prettier to automatically detect and force us resolve the warnings. We can furthermore make these linting fixes mandatory on commits (such as with Husky hooks) or PR merges (with CI/CD tools such as github Actions).

[Read More]

JavaScript Inheritance And Polymorphism In React JS Application

The React JS documentation emphasizes on using composition over inheritance for components, as there is hardly any scenario that requires component inheritance. However, that does not stop us from using inheritance and polymorphism within our JavaScript code. To explain, we discuss one such example below by using es6 classes: [Read More]

Add A Dropdown List in Suneditor React Using Custom Plugin

Merge Tags Or Insert Variables Can Easily Be Listed For The User To Choose From

In almost all of the text editors available for React JS adding your own dropdown list is not an easy task. In a React app I was using suneditor, and I needed to add my own dropdown list for the users to select a merge tag from, but I could not find a way from their documentation. [Read More]