External Libraries

You can use external front-end libraries and node packages to enhance your app's functionality. The following section lists the libraries that you can use and methods to include them in your app.

Front-End Libraries

To use an external library, you can include it from the corresponding Content Delivery Network (CDN) in the template.html file as shown in the following examples.

Example 1: jQuery
You can use jQuery libraries to manipulate UI elements as per your requirements. To add a button in your app’s UI, view the following snippet.

template.html

Copied Copy
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <script> $(document).ready(function(){ $("button").click(function(){ alert("This is an alert to quit!") }); }); </script> </head> <body> <button>Send Warning</button> </body> </html>
EXPAND ↓

Example 2: Handlebars
Handlebars helps you build semantic templates. You can directly include the library in your app or you can download it to the app directory and reference it from the template.html file as shown in the following example.

template.html

Copied Copy
1
<script src="library/handlebars.js"></script>

Here, handlebars.js is the downloaded library file in the app/library directory.

NPM Packages

You can use npm packages to leverage backend functionalities for your app. These libraries can be used only in the server.js file of your app. A few npm packages, such as request and underscore, are explained below.

Example 1: Request - Helps you make HTTP calls easily.
server.js Copied Copy
1
2
3
4
5
6
7
8
9
var request = require("request"); request("http://www.google.com", function (error, response, body) { console.log("error:", error); // Print the error if one occurred console.log("statusCode:", response && response.statusCode); // Print the response status code if a response was received console.log("body:", body); // Print the HTML for the Google homepage. });
manifest.json Copied Copy
1
2
3
"dependencies": [ "request": "1.8.3" ]

Example 2: Underscore - Contains various utility methods.
  1. First - Returns the first element of an array.
  2. server.js Copied Copy
    1
    2
    3
    4
    var _ = require("underscore"); var values = [5, 4, 3, 2, 1]; _.first(values); /* Returns value 5 */
    manifest.json Copied Copy
    1
    2
    3
    "dependencies": [ "underscore": "1.8.3" ]

  3. Uniq - Returns all unique values in an array.
  4. server.js Copied Copy
    1
    2
    3
    4
    var _ = require("underscore"); var values = [1, 2, 1, 4, 1, 3]; _.uniq(values); /* Returns arrray [1, 2, 4, 3] */
    manifest.json Copied Copy
    1
    2
    3
    "dependencies": [ "underscore": "1.8.3" ]