A microservice responsible for the front-end interface of the Field Nation app. Responsible for building static assets and build files necessary for the front-end components such as the stylesheets and scripts.
NOTE: The UI microservice no longer uses docker for local development!
The UI microservice is run via Node.js on your local development environment and pointed to a valid Monolith environment externally for the API connections.
First, install Node.js as per your operating system. The easiest way is to install NVM from https://github.com/creationix/nvm and then type "nvm install" in our current directory to install the latest version we're using in production.
Once you've installed Node.js, run "make build" to install all the appropriate dependencies.
You can now start/use UI (using pm2 + webpack-dev-server) with one of the following commands:
make localhost- points to a local running Monolith projectmake development- points to https://ui-dev.fndev.netmake production- points to https://ml.fieldnation.commake clean- cleans up any locally running instances before you start a new onepm2 logs- displays a running log of all output from your environment (similar to tail -f)
All environments are locally accessible via http://localhost:8000 (8000 was selected as port 80 often requires advanced permissions).
IMPORTANT NOTE: You must wait to see "webpack: bundle is now VALID" in your pm2 logs output is outputted before the environment will work. If you try to hit the environment before then, you'll get a message about js.base or other files being missing (because your assets aren't build yet).
When changing branches your libraries and assets will become stale and will need to be rebuilt. You should run "make" anytime you change branches to bring everything up to date. You may also need to terminate your "docker-compose up" window and re-run it if there are Node.js server-side changes.
You should be able to access environments directly in your browser:
- UI: http://localhost
The UI microservice has no database access and performs actions (almost) entirely using our V2 API using swagger-js. The UI microservice proxies all requests from the client to urls beginning with /v2 or /v1 to the appropriate microservice, automatically appending access tokens for you. Client-side React/JavaScript can thusly use XHR to directly communicate with microservices.
SAAS Buyer (portal1.fndev.net / portal2.fndev.net) (dev.local.fndev.net)
- Company users
- buyer.saas
- saas.w2.provider1
- saas.w2.provider2
- saas.dispatcher
- saas.manager
- saas.vendor
- saas.vendor.admin
- saas.vendor.manager
- saas.vendor.dispatcher
- saas.vendor.provider1
- saas.vendor.provider2
- Saas.client1
- saas.client1.user1
- saas.client1.user2
- Saas.service Company (this is a vendor)
- saas.sc.admin
- saas.sc.provider1
- saas.sc.provider2
Marketplace Buyer
- provider
- buyer.admin
- buyer.saas
- buyer.empty
- mp.dispatcher
- mp.manager
- coordinator (for PC+, assigned to buyer.admin project)
Service company
- service.company.admin
- service.company.provider
- service.company.provider2
Marketplace providers
- mp.provider1 (Elevate WO, classic listing)
- mp.provider2 (New elevate WO, New listing)
- mp.provider3 (classic WO, classic listing)
Field Nation types
- staff
- accountant
Note: The password for all accounts same as their user name and the saas portal user should be accessed by portal1.fndev.net / portal2.fndev.net
Similar to other Field Nation repositories, this app uses Git flow. Development efforts should be made against branches based off and pull requests pointed to develop. Hot fixes go directly to master. Releases are semantically versioned.
- Development workflow
- Component gallery
- Unit testing
- Regression testing
- Coding guidelines
- React Quick Tips and Gotchas
- Using Ajax
- Properties and state
- Field Nation Redux Implementation and Naming Schemes
- Global components
- Common anti-patterns and their solutions
- Building Nightwatch browser tests
- Working with server-side lists of data for user selection - ValueList component