kirankumargonti/tiktok-clone

TikTok Clone app with MERN ( MongoDB Express React Node ) Stack

TikTok Clone With MERN ( MongoDB Express React Node)

Live Project: https://tiktok-clone-mern-b8cd7.web.app/

Demo Picture

Project Setup

## Quick Start

# Clone the application
$ git clone https://github.com/kirankumargonti/tiktok-clone.git

# Install dependencies
$ npm install

# Serve on localhost:5000
$ npm run dev

1. Backend

• MongoDB Atlas

  • Create an Atlas Account.
  • Deploy a Free Tier Cluster.
  • Whitelist Your Connection IP Address.
  • Create a Database User for Your Cluster.
  • Connect to Your Cluster.

• Add your own MongoURI key to your application

  • Navigate to tiktok-backend directory and add your own cluster MongoURI key to
    • tiktok-backend/config/default.json
    • Example MongoURI key 👇 mongodb+srv://<username>":<password>@clustername.mongodb.net/test?retryWrites=true&w=majority

• Deploying to Heroku

  • Getting Started on Heroku with Node.js

  • Copy the hosting url and Naviagte to to frontend

2. Frontend

• Naviagte to axios.js file which is located in tiktok directory
• src/Components/axios.js
• update baseURL with your heroku application url

    # Install dependencies
    $ npm install

    # Serve on localhost:3000
    $ npm start

    # Build for production
    $ npm run build

• Frontend deployment at firebase
  • Create a Firebase Project

# Install firebase tools
$ npm install -g firebase-tools

# Login to firebase
$ firebase login

# Initialize your firebase project
$ firebase init

# Important Steps
    - Use an existing project
    - What do you want to use as  your public directory?
      build
    - Configure as a single-page app 
      (rewrite all urls to /index.html)? Yes
    - File build/index.html already exists. Overwrite? No

# Deploy to firebase
$ firebase deploy

For more information refer firebase docs

https://firebase.google.com/docs