Acquia Site Studio: Why You May Need It for Your Next Drupal Project

January 14, 2021
Lead Developer

With so many products and services available these days to assist with your website needs, it can be difficult to navigate all the options and determine the right solution for your business.

At Bounteous, we do a lot of work with Drupal and Acquia products and services. Over the past year, we've spent considerable time working with Site Studio, developing training materials for clients, creating resources, and working through various projects. Let us give you a brief tour of Site Studio and why it's perfect for your next project.

What Is Site Studio?

Site Studio, formerly known as Cohesion, is a Drupal product from Acquia that makes it easy to build a component-based website. Site Studio transfers the Front-End theming layer to the UI and gives content editors and marketing managers more control than ever over their sites. It provides a new site-building paradigm that's far more efficient than traditional builds.

The tools and features that come with Site Studio provide an excellent base to start with that allows client-side developers to contribute to a build from Day One. The low-code nature of Site Studio shields content editors from the Drupal backend and allows developers to focus on the overall content editing experience they're creating. It also provides your development team the ability to create elegant, performant, more powerful sites in half the time.

Let's break down the top points that contribute to the above philosophy.

Low-Code

Site Studio is designed to be low-code. This can mean a lot of things for different systems; however, in the context of Drupal, this is an important point to highlight.

Drupal inherently has its own hooks and other functions in place that make it a very powerful but also customizable CMS. However, to be able to use these ideas and functions correctly requires some prowess that a developer who has never touched a Drupal site will most likely not possess.

This is where the low-code nature of Site Studio really shines. New developers do not need to learn hooks, template suggestions, or any of the other Drupalisms that you will find on most sites. By layering Site Studio on top of Drupal, we now have a mechanism that takes care of the heavy lifting that we as developers use to write in custom functions. Site Studio may be low-code, but it is certainly not low on features.

Easily Extendable

Site Studio comes with a myriad of predefined components and styles thanks to the DX8 UI Kit. After initial setup, developers are immediately given access to over 50 different components consisting of sliders, cards, accordions, and more. While this is all great to have at the start of site-building, Site Studio takes it one step further.

Every single component that comes with Site Studio is extendable. Not only does this allow developers without previous Drupal experience to build rich editing experiences—but it also gives a noticeable jump start to most any component the developer is tasked to build.

Need to build a slider but the existing component is missing a field you need? No problem! Extend the existing slider and add your field. All of which takes minutes and no custom code to be written. Site Studio has a ton to offer out-of-the-box, but there is far more you can do with it.

Staying True to Drupal

There's an important synergy to highlight here. Site Studio comes with wonderful and easy-to-use features right out-of-the-box, which is one of the main draws to using it on any project. But at the end of the day, Site Studio is using Drupal as its backend—and we as developers need to be sure things are done correctly and the overall health of the application is kept at the forefront.

The beauty of Site Studio is how it uses features of Drupal developers love and simply extends them rather than rewriting them. By using these strengths that come with Drupal, there's essentially no more complexity in debugging, testing, or deploying sites that use Site Studio. This translates into a developing experience that all developers, both experienced and novice alike, can use together.

Starting With the Backbones of Site Studio

Composer, configuration management, and local environment: these are things a Site Studio implementation will not shake up too much from the stock Drupal setup we already know.

When getting a client resource up to speed, it's important to make sure that these fundamentals are understood and configured correctly from the beginning to ensure the developer is set up to succeed. Let's break down each of these points.

Site Studio - Composer

Composer is still behind the scenes managing all packages and modules just like a stock Drupal site. The only difference here is the inclusion of acquia/cohesion in the composer.json file.

However, for a developer working with Drupal and Composer for the first time, it can be a bit daunting to make a change to the project. The understanding of Composer's inner workings and how it relates to a Site Studio and Drupal implementation is crucial for any developer to contribute to a Site Studio project.

Site Studio - Local Environment

Again, no real changes here when developing with Site Studio. Something we have found that can greatly benefit any developer, whether it be internal or client-side, is to choose a single virtual environment scheme for all Site Studio implementations. Once a standardized system has been sanctioned, you can build custom tooling for said system.

This is a massive save when it comes to time constraints and debug headaches. When using Site Studio, there is a Drush command that updates all Site Studio templates and components. Manually running this one command may seem trivial on the surface—but when added to our automated tools for resetting a local environment, it proved to be one of those little things that was worth more than its weight in code.

Site Studio - Configuration Management

With Site Studio, this is probably the biggest change you will first notice. Just about every setting, component, and template in Site Studio is tracked in configuration. While this is a wonderful part of Drupal 8 that Site Studio utilizes well, it can get a bit confusing when trying to decipher exactly what these YAML files are doing when it comes to a pull request and working alongside other developers.

The best way to handle these config files is to pull down the branch of the pull request and import the config to be sure that everything is showing as expected and there are no errors on import.

What's New in Site Studio

Like with any Drupal Module, continuous development and improvements are essential in keeping your module relevant and in use. Since we first got our hands on Site Studio in early 2020, we've seen a ton of improvements. We started with version 5.7.9 and are now working with version 6.4.0. The following are some of the improvement highlights.

Component Field Repeaters

In version 6.3, Acquia added the Component field repeater feature to Site Studio. This is one of the most essential and important features added to date. Previously, repeater patterns were only available via the Site Studio Views Template builder. Think of this like a For Each loop, a control flow statement for traversing items in a collection.

Without the ability to repeat field items in components (a feature that is common in Drupal Site Building), we had to create a parent/child component relationship using dropzones. This method was okay and got the job done, but there were some limitations with the accordion components. Some of the issues with using this approach were that we could not limit which components could be added to a dropzone nor could we save a component as component content (more on that later).

The only other option was to create components with limited cardinality or item limits. That's okay in some cases, but when considering an accordion component or a carousel, users usually want unlimited. But now with field repeaters, that can be done directly on the component, making Site Studio even more powerful than before.

For example, to build a component using Site Studio's accordion elements, you no longer need to rely on the drop zone and separate components. Users can set a field repeater on the accordion item and repeat as needed. This simplifies the component building experience, making it even more intuitive.

Component Content Improvements

In the newest version of 6.4, Acquia adds two major improvements to component content. For those not familiar, component content is a saved component created on a page that allows users to reuse it on multiple pages but have a singular point of entry in order to update.

Previously, component content could only be created via a layout canvas field and saved from there. This is fine for instances where you create a component that you decide to reuse after the fact, but what about a component that you'd like to go through an approval process before it ever ends up on a page? Now, component content can be created directly from the list of component content which now matches a more standard entity behavior.

In addition to being able to save component content from the Component Content Manager, you can also now save components as component content when using a dropzone element. Previously, components using the dropzone element could not be saved as component content, thus limiting what you could actually save. This was challenging to deal with since, in order to create the effect of a repeating field, we had to rely on dropzones beyond their original intended scope. Now, any component can be saved as component content.

There are plenty of other improvements and fixes. It's clear that Acquia is committed to continuously improving Site Studio, and we would expect nothing less.

Why You Need It for Your Next Project

Creating Drupal websites with Site Studio has never been easier for the content editor or the developer. No matter their experience, anyone can contribute to a Site Studio project. With all the feature-rich aspects that are available today, as well as the ones to come in future updates, we can all see why Site Studio is an important shift into modern application and website development.

Gone are the days when there are hard lines in the sand between content editor and developer. Site Studio is a welcomed tool because it echoes the same mantra that Drupal and the community have had since its inception: let's build something together.

Want to learn more about Site Studio and what it can provide for your client solutions? Check out our article that takes a closer look at Site Studio as well as how we built a site in 10 days.