Build and Publish

Kinvey Studio provides you with the option to build, package, and publish both web and mobile applications. You can upload the produced web app bundle to the Kinvey Websites web site hosting or manually to a web server of your own choosing. As for mobile apps, you can easily run and test them on connected or emulated devices during the development phase. When ready to publish an app to App Store or Google Play, you can upload the app package to the respective store directly from Kinvey Studio.

Running Web Apps Locally

During development, you can utilize the Angular web server built-in inside Kinvey Studio to quickly view your changes locally. After you have finalized an app, you can proceed to building and publishing it.

To run a web app locally:

  1. Open your app in Kinvey Studio.
  2. From the toolbar in the upper-right corner, click Generate to generate the latest source code of your app.

    This action generates both the web and the mobile source code. Being a separate action, it allows you to make manual changes to the source code before you build.

  3. After generation completes, click Start Dev Server in the same toolbar.

    This action starts the Angular development server.

Kinvey Studio opens the app in your default web browser. If the app does not open, you can access it manually at the following address:

`https://localhost:4200`

Building Web Apps

The build process of a web app involves source code generation from the metadata that has been creating in the background as you configure modules, views, and components. You need to build before you can deploy the web application.

To quickly view your app in a web browser during development, you may want to use the Run function.

Based on the configuration parameters that you select, the produced deployment bundle can be debug for development or release for production use.

The debug version of the deployment bundle contains development-friendly code in a non-minimized format. The release version contains the same code in minimized form, suitable for production use.

To build an web app:

  1. Open your app in Kinvey Studio.
  2. From the toolbar in the upper-right corner, click Generate to generate the latest source code of your app.

    This action generates both the web and the mobile source code. Being a separate action, it allows you to make manual changes to the source code before you build.

  3. In the same toolbar, click the ellipsis sign and select Build for deployment to open the build configuration dialog.

  4. Select Debug or Release build configuration.
  5. (Optional) Set the Base href property.

    If you host your application in a subfolder of your web server, set Base href to it. For example, if index.html resides in /my/app/, you need to set Base href to /my/app/. If your project lives in the root directory, leave the default setting of /.

  6. Click Build.

The produced deployment bundle appears in <app_base-folder>/build-output/debug for Debug configurations and <app_base-folder>/build-output/release for Release configurations.

Publishing Web Apps

The web app build procedure creates a standards-compliant static web site, allowing you to publish it on most web servers.

Publishing Web Apps to Kinvey

Kinvey Websites is a quick way of publishing web sites from Kinvey Studio to cloud infrastructure maintained by Kinvey.

  1. Open your app in Kinvey Studio.
  2. From the toolbar in the upper-right corner, click Generate to generate the latest source code of your app.

    This action generates both the web and the mobile source code. Being a separate action, it allows you to make manual changes to the source code before you build.

  3. In the same toolbar, click the ellipsis sign and select Publish on cloud hosting.

Kinvey Studio builds the web app if not already built and then proceeds to upload its files to Kinvey. Before it does the upload, it creates a web site in Kinvey using the same name as the Kinvey Studio app.

If you already have a site with the same name in Websites, Kinvey Studio will overwrite its files without warning.

After the upload completes, Kinvey Studio opens your web site in Kinvey Console using your default web browser. Use the screen to manage your web site and to open its development and public URLs.

Publishing Web Apps to a Web Server

You can upload the deployment bundle produced by the build procedure to any web server capable of serving static web pages.

Check the official Angular documentation for specifics relating to routed Angular apps.

Running Mobile Apps on Devices

During development, you can quickly run your app on a running emulated/simulated device or a connected physical device. Kinvey Studio provides two options to do that:

  • Run an app package that you have already built—provides an experience which is as close as possible to installing the app from an app store but may require going through platform-dependent setup.
  • Preview the app—uses the Kinvey Preview app to run the code directly without building and platform-dependent setup work.

Running App Package

Kinvey Studio helps you run an app package that you have previously build on a running emulated/simulated device or a connected physical device. After you have finalized an app, you can proceed to publishing it to app stores.

You can deploy your apps on multiple connected and emulated devices simultaneously and inspect the generated logs through the Device Console tab of the Mobile Sidekick window's Output pane.

