Skip to content

Latest commit

 

History

History
154 lines (106 loc) · 4.05 KB

README.md

File metadata and controls

154 lines (106 loc) · 4.05 KB
Raw


DEV.to Clone

DEV.to Clone

Netlify Status

forthebadge forthebadge

An DEV.to clone created with MongoDB, Express, React, Node, and Socket.io

Live Site

Backend API

Tech

Features

  • Login / Signup
  • Google / Facebook / Twitter / GitHub OAuth
  • Create / Remove / Update / Delete Post
  • Like / Unicorn / Bookmark Post
  • Reading List
  • Create / Add Tags to Post
  • Follow Tags
  • Find Posts by Tags
  • Comment / Replies
  • Like Comment
  • Edit / Delete Comment
  • View Profile
  • Edit Profile
  • Follow User
  • Search Posts
  • Real-time Notifications
  • Skeleton Loading

How to setup locally

Clone

Clone the repo to your local machine using https://github.com/eknoorpreet/dev.to-clone

Setup

Install npm dependencies in both client and server subdirectories using npm install

$ cd server && npm install
$ cd client && npm install

Set up a MongoDB database either locally or online via MongoDB Atlas

Create a Cloudinary account

Create a new project on Google Cloud Platform

Create a .env file in in both client and server subdirectories

Set up the following environment variables

In client/.env:

REACT_APP_BASE_URL=http://localhost:5000/api
REACT_APP_SOCKET_IO_URL=http://localhost:5000
REACT_APP_GOOGLE_CLIENT_ID=<GOOGLE_CLIENT_ID>
REACT_APP_GITHUB_CLIENT_ID=<GITHUB_CLIENT_ID>
REACT_APP_FB_APP_ID=<FACEBOOK_CLIENT_ID>

In server/.env:

DB_USER = //user name for db
DB_PASSWORD = //password for db
DB_NAME = // name for db
JWT_KEY = //random string
COOKIE_KEY = //random string;
NODE_ENV = 'development';
CLIENT_URL = //the port of React app, ex: 'http://localhost:3000';

//cloundiary will provide you with the following credentials
CLOUDINARY_CLOUD_NAME = //cloud name
CLOUDINARY_API_KEY = //API key
CLOUDINARY_API_SECRET; //API secret

//Google will provide you with the following credentials
GOOGLE_API_KEY = //API key

//Github will provide you with the following credentials
GH_CLIENT_ID = //Github's Client ID
GH_CLIENT_SECRET = //Github's Client Secret

// Twitter will provide you with the following credentials
TWITTER_CONSUMER_KEY = //Twitter's Consumer key
TWITTER_CONSUMER_SECRET = //Twitter's Consumer Secret

Finally, run npm start in both client and server subdirectories

$ cd server && npm start
$ cd client && npm start

Screenshots

Login / Signup

Like / Unicorn / Bookmark

New Post

Comments and Replies

Real-time Notifications

Follow Tags

Edit Profile

Search