In this article, I’ll give you an overview of three CMS solutions of this type:
To give you the best insight possible, I’ll discuss some of the key technologies each of these platforms use and how they are unique from each other. So, you can pick the platform you think will be the best for the project you’re developing.
KeystoneJS is among the most popular CMSs built on top of Node.js. Its mission is to provide the users with a way to easily create database-driven websites with the help of MongoDB. Getting up and running with KeystoneJS is very easy. One way is to install a Yo generator called
generator-keystone and then initialize a new project using it. To do so, you can run the following commands in your project’s directory:
npm install -g generator-keystone yo keystone
The Keystone generator allows users to customize the application accordingly to their needs. It provides a lot of different choices for developers, which is always a plus. By default, Keystone applications make use of the Express framework and MongoDB. The people behind Keystone have shared a very solid guide focused on how to get started with the framework. You can read it here.
Once the generator has finished the configuration of the Keystone application, it will provide users with a boilerplate application equipped with an authentication template and a blogging system. KeystoneJS also provides users with a user interface, which makes it easy to add new pages, create SEO tags, define URLs and much more.
Some other technologies KeystoneJS allows you to configure out of the box are embed.ly, Cloudinary, and Mandrill. You can reference this link for a complete documentation. It’s definitely worth noting that Keystone’s documentation does a great job explaining each specification, and in great detail.
Next on the list there’s Pencilblue, a CMS that has been built to serve high-traffic web applications. Like KeystoneJS, Pencilblue provides a solid user interface that makes it easy to create new pages and blog posts, define SEO tags, and so on. One advantage of using Pencilblue is its built-in support for Bootstrap, AngularJS, and jQuery UI. As a result of this, developers can immediately begin implementing custom code into their Pencilblue application. On the back-end, Pencilblue provides built-in support for both MongoDB and Redis, and allows developers to easily enable the caching of database items.
Below is the code for getting started with the Pencilblue command-line:
npm install -g pencilblue-cli pbctrl install [appName]
Pencilblue uses a system of plugins which are very similar to the themes in WordPress. Below is an example of a template from the default Pencilblue theme; it shows how carets are used to load templates into a file. In addition to this templating system, controllers are another key part of this CMS as they allow developers to add functionality to it. Since Pencilblue is built on top of frameworks like AngularJS, those using it can use their knowledge of different libraries to add several functions to the themes.
<!-- Loads template at admin/head.html --> ^tmp_admin=head^ <div class="container"> <!-- Retrieves the HELLO_WORLD localized text --> ^loc_HELLO_WORLD^ </div> <!-- Loads analytics code --> ^analytics^ <!-- Loads template at admin/footer.html --> ^tmp_admin=footer^
Moreover, this CMS allows developers to create their own system of templates and controllers and their own theme. For those of you who are interested in deepening this topic, I suggest you to take a look at this Quick start guide to developing themes.
To sum up, Pencilblue provides a really powerful CMS solution for developers. It takes full advantage of the Node.js engine, and enables the use of clusters within their CMS. As a result of such powers, many developers have considered the possibility of moving from WordPress or Drupal and make use of Node.js multi-core processors instead.
Next on our list is Apostrophe. Whereas Keystone is built to create database-driven websites, this CMS is built to create design driven websites. I have included a gif of Apostrophe’s demo website. As you can see, it provides a rich interface for developers, and makes it extremely easy to add new content, build new pages, and more.
Apostrophe uses different technologies such as ImageMagick and MongoDB. Supposing you have Node.js, ImageMagick, and MongoDB already installed on your computer, you can get started with the Apostrophe Sandbox application by running the code below:
git clone https://github.com/punkave/apostrophe-sandbox cd apostrophe-sandbox && npm install mkdir data && cp local.example.js data/local.js node app apostrophe:reset node app
If you open up your browser and navigate to port 3000, you’ll see the Sandbox application and a user interface which is packed with several widgets that allow developers to add text or images, create new pages, edit existing areas of a page, and much more.
Apostrophe uses the Nunjucks templating engine to add custom logic to an application and the previously cited ImageMagick to ensure that all the images that have been added to a project are optimized for better performances, as well as viewing. When an image is rendered, Apostrophe will automatically scale the images accordingly to the area it takes up on the page. This CMS also offers users tools to easily create SEO descriptions, add custom tags to pages, and more.
The developers of Apostrophe provide a detailed documentation that shows users how the platform is configured and how it is meant to be used. If you want to get started using Apostrophe, here is a tutorial that offers a good overview of the Sandbox application I mentioned above.
Hopefully by now, you’ve gained a bit of insight regarding these platforms and the features they provide. If you are in need of a CMS, I definitely encourage you to employ one of the three discussed above as they offer so much regarding functionality. As always, if you have any questions, feel free to share your comments below and I’ll surely get back to you!
Thomas Greco is a web developer based out of New York City specializing in full-stack development with the M.E.A.N. stack technologies. Before web development, Thomas worked as a graphic designer, and he continues to utilize his background in design when building web applications. Have a question for Thomas ? You can reach him on Twitter.
Jump Start Git, 2nd Edition
Visual Studio Code: End-to-End Editing and Debugging Tools for Web Developers
Form Design Patterns