198 Lotus blogs updated hourly. Who will post next? Home | Blogs | Search | About 
Latest 7 Posts
Go Evergreen
Tue, Oct 17th 2017 83
Change is in the Air
Fri, Sep 1st 2017 2
Open Source Contribution
Fri, Jun 16th 2017 3
Docker Quick Tips
Fri, Apr 28th 2017 3
Notes in 9: Dev Tools Grab Bg
Tue, Apr 4th 2017 1
Custom JSON Serialization With GSON
Mon, Jan 23rd 2017 6
Recapping 2016
Mon, Jan 16th 2017 7
Top 10
Go Evergreen
Tue, Oct 17th 2017 83
Building Java Objects From JSON
Thu, Jan 22nd 2015 11
Manually Renewing HTTPS w/ Let's Encrypt
Wed, Jul 27th 2016 11
Server REST Consumption with Authentication
Mon, Aug 18th 2014 8
Notes in 9: Docker + SonarQube
Wed, Feb 24th 2016 8
Using Node to Connect to ... Almost Anything
Mon, Apr 18th 2016 8
Rebirth: An App of Ice and Fire
Wed, Dec 14th 2016 8
A Few ConnectED Thoughts
Thu, Jan 29th 2015 7
Headless DDE Builds With Jenkins CI
Fri, Mar 25th 2016 7
SCM Survey Results
Tue, Apr 12th 2016 7

Rebirth: An App of Ice and Fire
Twitter Google+ Facebook LinkedIn Addthis Email Gmail Flipboard Reddit Tumblr WhatsApp StumbleUpon Yammer Evernote Delicious


If you read my blog for any of the Saga of Servlets series, then I hope that you’re excited I’m returning to the application I put together for it. This time, it’s as a conversation piece in regards to some of the build process modernization I engaged in recently, in order to unify the code base in its git repository. In any case, it’s helping pave the way forward before I update some of the back-end elements, when it will again be a talking point for some additional rework and optimizations.


When my App of Ice and Fire (viewable here: iceandfire.mybluemix.net on Bluemix) was last left off, it had an Angular 1.x application as the front-end, with a gulp driven build process to optimize all the front-end assets, and was backed by some excellent servlets (extending DesignerFacesServlet) which were talking points for the previous entries in the series, which focused more on general premise of servlet construction and application structure with XPages and Domino. Sadly, the application was left to sit for several months, which was approaching the better part of a year now. During this time, several new frameworks came out; specifically the release and popularity of React, Angular 2’s release, and my current favorite, vue.js, not only started gaining popularity, but hit its version 2.0 as well. Additionally, I got on the bandwagon of switching to using npm scripts as the primary build pipeline; an approach that makes the dependencies, builds, and build-related actions all rather self-contained and neat. In other words, it was time for something new.

Hyrkoon the Hero, with Lightbringer in hand

What’s New

  • npm scripts are incorporated for build pipeline, with gulp for build process (for now at least)
  • re-incorporation of the multiple project repositories (the Bluemix implementation had previously been its own repo)
    • the Bluemix version is now in its own branch, bluemix
  • the src/ directory for the front-end application is shared between branches
    • with an npm script to copy from master into the bluemix branch
    • this paves the way for sharing the Java codebase between the master and bluemix branches, to follow on
  • the front-end (UI layer) app is its own branch, for use as a git subtree in the other versions (for single-source development)
  • npm script included as part of install to fix font-awesome, specifically to remove the version number, no more failing CSS references in XPages
  • no more symlinking! it was confusing to those who didn’t know it and wasn’t strictly necessary, so it was removed

Build Pipeline

The largest changes, from the front-end perspective, are in the implementation of the front-end assets and the build pipeline that includes them for use. For a break down, here’s a quick description of my npm scripts, which can be viewed in full here.

