Skip to main content

Portals for iOS developers

iOS developers configure Portals that present web experiences within mobile applications and use the Portals iOS library to allow native iOS code to interact with web code, and vice versa.

In this training module, you will take an existing iOS app and learn how to:

  • Sync and bundle web apps to present through Portals.
  • Pass contextual data to web apps loading within a Portal.
  • Interact with messages sent from web apps.
  • Implement and attach Capacitor plugins to Portals.
  • Dynamically load web apps within a Portal.

At the end of this training module, you will have put together a completed superapp.

note

Make sure you have read the training introduction before proceeding.

Setting up the project

In the introduction to this training, you cloned a repository for this training. The repository contains branches for different training modules, the start-ios branch corresponds to this training:

terminal

_10
cd ./tutorials-and-trainings-portals
_10
git checkout start-ios

In this training module, you will be working with the Jobsync superapp iOS project. The project utilizes Swift Package Manager for dependency management and SwiftUI as the UI framework. Where necessary, notes will be provided to highlight differences when using UIKit or Cocoapods.

Launch the project located at /ios/Jobsync.xcodeproj and proceed to the next section to install the Portals library.

Once you have loaded the project in Xcode, proceed to the next section to install the Portals library.

Installing the Portals library

To add the Portals iOS library into the Jobsync project in Xcode, follow these steps:

  1. Navigate to the project navigator and select the Jobsync project.
  2. In the main project view, locate and select the 'Package Dependencies' tab.
  3. Click the Add button ('+') to add a new package.

Next, add the Portals iOS library:

  1. Type https://github.com/ionic-team/ionic-portals-ios into the search bar.
  2. Set the dependency rule to 'Up to the Next Minor Version'.
  3. Click 'Add Package' and complete the prompt adding 'IonicPortals' to the Jobsync target.
info

Instructions on installing the Portals iOS library as a Cocoapod are available at this link.

Registering your Portals key

Portals is licensed software and requires a valid Portals product key for use.

Your Portals product key must be registered before any Portals are displayed in the UI. Register your key within the app initializer in JobsyncApp.swift:

JobsyncApp.swift

_17
import SwiftUI
_17
import IonicPortals
_17
_17
@main
_17
struct JobsyncApp: App {
_17
_17
init() {
_17
// Replace "YOUR_KEY_HERE" with your Portals product key.
_17
PortalsRegistrationManager.shared.register(key: "YOUR_KEY_HERE")
_17
}
_17
_17
var body: some Scene {
_17
WindowGroup {
_17
ContentView()
_17
}
_17
}
_17
}

You aren't required to register Portals during app initialization, but it is recommended to register as early into the app lifecycle as possible. Should you try to render a Portal before registering your key, a warning message will be displayed in your app.

caution

Avoid committing your Portals product key to source code repositories that may be publicly visible! You can use an .xcconfig file to store the key outside of a public repository.

What's next?

Now that you have set up the project and registered your Portals product key, you can take advantage of the Portals iOS library. In the next step of this module, you will create a Portal and use the Portals CLI to sync a web app to present within it.