Erstellen von Mobile Apps

HINWEIS

Adobe empfiehlt die Verwendung des SPA-Editors für Projekte, für die ein frameworkbasiertes Client-seitiges Rendering für einzelne Seiten (z. B. React) erforderlich ist. Weitere Informationen

Erstellen Sie Ihre Anwendung zur Installation auf einem Gerät oder Simulator zum Testen oder zur Veröffentlichung in Appstores. Sie können Anwendungen lokal über die PhoneGap-Befehlszeilenschnittstelle oder in der Cloud über PhoneGap Build erstellen.

Ein vollständiger Schritt-für-Schritt-Artikel zum Erstellen einer Mobile App mithilfe des von GitHub verfügbaren Codes ist verfügbar. here.

Verschieben der Anwendung in die Veröffentlichungsinstanz

Verschieben Sie die Anwendungsdateien in die Veröffentlichungsinstanz, damit Sie Inhaltsaktualisierungen für die installierten Instanzen der Mobile App bereitstellen und die Anwendung mit den veröffentlichten Inhalten erstellen können. Anwendungen bestehen aus zwei Knotenverzweigungen im Repository:

/content/phonegap/apps/<application name>: Die Webseiten, die Autoren erstellen und aktivieren.
/content/phonegap/content/<application name>: Anwendungskonfigurationsdateien und Konfigurationen für die Inhaltssynchronisierung.

HINWEIS

Wenn Sie die Anwendungsdateien nicht in die Veröffentlichungsinstanz verschieben, können Inhaltsautoren den Cache für die Inhaltssynchronisierung nicht aktualisieren.

Sie müssen nur die Dateien im /content/phonegap/content/<application name> in die Veröffentlichungsinstanz verzweigt werden. Die Dateien in der /content/phonegap/apps/<application name> -Verzweigung wird verschoben, wenn der Autor die Seiten aktiviert.

AEM bietet zwei Methoden zum Verschieben von Masseninhalten in die Veröffentlichungsinstanz:

Verwenden des Befehls Tree aktivieren in der Replikationskonsole.
Package erstellen , der den Inhalt enthält, und replizieren Sie das Paket.

Beispielsweise wird eine Mobile App mit dem Namen phonegapapp erstellt. Der folgende Knoten muss in die Veröffentlichungsinstanz verschoben werden: /content/phonegap/content/phonegapapp.

Tipp: Um ein Paket aus der Autoreninstanz in die Veröffentlichungsinstanz zu verschieben, verwenden Sie den Befehl Replizieren für das Paket.

chlimage_1-16

Erstellen mithilfe der PhoneGap-Befehlszeilenschnittstelle

Kompilieren Sie die PhoneGap-Anwendung mithilfe der PhoneGap-Befehlszeilenschnittstelle (CLI) auf Ihrem Computer. Um den AEM Inhalt in Ihre Anwendung aufzunehmen, erstellt AEM eine ZIP-Datei, die den Inhalt Ihrer Mobile App, Konfigurationen zur Inhaltssynchronisierung und andere erforderliche Assets enthält. Laden Sie die ZIP-Datei herunter und fügen Sie sie in Ihren Build ein.

Vorbereiten der Build-Umgebung

Um mit der PhoneGap-CLI zu erstellen, müssen Sie Node.js und das PhoneGap-Client-Dienstprogramm installieren. Sie benötigen eine Internetverbindung, um das folgende Verfahren durchzuführen.

Herunterladen und installieren Node.js.

Öffnen Sie ein Terminal oder eine Eingabeaufforderung und geben Sie den folgenden Knotenbefehl ein, um das PhoneGap-Dienstprogramm zu installieren:

npm install -g phonegap

Auf einem Unix- oder Linux-System müssen Sie den Befehl möglicherweise mit dem Präfix sudo.

Das Terminal zeigt die Ergebnisse einer Reihe von HTTP-GET-Befehlen. Wenn die Installation erfolgreich ist, zeigt das Terminal an, wo die Bibliotheken ähnlich wie im folgenden Beispiel installiert sind:

/usr/local/bin/phonegap -> /usr/local/lib/node_modules/phonegap/bin/phonegap.js
phonegap@3.3.0-0.19.6 /usr/local/lib/node_modules/phonegap
├── pluralize@0.0.4
├── colors@0.6.0-1
├── semver@1.1.0
├── qrcode-terminal@0.9.4
├── shelljs@0.1.4
├── optimist@0.6.0 (...)
├── prompt@0.2.11 (...)
├── phonegap-build@0.8.4 (...)
├── connect-phonegap@0.8.1 (...)
└── cordova@3.3.0-0.1.1 (...)

(Optional) Rufen Sie das SDK für die mobile Plattform ab, auf die Sie abzielen:
- Um Apps für die iOS-Plattform zu erstellen, installieren Sie die neueste Version von Xcode.
- Installieren Sie zum Erstellen von Android-Apps das Android SDK.

