Skip to content

Instagram Clone (light version) — Graphql + React (ios, android, web)

Notifications You must be signed in to change notification settings

stelmakhivan/react-native-instagram-clone

Repository files navigation

react-native-instagram-clone

Instagram Clone — Express + React Native

Run project locally

  1. Add file .env into server folder with config
PORT=YOUR_PORT
GOOGLE_ACCOUNT="YOUR_GOOGLE_ACCOUNT"
SENDGRID_API_KEY="YOUR_SENDGRID_API_KEY"
JWT_SECRET="YOUR_JWT_SECRET"
PRISMA_ENDPOINT=YOUR_PRISMA_ENDPOINT
  1. Install all dependencies with npm install or yarn in root, client and instaclone-app folders

  2. Configure your prisma account; in root directory put prisma.yml

endpoint: YOUR_ENDPOINT
datamodel: datamodel.prisma

generate:
  - generator: javascript-client
    output: ./generated/prisma-client/
  1. Install globally nodemon, prisma and expo-cli packages

  2. Run yarn prisma

  3. Install node_modules in client folder

  4. Run yarn serve:web for web or yarn serve:app for mobile (you can also run yarn serve if you want to view all platforms)

  5. If you want to upload images - you need to sign in Amason Web Services (I used free trial aws account and S3 bucket) and put your settings to .env like

....
AWS_KEY="YOUT_AWS_KEY"
AWS_SECRET="YOUR_AWS_SECRET"
AWS_BUCKET_NAME="YOUR_AWS_BUCKET_NAME"

Preview Preview

Graphql resolvers

  • Create an account
  • Request Secret
  • Confirm Secret (Log In)
  • Like / Unlike the photo
  • Comment on a photo
  • Search by user
  • Search by location
  • Follow / Unfollow User
  • Edit my profile
  • See user profile
  • See my profile
  • See the full photo
  • Upload a photo
  • Edit the photo (Delete)
  • See the feed
  • Send private Mesage
  • See rooms
  • See room
  • Receive Meesage (Realtime)