How to create a custom ESlint plugin

Recently our development team decided to enforce the role for function naming. Meaning, all function name should start with the prefix defined in the eslint rule.
Instead of giving some random names to the function, strict developers follow some pre-defined conventions.

Example:

<button onclick=”someFunction()”>Login</button>
function someFunction() {}

<button onclick=”onLogin()”>Login</button>
function onLogin() {}

In the HTML button click, we can give any name we want. but when we read the code, the second function makes more sense. Let’s write a plugin that will warn us about wrong function naming.

JavaScript Naming Convention Best Practices

Boolean: is, are, has

Events: init, pre, on, post

verb as a prefix: get, set, post, put, push, apply, calculate, compute, to, etc.

We’ll be using eslint for this project.

ESLint Introduction:

ESLint statically analyzes your code to quickly find problems. ESLint is built into most text editors and you can run ESLint as part of your continuous integration pipeline.