Full Demo

Objectives: 


  1. Learn how to deploy a full working APP on top of SOAJS (Pet Store)

  2. Learn how to build UI Modules and deploy them in the /wiki/spaces/BL/pages/61906563 pillar of SOAJS SOAJS Console

  3. Learn how to deploy a custom UI Frontend Interface for your APP with SOAJS
    - Deploy and use oAuth to login
    - Deploy and use URAC for member management and 3rd party integration (Facebook, Google+, Twitter)





1- Install SOAJS


Start by installing and deploying SOAJS as local cloud deploymentClick Here and you will be redirected to the SOAJS Installer Space where you can find the installation instructions.

For this demo, we will be using Local Cloud Deployment on top of Docker and we will provide our custom UI modules for the pet store when deploying the portal.



2- Install the Portal 


Login to the Dashboard using the credentials.

Press on Deploy Portal marked in blue on the top right dashboard and fill the wizard steps as following:



3- Install Demo


Once you finished the installation of the Portal, clone the full demo configuration repository to import some sample data before you proceed. 

OSX Users

Make sure you have Xcode (or at least Xcode cli) installed to be able to use the "git" command from the terminal!

Install and Import Pet Store sample data
# Create a directory to clone the repo
> mkdir -p /opt/soajs/node_modules

# Go to directory
> cd /opt/soajs/node_modules

# Clone configuration repo from Github
> git clone git@github.com:SOAJS-Demos/soajs.petstore.config

# install dependencies for repository
> cd soajs.petstore.config
> npm install

# Import the configuration
> cd soajs.petstore.config/import/

# node . -h <mongo service host> -p <mongo port>
> node . -h dashboard-soajsdata -p 32017

Import script help

# Open the import script help manual
> cd soajs.petstore.config/import/
> node . --help

Go to the Deploy pillar → Clouds & Deployments then Reload registry of the dashboard container.

Then Logout and Log back in, now the dashboard will load your new ACL permissions that includes the imported configuration for the pet store demo.



3 - Deploy Demo


3.1 Activate Demo Repo

Head over to the Develop pillar → Repositories to active the demo microservice.

In Repositories, we find the default SOAJS account activated and it contains a list of repositories we can turn on and off.

The Pet Store demo is in another organization (SOAJS Demos); this means we need to create an account for it and activate it.

Field NameField ValueDescription
Account ProviderGithubWhich Git Provider to integrate with
Account Domaingithub.comThe domain of the Git Provider
Account TypeOrganization - PublicThe type of Account
Account LabelSOAJS DemosEnter a name for this account (anything you want)
UsernameSOAJS-DemosThe username of the Account to use; in this case SOAJS-Demos is the username for the SOAJS Demos Organization that contains the demo repositories and code


The list contains multiple repositories but for the Pet Store Demo we need to activate only 2:

Repository NameBranchDescription
soajs.pestore.petstoremasterContains petstore microservice ( inventory ).
soajs.petstore.ordermasterContains orders microservice (Shopping Cart systems).

3.2 Deploy Environment and Microservice

Our import script already imported the configuration we need to get things going.

Let's deploy the DEV environment which will contain:

SystemsDescription
Nginx

Web Server that listens on port 81.

  • It loads the custom UI Frontend files based on the arriving request
  • It redirects and upstreams all API calls to the SOAJS Controller in this environment
ControllerSOAJS microservice that listens on port 4000 and analysis arriving requests to check the security and determine which microservice should handle these requests. Read More
oAuthSOAJS microservice that provides an out of the box implementation of oAuth 2.0, used to allow members to login and create access tokens for them. Read More
URACSOAJS microservice that offers user registration and access control to all members along with the ability to login via 3rd parties ( facebook - twiiter - google). Read More
Pet StoreCustom microservice built using the SOAJS Swagger Editor and contains all the APIs to manage a pet store inventory.
OrdersCustom microservice built using the SOAJS Swagger Editor and contains all the APIs that enable members to fill, checkout shopping carts & create orders while at the same time offers admin the ability to process these orders.


Step 1: Deploy Environment

Go to Deploy pillar → Clouds & Deployments

Select DEV from the drop down menu in the top left corner.

Press Deploy Environment.

Fill in the deploy environment form like the following pictures for both Nginx and Controller sections.

Once deployed, changed the environment to Dashboard in the top left sidebar, locate the controller and from it's Service Operation Menu, select Reload Registry.

This will instruct the dashboard controller that a new controller in a new environment is now present.

Step 2: Deploy Service

Change the environment back to Dev in the top left sidebar.

Navigate to Repositories under Deploy pillar, click on the service to deploy and press Configure Deployment, fill the form like the following picture and press First Time Deploy:

Deploy the following services using their latest versions: urac - oauth - petstore & orders.

Once the environment is deployed, update your hosts file and add the below entry:

Point the Dev API & widget Domain IPs in your local hosts file
127.0.0.1    petstore.soajs.org
127.0.0.1    petstore-api.soajs.org

Go to the Deploy pillar → Clouds & Deployments then Reload registry of the controller container in Portal environment.



4- Use the Demo


4.1 Test the services

Swagger Simulator : rich UI simulator that provides REST API documentation and the ability to interact with them.
SOAJS Dashboard UI is equipped with Swagger Engine and Simulator by default.

  1. Go to the dashboard → Develop → API Catalog
  2. Click on Swagger logo that appears if the microservice is created using Swagger Editor and a new tab will open
  3. Choose your environment where you deployed your microservice
  4. Use the simulator to make API calls to your microservice

4.2 Explore the widget

In your browser open http://petstore.soajs.org:81 and the pet store frontend UI interface will open; Enjoy the Shopping (smile)

4.3 Manage the pet store

Go to the PortalOperate pillar, where you will find two extra UI Modules : Pet Store and Order Management.

4.3.1 Pet Store

In the Pet Store module, you will be able to manage your pets inventory for the store.

4.3.2 Order Management

In the Order Management module, you will be able to list all orders and fulfill or reject them.



5 - Conclusion


To sum things up, this demo is an excellent example on how to deploy a full APP on top of SOAJS.

We showed you how to create environments and deploy microservices in them using catalog recipes and while doing that, we introduced couple of ready made services by SOAJS: Controller - oAuth - URAC.

Ready made services do not require any development effort, simply deploy and use them.

In addition to microservices, we showed you how to deploy and operate on two types of UI components: UI Modules & Frontend UI Interfaces.

Dive in deeper and learn more about how the full demo is constructed in the sub pages where we tackle every section by itself and explain it in depth.