Zopher

Reagieren Sie die native Twitter -App mit AWS Amplify und Expo

Dieses Projekt integriert ein reag-natives Front-End mit einem AWS-Amplify-Back-End mit Benutzerauthentifizierung (AWS Cognito) und einer GraphQL-API (AWS AppSync) für CRUD-Operationen zwischen Client und Datenbank (Amazon DynamoDB).

App -Übersicht

• Benutzer können sich bei der App anmelden.

• Benutzer können Beiträge erstellen, indem sie die Taste hinzufügen, in das Modal schreiben und Senden drücken.

• Benutzer können/im Gegensatz zu Posts mögen.

• Benutzer können ihre eigenen Beiträge löschen.

• Benutzer können den Post -Feed -Feed aktualisieren nach:

  • Drücken der Relad -Taste.
  • Ausführen eines Pull-to-Refresh.

Voraussetzungen

• Expo Cli

  • npm install -g expo-cli

• AWS -Konto

• Knoten JS mit NPM

• AWS verstärkt CLI

  • npm install -g @aws-amplify/cli
  • amplify configure (Link für einen Schritt -für -Schritt -Video).

Konfigurieren des Projekts

1. Klonen Sie dieses Repo zu Ihrer lokalen Maschine.

 git clone https://github.com/yhenni1989/Zopher.git

cd Zopher

2. Fügen Sie AWS -Verstärkungs -Abhängigkeiten zu Ihrem Projekt hinzu.

 yarn add aws-amplify aws-amplify-react-native

# or

npm install aws-amplify aws-amplify-react-native

3. Initialisiere das AWS -Verstärkungsprojekt.

 amplify init

Befolgen Sie die gleichen Anweisungen wie unten.

4. Konfigurieren Sie einen Amazon Cognito -Benutzerpool, um Benutzer -Anmeldeinformationen zu speichern.

 amplify add auth

# When prompt, choose: Yes, use the default configuration.

5. Fügen Sie den API -Dienst hinzu, um GraphQL zu verwenden und Daten in Amazon Dynammodb zu speichern.

 amplify add api

Folgen Sie der folgenden Konfiguration.

6. Zeit für die Bereitstellung Ihres Projekts in AWS.

 amplify push

Nach wenigen Minuten automatisierter Vorgänge erstellt die Amplify CLI einen Amazon -Cognito -Benutzerpool und einen Identitätspool, um Benutzer von CRENSIENTIONEN und eine AWS AppSync GraphQL -API zu speichern, um CRUD -Operationen zwischen Client und Servern zu ermöglichen.

Ausführen der Anwendung

1. Installieren Sie Clientabhängigkeiten.

 yarn

# or

npm install

2. Starten Sie die React Native App in Ihrem Simulator unter Ihrem Projektverzeichnis.

 expo start --ios

# or

expo start --android

Schritt -für -Schritt -Tutorial

• Schauen Sie sich den vollständigen Einrichtungsvorgang in der mittleren Geschichte an
• Video -Link für die Demo hier.