Introducing Portals for Capacitor

Today, we’re thrilled to announce Portals for Capacitor, making it possible for enterprise teams to implement a micro frontends strategy directly into Capacitor apps. Develop at scale by isolating different features and updating them independently. Portals for Capacitor is ideal for large-scale enterprise teams building mission-critical applications.

The power of Capacitor

Installed nearly half a million times per month and growing, Capacitor is Ionic’s solution to bridge web and native applications, providing seamless mobile experiences to users around the world. Since the release of Capacitor in May 2019, thousands of companies have used the cross-platform native runtime to build web apps that run on iOS, Android, desktop, and on the web as Progressive Web Apps.

Capacitor connects the web to native, enabling the best of both worlds by providing the tooling and runtime that make it possible to take any modern web app and deploy it natively to all the platforms you care about. Capacitor is quickly becoming the de facto standard for web developers building for mobile.

Now, with Portals for Capacitor, your enterprise team can bring Capacitor applications to market even faster.

Building Capacitor apps at scale

Capacitor apps harness the power of the web to quickly build mobile applications. However, when developing large-scale Capacitor apps, as with any mobile application, team organization can limit the potential to move even faster. Here are some potential challenges large teams could face:

Features are built at different times. Some features are created or updated faster than others. For new features to reach users, the entire application needs to be ready to ship at the same time. This lag can lead to bottlenecks in the development process and a slower shipping cadence.

Managing multiple developers can be difficult. When building Capacitor apps, a team of multiple developers—often spanning 10 or more developers—will likely work on the same code base. It takes an abundance of time and planning to ensure that developers aren’t tripping over each other to get the project done.

Why Portals for Capacitor?

Portals for Capacitor enables large enterprise teams to ship faster by dividing a single Capacitor app into smaller micro frontends. In combination with Appflow live updates, individual teams can now ship updates independently and on their own schedule. Here are just a few benefits of using Portals for Capacitor:

Organize development teams to speed up app production. Portals for Capacitor isolates different features and allows teams to build these features autonomously, without getting in the way of each other. With this architecture optimization, prioritize runtime versus build-time to provide a better user experience.

Update features autonomously. Portals for Capacitor works seamlessly with live updates by Appflow to ship features independently. Live updates enable teams to submit code changes directly to their users without waiting to package all features and updates simultaneously.

→ Sign up for a trial of Portals for Capacitor today!

Setting up Portals for Capacitor

Portals for Capacitor allows users to define separate micro frontend applications kto exist in the same Capacitor application. This is done by adding configuration to the Capacitor config defining the location of the applications during build.

const capacitorConfig: CapacitorConfig = {
  plugins: {
    // Portals for Capacitor configuration
    Portals: {
      shell: {
        name: 'shell',
        webDir: './build',
      },
      apps: [
        {
          name: 'account',
          webDir: '../account/build',
        },
      ],
    },
  },
};

After the applications have been defined, you can add live updates configuration so that each application can be deployed independently by having each application as a separate Appflow app.

{
  name: 'shell',
  webDir: './build',
  liveUpdateConfig: {
    appId: 'YOUR_APP_ID_IN_APPFLOW',
    channel: 'production',
    autoUpdateMethod: 'background',
  },
};

Now each micro frontend has not only its own app but also separate deployment channels.

→ Dig into the Portals for Capacitor documentation to learn more.

Get started today

Portals for Capacitor solves the problems faced when trying to develop and deploy features quickly. Sign up to try Portals for Capacitor, and get in touch with a Portals specialist to learn more.