Erste Schritte mit AWS

Erstellen einer React-Anwendung

Erstellen Sie eine einfache Web-Anwendung mit AWS Amplify

Modul 2: Initialisierung einer lokalen Amplify-Anwendung

In diesem Modul werden Sie die Amplify CLI installieren und konfigurieren.

Einführung

Nun, da wir ein neues Amplify-Projekt in unserem Konto initialisiert haben, wollen wir es in unsere lokale Umgebung übertragen, damit wir die Entwicklung fortsetzen und neue Funktionen hinzufügen können.

In diesem Modul installieren Sie die Amplify-CLI und initialisieren das Amplify-Projekt unter Verwendung der CLI.

Lerninhalte

  • Installieren und Konfigurieren der Amplify CLI
  • Initialisieren der Amplify-Anwendung

Wichtige Konzepte

Amplify CLI – Mit der Amplify CLI können Sie AWS-Services direkt von Ihrem Terminal aus erstellen, verwalten und entfernen.

 Veranschlagte Zeit

5 Minuten

 Verwendete Services

Implementierung

  • Installieren der Amplify CLI

    Das Amplify Command Line Interface (CLI) ist eine einheitliche Toolchain zur Erstellung von AWS Cloud-Services für Ihre Anwendung, die einem einfachen, geführten Workflow folgt. Lassen Sie uns fortfahren und die Amplify CLI über die Eingabeaufforderung (Windows) oder das Terminal (MacOS) installieren. HINWEIS: Dieser Befehl kann in einem beliebigen Verzeichnis in Ihrer Eingabeaufforderung/Ihrem Terminal ausgeführt werden, da das "-g" anzeigt, dass die Binärdatei global auf Ihrem System installiert wird.

    npm install -g @aws-amplify/cli
  • Konfigurieren der Amplify CLI

    Mit Amazon IAM (Identity and Access Management) können Sie Benutzer und Benutzerberechtigungen in AWS verwalten. Die CLI verwendet IAM, um Services programmatisch in Ihrem Namen über die CLI zu erstellen und zu verwalten.

    Um die CLI zu konfigurieren, führen Sie den Befehl configure aus. Um einen Video-Walkthrough des CLI-Konfigurationsprozesses zu sehen, klicken Sie hier.

    amplify configure
  • Initialisieren der Amplify-Anwendung

    Als Nächstes werden wir eine App lokal initialisieren. Da wir bereits ein Amplify-Projekt erstellt haben, können wir die bereits erstellte Anwendungskonfiguration verwenden.

    a. Klicken Sie in der Amplify-Konsole auf Backend-Umgebungen.

    Front End BackEnd Environments Module 2

    b. Kopieren Sie auf der Registerkarte Backend-Umgebung den Befehl amplify init auf Ihre Tastatur.

    Front End BackEnd Environments2 Module 2

    c. Initialisieren Sie das Amplify-Projekt lokal mit den folgenden Befehlen.

    HINWEIS: Stellen Sie sicher, dass das von Ihnen gewählte Profil unter Verwendung derselben Region konfiguriert wurde wie das Amplify-Projekt, das Sie bereits bereitgestellt haben.

    amplify init --appId your-app-id
    
    ? Enter a name for the project: amplifyapp
    ? Enter a name for the environment: dev
    ? Choose your default editor: Visual Studio Code
    ? Choose the type of app that youre building: javascript
    ? What javascript framework are you using: react
    ? Source Directory Path: src
    ? Distribution Directory Path: build
    ? Build Command:  npm run-script build
    ? Start Command: npm run-script start
    ? Do you want to use an AWS profile? Y
    ? Please choose the profile you want to use: your-aws-profile
    

Fazit

Sie haben das Amplify-Projekt initialisiert und sind nun bereit, mit dem Hinzufügen von Funktionen zu beginnen! Im nächsten Modul fügen wir einen kompletten Benutzerauthentifizierungsfluss mit nur wenigen Codezeilen hinzu.

Um Ihr Amplify-Projekt jederzeit im Dashboard anzuzeigen, können Sie jetzt den folgenden Befehl ausführen:

amplify console

War das Modul hilfreich?

Vielen Dank
Bitte teilen Sie uns mit, was Ihnen gefallen hat.
Es tut uns Leid Sie zu enttäuschen
Ist etwas veraltet, verwirrend oder ungenau? Bitte helfen Sie uns, dieses Tutorial zu verbessern, indem Sie Feedback geben.

Authentifizierung hinzufügen