To run your app on a connected iOS device, you need to have the latest version of iTunes installed on your machine. Kinvey Studio does not work with iTunes installed from Windows Store.

  1. Open your app in Kinvey Studio.
  2. From the toolbar in the upper-right corner, click Generate to generate the latest source code of your app.

    This action generates both the web and the mobile source code. Being a separate action, it allows you to make manual changes to the source code before you build.

  3. In the same toolbar, click Preview on Mobile to open the Mobile Sidekick window.

  4. In the Mobile Sidekick window, click the Connected tab to open the Run on Device view.
  5. Under Connected Devices, select one or more devices.

    Only trusted and properly provisioned devices can be selected:

    • Building for Android in Release configuration requires you to provide a valid Google Play self-signed code signing identity.
    • Building for iOS requires you to provide a valid certifate and mobile provision pair. If you have a Free Apple Developer account, you can use the Code Signing Assistance to automatically generate temporary certificate and mobile provision. For more information about iOS code signing, see the iOS Developer Program article.
    • To provision a specific device, click on the gear icon next to it. Clicking it opens the code signing management window, in which you can specify the code signing assets.
  6. Select a Build Type.

    To execute Local iOS builds, you must run Kinvey Studio on a macOS system configured for iOS development.

  7. Select a Configuration.

    The LiveSync feature is available and enabled by default only for builds in Debug configuration.

  8. (Optional) Modify the build parameters:

    • Clean Build ignores any previously cached data in the cloud, completely rebuilding the app. Initiating a clean build may help you to resolve sporadic build failures.
    • Webpack enables the use of this particular bundling format. For more information, see Bundle Your Code with Webpack.
    • Hot module replacement is an upgrade on top of LiveSync that helps you keep the current state of your app while applying any changes made to your code. For more information, see the NativeScript Hot Module Reload blog post.
    • Start Debugger starts a debug session as soon as the app is deployed on the device. Start Debugger is available only in Debug Configuration.
  9. Click Run on Device and wait for the app to be deployed on the device.

LiveSync

The LiveSync functionality lets you make changes to your app and see those changes applied in real time across all connected and emulated devices. LiveSync enables automatically when you initiate a Run on Device in Debug configuration.

LiveSync behave differently depending on the type of files being modified:

  • When changing an XML, HTML, or CSS file, the app refreshes automatically.
  • When changing a JavaScript or TypeScript file, the app restarts automatically.
  • When changing the app resources or plugins, the app rebuilds, redeploys, and relaunches automatically.

Code Signing Assistance

To build and deploy your apps on an iOS device, you need to have them code-signed with a valid certificate and mobile provision. The code signing assistance helps you to automatically generate temporary certificates and mobile provisions.

Limitations

  • You cannot use the certificate and mobile provision generated by the code signing assistance to publish your app to the App Store.
  • Only users with Free Apple Developer accounts can benefit from the automatic code signing assets generation. You can create a Free Apple Developer account here.
  • Only iOS devices connected to your machine during the generation are included in the mobile provision. Apps signed with this mobile provision can be deployed only on those devices.
  • To generate a temporary certificate and mobile provision, your application must have a unique App ID. Otherwise, the code signing assistance throws an error during the generation process.
  • The temporary certificate and mobile provisions have a limited lifetime—around 7 days. After this period, you have to generate new ones and use them instead.
  1. Open your app in Kinvey Studio.
  2. From the toolbar in the upper-right corner, click Generate to generate the latest source code of your app.

    This action generates both the web and the mobile source code. Being a separate action, it allows you to make manual changes to the source code before you build.

  3. In the same toolbar, click Preview on Mobile to open the Mobile Sidekick window.

  4. In the Mobile Sidekick window, click the Connected tab to open the Run on Device view.
  5. Under Connected Devices, click the gear icon next to the iOS device that you want to configure.
  6. In the Manage iOS Provisioning and Certificates dialog box that opens, click Auto Generate.
  7. Enter your Apple ID and Password and click Generate.
  8. When prompted, provide a password to protect the certificate.
  9. The newly created code signing assets automatically populate the Certificate and Provision fields.

You can now run your app on the specific iOS device.

Previewing on Device

Previews use the Kinvey Preview app to run your app without having to install various SDKs and tools or configure your environment for local iOS or Android development.

  1. Open your app in Kinvey Studio.
  2. From the toolbar in the upper-right corner, click Generate to generate the latest source code of your app.

    This action generates both the web and the mobile source code. Being a separate action, it allows you to make manual changes to the source code before you build.

  3. In the same toolbar, click Preview on Mobile to open the Mobile Sidekick window.

  4. On the Preview App tab, click Start Preview.

    A QR code appears on the screen.

  5. Above the QR code, click Kinvey Scanner app, scan the QR code that appears and install the app.

  6. Click Hide to close the installation QR code and return to the preview QR code.
  7. Open the Kinvey Preview app on your device and scan the preview QR code.

    The app downloads and starts. Allow a few moments for it to download.

You can leave the app running on the device while developing. After you make a change, click Generate and the app will automatically reload on the device, showing the latest developments.

Building Mobile Apps

The build process of mobile apps in Kinvey Studio takes the source code and outputs a native application package: IPA for iOS and APK for Android. You can use those to deploy the app on a device or publish it to the respective application stores.

