Skip to content

A Facebook Thread clone with MERN backend made with REST Apis.

Notifications You must be signed in to change notification settings

GohilMahendra/Thread-Rest

Repository files navigation

Threads

A full stack clone of Meta Threads. It have some mixed functionality like comment from instagram, grid images from twitter

Requirments

  • Node
  • React Native
  • FFMpeg(if not it's fine it will be installed with npm)
  • Xcode

Installation

React Native

Make sure you have Node.js and npm installed on your machine. If not, you can download and install them from here.

  1. Clone the repository:

    git clone https://github.com/GohilMahendra/Thread-Rest.git
    cd Thread-Rest
    
  2. Install libraries

    yarn
    
  3. Install pods

       cd ios
       pod install

Node Server

  1. install libraries
    yarn
    
  2. setup ENV file
  • MONGO_URL = your-db-uri
  • MAILER_PASS = your-mailer-password
  • MAILER_EMAIL = your-mailer-mail
  • AWS_ACCESS_KEY = aws-access-key-for-storage-access
  • AWS_SECRET_ACCESS_KEY = aws-secret-key-for-storage-access
  • AWS_S3_BUCKET_NAME = aws-bucket-name
  • AWS_REGION = aws-region-name
  • TOKEN_SECRET = token-secret-for-sign-jwt
  1. use this command to run on nodemoon
    yarn dev
    

Atlas search indexes

  • UserSearch (username,fullname) User Schema
    "mappings": {
     "dynamic": false,
     "fields": {
       "fullname": [
         {
           "type": "stringFacet"
         },
         {
           "type": "string"
         },
         {
           "foldDiacritics": false,
           "maxGrams": 7,
           "minGrams": 3,
           "tokenization": "edgeGram",
           "type": "autocomplete"
         }
       ],
       "username": [
         {
           "type": "stringFacet"
         },
         {
           "type": "string"
         },
         {
           "foldDiacritics": false,
           "maxGrams": 7,
           "minGrams": 2,
           "tokenization": "edgeGram",
           "type": "autocomplete"
         }
       ]
     }
    }

}

  • ContentSeach (post content full text search) Post Schema
    "mappings": {
    "dynamic": false,
    "fields": {
      "content": [
        {
          "type": "stringFacet"
        },
        {
          "type": "string"
        },
        {
          "foldDiacritics": false,
          "maxGrams": 7,
          "minGrams": 2,
          "tokenization": "edgeGram",
          "type": "autocomplete"
        }
      ]
    }
    }
    

}

Tech Stack

fronend

  • React-Native
  • Typescript
  • Redux-Toolkit
  • React-navigation v6
  • reanimated v2
  • Socket.io client

backend

  • MongoDB
  • Node.js
  • Express.js
  • Aws s3
  • JWT statless
  • Typescript
  • Socket.io

Features

Auth

  • Otp Email verification
  • JWT token used for statless authentication
  • Password is hashed using bcypt

Posts

  • create a post (post can be simple text , photo or a video same as twitter)
  • delete Post (only owner action)
  • like a post
  • comment on post
  • repost the other posts (same as twitter retweet without or with qoute)

Favorites

  • section dadicated to user activities
  • user can see all posts which liked by him
  • user can see all posts on which he commented along with the comment
  • user can get all list of followings, he can unfollow if want to directly from list

Pagination

  • all lists in app have pagination applied.
  • cursor pagination is implemented as mongodb is nosql database
  • cursor pagination runs fine in times of previous posts deletion before loading or new additions (removes case of duplicate posts)
  • post id as offset is used along with created time for sort posts

Followers

  • follow user
  • unfollow user
  • get following posts
  • get list of follwings
  • get into the user profile by pressing on user

Replies

  • comment on post, inspired by instragram comment section (diffrent from traditional)
  • get posts in which you replies
  • for the replied posts you can again do like,repost and comment

Messaging

  • send message to user in real time
  • message can be text or media (audio/video)
  • real time unread-counts, new convesations added
  • can check typing status and message of sender before it actually sends it

Screenshots

Dark Mode

Settings Dark Mode Settings logout Sign In
Screenshot 1 Screenshot 2 Screenshot 3
Sign Up Delete Thread User Profile
Screenshot 1 Screenshot 2 Screenshot 3
Following Comment 1 Comment 2
Screenshot 1 Screenshot 2 Screenshot 3
Comment 3 Favorites -Reply Favorites -Reply Delete
Screenshot 1 Screenshot 2 Screenshot 3
Favorites -liked Follwing Favorites -follwings
Screenshot 1 Screenshot 2 Screenshot 3
Full Text search 1 Full Text search 2 Full Text search 3
Screenshot 1 Screenshot 2 Screenshot 3
Profile 01 Profile 02 Create Thread
Screenshot 1 Screenshot 2 Screenshot 3
Profile Posts User Profile Posts Video Player
Screenshot 1 Screenshot 2 Screenshot 3
Real-Time Chat 1 Real-Time Chat 2 Real-Time Chat 3
Screenshot 1 Screenshot 2 Screenshot 3

Light Mode

Sign In Sign Up Feed1
Screenshot 1 Screenshot 2 Screenshot 3
Feed2 Feee3 Feed4
Screenshot 1 Screenshot 2 Screenshot 3
Repost User Posts Comments
Screenshot 1 Screenshot 2 Screenshot 3
Add Comment Feed5 UserProfile
Screenshot 1 Screenshot 2 Screenshot 3
Qoute Post Qoute Post 2 Search
Screenshot 1 Screenshot 2 Screenshot 3
Full Text search 1 Full Text search 2 Full Text search 3
Screenshot 1 Screenshot 2 Screenshot 3
Create Threads User Profile Edit Profile
Screenshot 1 Screenshot 2 Screenshot 3
User Profile User Profile 2 Favorites
Screenshot 1 Screenshot 2 Screenshot 3
Favorites 2 Favorites 3 Favorites 4
Screenshot 1 Screenshot 2 Screenshot 3
Profile Settings
Screenshot 1 Screenshot 2
Real-Time Chat 1 Real-Time Chat 2 Real-Time Chat 3
Screenshot 1 Screenshot 2 Screenshot 3