A JBoss Project
Red Hat

How To:

Create and Import Node.js Applications

Node.js is an event-based, asynchronous I/O framework and is used to develop applications that run JavaScript on the client and server side. This allows the application to re-use parts of the code and to avoid switching contexts. Node.js is commonly used to create applications such as static file servers, messaging middleware, HTML5 game servers, web application framework, and others.

JBoss Tools supports node.js application development using the npm package installer and offers a built-in debugging tool to identify and fix issues with applications. In the subsequent sections, instructions are available for the following tasks:

Setting Up Prerequisites for Node.js Development

Ensure that the following prerequisites are met to start developing node.js applications in JBoss Tools:

  1. Install npm. On Red Hat Enterprise Linux and Fedora, use the sudo dnf install npm command. See the npm documentation (https://docs.npmjs.com/getting-started/installing-node) for installation information about other operating systems.

  2. Install JBoss Tools.

Result: You are now ready to start developing Node.js applications with JBoss Tools.

Creating a new JavaScript Application

To create a new JavaScript project and application in JBoss Tools:

  1. To create a new JavaScript project:

    1. Click File  New  Other and type JavaScript in the search text box.

    2. Select JavaScript Project and click Next.

    3. In the Project Name field, add a name for your new project.

    4. Ensure that the rest of the fields, which are set to the default settings, are as required, and then click Finish to create the new project.

    5. If asked to view the JavaScript perspective, click Yes. Your new project is listed in the Project Explorer view.

  2. To interactively create a package.json file:

    1. Click File  New  Other and then type npm in the search box.

    2. From the search results, click npm Init.

    3. Set the Base directory to your JavaScript project folder in your JBoss Tools workspace.

    4. Optionally, clear the Use default configuration check box to supply non-default values for these fields.

    5. Click Finish to continue with the default values for the package.json file or to continue after changing the default values.

      Generate a New package.json File
      Figure 1. Generate a New package.json File
    6. The new package.json file is generated and displayed for editing. If required, manually edit the file in the displayed pane and save the changes.

      Manually Edit the Generated package.json File
      Figure 2. Manually Edit the Generated package.json File
  3. Manually edit the package.json file to add dependencies. Dependencies are modules which provide extended functionality, such as libraries and frameworks. See the following screen capture for an example of the required format for dependencies and developer dependencies.

    Adding Dependencies to the package.json File
    Figure 3. Adding Dependencies to the package.json File

    For further details about dependencies, see the NPM documentation: https://docs.npmjs.com/files/package.json#dependencies

  4. Create a new JavaScript file with the required business logic:

    1. In the Project Explorer view, right-click the name of your project, and select New  File.

    2. In the dialog box, add a name for the new file, for example index.js, and click Finish to create the new file.

    3. The new file displays for editing in a new tab. Add the required business logic to the your JavaScript files and save the changes.

  5. Run the project files by right-clicking the index.js file in your project and select Run As  Node.js Application. The Console view appears and displays details about the application as it runs, or errors if it is unable to run the application.

Result: You have created a new JavaScript project and application.

Importing an Existing JavaScript Project

You can import an existing JavaScript project directly into JBoss Tools and then make changes and run the project as follows:

  1. Import an existing project into JBoss Tools:

    1. Click File  Import.

    2. In the Import dialog box, expand the General option.

    3. Click Existing Projects into Workspace and then click Next.

    4. In the Import Projects dialog box:

      1. Click either the Select root directory or Select archive file options based on your project format.

      2. Click Browse to add the path to the project root directory or archive file.

      3. In the Projects box, select one or more projects to import into the workspace.

      4. If required, click the Search for nested projects option to locate nested projects in the root directory or archive file.

      5. Click the Copy projects into workspace option to save a copy of the imported project in the workspace directory specified for JBoss Tools.

      6. If required, select the Add project to working sets checkbox and add the details for a new or existing working set.

      7. Click Finish to add the project to the workspace. The Project Explorer view now contains your imported project.

  2. If required, expand the project in the Project Explorer view and either double-click the project files to edit them, or right-click and select New  File to add a new JavaScript file for your project.

  3. Run the project files by right-clicking the index.js file in your project and click Run As  Node.js Application. The Console view appears and displays details about the application as it runs, or errors if it is unable to run the application.

Result: You have imported an existing JavaScript project into JBoss Tools.

Debugging Node.js Applications

After either creating a new Node.js project or importing an existing one and then running the project, some errors may appear. JBoss Tools includes a debugger to help identify and resolve these issues. To use the debugging feature:

  1. Start the debugger for your project:

    1. In the Project Explorer view, expand your project.

    2. Right-click the index.js file for your project and click Debug As  Node.js Project.

    3. Select the Remember my decision check box in the dialog box to apply your selection to subsequent perspective shifts and then click Yes or No to continue.

  2. Review the elements of your project’s JavaScript files to locate errors in one of two ways:

    1. Expand any variable listed in the Variables tab to view additional objects and edit the details for each item.

    2. Hover the mouse cursor over any variables in the index.js tab to view and edit its property details.

  3. Make changes to the files to address the errors:

    1. Edit the index.js file in the appropriate view.

    2. Save the changes. The Console view runs the updated file and displays changes.

  4. After debugging the errors, use the Resume, Suspend, and Terminate buttons (nodejs resume pause) as follows to test your changes:

    1. The Resume button (green triangle) continues running the project files.

    2. The Suspend button (two yellow rectangles) temporarily stops running the project files to allow users to make changes.

    3. The Terminate button (red square) ends the running of the project files.

  5. Repeat steps 4 through 6 as necessary to locate and fix errors found by the debugger.

  6. When debugging is concluded, click Window  Show View  Other and select Project Explorer from the options. This displays the list of projects again.

Result: You have debugged your application and returned to the Project Explorer view.

back to top