Inventory Micro App - Part 1

• Inventory Service
• Inventory BFF
• Inventory UI

Business Need

MVP Statement

• Who: Distribution employees in each of the regional warehouses

• What: A secure web application that enables easy access to list of product SKU inventory levels and inventory locations

• Wow: Make the system appealing and easy to use. Deliver it hosted on the IBM Cloud platform. Develop it quickly as a minimum viable product. Use the latest managed container runtimes and DevOps best practices to enable post MVP feature improvements. Simulate a release to a Test environment.

Architecture

User interface

Technical Requirements

• Microservices
  • Stateless
  • REST APIs
  • Polyglot
• DevOps with CI/CD (continuous integration and continuous delivery)
  • Monitoring and logging
  • Code analysis
  • App security
• Deployed to Red Hat OpenShift on IBM Cloud or IBM Cloud Kubernetes Service
• Follow the Carbon Design System user experience

Guide

Prebuilt Solution

Inventory Service

Setup

• Create a new repository from the Spring Boot Microservice template

  You can access this template on the Starter Kits page in the Developer Dashboard.

  Warning: If you are developing on a shared education cluster, place the repository in the Git Organisation listed in your notification email and remember to add your initials as a suffix to the app name.

  In order to prevent naming collisions, name the repository inventory-management-svc-{your initials}, replacing {your initials} with your actual initials.

• Clone the new repository to your machine

• Log in to the cluster from the command line, then register the pipeline

  igc pipeline -n dev-{your initials}
  Copy to clipboardCopied!

  replacing {your initials} with your actual initials

• Run igc credentials to get the credentials for the Jenkins instance

• Open the pipeline to see it running

• When the pipeline is completed, run igc ingress -n dev-{your initials}. You should see an entry for the app we just pushed. Select the entry and hit Enter to launch the browser.

• Run the service locally

  npm start
  Copy to clipboardCopied!

  OR

  ./gradlew bootRun
  Copy to clipboardCopied!

  When the execution output says “Server started”, the app is running.

• Open a browser to http://localhost:9080/swagger-ui.html

  This will display the Swagger UI page that provides a user interface to exercise the APIs.

Create initial components

• Create a class named Application in the com.ibm.inventory_management.app package.

• Add the @SpringBootApplication and @ComponentScan annotation to the class. The @ComponentScan annotation should include com.ibm.inventory_management.*, com.ibm.cloud_garage.*, and com.ibm.health packages.

src/main/java/com/ibm/inventory_management/app/Application.javaCopy to clipboardCopied!
package com.ibm.inventory_management.app;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.boot.CommandLineRunner;
import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;
import org.springframework.boot.builder.SpringApplicationBuilder;
import org.springframework.boot.web.servlet.support.SpringBootServletInitializer;
import org.springframework.context.ApplicationContext;

• Delete application.app

• Run the service locally. The swagger page should no longer contain the /hello API endpoint.

• Commit and push the changes to Git.

git add .
git commit -m "Adds Application and Removes default Application class"
git push
Copy to clipboardCopied!

Add StockItem controller

• Start the tests in tdd mode with npm run tdd (or ./gradlew test --continuous)

• Add a StockItemControllerTest.java in com.ibm.inventory_management.controllers under the test folder

src/test/java/com/ibm/inventory_management/controllers/StockItemControllerTest.javaCopy to clipboardCopied!
package com.ibm.inventory_management.controllers;
import org.junit.jupiter.api.DisplayName;
@DisplayName("StockItemController")
public class StockItemControllerTest {
}

• Add the MockMvc infrastructure and create the StockItemController

src/test/java/com/ibm/inventory_management/controllers/StockItemControllerTest.javaCopy to clipboardCopied!
package com.ibm.inventory_management.controllers;
import static org.mockito.Mockito.spy;
import org.junit.jupiter.api.BeforeEach;
import org.junit.jupiter.api.DisplayName;
import org.springframework.test.web.servlet.MockMvc;
import org.springframework.test.web.servlet.setup.MockMvcBuilders;

src/main/java/com/ibm/inventory_management/controllers/StockItemController.javaCopy to clipboardCopied!
package com.ibm.inventory_management.controllers;
public class StockItemController {
}

• Add the tests for the controller behavior and make the corresponding changes to make the tests pass

