Micro Frontends for Mobile.

Portals micro frontends allow multiple teams to build, test, and ship in parallel with hyper-focused embedded web experiences in your React Native, Android, iOS, and Capacitor mobile apps.

Start building →

Supports:

Watch Ionic Portals in Action

A new era of scaling mobile app development is here. See how Portals breaks down barriers and increases development velocity.

WHY PORTALS?

Allow multiple teams to contribute to large scale mobile projects.

The easy way for web teams to add new features and screens to native apps in a safe, controlled way. Each Portal is a focused experience that delivers specific features and functionality, and is entirely self-contained. Teams can build, test, and ship these embedded micro experiences in parallel, allowing organizations to dramatically scale application development.

A Better Web View
Easily embed custom web-based experiences while avoiding all the messy, annoying parts of stock Web View management.
Deep Native Integration
Build native mobile experiences that your users will love by exposing native features to the Web View in a standard and consistent way.
Highly Secure
Empower web teams to contribute to native mobile projects, while maintaining full control of the exposed native API surface area.

How it works

Bring dynamic web experiences to mobile.

Safely and securely add web-based experiences to your existing native mobile apps. Here’s how it works:

1
Drop the Portals iOS & Android libraries into your app
2
Choose the web experiences you want to integrate with
3
Set granular permissions that designate which parts of the native app your web teams can touch
4
Choose from our pre-built native plugins to unlock full native device features in your web-based experiences
5
Build and ship 🚀

Portals takes care of the rest, without any advanced configuration or ongoing maintenance. The best part? Your web experiences are seamlessly integrated into the mobile experience, and virtually invisible to your users.

Features

Unlike stock Web Views, Portals is designed to help app teams work with the Web, not against it.

Put simply—Portals makes using Web Views enjoyable.

A powerful API for enhanced native experiences

Portals provides a powerful cross-platform API to expose native functionality for embedding rich web apps in a controlled manner, a robust web-to-native communication bridge—and coming soon, cloud services for real-time app updates and more. Interested in testing it out early? Make sure to drop us a note.

import IonicPortals

class HomeViewController: UIViewController {
  override func loadView() {
    let portal = Portal(
      name: "myPortal", 
      startDir: "web_app",
      initialContext: ["startingRoute": "/home"]
    )
    
    self.view = PortalUIView(portal: portal)
  }
}

class ProfileFragment : PortalFragment {
    constructor() : super()
    constructor(portal: Portal?) : super(portal)
    companion object {
        @JvmStatic
        fun newInstance(): ProfileFragment {
            val portal: Portal = PortalBuilder("myPortal")
                .addPlugin(ShopAPIPlugin::class.java)
                .setInitialContext(mapOf("startingRoute" to "home"))
                .setStartDir("web_app")
                .create()
            return ProfileFragment(portal)
        }
    }
}

import ShopAPI from './ShopAPIPlugin';
import Portals from '@ionic/portals';

const App: React.FC<InitialContext> = () => {
  const [sessionInfo, setSession] = useState(null);
  const [startingRoute, setInitialRoute] = useState(null);

  useEffect(() => {
    const { context, sessionInfo } = await Promise.all(
      Portals.getInitialContext());
      ShopAPI.getSessionInfo());
    );
    setInitialRoute(context.startingRoute);
    setSessionInfo(sessionInfo);
  }, []);

  // ...

Rich native features and functionality

App development teams can build their own custom native functionality and easily expose it to the Web View. Likewise, the many plugins available in Capacitor core offer drop-in features and functionality when you need it.

Shared session info and auth tokens with web experiences

Take existing native app sessions and share with your Web based experiences and flows. Use the API to pass authentication tokens through Portals and keep users logged in, ensuring a smooth UX.

A better Web View for iOS and Android native apps

Portals provides a superior Web View native control for iOS and Android that brings the full power of the popular Capacitor runtime bridge to existing native apps in a safe and controlled way.

Access control to your mobile projects

Native development teams get granular control over which parts of the app—including specific features and data—the web team can access when collaborating on a mobile project.

Parity with platform changes and version updates

Unlike roll-your-own solutions that use the basic Web View development kit, Portals is fully managed and updated over time. That means, when mobile platform updates come out, we make sure the solution continues to work and keeps pace with the latest security guidelines.

Increased app development velocity with web content

Enable your web development teams to bring existing rich web experiences—dynamic forms, pre-existing pages, workflows—and incorporate them seamlessly into the native app. Focus on building new experiences that require native code to shine.

Who is it for?

But wait—Portals isn’t for everyone.

Portals is for you if...

You'd like to accelerate app development and make more effective use of your time
You’re maintaining a complicated, brittle Web View on your own
Your apps require a seamless user experience embedding web content into native
You want to incorporate web-based experiences with the skills your web team already has
You’d like to enable both web and native teams to collaborate in a safe, effective manner

Portals is NOT for you if...

You’re already content with using stock Web Views from platform vendors
You prefer to roll your own security, features, and integrations
You’re happy with the traditional Web View user experience in native apps
You are not currently using or plan to leverage any web-based experiences in your apps
You plan to keep your web and native teams focused on their respective platforms

Pricing

Contact sales for pricing.

Portals requires a license to run in a production environment. Get in touch with our team to discuss how Portals can help your team ship faster.

Try it now →

Q4 Update: Ionic Show. December 13th 2022.