Herunterladen der Inhalts-ZIP-Datei

Verschieben Sie den Inhalt Ihrer Mobile App in Ihr Dateisystem.

Wählen Sie auf der Seite Mobile Apps Ihre Anwendung aus.
(Optional) Um die Anwendung für vollständige Installationen zu erstellen, klicken oder tippen Sie in der Symbolleiste auf das Symbol Cache löschen .

HINWEIS

Der Cache enthält Inhaltsaktualisierungen für installierte Anwendungen. Beim Löschen des Zwischenspeichers werden alle zwischengespeicherten Aktualisierungen ausgeschlossen.
Klicken oder tippen Sie in der Symbolleiste auf das Symbol CLI Assets herunterladen .
Nachdem Sie die ZIP-Datei gespeichert haben, klicken Sie im Dialogfeld Erfolg auf Schließen .
Extrahieren Sie den Inhalt der ZIP-Datei.

PhoneGap-CLI zum Erstellen verwenden

Verwenden Sie die PhoneGap-CLI, um die Anwendung zu kompilieren und zu installieren. Informationen zur Verwendung der PhoneGap-CLI finden Sie in PhoneGap . Befehlszeilenschnittstelle Dokumentation.

Öffnen Sie ein Terminal oder eine Eingabeaufforderung und ändern Sie das aktuelle Verzeichnis in die heruntergeladene ZIP-Datei der Anwendung. Beispielsweise ändert das folgende Verzeichnis den Ordner in die Datei "ng-app-cli.1392137825303.zip":
```
cd ~/Downloads/ng-app-cli.1392137825303
```
Geben Sie den phonegap-Befehl für die Plattform ein, auf die Sie abzielen. Mit dem folgenden Befehl wird beispielsweise die App für Android erstellt:
```
phonegap build android
```

Erstellen mit PhoneGap Build

Verwenden Sie den PhoneGap-Cloud-Service, um Ihre App zu erstellen. Dazu müssen Sie zunächst eine PhoneGap Build erstellen.

Herstellen einer Verbindung zu PhoneGap Build

Erstellen Sie eine PhoneGap Build-Konfiguration, damit Sie die PhoneGap Build-Dienste aus AEM heraus verwenden können. Geben Sie den Benutzernamen und das Kennwort des PhoneGap Build an, das Sie zum Erstellen Ihrer Mobile Apps verwenden werden.

Öffnen Sie die Seite Tools . (http://localhost:4502/tools.html).
Klicken Sie im Bereich "CQ-Vorgänge"auf "Cloud Services".
Klicken Sie auf den Link Jetzt konfigurieren für PhoneGap Build.
Geben Sie im Dialogfeld Konfiguration erstellen einen Wert für die Eigenschaft Titel ein. Standardmäßig wird der Wert der Eigenschaft "Name"aus dem Titel abgeleitet, Sie können jedoch einen Namen eingeben. Klicken Sie auf „Erstellen“.
Geben Sie im Dialogfeld "PhoneGap Build Configuration"Ihren Benutzernamen und Ihr Kennwort ein und klicken Sie auf "OK".

Verwenden von PhoneGap Build

Senden Sie Ihre Anwendungsressourcen zur Kompilierung für die verschiedenen mobilen Plattformen an PhoneGap Build.

Öffnen Sie auf der Seite Mobile Apps Ihre Mobile App. (http://localhost:4502/mobile.html/content/phonegap)
(Optional) Um die Anwendung für vollständige Installationen zu erstellen, wählen Sie die Anwendung aus und klicken Sie auf das Symbol Cache löschen .

HINWEIS

Der Cache enthält Inhaltsaktualisierungen für installierte Anwendungen. Beim Löschen des Zwischenspeichers werden alle zwischengespeicherten Aktualisierungen ausgeschlossen.
Wählen Sie die Begrüßungsseite aus und klicken Sie dann auf das Symbol Remote erstellen .

Hinweis: Die Beta-Version AEM Beta erstellt keine Inbox-Benachrichtigung, wenn der Build erfolgreich abgeschlossen wurde.
Klicken Sie im Dialogfeld "Erfolg"auf PhoneGap Build , um die Adobe PhoneGap Build-Seite unter https://build.phonegap.com/apps. Wenn Sie darauf warten, dass Ihre App angezeigt wird, können Sie die PhoneGap Build Seite.

Weitere Informationen zur Installation des Builds finden Sie unter Dokumentation zu PhoneGap Build.

HINWEIS

Kostenlose PhoneGap Build sind nur für eine private Anwendung erlaubt. PhoneGap-Builds schlagen fehl, wenn Sie eine zusätzliche private Anwendung erstellen.