Node.js: Content Managers Developed using the JavaScript Environment
Content management systems are a mandatory requirement of any digital project in the editorial sector. Some companies choose free CMS such as WordPress, Drupal or Joomla. However, there are companies (usually the media) that prefer to develop their own managers so as to achieve greater customization and robustness and maybe even be able to market the solution. There is now another option in the market: the various CMS developed on Node.js, the JavaScript server-side development environment.
There are four main examples of managers based on Node.js and the JavaScript technology: KeystoneJS, Hatch.js, Apostrophe and Pencilblue. All of these solutions may be an interesting alternative thanks, to a large extent, to the increased influence of syntaxis in the overall development of digital projects, from adding interactivity to user interfaces to other areas such as back-end, servers and databases.
Although it goes without saying, it should be noted that the KeystoneJS installation has two obvious dependencies, Node.js and MongoDB. As a consequence, you need to install the environment and database to be able to use this web and application editor. They are easy to download and set up. You can find tutorials in their web pages.
There are additional conditions: the developer or designer must have mastered programming in JavaScript and it is recommended that they know Jade– the template system used in Node.js and based on this syntaxis– and LESS, the CSS style sheet extension. Virtually all JavaScript professionals know about both these projects.
Install the KeystoneJS generator (this is its code on GitHub), developed by the Yeoman team. To do so, use this command: $ npm install -g generator-keystone
Create the project folder. You need to create the directory for the web project or its application. $ mkdir my-test-project
Check that you are inside your own project: $ cd my-test-project
Run the KeystoneJS generator: command $ yo keystone.
Final step. Run the command $ node keystone and open the local test server http://localhost:3000/ in the browser.
KeystoneJS – main characteristics:
– Available for free, it sits under the MIT license.
– Based on a MVC architecture (Model-View-Controller).
– Management system for registered users.
– Dynamic paths.
– Jade can be used as the template system but developers may choose one of the alternative options. Templates are fully customizable, with or without Jade.
– PaaS (Platform as a Service) for hosting solutions.
– Integration with email and services such as MailChimp.
Hatch.js is one of the market alternatives to KeystoneJS, the CMS on Node.js most commonly used by developers. Hatch.js is a flexible and scalable open-source tool. It is a framework for creating webpages which combines content management with the use of social media for its distribution. It can be customized using widgets. In addition to Node.js, Hatch.js is built on Redis, an open-source solution for storing NoSQL data in the memory.
These are some of its defining characteristics:
– Quick and scalable CMS, which developers appreciate. Based on a key-value model, the NoSQL database system enables quick content load even in pages with big volumes of dynamic information. According to the developers of Hatch.js, this response time is under 0.05 seconds without having to use cache.
– Plug-in based solution. Hatch.js characteristics are written with plug-ins at the top of the platform. If developers wish to implement new features, they only need to code their own plug-in. To do so, they use CompoundJS, the Model-View-Controller development framework for Node.js.
– Every single template possibility. Hatch.js contains the themes from Bootstrap, Twitter’s development framework to design responsive websites. Alternatively, you can create your own template or program the project from scratch using HTML and CSS.
– It has all fonts from Google Webfonts.
– You can use LESS for CSS style sheets.
– Commercial licenses cost almost 730 euros/month.
Apostrophe is a CMS which focuses on enabling simple content creation. Just like the aforementioned managers, it is based on Node.js for the back-end and MongoDB for the database.
Instead of Jade, Apostrophe uses Nunjucks as its template engine in JavaScript. Inspired by jinja2, the most powerful template engine for Python, Nunjucks precompiles templates directly on any modern browser and is fully scalable thanks to the use of extensions.
In addition to Node.js and MongoDB, another Apostrophe dependency is ImageMagick, a tool for creating, editing and converting images into all formats (jpeg, png, gif, tiff, svg, etc.). This is a kind of Photoshop incorporated into CMS: you can retouch colors and light curves, change sizes, retouch the frame, flip images, apply special effects… ImageMagick is an open-source software solution with Apache 2.0 license.
Pencilblue is a CMS based on Node.js, MongoDB and Redis for the creation of responsive editorial projects. For design targeted at mobile devices such as smartphones, smart watches and tablets, developers who use Pencilblue benefit from integration with Bootstrap; AngularJS, the front-end development framework based on the Model-View-Controller (MVC) paradigm; and jQueryUI, the set of templates and widgets aimed at designing the user interface of websites.
Just like any other CMS, Pencilblue is fully scalable and customizable by installing plug-ins (a very similar system to more well-known managers such as WordPress). You can find the list of modules in the manager’s website. In any case, as it happens with WordPress, developers who use Pencilblue can program their own plugin. Watch this video for more information:
Banco Bilbao Vizcaya Argentaria, S.A. owner of this portal uses cookies and/or similar technologies of its own and third parties for the purposes of personalization, analytics, behavioral advertising or advertising related to your preferences based on a profile prepared from your browsing habits (e.g. pages visited). If you wish to obtain more detailed information, consult our Cookies Policy.
Cookie settings panel
These are the advanced settings for first-party and third-party cookies. Here you can change the parameters that will affect your browsing experience on this website.
Technical Cookies (required)
These cookies are used to give you secure access to areas with personal information and to identify you when you log in.
Name
Owner
Duration
Description
gobp.lang
BBVA
1 month
Language preference
aceptarCookies
BBVA
1 year
Configuration Accepted Cookies
_abck
BBVA
1 year
Helps protect against malicious website attacks
bm_sz
BBVA
4 hours
Helps protect against malicious website attacks
ADRUM_BTs
Salesforce Marketing Cloud
Session
Required for monitoring of the service, inherent to SFMC
ADRUM_BT1
Salesforce Marketing Cloud
Session
Required for monitoring of the service, inherent to SFMC
ADRUM_BTa
Salesforce Marketing Cloud
Session
Required for monitoring of the service, inherent to SFMC
ADRUM_BT
Salesforce Marketing Cloud
Session
Required for monitoring of the service, inherent to SFMC
xt_0d95e
Salesforce Marketing Cloud
Session
Remember user preferences (if any)
__s9744cdb192d044faa1bf201d29fafd1e
Salesforce Marketing Cloud
Session
Remember user preferences (if any)
wpml_browser_redirect_test
WPML
Session
Text translation in the portal
wp-wpml_current_language
WPML
24 hours
Text translation in the portal
Analytics Cookies
They are used to track the activity or number of visits anonymously. Thanks to them we can constantly improve your browsing experience
Your browsing experience is constantly improving.
With your selection, we cannot offer you a continuously improved browsing experience.
Name
Owner
Duration
Description
AMCV_***
Adobe Analytics
Session
Unique Visitor IDs used in Cloud Marketing solutions
AMCVS_***
Adobe Analytics
2 years
Unique Visitor IDs used in Cloud Marketing solutions
demdex (safari)
Adobe Analytics
180 days
Create and store unique and persistent identifiers
sessionID
Adobe Analytics
Session
Launch's internal cookie used to identify the user
gpv_URL
Adobe Analytics
Session
Adobe Analytics plugin: getPreviousValue Capture the value of a certain variable in the following page view, in this case the prop1
gpv_level1
Adobe Analytics
Session
Cookie used to store the DataLayer levl1 of the previous page.
gpv_pageIntent
Adobe Analytics
Session
Cookie used to store the pageIntent of the previous page.
gpv_pageName
Adobe Analytics
Session
Cookie used to store the pagename of the previous page.
aocs
Adobe Analytics
Session
Cookie that stores the first values collected at the beginning of a process.
TTC
Adobe Analytics
Session
Cookie used to store the time between the App Page Visit event and the App Completed event.
TTCL
Adobe Analytics
Session
Cookie used to store the time between the LogIn event and App Completed.
s_cc
Adobe Analytics
Session
Determine if cookies are active
s_hc
Adobe Analytics
Session
Cookie used by Adobe for analytical purposes
s_ht
Adobe Analytics
Session
Cookie used by Adobe for analytical purposes
s_nr
Adobe Analytics
2 years
Determine the number of user visits
s_ppv
Adobe Analytics
Permanent
Adobe Analytics plugin: getPercentPageViewed Determine what percentage of the page a user views
s_sq
Adobe Analytics
Session
ClickMap/ActivityMap features
s_tp
Adobe Analytics
Session
Cookie used by Adobe for analytical purposes
s_visit
Adobe Analytics
2 years
Cookie used by Adobe to know when a session has been started.
Advertising Cookies
They allow the advertising shown to you to be customized and relevant to you. Thanks to these cookies, you will not see ads that you are not interested in.
The advertising is customized to you and your preferences.
Your choice means you will not see customized ads, only generic ones.
Name
Owner
Duration
Description
OT2
VersaTag
90 days
VersaTag Cookie used to store a user id and the number of user visits.
u2
VersaTag
90 days
VersaTag Cookie where the user ID is stored
TargetingInfo 2
MediaMind
1 year
Cookie that serves to assign a unique random number that generates MediaMind.
Customization Cookies
These cookies are related to general features such as the browser you use.
Your experience and content have been customized.
With your selection, we cannot offer you a continuously improved browsing experience.
Name
Owner
Duration
Description
mbox
Adobe Target
9 days
Cookie used by Adobe Target to test user experience customization.
Looks like you’re browsing from MexicoSpainArgentinaPeruColombiaBelgiumChileUSAFranceHong KongItalyPortugalUnited KingdomTurkeyUruguayVenezuelaAlemania, so let’s show you the custom content for your
location. Change
Select a country
In order to access the private area and corresponding sandbox, select the country of the APIs you want to use.