To quickly upload your app to a device during development, you may want to use the Run function.

Kinvey Studio lets you choose between two types of builds:

  • Cloud builds help achieve a truly cross-platform mobile development because you can build for iOS and Android from any desktop OS supported by Kinvey Studio. No preliminary setup is required to build your mobile apps in the cloud.
  • Local builds require you to configure your system by installing various development tools and SDKs, but also give you complete control over your environment. A notable limitation is the need for a macOS system to build apps for iOS. For detailed information on how to setup your environment for local NativeScript development, see NativeScript Advanced Setup: Windows or NativeScript Advanced Setup: macOS.

Building for Android

  1. Open your app in Kinvey Studio.
  2. From the toolbar in the upper-right corner, click Generate to generate the latest source code of your app.

    This action generates both the web and the mobile source code. Being a separate action, it allows you to make manual changes to the source code before you build.

  3. In the same toolbar, click the ellipsis sign and select MOBILE > Build app package to open the mobile build configuration window.

  4. Select Android.
  5. (For Release configuration) Select a Google Play developer certificate:
    1. Hover over Android and click the gear icon that appears, to open the certificate management dialog box.
    2. In Certificate, browse your local file system for a p12 certificate file or expand the drop-down list to select a certificate stored in Windows Certificate Manager or macOS Keychain.
    3. Close the Manage Android Certificates dialog box.
  6. Select a Build Type.

    See Building Mobile Apps for an explanation of build types.

  7. Select a Configuration.

    To build for Android in Release configuration, you need to have specified a certificate for a valid Google Play self-signed code signing identity as explained in a previous step.

  8. (Optional) Modify the build parameters:

    • Enable Clean Build to ignore any previously cached data in the cloud, completely rebuilding the app. Initiating a clean build may help you to resolve sporadic build failures.
    • Enable Webpack to use this particular bundling format. For more information, see Bundle Your Code with Webpack.
  9. Click Build.

If you have provided a Google Play certificate stored in the file system, you will be prompted to enter its password on every build. Certificates stored in Certificate Manager or Keychain do not require password validation.

When the build process is complete, you are presented with a path to the produced APK file and a QR code. You can use a barcode scanner app to scan the QR code and install the application directly on your device.

Building for iOS

To build for iOS, you need a valid certificate and mobile provision. For more information about iOS code signing, see the iOS Developer Program.

  1. Open your app in Kinvey Studio.
  2. From the toolbar in the upper-right corner, click Generate to generate the latest source code of your app.

    This action generates both the web and the mobile source code. Being a separate action, it allows you to make manual changes to the source code before you build.

  3. In the same toolbar, click the ellipsis sign and select MOBILE > Build app package to open the mobile build configuration window.

  4. Select iOS.
  5. Select an iOS certificate and provision:

    1. Hover over iOS and click the gear icon that appears, to open the certificates and provisions management dialog box.
    2. In Certificate, browse your local file system for a certificate file or expand the drop-down list to select a certificate stored in Windows Certificate Manager or macOS Keychain.
    3. In Provision, browse your local file system for a mobile provision
    4. Close the Manage iOS Provisions and Certificates dialog box.

      When building locally, the code signing information provided in step 5 will be taken automatically from the macOS keychain. Kinvey Studio will identify the correct code signing assets based on the App ID and the DEVELOPMENT_TEAM ID specified in the App_Resources/iOS/build.xcconfig file.

  6. Select a Build Type.

    See Building Mobile Apps for an explanation of build types.

    To execute Local iOS builds, you must be running Kinvey Studio on a properly configured macOS system.

  7. Select a Configuration.

  8. (Optional) Modify the build parameters:

    • Clean Build ignores any previously cached data in the cloud, completely rebuilding the app. Initiating a clean build may help you to resolve sporadic build failures.
    • Webpack enables the use of this particular bundling format. For more information, see Bundle Your Code with Webpack.
  9. Click Build.

If you have provided a certificate stored in the file system, you will be prompted to enter its password on every build. Certificates stored in Certificate Manager or Keychain do not require password validation.

When the build process is complete, you will be presented with a path to the produced IPA file.

Publishing Mobile Apps

When your app is ready for production, you can build the application package and automatically upload it to Google Play or Apple App Store. When combined with cloud builds, this feature allows you to publish iOS applications from operating systems other than macOS.

Publish to Google Play

The initial publication to Google Play needs to be done manually. After you build your app in Sidekick, you need to upload the application package to the Google Play Console as described below. After that, Kinvey Studio will be able to publish app updates for you.