"scripts": {
  "postinstall": "node ./node_modules/bower/bin/bower install -s && npm run fix-fa",
  "fix-fa": "npm run fix-fa:ver && npm run fix-fa:ie",
  "fix-fa:ver": "replace '\?v=4\.7\.0' '' ODP/WebContent/libs/fontawesome/css/*.css -s",
  "fix-fa:ie": "replace '\?#iefix&v=4\.7\.0' '' ODP/WebContent/libs/fontawesome/css/*.css -s",
  "build": "gulp build",
  "build:watch": "gulp",
  "dev": "concurrently --kill-others "npm run json-srv" "npm run bs-srv" "npm run build:watch"",
  "bs-srv": "browser-sync start --port 8000 --proxy localhost:3000",
  "json-srv": "json-server --quiet --id unid db.json --watch --routes routes.json --static ODP/WebContent/",
  "clean": "del-cli 'ODP/WebContent/*' '!ODP/WebContent/WEB-INF' '!ODP/WebContent/lib'",
  "test": "echo "Error: no test specified" && exit 1"

You can see the postinstall script, which runs immediately after install; so when a user runs npm install and pulls in the dependencies, it will be kicked off immediately following it, without need for the user’s intervention. One major thing of note is that while bower is still in use, this makes it more seamless, unobtrusive, and easy to switch to an alternative solution some day.

The fix-fa scripts perform the removal of both the ?v=4.7.0 (the currently specified version) and ?#iefix&v=4.7.0, which have been known to cause issues with being loaded from XPages. They are split apart into fix-fa:ver and fix-fa:ie, run together by the “parent” task. Of note, I had to escape both the special characters and also the escape character, as that’s how the replace tool I implemented needs it.

The build and build:watch tasks both do what you would expect, but now my gulpfile.js is considerably cleaner, with only the build specifics defined as gulp tasks.

The most complex npm script is the dev script, which:

Aside from being a bit of a populist move at the moment, it’s good in that you can boil down your npm scripts to just a small handful of truly worthwhile scripts. A user can generally remember that npm run dev will run the watch and live-reload environment, with npm run build being the one-off build task, and npm run clean the clean command to remove the built assets. If nothing else, they’re more easily documented in a project’s ReadMe file.

There is absolute benefit to being able to make use of both the npm ecosystem for the various packages to perform the required tasks involved. I didn’t have to write my own cross-environment supported script to do any of what goes on in the npm scripts, let alone something as complex as concurrently, which manages the task of performing simultaneous commands or npm scripts. Anything I can run from the host (and require as a dependency) from the CLI is available to be used. This is quite powerful and, once properly configured, should seem somewhat straightforward.

What’s Missing?

In the future, I have plans to refactor the front-end portion of the app, along with addressing some of the concerns such as my copying all the library assets into ODP/WebContent/libs/, which is inelegant. This should set up a blog post or two covering these topics. All in all, it’s a rather usable scenario at the moment.

How to Check it Out

The repository itself is the best place to have a look. You can also find the v1.0.0 release information a decent place to look.


This may just be a node fan’s nerd-ing out, but I think it shows how to improve the build pipeline for a given application over time, to make it more manageable and easily run by the user/developer. I’m sure I’ll come back to this app in the future, so stay tuned, as there are good things ahead.

Dec 14, 2016
9 hits

Recent Blog Posts
Go Evergreen
Tue, Oct 17th 2017 4:00p   Eric McCormick
Happy 🎂 Day IE 11! On the 17th of October in 2013, Internet Explorer 11 was released from Microsoft. That means that as of today, this popular* browser is now four years old and, with all respect to it, it really ought to go. Good day sir. I said good day! Evergreen Browsers What makes a browser, or any software for that matter, evergreen? Well, the basic requirements for a browser, or any piece of software for that matter, are specifically the support of automatic updates, that bring in:
Change is in the Air
Fri, Sep 1st 2017 1:00p   Eric McCormick
I’m Back What Can I Say? In Case You Missed It If you find yourself asking “where was Eric?”, this should summarize it all: Instead of trying to do everything all summer, I tend to take a break from blogging and a lot of open source endeavors over the summer. It means I can focus on family time along with yard and house projects. Ah... Summer That’s all paid off and, with fall fast approaching, I’ve found myself wanting to start those things back up; ramping up into winter when
Open Source Contribution
Fri, Jun 16th 2017 5:00p   Eric McCormick
Intro It’s time to clear some of the backlog. I started this post a few months back and it should probably be sent on its way to clear the pile of drafts I haven’t finished yet… 🤔 I have a bit of a passion for open source software. My preferred distribution of Linux has been Ubuntu since 4.10, the Warty Warthog (I was even a minor contributor on a short lived, wildly popular project that aimed at improving the Ubuntu experience early on), I’ve enjoyed most open source projects I’ve
Docker Quick Tips
Fri, Apr 28th 2017 3:00p   Eric McCormick
Docker If you have been living under a rock, Docker is pretty much amazing. If you haven’t been living under a rock, you may be getting used to the idea of Docker, but still have the occasional question. I’ve found myself using Docker in increasing amounts and complexity over the last year or so. I’ve recently decided to start recording some of the tasks I’ve found useful, some of which may be less familiar to a beginner. If you’re so inclined, check out the playlist, embedded here.
Notes in 9: Dev Tools Grab Bg
Tue, Apr 4th 2017 1:00p   Eric McCormick
Intro I’m on Notes in 9 again, with a “grab bag” of a couple of tools I’ve put together recently that may be of a varying degree of useful for other Domino + XPages developers. You don’t need these to do development, but for the right person, they may help with their development workflow. Also of note, with the upgrade to Swiper with the FP8 release of Notes + Domino Designer, the limitations previously mentioned are no longer there! This means that my second tool I talked about, node-
Custom JSON Serialization With GSON
Mon, Jan 23rd 2017 2:00p   Eric McCormick
Intro Here’s a curious one, in which I found myself with a limitation of not being able to output JSON with scientific notation values. wait, what? If you’re wondering why that is, since both JSON and JavaScript allow scientific notation of number values, you are absolutely correct and that’s a great question. The strange thing was that I found myself outputting perfectly valid JSON to be consumed by something specific which didn’t allow scientific notation. I’m not entirely sure wh
Recapping 2016
Mon, Jan 16th 2017 3:00p   Eric McCormick
Intro Per usual, I’ve had a little break between things and decided to catch up with a bit of a summary of some recent things that each didn’t necessitate their own post. 2017 IBM Champion For starters, I’m honored to be named an IBM Champion in Collaboration Solutions (/ Social Business) for the third time. This would be a hat trick in (ice) hockey 🏒. I’m happy to be recognized with a group of people, developers and more, who are passionate about both their work and the plat
Rebirth: An App of Ice and Fire
Wed, Dec 14th 2016 4:00p   Eric McCormick
Intro If you read my blog for any of the Saga of Servlets series, then I hope that you’re excited I’m returning to the application I put together for it. This time, it’s as a conversation piece in regards to some of the build process modernization I engaged in recently, in order to unify the code base in its git repository. In any case, it’s helping pave the way forward before I update some of the back-end elements, when it will again be a talking point for some additional rework and
Scripting Server Upgrades
Fri, Nov 11th 2016 2:00p   Eric McCormick
Intro This one might be slight departure from my usual, but those that have followed my blogging this past year will have noticed a bit more of a leaning towards DevOps in some of my posts. This echoes a lot of what I’ve been concluding as increasingly a necessary part of development; that we need to consider a picture large enough to encompass the themes surrounding development functions and, like any good developer (DRY ~= “lazy”), automate the heck out of it. Overview I had p
Everything Old is New Again
Mon, Oct 24th 2016 8:00p   Eric McCormick
Intro Every so often, it’s good to reassess one’s position. This is good from both a standpoint of being inquisitive and even interrogative, but when it comes to the ever changing landscape of the front-end development space, it’s not only inevitable, but must be embraced for what feels the need to “stay afloat”. I’m changing theme of my blog, hopefully for the better. The previous theme was good and did a great job of getting things started, but while I had forked a copy of a good

Created and Maintained by Yancy Lent - About - Planet Lotus Blog - Advertising - Mobile Edition