Meeting KeystoneJS

By Manikanta Panati

Keystone.js is an open source Node.js based CMS and web application framework created by Jed Watson in 2013. The framework makes it very easy to build database-driven websites, applications & APIs and is built upon Express, the defacto web server for Node.js and uses Mongo DB as its storage backend. Mongo DB is a very popular and powerful document store that is capable of storing data without it being structured in a schema.

Keystone is designed to make complicated things simple, without limiting the power or flexibility of node.js or the frameworks it is built on.

What are web frameworks?

A web framework aims to assist a developer in delivering web applications quickly and easily. The term framework is relatively loosely defined and can include anything from a collection of components to a complete abstraction of workflow in an application. A framework typically provides a certain style and/or a certain structure that assists the developer and this structure is generally based on specific design patterns. Some of the well-known web frameworks include Ruby on Rails, Laravel, Django and Symfony. Ruby on Rails follows the popular MVC (Model-View-Controller) design pattern where as Django and Keystone.js follow the MVT (Model-View-Template) design pattern. Both the MVC and MVT design patterns allow for the logical separation of code and are very similar conceptually. Web frameworks encourage loose coupling and strict separation between pieces of application.

The Model-View-Template design pattern

Keystone.js is based on a design pattern called Model-View-Template. A good understanding of this concept is the basis for working with Keystone.js. Web application architecture generally comprises of three pieces that work together - data access logic, business logic, and presentation logic. A good framework will aim for the logical separation of these pieces in an application into distinct subsystems so as to allow for high degree of re-usability of components. Here’s roughly how the M, V, and T break down in Keystone.js:

M stands for “Model,” which represents the data access layer. Models typically contain definition of the data and methods to interact with data like how to access it, how to validate it, which behaviors it has, and the relationships between the data.

V stands for “View,” which represents the business logic layer. Views contain the logic that access the model, performs any calculations and defers the results to the appropriate template(s). View is like a bridge between models and templates.

T stands for “Template,” which represents the presentation layer. Templates handle presentation-related decisions: how something should be displayed on a Web page or other type of document.

If you’re familiar with other MVC Web-development frameworks, such as Laravel, you may consider Keystone.js views to be the “controllers” and Keystone.js templates to be the “views”. In Keystone.js, the “view” describes the data that gets presented to the user; it’s not necessarily just how the data looks, but which data is presented. In contrast, Laravel and similar frameworks suggest that the controller’s job includes deciding which data gets presented to the user, whereas the view is strictly how the data looks, not which data is presented.

Both MVC and MVT are very similar and interpretation of these concepts varies slightly from framework to framework and no one is more “correct” than the other. It is good to get a proper understanding of the underlying concepts.

Introducing the IncTicket Project

The best way to learn about a new technology is to be able to visualize the various capabilities of the technology in terms of using them in the implementation of a real world project. Throughout this book, I will introduce Keystone.js features and syntax in conjunction with developing IncTicket, a web based application that allows for the creation and management of incident tickets.

IncTicket will enable users to create tickets, assign statuses, set priorities, categories, and assign tikets to users. Other users can then interact with the tickets, updating their state and more.

Why Use KeystoneJS?

Before we begin installing and using KeystoneJS, we will first look at why we use KeystoneJS framework over other frameworks available online. Simply put, KeystoneJS provides a standardized set of components that allow for fast and easy development of web applications that can be quickly developed, maintained, and extended.

KeystoneJS has a number of key features that makes it worth using, including:

• Modularity – Keystone will configure express – the de facto web server for node.js – for you to connect to your MongoDB database using Mongoose, the leading object data mapping (ODM) package.
• Auto-generated Admin UI – Whether you use it while you’re building out your application, or in production as a database content management system, Keystone’s Admin UI will save you time and make managing your data easy.
• Session Management – Keystone comes ready out of the box with session management and authentication features, including automatic encryption for password fields.
• Email Sending – Keystone makes it easy to set up, preview, and send template-based emails for your application. It also integrates with Mandrill.
• Mandrill is an email API offered by MailChimp, the email marketing company. We will use it to send emails programmatically.
• Form Processing – Want to validate a form, upload an image, and update your database with a single line? Keystone can do that, based on the data models you’ve already defined.
• Database Fields – IDs, Strings, Booleans, Dates, and Numbers are the building blocks of your database. Keystone builds on these with useful, real-world field types like name, email, password, address, image, and relationship fields.

What Is KeystoneJS Best for?

KeystoneJS is a generic content management framework, meaning that it can be used for developing a variety of web applications using JavaScript. Because of its modular architecture and clean separation of various functionality, it is especially suitable for developing large-scale applications such as portals, forums, content management systems (CMS), e-commerce projects, RESTful Web services, and so on.

KeystoneJS Versions

KeystoneJS currently has two major versions available: 0.3.x and 0.4. At the time of writing this book, Version 0.3.x is the current generation of the framework and is in active development mode. Version 0.4 is a work in progress, adopting the latest technologies and protocols, including Mongoose 4, elemental UI, and core changes.

About the Author

Manikanta Panati has spent the last 10 years perfecting enterprise level application development using Microsoft and Open Source technologies. Recent projects include a very popular coupon site in Asia, a Node.js powered application that aggregates and maintains business data for over 2.2 million businesses.  With a Masters in Information Systems and a Masters in Project Management, and Microsoft Certified Technical specialist (MCTS), Microsoft Certified Professional Developer (MCPD) certifications, he still learns something new every day! Born and brought up in beautiful Bangalore, India, and presently based out of equally beautiful North Carolina, he works for a multinational financial institution managing migration and development of projects.

This article is excerpted from the book Beginning KeystoneJS: A practical introduction to KeystoneJS using a real-world project, by Manikanta Panati.