Git Product home page Git Product logo

refarch-cloudnative-bluecompute-web's Introduction

BlueCompute Web Application

Web Service

This project is part of the 'IBM Cloud Native Reference Architecture' suite, available at https://github.com/ibm-cloud-architecture/refarch-cloudnative-kubernetes

Table of Contents

Introduction

The sample Web application is built to demonstrate how to access the Omnichannel APIs hosted on IBM Cloud . The application provides the basic function to allow user to browse the Catalog items, make an Order and check the profile. The Web application is built with AngularJS in Web 2.0 Single Page App style. It uses a Node.js backend to host the static content and implement the BFF (Backend for Frontend) pattern.

Here is an overview of the project's features:

  • AngularJS SPA
  • Node.js based BFF application to access APIs
  • Authentication and Authorization.
  • Distributed as Docker container and deployed to Kubernetes cluster.

How it works

Web Microservice serves 'IBM Cloud Native Reference Architecture' suite, available at https://github.com/ibm-cloud-architecture/refarch-cloudnative-kubernetes, Microservice-based reference application. Though it is a part of a bigger application, Web service is itself an application that serves as User Interface for BlueCompute.

Implementation

There are two versions of this application, each available in their own branch, as documented below.

  • Microprofile - Uses the backend microservices that are leveraged using Microprofile framework.
  • Spring - Uses the backend microservices that are leveraged using Spring Boot.

References

refarch-cloudnative-bluecompute-web's People

Contributors

hemankita avatar osowski avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

refarch-cloudnative-bluecompute-web's Issues

Update app configuration details to know where to acquire correct information

For https://github.com/ibm-cloud-architecture/refarch-cloudnative-bluecompute-web#run-the-web-application-locally Step 2, you can get the correct information from the Settings > Endpoints page in the API Connect service page from Bluemix. These values are available in the Base URL via https://[host]/[org]/[catalog]. This would be helpful for a user who is unfamiliar with the tooling.

This should be updated in the documentation.

using Bluecompute helm-chart -> two container fail always and error during removal of release

  1. using the bluecompute helm repository at: https://raw.githubusercontent.com/ibm-cloud-architecture/refarch-cloudnative-kubernetes/master/docs/charts/bluecompute-ce
    to deploy on ICP with default settings (only new name other values are not changed)
    1.1 after successfull deployment two container allway fail:
    ORDERS:
    TYPE | SOURCE | COUNT | REASON | MESSAGE | FIRST SEEN | LAST SEEN
    -- | -- | -- | -- | -- | -- | --
    Normal | default-scheduler | 1 | Scheduled | Successfully assigned anotherdemo-orders-5cf887f95b-grhrl to 172.16.205.57 | Mar 22nd 2018 at 2:00 PM | Mar 22nd 2018 at 2:00 PM
    Normal | kubelet 172.16.205.57 | 1 | SuccessfulMountVolume | MountVolume.SetUp succeeded for volume "default-token-mnbd4" | Mar 22nd 2018 at 2:00 PM | Mar 22nd 2018 at 2:00 PM
    Normal | kubelet 172.16.205.57 | 3 | Pulling | pulling image "ibmcase/bluecompute-orders:latest" | Mar 22nd 2018 at 2:00 PM | Mar 22nd 2018 at 2:01 PM
    Normal | kubelet 172.16.205.57 | 3 | Pulled | Successfully pulled image "ibmcase/bluecompute-orders:latest" | Mar 22nd 2018 at 2:00 PM | Mar 22nd 2018 at 2:01 PM
    Normal | kubelet 172.16.205.57 | 3 | Created | Created container | Mar 22nd 2018 at 2:00 PM | Mar 22nd 2018 at 2:01 PM
    Normal | kubelet 172.16.205.57 | 3 | Started | Started container | Mar 22nd 2018 at 2:00 PM | Mar 22nd 2018 at 2:01 PM
    Warning | kubelet 172.16.205.57 | 3 | BackOff | Back-off restarting failed container | Mar 22nd 2018 at 2:01 PM | Mar 22nd 2018 at 2:02 PM

and
CUSTOMER:

TYPE SOURCE COUNT REASON MESSAGE FIRST SEEN LAST SEEN
Normal default-scheduler 1 Scheduled Successfully assigned anotherdemo-customer-6ddbd8c7f-2wxns to 172.16.183.206 Mar 22nd 2018 at 2:00 PM Mar 22nd 2018 at 2:00 PM
Normal kubelet 172.16.183.206 1 SuccessfulMountVolume MountVolume.SetUp succeeded for volume "default-token-mnbd4" Mar 22nd 2018 at 2:00 PM Mar 22nd 2018 at 2:00 PM
Normal kubelet 172.16.183.206 4 Pulling pulling image "ibmcase/bluecompute-customer:latest" Mar 22nd 2018 at 2:00 PM Mar 22nd 2018 at 2:02 PM
Normal kubelet 172.16.183.206 4 Pulled Successfully pulled image "ibmcase/bluecompute-customer:latest" Mar 22nd 2018 at 2:00 PM Mar 22nd 2018 at 2:02 PM
Normal kubelet 172.16.183.206 4 Created Created container Mar 22nd 2018 at 2:00 PM Mar 22nd 2018 at 2:02 PM
Normal kubelet 172.16.183.206 4 Started Started container Mar 22nd 2018 at 2:00 PM Mar 22nd 2018 at 2:02 PM
Warning kubelet 172.16.183.206 7 BackOff Back-off restarting failed container Mar 22nd 2018 at 2:01 PM Mar 22nd 2018 at 2:03 PM

  1. Remove Helm Release during removal get an error:
    Error making request: Error: ESOCKETTIMEDOUT DELETE https://icp-management-ingress:8443/helm-api/api/v1/releases/andemo?locale=en-US HTTP/1.1 Accept: application/json Content-Type: application/json Content-Type: application/json Cookie: *** {} Error: ESOCKETTIMEDOUT

