Drupal Frontend web development

The changing role of the front end developer

Developing sites for Drupal is an art as much as a science. The magic happens in the theming layer where the forces of structure, content and design are combined to produce the end result. To the end user, the result is an attractive site which is coherent and consistent. The front end developer is able to leverage the work done by architects, content designers, designers and site builders to make this a reality.

The role of the front end developer has changed dramatically in recent times. In the earlier phases of web development a frontender would have been mainly concerned with templates producing HTML and CSS to transform the presentation of that HTML. Whilst this is still very much the bread and butter of frontend developers there are now a range of other technologies and approaches available to them. Frontend developers now utilise complex pipelines to build their creations and utilise frameworks such as ReactJS to deliver more dynamic experiences for users.

Component driven design

Component driven design is front and center at the design and development process. Units of functionality, data and presentation can be encapsulated into components which are used to build pages with. Design is therefore about much more than just the way things look. The frontend web developer needs to thing about structure, state, interaction and presentation. They need to be master of many domains.

Decoupling the frontend

The decoupling of code in computer science has been a solid principle for decades. Components should do one thing and do it well. They should be able to talk to each other using agreed interfaces for communication. These principles have now made their way across into frontend development. The rise of frameworks such as Angular, ReactJS and Vue have opened the way for the frontend to be decoupled from the backend. The interface, in this case, is the format of the data flowing from the back to the front and vice versa.

In the Drupal world there has been a lot of talk about the various advantages of partially decoupling and fully decoupling. A fully decoupled site would have Drupal being used solely as a data server with the frontend handling all of the presentation and functionality. In contrast, a partially decoupled Drupal site would still utilise some of Drupal's core systems such as permissions, templates, rendering pipeline and caching.

At Morpht we have thus far opted for a partially decoupled approach. We believe that there is a lot of value in the decades of effort which have gone into these systems. They serve us well and provide a solid, known foundation to solve well known problems. We will utilise frameworks such as ReactJS and templating solutions such as Handlebars where it makes sense - on a per component basis. This allows us to deliver dynamic, "reactive" experiences when needed.

The Morpht team

Our team comprises of back and frontend developers able to implement frontend solutions. This has enabled us to deliver a number of demanding frontend applications based on Drupal. We have delivered mapping solutions, decision trees and other more complex applications with a variety of stages. Our personalization solutions for Convivial CMS are also heavily involved on decoupled principles.