src/test/java/com/ibm/inventory_management/controllers/StockItemControllerTest.javaCopy to clipboardCopied!
package com.ibm.inventory_management.controllers;
import static org.mockito.Mockito.spy;
import static org.springframework.test.web.servlet.request.MockMvcRequestBuilders.get;
import static org.springframework.test.web.servlet.result.MockMvcResultMatchers.content;
import static org.springframework.test.web.servlet.result.MockMvcResultMatchers.status;
import org.junit.jupiter.api.BeforeEach;
import org.junit.jupiter.api.DisplayName;

src/main/java/com/ibm/inventory_management/controllers/StockItemController.javaCopy to clipboardCopied!
package com.ibm.inventory_management.controllers;
import java.util.ArrayList;
import java.util.List;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RestController;
@RestController

• Start the local server

npm start
Copy to clipboardCopied!

./gradlew bootRun
Copy to clipboardCopied!

• When the server starts, open a browser to http://localhost:9080/swagger-ui.html to view the swagger documentation. You should see the stock item entry in the list

• Commit and push the changes to Git.

git add .
git commit -m "Adds StockItemController"
git push
Copy to clipboardCopied!

Add a service for providing results

• Update the controller test to include returning data from the service

src/test/java/com/ibm/inventory_management/controllers/StockItemControllerTest.javaCopy to clipboardCopied!
package com.ibm.inventory_management.controllers;
import static org.mockito.Mockito.mock;
import static org.mockito.Mockito.spy;
import static org.mockito.Mockito.when;
import static org.springframework.test.web.servlet.request.MockMvcRequestBuilders.get;
import static org.springframework.test.web.servlet.result.MockMvcResultMatchers.content;
import static org.springframework.test.web.servlet.result.MockMvcResultMatchers.status;

