Making the simplest possible jQuery plugin
In this recipe, we will create the simplest possible Bootstrap plugin, with just the most basic functionality. The intention of having such a recipe in this book is to clarify the core principles of extending Bootstrap 4 via jQuery plugins as a starting point for more complex code.
Getting ready
To get ready, you can review the completed recipe by running harp server in the chapter7/complete
folder, and navigate to localhost:9000/recipe07-01
. The result you see should be a simple web page, with a navbar, a heading, and a paragraph.
After previewing the result we are trying to achieve, navigate to the chapter7/start
folder and open the _js.ejs
, _nav.ejs
, _recipe-07-01-js.ejs
files in the app/partial folder. Also, one level up, in the root of the app
folder, open the file titled recipe07-01.ejs
.
How to do it…
- Open the currently blank
_recipe07-01-js.ejs
and paste the code as follows:
// Step 1: Add an IIFE (function($) { // step 2 code goes here })(jQuery...