A few months back we promised to make a decision on whether the admin section for PencilBlue 1.0 would be written in Angular 2 or React. After listening to your feedback and development needs, and calculating the long term requirements of the platform, we have decided to go with React.
This was a choice that was equally driven by business requirements as technical ones. Because we know that there would be a strong reaction from the community regardless of which frontend framework we chose, I'll do my best to convey the main factors behind this decision.
Minimizing barriers to entry
Obviously, we want people to use PencilBlue - to learn how to develop with it and, ultimately, to develop plugins for the community. In order to accomplish this we saw three key requirements for the admin section upgrade:
Maintaining PencilBlue is no small task. There are a wide range of issues and questions that make their way into our github queue, from how to meet a very specific technological or business need, to how to install Node.js. Adding a whole new category of "how to fix something breaking in TypeScript and/or its compilation process" could be disastrous for the platform's long term health.
Minimize the amount of third party frameworks needed
We work to make PencilBlue as easy to learn as possible, but as a business class CMS it naturally has a higher barrier to entry from platforms geared for less complex use cases. We don't want to pile onto that by introducing unneeded complexity.
It's much easier to transition our existing user base to the major changes of 1.0 (and to onboard new developers) by saying:
In order to build admin plugins you'll need to learn how to build a basic, client-side React controller in ES6.
... instead of saying:
In order to build admin plugins you'll need to learn Angular 2, TypeScript, how to compile it with the base PencilBlue admin section TypeScript using the CLI, and how to make sure you don't conflict with any other third party admin plugins that also need to be compiled.
That being said, you remain completely free to use whatever frontend frameworks you want in your site themes or public facing plugins. React only applies to admin section modification itself.
No added server-side rendering
We regularly receive requests to integrate Pug (formerly Jade) or Handlebars into the platform. Rather than tie down PencilBlue to any one rendering engine - outside of our built in services - we direct users to integrate their library of choice directly into their Node.js controllers.
It's for this same reason that we chose not to use server-side React, opting for the client-side implementation with Babel. Who knows what PencilBlue 3.0 will look like, or what browser functionality will be available in five or ten years?
In the interest of the long-term lifecycle of the platform, we want to keep the server side code as pure as we can. We want to give you, the developer, as much flexibility in your implementation as possible.
Where we go from here
We want to do this right. PencilBlue 1.0 will be our first set of breaking changes to the platform in almost three years (something we're very proud of), and we intend to make sure that it's worth the effort to upgrade.
We will, of course, be documenting everything, including a full upgrade path and generated code-level documentation for the new admin section. We also intend to release a book on PencilBlue development after the release.
The admin section refresh is only one piece of the total 1.0 package. We'll be releasing an updated roadmap in the near future, as well as making some exciting announcements regarding our development community.
You can see the beginnings of our React implementation on the angular-react branch of the platform, and watch the progress from there as well. As always, we are open to pull requests to help speed up the process and are best reached through our github issues or our Gitter channel.
A few months ago we announced that the admin section of PencilBlue version 1.0 would be upgraded to Angular 2. We saw this as a natural progression for the platform, since the current frontend runs on Angular 1.x.
We were immediately inundated by users asking, "why not React?"
So, as maintainers who try to always listen to our user base - often to a fault - we explored React as an option. After all, we're going to have to completely rewrite the admin section either way, since we're performing a total facelift. Weighing the pros and cons of the two frameworks, we came to the following conclusions:
Though it may be obvious where we're leaning, we haven't made an official selection yet. We'll make that announcement with the release of 0.8.0 in December. If you feel strongly one way or the other, we encourage you to reach out to us on Twitter or Gitter.
0.7.0 brings about the start of some exciting changes. The release focuses on preparing the platform for next year’s 1.0 release. The simplification of the Localization and the Plugin services ensures that each piece of the two services is maintainable and testable.
Aside from cleanup and bug fixes we are excited to announce 3 new features. The first is the ability to override the default sanitization rules for WYSIWYG content. This will allow plugins to relax the strict rules when developers have specific needs.
See the function definitions here.
The second big feature is the ability to group plugin settings. Developers found that as their plugins grew in complexity so did the number of plugin settings. Having a large number of settings made it difficult to find what needed to be changed. Additionally, the UI automation was more difficult than it needed to be. The addition of the settings groups makes this easy by adding identifiers for the headings and separating out settings into logical groups. With this change plugin settings can now specify a “displayName” property. Optionally, the value can be a localization key in order to support multiple locales.
Lastly, we are pleased to announce Bower support for plugins. The details.json file now supports a “bowerDependencies” property where each dependency can be specified.
Sample details.json file.
This gives plugin developers greater freedom for managing dependencies. During installation and on startup PencilBlue will inspect the file system to ensure that the dependencies exist. If not then PencilBlue will perform a Bower install to persist the missing dependencies.
Looking forward to what is coming up next we have one more release in 2016. 0.8.0, set for a December delivery, will update the navigation capabilities of the platform. It will place a focus on creating multiple menus, placements, and SEO. Secondly, the request handler will be getting refactored for performance and flexibility.
The following release, set to be delivered early 2017, will bring the platform out of beta as 1.0. PencilBlue 1.0 will bring about a few changes to the platform. First, the core of the platform will leverage promises over callbacks. We’ve weighed the pros and cons and came to the conclusion that it provides a cleaner look and feel to the code as well as falls in line with what the majority of our enterprise users will use for testing and automation. Additionally, the move to promises will come with our move ES6. Our prototypes today are designed very much like ES6 classes. This transition will simply make the design more familiar and fall in line with the latest JS standards. Next, all deprecated functions will be removed. This will bring about the first set of breaking changes in the platform. Not to fret, we will be providing an upgrade guide for code and existing data. Finally, the admin section and default theme will be getting a fresh new look. The default plugins will leverage the APIs that have been and are in the process of being developed.
With any major release there are a few things that are still in flux. Here are a few decisions that will be made and decided on as we release 0.8.0.
· React or Angular 2 for default plugins -
· Plugins as NPM modules
· Removal of core prototypes to a separate NPM package
As always the feedback from the community is greatly appreciated. You can reach us via Twitter @GetPencilBlue or on Gitter.