The New Service Architecture in ExpressionEngine 3

Almost all Solspace ExpressionEngine add-ons have a control panel. There's a place where you can go inside ExpressionEngine to do stuff like update preferences and handle maintenance and reporting tasks. Building these control panels, depending on the functionality of the add-on has often been a deciding factor in whether or not we build an add-on at all. It once took a lot of work to create the different control panel views for an add-on. But with a change that EllisLab has introduced in EE 3, this work has gotten much easier. This is a very important development for the ExpressionEngine community as it further lowers the barrier for add-on developers to execute innovative and highly valuable web application solutions for what is already a great CMS platform.

First off, when it's easy to build a control panel for the users of a software product, the barrier to creating that product is much lower. No longer do you need a UI designer, front-end developer, and QA of all that stuff in order to execute a cool idea. All you need is the back-end engineer to fire up the functionality.

Second, when the platform changes and goes to a new version, since your creation of the control panel pages was done in an abstracted way, you don't have to convert that much. The barrier for maintenance is lower.

Third, the end user of an add-on running inside ExpressionEngine has a much easier time navigating through the control panel as a whole when the UI is unified. The whole system comes across as being more professional and more of one piece. We have learned over the years that the more clean and professional you can make the user interaction with your add-on tools on the backend, the more success you will have. Now this has been opened up to all add-on developers and I think there will be an excellent overall result.

Fourth, when a service level is provided in the base platform, and that service level exposes many useful and hard to execute UI functions, the add-ons that can leverage those tools become much more powerful for a very low cost. On this last point an example will go a long way.

Frequently a control panel UI must do the job of letting someone create, edit and delete something in the database. We need a UI to show the paginated list view of created items. And we need to provide a clean interface for letting people confirm before they delete items from this list. This UI is usually a pain in the butt because you have to write so much code and maintain so many different views. In ExpressionEngine 3, EllisLab made this part of UI creation really easy and approachable. Below is a screen shot from the User module that shows the list view of a certain kind of database content specific to User, a role. It's like a permission level but super flexible.

So your users can click the row of an item they want to delete. They can click anywhere in that row, not just the checkbox. EllisLab created all of the code to support that and since we are using their Services layer, we inherit all of that important UI functionality. Not to mention that, but any other dev doing this same thing will present the same clean UI to their users. The next screen shot shows the modal confirmation window that allows a user to make sure they are actually deleting what they think they are deleting.

The UI is clean and professional and contemporary. Best of all, when I coded this I didn't have to write a bunch of crazy Javascript and HTML to get it to this level. I inherited all of that from ExpressionEngine. Here's the code that made that modal window work.

You may not know how to read PHP code, but basically all I have to do is define some attributes of my modal window, add that modal window to my page, and make sure I tell ExpressionEngine to include the Javascript libraries needed to make it all go. ExpressionEngine does the boring work of looping through a list of items, assembling them into the modal so that the user can verify their action, then I handle the result of that action. This used to take days to code, now it takes a few minutes.

In future blog posts I will talk more about some of the changes that EllisLab has made in ExpressionEngine 3. But for now I'm having so much fun working in ExpressionEngine 3 that what I most want to do is get back to converting our add-ons.