Skip to main content

 

Stay Connected and Keep Current

 

Keeping you informed with the latest and greatest.

 

 

developers looking at computer

3 Ways to Master Red App Development Using the Sabre Red 360 Web SDK

SDK

Alexandre Meneghello | May 2021

Reimagining the User Experience

One important feature present on Sabre Red 360 and Sabre Red 360 Web, is that agencies can create applications that are both visually and functionally integrated into the consultant’s workspace. In fact, this feature alone is responsible for creating a niche of developers who specialize in such customizations. It provides you with the ability to integrate multiple workflows across several systems onto a single desktop with the tools to customize key functionality across your consultant’s workflows to increase efficiencies, reduce manual steps, and support your business strategy.

Changes to an API-driven point-of-sale opened new pathways for power and growth improving the operational efficiency.

What You Can Expect

Over the next several months, we will be walking you through the customization process that gives you the ability to reimagine the customer experience.

  • How to Install the Sabre Red 360 Web SDK
  • How to Consume Sabre APIs Using the Sabre Red 360 Web SDK
  • How to Add Remarks to a PNR Using the Sabre Red 360 Web SDK Typescript Component

What do you want to see next? Fill out our form here and let us know what topics you want to learn more out!

How to Install the Sabre Red 360 Web SDK

For this Red App Development series, we will be focusing on Web Red Apps, or Web Modules, which are plug-ins that allows customization of the common Graphical User Interface shared on both Sabre Red 360 and Sabre Red 360 Web applications. The development environment is based on Web technologies, so you are expected to work with latest technology trends and languages which support a modern Web Development stack:

  • Web Red Apps uses Typescript as its main programming language, and it is based on component libraries shared from the core and accessible by developers using the Sabre Red Web SDK.
  • Sabre Red Web SDK offers a command line tool called Sabre Concierge (NGV), which is responsible of converting your Web Red App source code into suitable JavaScript files to be loaded directly into Sabre Red 360 and Web during runtime. The Sabre Concierge is based on NodeJS+NPM and its range of commands include:
    • NGV init – create new Web Red App project structure
    • NGV build - "compile" your typescript code onto JavaScript module.
    • NGV run – creates a Server on developer machine which allow to test Web Red Apps on Sabre Red Web.
    • NGV export – bundles a Web Red App for publishing on the Sabre Red App Centre
    • NGV update / NGV migrate – may be necessary to apply corrections on the source code when a new version of Sabre concierge is installed.
  • Third party technologies exposed by Sabre Red Web SDK
    • Typescript
    • React+Redux
    • Handlebar Templates
    • LESS Style sheet
    • Bootstrap
    • JQuery
    • CryptoJS
    • XML2Json

Getting Your Development Environment Ready

Register yourself on Sabre Dev Studio

This will grant you access to download Red App developer resources, as well extended access to Sabre APIs documentation. Be sure to check blog posts and sample code sections, its good area to keep up to date with latest trends and innovations for Sabre developers.

Become a Red App certified provider

This will grant you access to Sabre Red App Centre, the B2B Marketplace for Red Apps, there you will be able to manage your entire Red Apps process: Apply, Build, Certify and Publish your own Red Apps. When you became a certified Red App provider, an ERP/PCC will also be provided, which will allow you to run CERT environments of Both Sabre Red 360 and Sabre Red Web applications used for developing and testing your Red Apps.

Prepare your development environment accordingly

Web Red Apps, based on Web Development paradigms, using Typescript as its main language, allow developers to customize the main graphical user interface of both Sabre Red 360 and Sabre Red Web applications, also offers workflow management from a front-end perspective (user interactions)

  • Install Sabre Concierge tool, Typescript code editor and a chromium-based Web Browser which allow you to code, run and debug your Web Modules using development mode. Link to online help to install Sabre concierge tool.
  • The Red App SDK is available for both Windows and Mac environments, and its distributed in two different packages "full" Red App SDK, which would allow creation of desktop Red Apps and Web Red Apps, and a lightweight package holding just the Web SDK (Sabre Concierge + documentation). The latter is the focus of this series.
  • If you need any help during installation of your SDK / IDE please consult Sabre Red Apps Support Team at sabredappssuport@sabre.com

Create your first "Hello World" project

Sabre Concierge would be your main tool to create, build and test Web Module projects, as a command line tool, be prepared to have command prompt / Terminal available, preferably with Admin rights, in our example we well be using the Integrated Terminal under Visual Studio Code Editor from Microsoft, creators of Typescript, highly recommended asset, you can grab your free copy here

[NGV INIT], this command will create a new project structure for you start coding, the process will include some questions that will be used to set-up you Application, at the end of the process you should have a new directory created on the folder you started the NGV INIT command.

Picture 1

 

Picture 2

 

Picture 3

 [NGV BUILD], will "transpile" the Web Red App Typescript source code onto JavaScript Web Module structure, which could be dynamically loaded onto Sabre Red 360 during runtime.

Picture 4

 

Picture 5

 [NGV RUN] creates a local server to host the Web Module, so it can be provisioned on the Sabre Red 360 Web running in Developer Mode, the default address for the host would be http://localhost:8080, but it can be changed on the NGV RUN command line. Once you have the local server running, all changes done on the code will trigger an automatic NGV BUILD on the background, so you just need to refresh your browser to test your changes (CTRL+R)

Picture 6

 

Picture 7

 

Picture 8

 

Picture 9

 

Picture 10

 

Picture 11

Now that you have your development environment ready, and know the principal commands to build your Web Red Apps, it's recommended to get involved with some Sample Apps offered by the SDK Team, you can find those under the samples directory on the SDK package, look for the ones which names start with com.sabre.example3.web, and there is also a public Red App called Showcase which implements the most common features offered by the SDK, its source code its available on Sabre's GitHub Channel.

Next time we will be covering an important feature from the Sabre Red 360 Web SDK, which allows seamless connectivity with Sabre APIs, both SOAP and REST, those, together with UI component, form the main pillars of Web Red App development strategy.

Resources

Sabre Dev Studio - Get information about sabre APIs, download Sabre Red 360 SDK, access to blog posts and content directed to developers. Main portal and SDK.

Sabre Developer Partner Network  - Connect with different product providers, hire professionals, get acquainted with different Sabre offers.

Sabre Red App Centre - Connect with the Travel B2B App marketplace, browse and Shop for hundreds of Red Apps that integrate with your Agency workflow, publish you own Red Apps. (https://www.sabreredappcentre.sabre.com)

Help and support - Red App support, WebServices (APIs) support, Stackoverflow, and Github