/stackoverflow_Mongo

Primary LanguageJavaScriptMIT LicenseMIT

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!

🚀 Tech Stack

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

⚠️ Prerequisite

  • node
  • npm
  • mongodb

💿 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

🔎 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.

🌐 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

📜 Todo

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

📝 License

This project is made available under the MIT License.