Stackoverflow Clone Save

This project is a simplified a full stack clone of Stackoverflow.

Project README

Stackoverflow Clone

This project is a simplified a full stack clone of Stackoverflow. I wrote it to learn more about Nodejs, React/Next, pixel perfect design and NoSQL databases in general. Feel free to contribute!

:rocket: Tech Stack

  • ReactJs
  • NextJs
  • Storybook
  • PostCSS
  • NodeJs
  • Express
  • MongoDB
  • Mongoose

:warning: Prerequisite

  • node
  • npm
  • mongodb

:cd: How to run local

# Clone this repository
$ git clone https://github.com/salihozdemir/stackoverflow-clone

# Go into the repository
$ cd stackoverflow-clone

# Go into server
$ cd server

# Start mongodb locally
$ mongod

# Install dependencies
$ npm install

# Start the backend server
$ npm run dev

# On another terminal, go to the client folder
$ cd ../client

# Install dependencies
$ npm install

# Use the command below for Android devices
$ npm run dev

# To see the incomplete storybook components
npm run storybook

:mag_right: Testing

Make sure mongodb is running before testing the server.

$ cd server
$ yarn test

There are missing tests on the server side and there are no tests on the client side yet.

:globe_with_meridians: Deploy

Deploying Server App on Heroku

  • You will need to have setup a MongoDB Atlas account and database.

  • Make sure that the cluster has allowlisted connections from anywhere.

  • Create a Heroku new app.

  • Go to app settings

  • Add the following enviroments.

    • DATABASE_URL (to use your MongoDB connection string)
    • JWT_SECRET
  • Add Nodejs to buildpacks

  •   # Go into the repository
      $ cd stackoverflow-clone
    
      # Heroku Setup
      $ npm install -g heroku
      $ heroku login
      $ heroku git:remote -a your-app-name
    
      # push subdirectory repository with subtree
      $ git subtree push --prefix server heroku master
    

Deploying Client App on Vercel

  • Deploy with Vercel

  • Select client directory

  • Add heroku api url to SITE_NAME enviorement

  • Finally deploy client application

:scroll: Todo

  • Add missing components to storybook
  • Complete missing server tests
  • Add text editor for post

:memo: License

This project is made available under the MIT License.

Open Source Agenda is not affiliated with "Stackoverflow Clone" Project. README Source: salihozdemir/stackoverflow-clone

Open Source Agenda Badge

Open Source Agenda Rating