Zopher Save

Tweeting app with React Native and Expo using GraphQL with AppSync and AWS Amplify.

Project README

React Native Twitter app with AWS Amplify and Expo

layout

This project integrates a React Native front-end with an AWS Amplify back-end that has user authentication (AWS Cognito) and a GraphQL API (AWS AppSync) for CRUD operations between the client and the database (Amazon DynamoDB).

App Overview

  • Users can sign up/in to the app.

  • Users can create posts by pressing the add button, writing inside the Modal, and pressing submit.

  • Users can like/unlike posts.

  • Users can delete their own posts.

  • Users can update the posts feed by:

    • Pressing the reload button.
    • Performing a pull-to-refresh.

Prerequisites

Configuring the project

  1. Clone this repo to your local machine.
git clone https://github.com/yhenni1989/Zopher.git

cd Zopher
  1. Add AWS Amplify dependencies to your project.
yarn add aws-amplify aws-amplify-react-native

# or

npm install aws-amplify aws-amplify-react-native
  1. Initialise the AWS Amplify project.
amplify init

Follow the same instructions as below.

init
  1. Configure an Amazon Cognito User Pool to store users credentials.
amplify add auth

# When prompt, choose: Yes, use the default configuration.
  1. Add the API service to use GraphQL and store data in Amazon DynammoDB.
amplify add api

Follow the below configuration.

api
  1. Time to deploy your project to AWS.
amplify push
push

After few minutes of automated operations, the Amplify CLI will create an Amazon Cognito User Pool and Identity Pool to store users crendentials and an AWS AppSync GraphQL API to allow for CRUD operations between client and servers.

Running the application

  1. Install client dependencies.
yarn

# or

npm install
  1. Launch the React Native app in your simulator under your project directory.
expo start --ios

# or

expo start --android

Step by step tutorial

  • Check out the full set up process in the Medium story
  • Video link for the demo in here.
Open Source Agenda is not affiliated with "Zopher" Project. README Source: youneshenniwrites/Zopher

Open Source Agenda Badge

Open Source Agenda Rating