Publishing for the First Time

  1. Build an Android application package (APK) in Release configuration by following the steps in Building for Android.
  2. Upload the application package to the Google Play Console and publish your release:

    1. Log in to the Google Play Console.
    2. In the All applications tab, click Create Application to create a new app.
    3. In the Create application dialog box, select a default language, provide an application title, and click Create to proceed.
    4. In the Store listing tab, complete the required fields and provide the needed assets. Click Save Draft.
    5. In the Pricing & distribution tab, complete the pricing and distribution settings for your app. Click Save Draft.
    6. In the App releases tab, select between the Alpha, Beta, and Production tracks and click on the respective Manage button. The Alpha and Beta tracks are used for initial testing of your application. Only the Production track can be used to publish your app to Google Play.
    7. On the screen of the selected track, click Create Release.
    8. Under APKs to add, provide the application package (APK) created earlier.

      Review your draft release and make any additional changes if needed.

    9. Select Review.

    10. On the Review and rollout release screen, verify that there are no issues with the release before rolling it out to users. Address any warnings or errors before proceeding.
    11. Click Confirm rollout to publish your app.

Publishing App Updates

The first step—configuring a service account and obtaining a JSON key—has to be completed only the first time you publish an app update. You can reuse the JSON key for future updates.

  1. Configure a Service Account and obtain a JSON key:

    1. Log in to the Google Play Console.
    2. Select the Settings tab, followed by the API access tab.
      • (Optional) Click Create New Project.
    3. Click Create Service Account and follow the Google API Console link in the dialog box.
    4. Click Create Service account at the top of the developer's console screen.
    5. Provide a name for the service account.
    6. Click Select a role and choose Project > Service Account Actor.
    7. Click the Furnish a new private key checkbox.
    8. Select JSON as the Key type.
    9. Click Create to close the dialog box.

      This action automatically downloads the required JSON file to your computer.

    10. Back in the Google Play developer console, click Done to close the dialog box.

    11. Click Grant Access for the newly added service account.
    12. Choose Release Manager from the Role drop-down box.
    13. Click Add user to close the dialog box.
  2. Build and upload your app from Kinvey Studio to the Google Play Console:

    1. Open your app in Kinvey Studio.
    2. From the toolbar in the upper-right corner, click Generate to generate the latest source code of your app.

      This action generates both the web and the mobile source code. Being a separate action, it allows you to make manual changes to the source code before you build.

    3. In the same toolbar, click the ellipsis sign and select MOBILE > Publish to stores to open the mobile build configuration window.

    4. Select Google Play.
    5. Hover on the Google Play box and click on the gear icon to open the certificate management dialog.
    6. In Certificate, browse your local file system for a certificate file or expand the drop-down list to select a certificate stored in Windows Certificate Manager or macOS Keychain. Close the dialog box.
    7. Select a Build Type and click Next.
    8. When prompted, provide the Service Account JSON key generated earlier. Select between the Alpha, Beta, and Production tracks and click Upload.
  3. Review and publish your release:

    1. Log in to the Google Play Console and select your app.
    2. From the left-side menu, select Release management > App releases.
    3. Next to the release that you want to rollout, select Edit release.
    4. Review your draft release and make any additional changes if needed.
    5. Click Review.
    6. In the Review and rollout release screen, verify that there are no issues with the release before rolling it out to users. Address any warnings or errors.
    7. For production releases, select your rollout percentage.
    8. Click Confirm rollout.

Publish to App Store

Verify the following before you continue with the procedure: You have matching distribution provisioning profile and distribution certificate. You have registered a bundle ID in the iOS Dev Center. * You have created an App record in App Store Connect. For more information, see Add an app to your account in the official Apple documentation.

  1. Open your app in Kinvey Studio.
  2. From the toolbar in the upper-right corner, click Generate to generate the latest source code of your app.

    This action generates both the web and the mobile source code. Being a separate action, it allows you to make manual changes to the source code before you build.

  3. In the same toolbar, click the ellipsis sign and select MOBILE > Publish to stores to open the mobile build configuration window.

  4. Select Apple App Store.
  5. Hover on the Apple App Store box and click on the gear icon to open the certificate management dialog.
  6. In Certificate, browse your local file system for a certificate file or expand the drop-down list to select a certificate stored in Windows Certificate Manager or macOS Keychain. Close the dialog box.
  7. In Provision, browse your local file system for a mobile provision.
  8. Close the Manage iOS Provisioning and Certificates for Apple App Store dialog box.
  9. Select a Build Type.
  10. Click Next and wait for the build process to complete.
  11. Provide your Apple username and password.
  12. Click Upload and wait for confirmation that the upload completed successfully.
  13. Log in to iTunes Connect to submit your app for review. For more information, see Submitting iOS Apps to the App Store in the official Apple documentation.