Show Menu
THEMEN×

Erstellen von Mobilanwendungen

Adobe empfiehlt die Verwendung des SPA-Editors für Projekte, für die ein frameworkbasiertes clientseitiges Rendering für einzelne Seiten (z. B. React) erforderlich ist. Weitere Informationen
Erstellen Sie Ihre Anwendung, um sie auf einem Gerät oder Simulator zum Testen oder zur Veröffentlichung in App Stores zu installieren. Sie können Anwendungen lokal über die PhoneGap-Befehlszeilenschnittstelle oder in der Cloud mit PhoneGap Build erstellen.
Ein vollständiger Schritt-für-Schritt-Artikel zum Erstellen einer mobilen Anwendung mit dem von GitHub verfügbaren Code ist hier verfügbar.

Verschieben der Anwendung in die Veröffentlichungsinstanz

Verschieben Sie Anwendungsdateien in die Veröffentlichungsinstanz, damit Sie Inhaltsaktualisierungen zu den installierten Instanzen der mobilen Anwendung 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 Inhaltssynchronisierungskonfigurationen.
Wenn Sie die Anwendungsdateien nicht in die Veröffentlichungsinstanz verschieben, können Inhaltsersteller den Content Sync-Cache nicht aktualisieren.
Sie müssen nur die Dateien in der /content/phonegap/content/<application name> Verzweigung in die Veröffentlichungsinstanz verschieben. Die Dateien in der /content/phonegap/apps/<application name> Verzweigung werden verschoben, wenn der Autor die Seiten aktiviert.
AEM bietet zwei Methoden zum Verschieben von Masseninhalten in die Veröffentlichungsinstanz:
Beispielsweise wird eine mobile Anwendung namens phonegapapp erstellt. Der folgende Knoten muss in die Veröffentlichungsinstanz verschoben werden: /content/phonegap/content/phonegapapp.
​Tipp: Um ein Paket von der Autoreninstanz in die Veröffentlichungsinstanz zu verschieben, verwenden Sie den Befehl "Replizieren"im Paket.

Erstellen mit der PhoneGap-Befehlszeilenschnittstelle

Das Kompilieren der PhoneGap-App erfolgt auf Ihrem Computer mithilfe der PhoneGap-Befehlszeilenoberfläche (Command Line Interface, CLI). Um den AEM-Inhalt in Ihre Anwendung aufzunehmen, erstellt AEM eine ZIP-Datei, die den Inhalt Ihrer mobilen Anwendung, die Inhaltssynchronisierungskonfigurationen und andere erforderliche Elemente 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 auszuführen.
  1. Download and install Node.js .
  2. Ö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 dem Befehl eventuell ein Präfix voranstellen 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 dem folgenden Beispiel installiert werden:
    /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 (...)
    
    
  3. (Optional) SDK für die mobile Plattform abrufen, die Sie als Ziel auswählen:
    • Um Apps für die iOS-Plattform zu erstellen, installieren Sie die neueste Version von Xcode .
    • Um Android-Apps zu erstellen, installieren Sie das Android-SDK .

Herunterladen der Inhalts-ZIP-Datei

Verschieben Sie den Inhalt Ihrer mobilen Anwendung in Ihr Dateisystem.
  1. Wählen Sie auf der Seite "Mobilanwendungen"Ihre Anwendung aus.
  2. (Optional) Um die Anwendung für vollständige Installationen zu erstellen, klicken Sie in der Symbolleiste auf das Symbol Cache löschen oder tippen Sie auf das Symbol Cache löschen.
    Der Cache enthält Inhaltsaktualisierungen für installierte Anwendungen. Beim Löschen des Zwischenspeichers werden alle zwischengespeicherten Aktualisierungen ausgeschlossen.
  3. Klicken Sie in der Symbolleiste auf das Symbol "CLI-Assets herunterladen"oder tippen Sie darauf.
  4. Nachdem Sie die ZIP-Datei gespeichert haben, klicken Sie im Dialogfeld Erfolg auf Schließen.
  5. Extrahieren Sie den Inhalt der ZIP-Datei.

