Giter Club home page Giter Club logo

mlangbehn / logistics-wizard-webui Goto Github PK

View Code? Open in Web Editor NEW

This project forked from ibm-cloud/logistics-wizard-webui

0.0 3.0 0.0 3.08 MB

Web UI for Logistics Wizard Showcase demo. The Logistics Wizard is an end-to-end, smart supply chain management solution that showcases how to execute hybrid cloud, microservices, and predictive data analytics in the real world.

Home Page: https://logistics-wizard.mybluemix.net

License: Other

Shell 1.03% JavaScript 88.66% CSS 9.01% HTML 0.24% Nginx 1.06%

logistics-wizard-webui's Introduction

Logistics Wizard Web User Interface

master Build Status Coverage Status
dev Build Status Coverage Status

This project is part of the larger Logistics Wizard project.

Overview

This project is designed with a bunch of awesome new front-end technologies, all on top of a configurable, feature-rich webpack build system that's already setup to provide hot reloading, CSS modules with Sass support, unit testing, code coverage reports, bundle splitting, and a whole lot more, while providing amazing developer tools such as Redux CLI (a generator), Redux devtools (Chrome extension), and Storybook for visually developing and testing components.

This is meant to be a client-side static file application only. No server is used when application is deployed.

Running the WEBUI locally

When the application runs locally, it uses a Node.js server to bring you developer tools like hot swap. When deployed to Cloud, Node.js runtime is NOT used. We will build static files to the dist folder and use nginx to host those static files as a purely client side application. Do not write any server side code in this application.

Get the code

git clone https://github.com/IBM-Bluemix/logistics-wizard-webui
cd logistics-wizard-webui
npm install

Set up env vars

Create a file called config/.env with the following data. See .env-example

module.exports = {
  controller_service: '<url to your controller api service>',
  google_maps_key: '<your google maps api key here (optional)>',
}

Deploy the WEBUI to IBM Cloud - Cloud Foundry

To use a continous integration pipeline to handle build and deployment, go here: https://github.com/IBM-Bluemix/logistics-wizard-toolchain. To manually push to Cloud, continue:

We need to compile/build the application to generate static web files. Then push only those static files to Cloud and use the nginx buildpack to host the files

Verify that your config/.env file has the correct controller service URL. This URL will be read and injected to the static files during the build process.

npm run clean
npm run deploy:prod
cd dist

Test to see if your built application is working OK:

 npm install http-server -g
 http-server

Application should be available at http://127.0.0.1:8080 . If everything looks OK, push it to IBM Cloud

bx cf push <unique-app-name> -b staticfile_buildpack

logistics-wizard-webui's People

Contributors

rvennam987 avatar rvennam avatar colbycheeze avatar l2fprod avatar scribblets avatar

Watchers

James Cloos avatar Matt Langbehn avatar  avatar

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.