Elevate Editor Experience with Agility CMS and Gatsby

In a perfect scenario, there should be synergy among:

• the User Experience,
• the Developer Experience,
• and the Editor Experience of your website.

JAMstack has done wonders for the developer and user experience (DX and UX) of building and using websites.

They are faster, more reliable, and easier to build. Unfortunately, the content editor experience (EX) is often overlooked.

Developers are learning how to build sites using Headless CMSs and JAMstack, but aren't considering the needs of editors. You know, the folks that manage the website!

The current problems include:

• Editors can't preview content before publishing, or preview takes too long
• Editors have limited control over the sitemap
• Limited control over what content is on what page

If you experience problems like this, this webinar is for you:

How Can You Improve EX + DX + UX?

How can you make that happen? You can achieve this when you build a site using Gatsby and integrate it with Agility CMS. Gatsby helps redefine the User Experience and Developer Experience, while Agility CMS contributes to a positive Editor Experience, ensuring an easily manageable and endlessly scalable website management experience.

Agility CMS helps improve the Editor Experience by providing breezier workflows and, more importantly, less of a dependency on developers in Page Management tasks like:

- creating a Landing Page and A/B testing Landing Pages;

- creating pages for Gated Content;

- moving modules around on the page to reorganize the content for better flow

- creating copies of pages with the new order of modules, etc.

What is Gatsby, and what does it offer?

Gatsby or GatsbyJS is a static website generator or, more accurately, a JAMstack framework that presents a fluid site development experience that's more progressive than traditional static site development and management.

Gatsby is one of the JAMstack pioneers, a cornerstone of the Jamstack ecosystem.

It even offers some upgrades over dynamic content management. With the help of its Javascript-APIs-Markup, GatsbyJS helps simplify content sourcing from external systems, as all content is updated during the website build process.

Website builders these days rely on Gatsby for multiple reasons:

Better User Experience

Sites built by GatsbyJS grant faster site accessibility to visitors, perform better, and tick off all SEO strong points.

Better Hosting Experience

Even though your site performs better than dynamic sites, it is still just a static HTML site; website owners do not need high-end hosting services and still experience reliable and fluid website hosting.

Better Development Experience

GatsbyJS elevates the Developer Experience by providing a React Javascript environment, making it easy to maintain the site codebase. Developers can create and modify codes and add/remove plugins and API integrations in the blink of an eye!

Better Editor Experience?

Gatsby already provides a lightweight coding environment for developers with the help of its React ecosystem, which makes for a satisfying User Experience. But, it can further catalyze the Editor Experience if you integrate your Gatsby site with Agility CMS.

Using Agility CMS for a better Editor Experience

Why Agility CMS is the best CMS for Marketers

Agility CMS makes the content management process work like a charm for site managers, allowing them to create and modify content without a hitch.

Now, what makes Agility CMS, particularly a good fit for GatsbyJS sites is that Agility CMS not only provides native support for GatsbyJS via our gatsby-source-agilitycms GitHub but with our built-in Page Management, the plugin can automatically generate your pages based on your page tree in Agility CMS. Combine this with our Page Template/Page Module architecture, which means editors can create their own pages and add/order/remove functionality and content on each page, all without requiring assistance from a developer.

Static websites have gained popularity for not relying on dynamic data sources or server-side processing for displaying content. However, static websites are a hassle for content editors who regularly interact with the website codebase to update said content. That is where Agility CMS provides a headless content management system for static websites.

Think of Agility CMS as a central hub for your site content which allows you to externalize management of your backend content database with the help of a RESTful API.

Also, there is a treasure trove of tools available in the form of UI components and Page Templates within Agility CMS' built-in Page Management functions. Thus, in plain terms, Gatsby can help you build high-performing, lighting-fast websites, and an Agility CMS can help you source content for it and generate your website pages as per requirement. 

Why the Editor Experience is better in Agility CMS vs other CMSs

In short, Agility CMS allows developers to Develop Components, not Websites. When building a website with Gatsby and Agility CMS, taking advantage of Agility CMS native Page Management is essential. Start by looking at the Agility CMS starter site rather than starting from a blank area. It shows you how you should structure your gatsby site and serves as an example based on our recommended best practices. Developers can save time and money by allowing editors to manage all aspects of pages. Editors should be able to control what pages are on their website and what is on each page.

Offloading this responsibility to editors means developers can spend less time responding to content needs and more time improving UX. You'll maintain a toolbox of UI components (i.e. Modules and Page Templates) that editors will use to compose their pages.

What happens when you let Agility CMS manage your Gatsby site content

You can bid goodbye to your site content editing woes once your Gatsby site is integrated with Agility CMS. Agility's easy-to-use interface will grant enough flexibility and autonomy to the website editing tasks, invalidating any dependency on developers to create and update new site content.

As a result, your website Editor Experience is now at par with the User and Developer Experience.

If you are interested in starting with Gatsby and Agility CMS - here is how to start in 3 easy steps!