PhoneGap-Befehlszeilenschnittstelle zum Erstellen

Verwenden Sie die PhoneGap-CLI, um die Anwendung zu kompilieren und zu installieren. Informationen zur Verwendung der PhoneGap-CLI finden Sie in der Dokumentation zur PhoneGap- Befehlszeilenschnittstelle .
  1. Öffnen Sie ein Terminal oder eine Eingabeaufforderung und ändern Sie den aktuellen Ordner in die heruntergeladene ZIP-Datei der Anwendung. Beispielsweise wird im folgenden Beispiel der Ordner in die Datei "ng-app-cli.1392137825303.zip"geändert:
    cd ~/Downloads/ng-app-cli.1392137825303
    
    
  2. Geben Sie den Befehl phonegap für die Plattform ein, die Sie als Ziel auswählen. Mit dem folgenden Befehl wird beispielsweise die App für Android erstellt:
    phonegap build android
    
    

Erstellen mit PhoneGap Build

Verwenden Sie den PhoneGap-Cloud-Dienst, um Ihre App zu erstellen. Um dieses Verfahren auszuführen, müssen Sie zunächst eine PhoneGap Build-Konfiguration erstellen.

Connecting to PhoneGap Build

Erstellen Sie eine PhoneGap Build-Konfiguration, damit Sie die PhoneGap Build-Dienste in AEM verwenden können. Geben Sie den Benutzernamen und das Kennwort des PhoneGap Build-Kontos an, das Sie zum Erstellen Ihrer mobilen Anwendungen verwenden werden.
  1. Öffnen Sie die Seite "Tools". ( http://localhost:4502/tools.html ).
  2. Klicken Sie im Bereich "CQ-Vorgänge"auf Cloud-Dienste.
  3. Klicken Sie auf den Link Jetzt konfigurieren für PhoneGap Build.
  4. Geben Sie im Dialogfeld "Konfiguration erstellen"einen Wert für die Eigenschaft "Titel"ein. Standardmäßig wird der Wert der Eigenschaft Name vom Titel abgeleitet, Sie können jedoch einen Namen eingeben. Klicken Sie auf Erstellen.
  5. Geben Sie im Dialogfeld "Konfiguration von PhoneGap"Ihren Benutzernamen und Ihr Kennwort für PhoneGap Build ein und klicken Sie auf OK.

PhoneGap Build verwenden

Senden Sie Ihre Anwendungsressourcen zur Kompilierung für die verschiedenen mobilen Plattformen an PhoneGap Build.
  1. Öffnen Sie auf der Seite "Mobilanwendungen"Ihre Mobilanwendung. ( http://localhost:4502/mobile.html/content/phonegap )
  2. (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".
    Der Cache enthält Inhaltsaktualisierungen für installierte Anwendungen. Beim Löschen des Zwischenspeichers werden alle zwischengespeicherten Aktualisierungen ausgeschlossen.
  3. Wählen Sie die Begrüßungsseite und klicken Sie dann auf das Symbol "Remote erstellen".
    ​Hinweis: Die Beta-Version von AEM Beta erstellt keine Inbox-Benachrichtigung, wenn der Build erfolgreich abgeschlossen wurde.
  4. Klicken Sie im Dialogfeld Erfolg auf PhoneGap Build, um die Seite Adobe PhoneGap Build unter https://build.phonegap.com/apps zu öffnen. Wenn Sie darauf warten, dass Ihre App angezeigt wird, können Sie die Seite PhoneGap Build-Status überprüfen.
    Weitere Informationen zum Installieren des Builds finden Sie in der PhoneGap Build-Dokumentation .
    Kostenlose PhoneGap Build-Konten sind für eine private Anwendung zulässig. PhoneGap-Builds schlagen fehl, wenn Sie eine zusätzliche private Anwendung erstellen.

Die nächsten Schritte

Der nächste Schritt nach dem Erstellen ist das Lernen der Struktur einer App .