Nested link (A) and grid view (div class=pure-g) for the inventory display breaks the formatting for Windows based browsers

Recommend to put the link under the individual cell for StoreWebApp/views/inventory.jade

            div.item-box
              div.pure-g
                div.pure-u-1-1
                  a(href= "/item/" + item.id).pure-menu-link.item-link
                    img(src= base_url + item.img).pure-img
                div.pure-u-1-1
                  a(href= "/item/" + item.id).pure-menu-link.item-link
                    div.item-section= item.name
                div.pure-u-1-2
                  a(href= "/item/" + item.id).pure-menu-link.item-link
                    div.item-section= '$' + item.price
                div.pure-u-1-2
                  a(href= "/item/" + item.id).pure-menu-link.item-link

Error response from daemon: Get https://mycluster.icp:8500/v2/: dial tcp: lookup mycluster.icp on 10.1.0.10:53: no such host

I am taking this tutorial: https://www.ibm.com/cloud/garage/dte/tutorial/set-jenkins-pipeline-continuously-integrate-and-deliver-kubernetes-deployments-ibm-cloud

The build job ("Build Now") fails with the following message:

Stage Logs (Push Docker Image to Registry)

Shell Script -- #!/bin/bash NAMESPACE=`cat /var/run/configs/registry-config/namespace` REGISTRY=`cat /var/run/configs/registry-config/registry` set +x DOCKER_USER=`cat /var/run/secrets/registry-account/username` DOCKER_PASSWORD=`cat /var/run/secrets/registry-account/password` docker login -u=${DOCKER_USER} -p=${DOCKER_PASSWORD} ${REGISTRY} set -x docker push ${REGISTRY}/${NAMESPACE}/bluecompute-ce-web:1 -- (self time 2s)

[web_pipeline] Running shell script
+ cat /var/run/configs/registry-config/namespace
+ NAMESPACE=default
+ cat /var/run/configs/registry-config/registry
+ REGISTRY=mycluster.icp:8500
+ set +x
WARNING! Using --password via the CLI is insecure. Use --password-stdin.
Error response from daemon: Get https://mycluster.icp:8500/v2/: dial tcp: lookup mycluster.icp on 10.1.0.10:53: no such host

Notice the last line:

Error response from daemon: Get https://mycluster.icp:8500/v2/: dial tcp: lookup mycluster.icp on 10.1.0.10:53: no such host

Upgrade helm in Travis test, or add CRDs for istio resources

Currently adding Istio yamls, and failing the Travis builds because the helm doesn't know what a Gateway or VirtualService is. Will have to do this for each Travis pipeline for all projects where we introduce Istio resources.

Solution:

  1. upgrade helm version to 2.10.0 or newer
    or
  2. kubectl apply -f https://raw.githubusercontent.com/IBM/charts/master/stable/ibm-istio/templates/crds.yaml for the Istio CRDs

"TypeError: Cannot read property 'protocol' of undefined" in bluecompute-web POD logs

Using the bluecompute helm repository at: https://raw.githubusercontent.com/ibm-cloud-architecture/refarch-cloudnative-kubernetes/master/docs/charts/bluecompute-ce to deploy on ICP 2.1.0.2 with default settings (only name other values are not changed) and on IBM Public Cloud Kubernetes Cluster

helm repo add ibmcase https://raw.githubusercontent.com/ibm-cloud-architecture/refarch-cloudnative-kubernetes/master/docs/charts/bluecompute-ce
helm install --name bluecompute ibmcase/bluecompute-ce

The "Place your order here" - Buy Button failed with "TypeError: Cannot read property 'protocol' of undefined" in bluecompute-web POD logs:

TypeError: Cannot read property 'protocol' of undefined
at setNewOrderOptions (/StoreWebApp/routes/orders.js:90:45)
at /StoreWebApp/routes/orders.js:30:3
at Layer.handle [as handle_request] (/StoreWebApp/node_modules/express/lib/router/layer.js:95:5)
at next (/StoreWebApp/node_modules/express/lib/router/route.js:131:13)
at Route.dispatch (/StoreWebApp/node_modules/express/lib/router/route.js:112:3)
at Layer.handle [as handle_request] (/StoreWebApp/node_modules/express/lib/router/layer.js:95:5)
at /StoreWebApp/node_modules/express/lib/router/index.js:277:22
at Function.process_params (/StoreWebApp/node_modules/express/lib/router/index.js:330:12)
at next (/StoreWebApp/node_modules/express/lib/router/index.js:271:10)
at Function.handle (/StoreWebApp/node_modules/express/lib/router/index.js:176:3)
[0mPOST /order/ �[31m500 �[0m2.599 ms - 983�[0m

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.