Giter VIP home page Giter VIP logo

react-twitter-clone's Introduction

streamer

streamer is a Twitter Clone built with Stream Feeds and the React Feeds SDK:

Preview of built clone

Quick Links

What is Stream?

Stream allows developers to rapidly deploy scalable feeds and chat messaging with an industry-leading 99.999% uptime SLA guarantee. With Stream’s chat components, developers can quickly add chat to their app for a variety of use-cases:

  • Livestreams like Twitch or Youtube
  • In-Game chat like Overwatch or Fortnite
  • Team style chat like Slack
  • Messaging style chat like Whatsapp or Facebook’s messenger
  • Commerce chat like Drift or Intercom

Repo Overview 😎

This repo contains full source code for the Build a Twitter Clone tutorial series on Stream's blog.

Supported functionalities in this clone include:

  • Sign in using different user accounts
  • Create tweets
  • React to tweets (like and comments)
  • Follow users
  • Notifications for reactions and follows

Requirements πŸ› 

  • Register and create a Stream app (you can call it streamer or whatever you want)
  • Install Node v16.13.1 (16.13.1 is the version used for this project)

Steps to Run Locally πŸ§‘β€πŸ’»πŸ‘©β€πŸ’»

  • Clone this repo:

    git clone https://github.com/GetStream/react-twitter-clone
  • Install dependencies:

    npm install
    ## or
    yarn
  • Add the API key and APP ID of your Stream app to src/App.js, line 15 and 16

  • Using your API key and API Secret, generate user tokens for all users in users.js and replace the token property accordinly

  • Create three feed groups on your Stream dashboard for your app:

    • timeline feed group of flat type
    • user feed group of flat type
    • notification feed group of notification type
  • Start server:

    npm run start

Your Twitter clone will be live on localhost:3000 and you can begin experimenting the functionalities or adding yours 😁

Kindly leave a star on the React Feeds SDK if you enjoyed the result of the tutorial 😁

react-twitter-clone's People

Contributors

dillionmegida avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    πŸ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. πŸ“ŠπŸ“ˆπŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❀️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.