Steps to add new Javascript plugin
We use the following steps when we add new plugins for our template to make sure the functionalities of new plugin meet our need:
- Check first that there is not any exiting plugins with same required functionalities exist in JavaTMP template.
- Check that the new plugin is free and the source code is publically available preferable on github
and the new plugin has demo pages and examples that describe the plugin.
- Check the new plugin does not interfere with any exiting plugin and it is supported with current jQuery and Bootstrap versions.
- Check any prerequisite plugins or frameworks for new plugin to download them too.
- Check that the new plugin has active development community.
- Check online demo of plugin and make sure it provide needed functionalities.
- Check that the new plugin is supported and published in node.js.
- Install and register the new plugin in node module by running the following command
at the command prompt in root folder of JavaTMP-App-Starter Project:
npm install <<module name>> --save
- Make sure that the previous command downloaded the plugin folder in
./node_modules
folder
and updated the ./package.json
’s dependencies section by adding the new module name as dependency.
- Create a demo page for new plugin by using one of empty pages like
./web/pages/custom-pages/empty-pages/card-page.jsp
page.
- Add a link for new page in sidebar menu in
index.jsp
page and make it point to above new plugin page.
- Implement the plugin functionalities in the new page and check if the new plugin need a custom style to reflect
the standard JavaTMP template styling.
- If the new plugin need a custom styling page, then create a new empty sass file in assets/sass/plugins folder.
- Add or override the new plugin styling in the created sass file above.
- The above sass file will be compiled and minimized to css file when one of
the following gulp’s task run: “plugins-sass”, “sass”, “watch-sass-and-js”, and “default”.
Explicitly Run the following command to check the generation of new plugin custom css file by (re-generate all CSS files):
- Use the custom styling file for new plugin after the main plugin styling files in your demo page
or in gulp’s task
generate-dist
- Update page JavaTMP Front-end Plugins And Frameworks
by adding information to describe the name, description, URL, Prerequisite and License of new plugin.
- Adding plugin information in credit section of
documentation home page .
- Update Version Change Log
page by adding information about your modification in next or current version release.
- Check if the new plugins should be exist in the other versions, then implement it there.
- Check if the new plugins need a dynamic backend components and can be run through AJAX and Java,
then implement a dynamic behaviour for it in Java version too.
Steps to remove Javascript plugin
- Remove plugin reference from
package.json
.
- Remove plugin reference from
gulpfile.js
in config
and src
variables.
- Remove a custom SASS file for plugin in
./web/assets/src/sass/plugins/
if there is any file for this plugin.
- Remove a custom SASS file calling in
./web/assets/src/sass/main.sass
file for this plugin if there is any one.
- Run
gulp
command.
- Remove Any use for the plugin in any front-end HTML and JSP pages.