Setting Up an Oracle JET Application

This tutorial needs a review. You can edit it in GitHub following these contribution guidelines.

This document provides a step-by-step set of instructions guiding you through the process of setting up an application based on Oracle JavaScript Extension Toolkit (JET). JET empowers web and mobile developers by providing a modular toolkit based on modern JavaScript, CSS3, and HTML5 design and development principles.

Setting Up

In this exercise you learn how to set up an Oracle JET application via the ojet-cli tool.

Note: If you have been using the Yeoman-based generator, that is, generator-oraclejet , you must install it before continuing with the steps below, via npm -g uninstall generator-oraclejet .

  1. On the command prompt in a terminal window, type the following:

node -v

If the terminal window shows that Node is not installed or at a lower version than 5, go to the Node site and install the Long Term Support (LTS) release of Node. Currently, at the time of writing, the LTS release is v6.11.2, and is listed as being "recommended for most users".

Note: Do not use the Latest release of Node, i.e., v8.x. The Node Package Manager (NPM) version 5 that comes with Node v8.x has bugs that cause nested dev-dependencies to not be installed properly. This is listed in our Release Notes for JET 3.2.0 and we are watching the npm bugs to see when they are going to fix them.

  1. After completing the above step, install the Oracle JET Command Line ( ojet-cli ) tool as follows:

npm -g install ojet-cli

Note: You may need to be in admin mode, such as via sudo -s on Mac OS X, to be able to call the above command.

Under the covers, the ojet-cli tool installs and uses popular JavaScript tools, such as Yeoman and Grunt, as can be seen here. Where previously, you’d have to use commands such as yo and grunt , these are now hidden within the ojet-cli tool and do not need to be installed separately anymore.

  1. The -g argument in the previous step should have installed the ojet command globally, so that you should be able to run ojet anywhere, i.e., not in any specific folder or location since the ojet command should now be globally available. To try it out, run the following:

ojet help

The terminal window should now show all the commands available to be used with ojet . If not, you can manually configure the PATH of your system to include ojet-cli .

  1. Once you have successfully run ojet help , use ojet to create a new Oracle JET application, as follows:

ojet create MyApp --template=navdrawer

'navdrawer', in the command line above, is one of the starter templates made available by Oracle JET, as outlined below:

After the process completes, you should have an application structured as follows:

navdrawer

Open the application into an editor or IDE of your choice, such as NetBeans IDE, which displays the application as shown in the screenshot above.

  1. Once the application is created, use the terminal window to navigate into the root folder, i.e., the top folder, which is named MyApp , and build and serve the application, as follows:

ojet serve

After the build completes, the browser opens and displays the application:

newhtml5project 9

Congratulations, you have successfully set up an Oracle JET application. Repeat the steps above whenever you need to set up a new Oracle JET application.

Send Feedback on This Tutorial

See Also

For more information about support for Oracle JET and a variety of HTML5 applications in the IDE on netbeans.org, see the following resources: