Jetray

Jetray is a lightweight toolkit that enables the rapid creation, development and deployment of JavaScript-centric (ok, React and Angular) portlets for Liferay DXP.

Jetray is built around the tools you’re familiar with (yeoman, npm, gulp, webpack) from a standard UX development environment, but also supports using Gradle as a primary build system and hides all the gory details of deploying your portlets into the Liferay DXP server environment. You can also use techniques like “watch” and “live reload” for your portlet-based development.

Features

Familiar Tools

Leverages industry standard tools for UX development such as yeoman, npm, gulp and webpack for building Angular and React portlets.

Easy and Fast

Use the supplied yeoman generator to select either Angular or React, and choose npm or gradle. From 0 to a fully working and deployed portlet in just minutes

Optimized

Supports multiple portlets per page. Angular and React frameworks included only once per page regardless of the number of portlets on the page. Toolkit supports both development and production "modes".

Rich Examples

Generated portlets are fully functional and include working code samples for URL routing and REST-based data retrieval.

Gradle Support

While Jetray is fundamentally npm-based it can be embedded inside Gradle builds for integration with CI and custom Java.

Solid Foundation

Based on Xtivia's years of engineering experience with Liferay and JavaScript-based portlet development.

Getting started

The following is a quick outline of the steps needed to generate an Angular or React portlet using Jetray:


  • Clone the git repository

    Navigate to the Jetray repository on GitHub and clone the project into a local directory in your local filesystem.

  • Install the required npm packages

    Ensure that you have installed node, and also have installed the node packages yo and gulp-cli globally

  • Make the freshly cloned directory (a Yeoman generator) visible to NodeJS and Yeoman

    cd into the freshly cloned directory from step #1 and run 'npm link'.

  • Create your new portlet

    Create a new portlet project directory, cd into it, and run 'yo jetray' and answer the prompts.

  • Build your new portlet

    After portlet generation and the installation of required packages (step 4) is complete, simply run 'gulp build'.

  • Deploy your new portlet to Liferay DXP

    Run 'gulp deploy', then login to Liferay and add your shiny new portlet to a page. It's that easy!

  • Edit the sample portlet to meet your requirements

    Study the generated example portlet and change it as needed to meet your own specific requirements. Then repeat the 'gulp build' and 'gulp deploy' steps as needed.