Going Headless with Drupal 7 and Angular

As a digital marketing agency in Portland, Oregon, we recently took on the challenge of building a custom Learning Management System (LMS) from scratch for a high-profile client. In this beginner session, we’ll talk about the discoveries and hurdles of building an Angular-based LMS while leveraging Drupal’s stability as a framework. We’ll show how we used Drupal to manage more than 20,000 users while functioning as the content builder and asset library for the LMS.

We’ll give a high-level overview of the road map used to link Drupal to MongoDB and MongoDB to the Angular front end and the embedded LMS application. We’ll discuss the Drupal contrib modules we used to push content from Drupal’s MySQL database to a MongoDB servicing the Angular front end, and how images and other media assets are successfully managed. We’ll also touch on the authentication process that allows users to update their Drupal-based user profiles through the Angular app.

Some of the biggest Drupal-centric challenges we worked through include:

• Hooking into the MEAN for Drupal to format Drupal nodes into a JSON manifest, push the manifest into a MongoDB, and build an Angular app to consume the manifest data from MongoDB (we’ll include sample code and diagrams)
• High-level user authentication from Angular to Drupal and the modules and libraries we used (with supporting diagram)
• Using Drupal’s image processing to serve properly formatted images and other assets to the app via Drupal contrib modules (with code examples)
• Support of up to 30 different languages using Entity Translations