The Strangler App – Two Years On

Feature image: balloons floating over Limerick city.

In 2016, I wrote about Martin Fowler’s term the strangler app.

It’s an approach to refactoring old software. You have an old piece of software. You introduce a new piece of software: the strangler app. Bit by bit, you let the new software grow its “vines”. Slowly it takes over the old software until that dies.

My strangler app for Bitesize Irish Gaelic is putting down its roots, two years on. As a way of a status update, here’s my progress. Bitesize is an Irish language learning application, with related services for customers. It as a mix of a marketing site and online course, all in one piece of custom software that I’ve built over the years, along with several contractors and an intern who had developed it.

Current situation

  • API – a Slim PHP framework app. Structured with routes, controllers (with dependency injection), services, repositories (data layer), helpers. There are several older API approaches in the legacy app, which will need to be fed into this main API.
  • main site – still a PHP legacy application, serving HTML through Smarty templating.
  • Integrated with Chargebee subscription billing platform, moving away from Fastspring which we were using for about five years.

I’ve been introducing VueJS into the main site, including learning-enhancement quizzes feature in summer 2017, its login page, and signup page for multi-currency functionality.

Interestingly, none of the Vue in the legacy application is built through a build process. The library is simply included. That doesn’t give you all the features of Vue (like single-file components), but it was a fantastic way to introduce it to the existing application.

The marketing site is barely responsive for mobile viewing, although that’s our main traffic type. The course itself works on mobile, but doesn’t give any type of “app-like” experience.

Where we came from – two years ago

The PHP application did not have namespaced components. It was (and is in places) built with a mix of strategies like data access objects, and a strange mix of service+repository for each type of entity, like lesson.

The PHP code took quite a bit of refactoring so far, just to be able to expose a new API application from it. For example, much of the logic was (and is in places) in scripts (not classes). These scripts essentially acted as controllers. They did the job, but needed restructuring into classes.

A fundamental part of Bitesize is its membership logic. We were using a mix of a legacy connection with 2Checkout, and Fastspring. The business logic for membership was all over the place, in different controller scripts and some classes. To support the launch a new membership plan in early 2018, I refactored this to a new membership periods concept, now controlled by several single-responsibility service components (including a “membership periods” service that tells use what the user’s current plan is and whether it’s expired, and a “feature access” service, to decide who gets access to which feature).

The end goal

Bitesize’s online presence will consist of:

  1. Marketing site – to be powered by WordPress, so that others can update the site’s contents without me in the way. But for that to happen, the legacy PHP application needs to make way. And for that to happen we need:
  2. Web app – driving the actual software for our members. It will be written in VueJS with a SlimPHP backend (and MariaDB database). This is the primary strangler app. It will be hosted on a separate domain or subdomain from the marketing site. A much more “appy” experience for members.

How I’ll get there

You can’t “do” a large project, you simply take a series of steps until you can consider the outcome “acheived”. With that in mind, I’ll continue with the strangler app idea, step by step.

In a small ordered list of priority:

  • API endpoint issuing JSON web tokens, including refresh tokens that can be invalidated. Validating against currently-stored user credentials in the database.
  • Use Vue CLI to build the new started web app
  • Develop login functionality in the web app, storing the validated user in the Vuex store
  • Then on to screens for Levels, Weeks and Lessons
  • It will be interesting how to adapt existing members to this new app. The current strategy I have in mind is to redirect any new free trial members this this web app when it’s functional, and later that we contact each of our members to educate them over time of the change. Many of our members use mobile and tablets to use the software, so the new web app will be a benefit for them.

That’s about it for the rest of 2018. I’m looking forward to the challenge of building the VueJS web app from scratch, after developing features for Bitesize so far without a build process.