Five reasons migrating your UI extension to an app will save you headaches

Published on November 30, 2020

Five reasons migrating your UI extension to an app will save you headaches

Subscribe for updates

Build better digital experiences with Contentful updates direct to your inbox.

Turning a User-Interface Extension (UIE) into an app doesn’t require many code changes, but it does give you access to new, powerful features. That’s because apps are built on the same underlying technologies that run UI extensions. Here’s five reasons you might want to punch a few keys and make the leap.

What’s the difference between UI extensions and apps, anyway?

UIEs help you extend the Contentful web app, so that editors and admins can do more on their own. They show up in various locations in the web app to provide custom functionality. Apps do the same thing with the same technologies.

For example, a sidebar app can show the translation status of the current entry. A field app can integrate a third-party product catalog picker. A page app can create an entire dashboard comprised of Contentful and third-party data.

Apps represent a portable and repeatable solution for developers that work with Contentful and editors regularly. As a developer who worked on building our new App Framework, I know firsthand that apps provide new ways to shore up custom functionality to integrate Contentful and other products in order to meet your business needs.

From a technical standpoint, apps run on the same underlying technologies that run UI extensions. Little to no code changes are needed to make a UIE an app and leverage the advantage of more powerful features. 

When and why to migrate UIEs to the App Framework

Here’s five reasons to migrate:

Should you migrate your UI extensions to applications

1. If your UIE shares multiple locations and shares a global configuration. Apps allow custom-configuration UIs, which give your regular users the ability to set your app’s configuration during and after installation without the need for code.

2. If you want a UIE that has its own personal webhook. Apps can act as their own webhook and can even access the configuration set by regular users described in the first reason above.

3. If you want an app to act as a user itself and listen for changes to data, modify data or do both at the same time. Apps show up in the Contentful web app and in the API data as themselves under the Author field when they’ve modified something.

4. If you want to share a UIE across environments, spaces or even organizations. Apps work at the organization level and can be installed into any space or environment without the need to copy and paste code or configuration. 

5. If you want to keep your UIEs as up-to-date as possible. We’ve replaced UI extensions with apps, and we’re committed to further developing apps and the App Framework.  Apps bridge the gap between the developer and editor experience.

In many cases, developers that migrate only need to do two things. (1) Create a blueprint for how an app gets installed to a space, which we call an AppDefinition. (2) Host your UIE on the internet. You now have an app. Optionally, you can implement advanced features like a custom configuration screen and add new functionality as described above.

Additional resources

You can read more about the technical details in documentation. I explain our migration process with a sample UIE as well as detail the specifications and functions newly provided by apps.

If you’re looking for a more visual example, my colleague Stefan and I recently had a live coding session during our Fast Forward conference. We took a UIE Stefan had built and turned it into an app with additional features.

Subscribe for updates

Build better digital experiences with Contentful updates direct to your inbox.

Related articles

API-first means the API is the primary and most important focus during the development process for a new product. Why does it matter? Allow us to explain.
Guides

What is API-first?

September 21, 2023

GraphQL variables let you create reusable queries and mutations that are type-safe. This article explains how to use them, with examples.
Guides

How to use GraphQL variables to give queries type safety

October 22, 2021

Vue and React are both popular JavaScript UI frameworks. We cover their similarities and differences, discussing which is best for different use cases.
Guides

Vue vs. React: Which JavaScript UI framework is best?

July 18, 2024

Contentful Logo 2.5 Dark

Ready to start building?

Put everything you learned into action. Create and publish your content with Contentful — no credit card required.

Get started