src/main/java/com/ibm/inventory_management/models/StockItem.javaCopy to clipboardCopied!
package com.ibm.inventory_management.models;
import java.io.Serializable;
public class StockItem implements Serializable {
    private String name;
    public String getName() {
        return name;

src/main/java/com/ibm/inventory_management/services/StockItemApi.javaCopy to clipboardCopied!
package com.ibm.inventory_management.services;
import java.util.List;
import com.ibm.inventory_management.models.StockItem;
public interface StockItemApi {
    List<StockItem> listStockItems();
}

src/main/java/com/ibm/inventory_management/controllers/StockItemController.javaCopy to clipboardCopied!
package com.ibm.inventory_management.controllers;
import java.util.List;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RestController;
import com.ibm.inventory_management.models.StockItem;
import com.ibm.inventory_management.services.StockItemApi;

• At this points the tests should pass even though we haven’t provided an implementation of the service yet since we are creating a mocking the service in the unit test

• Update the StockItem model to include the remaining fields

src/main/java/com/ibm/inventory_management/models/StockItem.javaCopy to clipboardCopied!
package com.ibm.inventory_management.models;
import java.io.Serializable;
public class StockItem implements Serializable {
    private String name;
    private String id = null;
    private int stock = 0;
    private double price = 0.0;

• Provide an implementation of the service that just returns a couple of hard-coded data values, for now. Services are denoted in Spring Boot with the @Service annotation

src/main/java/com/ibm/inventory_management/services/StockItemService.javaCopy to clipboardCopied!
package com.ibm.inventory_management.services;
import static java.util.Arrays.asList;
import java.util.List;
import org.springframework.context.annotation.Primary;
import org.springframework.stereotype.Service;

• Replace the api() method in the SwaggerDocket class to restrict the swagger page to only show the /stock-items API

src/main/java/com/ibm/cloud_garage/swagger/SwaggerDocket.javaCopy to clipboardCopied!
    @Bean
    public Docket api() {
        return new Docket(DocumentationType.SWAGGER_2)
                .select()
                .apis(buildApiRequestHandler())
                .paths(PathSelectors.regex(".*stock-item.*"))
                .build()
                .apiInfo(buildApiInfo());
    }

Verify the service locally and push the changes

• Start the application

  npm start
  Copy to clipboardCopied!

  or

  ./gradlew bootRun
  Copy to clipboardCopied!

• Open a browser to http://localhost:9080/swagger-ui.html to see the Swagger page

• Run the service by selecting Try it out then Execute

• You should see the data we defined in the service in the previous section

• Commit and push the changes to git

git add .
git commit -m "Adds StockItem service implementation"
git push
Copy to clipboardCopied!

• The pipeline should kick off and you will be able to see the running service by running igc ingress -n dev-{initials} and selecting the ingress of your service

Inventory BFF

Setup

• Create a new repository from the Typescript GraphQL Starter Kit

  Warning: If you are developing on a shared education cluster place the repository in the Git Organisation listed in your notification email and remember to add your initials as a suffix to the app name.

  • In order to prevent naming collisions, name the repository inventory-management-bff-{your initials} replacing {your initials} with your actual initials.

• Clone the new repository to your machine

• Run npm install to install all the package dependencies

• Log into the cluster from the command-line then register the pipeline

  igc pipeline -n dev-{your initials}
  Copy to clipboardCopied!

  replacing {your initials} with your actual initials

• Open the pipeline to see it running

• When the pipeline is completed, run igc ingress -n dev-{your initials}. You should see an entry for the app we just pushed. Select the entry and hit Enter to launch the browser.

Build the controller for the REST interface

• Start the tests in tdd mode by running

npm run tdd
Copy to clipboardCopied!

• Create the controller test

test/controllers/stock-items.controller.spec.tsCopy to clipboardCopied!
import {Application} from 'express';
import * as request from 'supertest';
import {buildApiServer} from '../helper';
describe('stock-item.controller', () => {
  let app: Application;
  beforeEach(async () => {

• Create the controller component

src/controllers/stock-items.controller.tsCopy to clipboardCopied!
import {GET, Path} from 'typescript-rest';
@Path('stock-items')
export class StockItemsController {
  @GET
  async listStockItems(): Promise<any[]> {
    return [];
  }

• Add the controller to the controllers index.ts. (Using index.ts is a good way to manage which components are exposed by a component and provide a good way to load the modules that will be injected into other components)

src/controllers/index.tsCopy to clipboardCopied!
export * from './health.controller';
export * from './stock-items.controller';

• Start the service to see it running

npm start
Copy to clipboardCopied!

• Open a browser to http://localhost:3000/api-docs to see the swagger page

• Expand our service from the list, click Try it out, then click Execute

• Push the changes we’ve made to the repository

git add .
git commit -m "Adds stock items controller"
git push
Copy to clipboardCopied!

• Open the pipeline to see it running

Update the controller to call a service

• Add a StockItem model that contains the values needed for the UI

src/models/stock-item.model.tsCopy to clipboardCopied!
export class StockItemModel {
  id: string;
  name: string;
  description: string;
  stock: number;
  unitPrice: number;
  picture: string;
  manufacturer: string;
}

• Register the model with the index.ts file in the models directory

src/models/index.tsCopy to clipboardCopied!
export * from './stock-item.model';

• Define an abstract class to provide the interface for our API

src/services/stock-items.api.tsCopy to clipboardCopied!
import {StockItemModel} from '../models';
export abstract class StockItemsApi {
  async abstract listStockItems(): Promise<StockItemModel[]>;
}

• Add the abstract class to the index.ts file in the services directory

src/services/index.tsCopy to clipboardCopied!
export * from './stock-items.api';

• Update the controller test to inject the service into the controller and to return the value from the service

test/controllers/stock-items.controller.spec.tsCopy to clipboardCopied!
import {Application} from 'express';
import * as request from 'supertest';
import {Container} from 'typescript-ioc';
import {buildApiServer} from '../helper';
import Mock = jest.Mock;
import {StockItemsApi} from '../../src/services';
describe('stock-item.controller', () => {

• Update the controller to inject the service and use it

src/controllers/stock-items.controller.tsCopy to clipboardCopied!
import {Inject} from 'typescript-ioc';
import {GET, Path} from 'typescript-rest';
import {HttpError} from 'typescript-rest/dist/server/model/errors';
import {StockItemModel} from '../models';
import {StockItemsApi} from '../services';
class BadGateway extends HttpError {
  constructor(message?: string) {

Create a mock service implementation

• Add a stock-items-mock.service to services

src/services/stock-items-mock.service.tsCopy to clipboardCopied!
import {Provides} from 'typescript-ioc';
import {StockItemsApi} from './stock-items.api';
import {StockItemModel} from '../models';
@Provides(StockItemsApi)
export class StockItemsMockService implements StockItemsApi {
  async listStockItems(): Promise<StockItemModel[]> {
    return [

• Add the mock service to the index.ts file in the services directory

src/services/index.tsCopy to clipboardCopied!
...
export * from './stock-items-mock.service';

• Start the service

npm start
Copy to clipboardCopied!

• Open a browser to http://localhost:3000/api-docs and execute the stock items controller. You should see the data from above returned by the service.

• Push the changes we’ve made to the repository

git add .
git commit -m "Adds a mock service implementation"
git push
Copy to clipboardCopied!

• Open the pipeline to see it running

Add a GraphQL implementation of Stock Items

• Create a stock-items GraphQL schema in the schemas directory

src/schemas/stock-item.schema.tsCopy to clipboardCopied!
import {Field, Float, Int, ObjectType} from 'type-graphql';
import {StockItemModel} from '../models';
@ObjectType()
export class StockItem implements StockItemModel {
  @Field()
  id: string;
  @Field()
  description: string;

• Add the stock-items schema to the index.ts in the schemas directory

src/schemas/index.tsCopy to clipboardCopied!
export * from './stock-item.schema'

• Add a ‘stock-item’ GraphQL resolver in the resolvers directory

src/resolvers/stock-item.resolver.tsCopy to clipboardCopied!
import {Query, Resolver} from 'type-graphql';
import {Inject} from 'typescript-ioc';
import {resolverManager} from './_resolver-manager';
import {StockItem} from '../schemas';
import {StockItemModel} from '../models';
import {StockItemsApi} from '../services';
@Resolver(of => StockItem)

• Add the stock-items resolver to index.ts in the resolvers directory

src/resolvers/index.tsCopy to clipboardCopied!
export * from './stock-item.resolver';

• Start the service

npm start
Copy to clipboardCopied!

• Verify that the that the resolver is available using the Graph QL browser provided by the Starter Kit

  • Open GraphQL Playground: http://localhost:3000
  • Run the query query { stockItems { name } }

• Push the changes we’ve made to the repository

git add .
git commit -m "Adds a graphql interface"
git push
Copy to clipboardCopied!

• Open the pipeline to see it running

Create a service implementation that calls the microservice

• Add a stock-item-service.config file in the config directory

src/config/stock-item-service.config.tsCopy to clipboardCopied!
import {Provided, Provider} from 'typescript-ioc';
const baseUrl: string = process.env.SERVICE_URL || 'localhost:9080';
const provider: Provider = {
  get: () => ({
    baseUrl,
  })
};

• Add the stock-item-service config to an index.ts of the config directory

src/config/index.tsCopy to clipboardCopied!
export * from './stock-item-service.config'

• Create a stock-items service in the services directory that uses the config

src/services/stock-items.service.tsCopy to clipboardCopied!
import {Inject, Provides} from 'typescript-ioc';
import {get, Response} from 'superagent';
import {StockItemsApi} from './stock-items.api';
import {StockItemModel} from '../models';
import {StockItemServiceConfig} from '../config';
import {LoggerApi} from '../logger';
class StockItem {

• Add stock-item.service to index.ts in the service directory
• Remove stock-items-mock.service from index.ts

src/services/index.tsCopy to clipboardCopied!
export * from './stock-items.service';

• Add a serviceUrl property to the values.yaml file of the Helm chart. The value of the property should match the Kubernetes service of the microservice. (For Starter Kit projects, the service name is the same as the name of the application which is that same as the name of the repository.)

chart/base/template/values.yamlCopy to clipboardCopied!
global: {}
serviceUrl: "inventory-management-svc-{your initials}:80"
...

• Add a new environment variable named SERVICE_URL to the list of existing environment variables in deployment.yaml. (SERVICE_URL is the name we gave the environment variable in our stock-item-service.config class as the first step in this section.) The value of this environment variable should come from the serviceUrl value we defined. You can add | quote to wrap the value in quotes in case the value is not formatted correctly.

chart/base/templates/deployment.yamlCopy to clipboardCopied!
  ...
  env:
    - name: INGRESS_HOST
      value: {{ include "starter-kit-chart.host" . }}
    - name: PROTOCOLS
      value: {{ include "starter-kit-chart.protocols" . }}
    - name: SERVICE_URL
      value: {{ .Values.serviceUrl | quote }}
  ...

• Commit and push the changes to git

git add .
git commit -m "Adds service implementation"
git push
Copy to clipboardCopied!

• Open the pipeline to see it running

Inventory UI

Setup

• Create a new repository from the React UI Patterns Starter Kit into your Git org - https://github.com/cloud-native-toolkit/template-node-react/generate

  In order to prevent naming collisions, name the repository inventory-management-ui-{your initials} replacing {your initials} with your actual initials.

• Clone the new repository to your machine

• Run npm install to install the project dependencies

• Log into the cluster from the command-line then register the pipeline

  igc pipeline -n dev-{your initials}
  Copy to clipboardCopied!

  replacing {your initials} with your actual initials

• Open the pipeline to see it running

Create the initial components

• Open a terminal and start the application in development mode to see the initial UI and the changes as we make them

npm run start:dev
Copy to clipboardCopied!

• Make a copy of the TableList pattern component from the pattern-component directory into the components folder. Rename the file and the class inside to StockItemList.

client/src/components/StockItemList.jsxCopy to clipboardCopied!
import React, { Component } from "react";
import {
  StructuredListWrapper,
  StructuredListRow,
  StructuredListCell,
  StructuredListHead,
  StructuredListBody,
  StructuredListInput,
  Icon

• Update UIShell.jsx

  • Update the header variable to whatever name you want. “Big Blue Widgets” is used in the example
  • Update the menuTitle to “Inventory Management”
  • Remove all the values from menuItems

client/src/components/UIShell.jsxCopy to clipboardCopied!
class UIShell extends Component {
  header = "Big Blue Widgets";
  menuTitle = "Inventory Management";
  menuItems = [
    "Stock Items",
  ];
  ...
}

• Update UIShellBody.jsx

  • Remove all of the pattern values from the components map and add one entry for Stock Item List. The value on the left is the label that is displayed and the value on the right is the class that should be loaded (e.g. "Stock Items": StockItemList). Note: The label value needs to match the one used on UIShell
  • Update the Use Stock Items as the default pattern name when none is given

client/src/components/UIShellBody.jsxCopy to clipboardCopied!
import React, {Component} from "react";
import "../pattern-components/patterns.scss";
import StockItemList from "./StockItemList";
class UIShellBody extends Component {
  components = {
    "Stock Items": StockItemList
  };

• With the application running in the first terminal, open a second terminal in the repository directory and push the changes we’ve made to the repository

git add .
git commit -m "Initial shell components"
git push
Copy to clipboardCopied!

• Return to the pipeline to see it running

• Refresh the browser from earlier (or follow the steps from before to use igc ingress to open the browser). The changes we just made should be reflected in the UI.

Update StockItemList contents

• Start the application in development mode (if not already running) with npm run start:dev

• Update the title and subtitle with values for our Stock Items view.

• Update the columns and data fields with the list of columns and sample data to match the UI. Set the formatters to {} for now.

  The value in the columns array maps to one of the attributes in our data values (e.g. name refers to the name attribute)

• The result of these changes should look like the following:

client/src/components/StockItemList.jsxCopy to clipboardCopied!
class StockItemList extends Component {
    title = 'Stock Items';
    subtitle = 'This is the current inventory of items';
    columns = [
      "name",
      "description",
      "stock",
      "unitPrice",

• View the new data in your local UI: http://localhost:3000/

• Push the changes we’ve made to the repository

git add .
git commit -m "Updates the StockItemsList view"
git push
Copy to clipboardCopied!

• Look at the Jenkins pipeline and the deployed app

Add a service component to get mock Stock Items

• Create a directory called services under the client/src folder

• Create a file named stock-item-mock.service.js in the service directory. Our StockItem service component will have a single asynchronous function called listStockItems() that returns a list of StockItems.

client/src/services/stock-item-mock.service.jsCopy to clipboardCopied!
export class StockItemMockService {
  async listStockItems() {
    return [];
  }
}

• Implement the service by copying the data array from StockItemList and returning it in the function. You can add a call to timer() to simulate wait time

client/src/services/stock-item-mock.service.jsCopy to clipboardCopied!
import timer from '../util/timer';
export class StockItemMockService {
  async listStockItems() {
    // wait 1 second before returning data
    await timer(1000);
    return [
      {

• Update the components to pass the service in the properties

client/src/App.test.jsxCopy to clipboardCopied!
import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';
import {StockItemMockService} from "./services/stock-item-mock.service";
describe('App', () => {
  test('canary verifies test infrastructure', () => {
     expect(true).toEqual(true);
  });

client/src/App.jsxCopy to clipboardCopied!
import React, { Component } from "react";
import UIShell from "./components/UIShell";
import "./App.scss";
import {StockItemMockService} from "./services/stock-item-mock.service";
class App extends Component {
  constructor(props) {
    super(props);

client/src/components/UIShell.jsxCopy to clipboardCopied!
...
class UIShell extends Component {
  ...
  render() {
    return (
      <div>
        <Header aria-label="IBM Platform Name">

client/src/components/UIShellBody.jsxCopy to clipboardCopied!
...
class UIShellBody extends Component {
  components = {
    "Stock Items": StockItemList
  };
  defaultComponent = "Stock Items";
  render() {

• Update StockItemList to use the provided service

src/components/StockItemList.jsxCopy to clipboardCopied!
...
class StockItemList extends Component {
  ...
  async componentDidMount() {
    this.setState({
      data: await this.props.stockService.listStockItems()

• View the new data in your local UI: http://localhost:3000/

• Push the changes we’ve made to the repository

git add .
git commit -m "Adds a mock service"
git push
Copy to clipboardCopied!

• Look at the Jenkins pipeline and the deployed app

Add a service that calls the BFF

• With npm, install the superagent and @types/superagent dependencies

npm i -s superagent
npm i -D @types/superagent
Copy to clipboardCopied!

• Create a service implementation in the services directory called stock-item.service.js

client/src/services/stock-item.service.jsCopy to clipboardCopied!
export class StockItemService {
  async listStockItems() {
    return [];
  }
}

• Add an implementation of listStockItems() that calls the BFF through the /api proxy

client/src/services/stock-item.service.jsCopy to clipboardCopied!
import * as superagent from 'superagent';
export class StockItemService {
  constructor(baseUrl) {
    this.baseUrl = baseUrl || '/api';
  }
  async listStockItems() {
    return superagent

• Update App.jsx to use the new service instead of the mock service.

client/src/App.jsxCopy to clipboardCopied!
import React, { Component } from "react";
import UIShell from "./components/UIShell";
import "./App.scss";
import {StockItemService} from "./services/stock-item.service";
class App extends Component {
  constructor(props) {
    super(props);

• The deployment is already configured to use the value of apiHost for our proxy service. We need to configure the apiHost value to point to the Kubernetes service resource of the BFF.

chart/base/template/values.yamlCopy to clipboardCopied!
apiHost: "inventory-management-bff-{your initials}:80"

• Push the changes we’ve made to the repository

git add .
git commit -m "Updates the StockItemsList view"
git push
Copy to clipboardCopied!

• Look at the Jenkins pipeline and the deployed app

Summary

Deploy the Inventory App solution

Inventory Services

• Create a new project from the Inventory Management Service solution template named inventory-management-svc-{initials}

• Clone the repository to your local machine

• Log into the cluster from the command-line then register the pipeline

  igc pipeline -n dev-{your initials}
  Copy to clipboardCopied!

  • replacing {your initials} with your actual initials

• Run igc credentials to get the credentials for the Jenkins instance.

• Open the pipeline to see it running

Inventory BFF

• Create a new project from the Inventory Management BFF solution template named inventory-management-bff-{initials}

• Clone the repository to your local machine

• Log into the cluster from the command-line then register the pipeline

  igc pipeline -n dev-{your initials}
  Copy to clipboardCopied!

  • replacing {your initials} with your actual initials

• Run igc credentials to get the credentials for the Jenkins instance.

• Open the pipeline to see it running

• Update the connectsTo value in charts/base/templates/values.yaml to point to the kubernetes service of the microservice. The value most likely will be inventory-management-svc-{initials}:80.

• Commit and push the changes

  git add .
  git commit -m "Update the connectsTo"
  git push
  Copy to clipboardCopied!

Inventory UI

• Create a new project from the Inventory Management UI solution template named inventory-management-ui-{initials}

• Clone the repository to your local machine

• Log into the cluster from the command-line then register the pipeline

  igc pipeline -n dev-{your initials}
  Copy to clipboardCopied!

  • replacing {your initials} with your actual initials

• Run igc credentials to get the credentials for the Jenkins instance.

• Open the pipeline to see it running

• Update the hostApi value in charts/base/templates/values.yaml to point to the kubernetes service of the BFF. The value most likely will be inventory-management-bff-{initials}:80.

• Commit and push the changes

  git add .
  git commit -m "Update the hostApi"
  git push
  Copy to clipboardCopied!

• Verify that the application is running