Quora Clone : How to build Full Stack Quora Clone

Code With Akky
3 min readFeb 1, 2021

--

Hello Coding Aliens, How are you doing guys? Welcome back to another blog. But this time something interesting and unique blog em writing about. We will see how you can build a Full stack Quora by yourselves. I’m done with my youtube tutorial for the same tutorial. If you’ve watched the video yet don’t worry I will embed the video in the blog. You don’t need to go anywhere.

Now its time to talk about the build and the technology we are using to build this project. So here is the list of all the technologies —

  1. React — for Front End
  2. Redux — for State Management Tools
  3. Firebase — for Back End
  4. Material-UI — for Icons

This project is bootstrapped with CREATE-REACT-APP and redux template.

Step #1: Project initialization and configuration

You guys have to open the terminal of Visual Studio Code and fire the command. npx create-react-app quora-clone — template redux. It will generate the boiler plate react project from where you can start building your dream project.

Step #2: Installing dependencies

Here is the least of dependencies you guys have to install from the terminal using npm .

  1. @material-ui/core
  2. @material-ui/icons
  3. firebase
  4. react-flip-move
  5. react-modal

To install these dependencies you have to fire the command npm install *dependencies name*

Step #3: Start Building the Components

We will build the functional components and will implement the concept of HOOKS to achieve the full fledged UI and Functionality.

To generate the snippets of functional component inside the Visual Studio Code. You guys have to first install the extension from the marketplace inside the IDE named ES6/REACT/REDUX/GraphQL snippets.

Now build the required component.

ScreenShots

Login Page of Quora Clone
Landing page of Quora clone

For asking the question we will use react-modal popup. And this is the exact code for the modal popup using the react hooks and state.

From this link you guys will get the idea of Modal implementation in react using react-modal.

We will use same thing for answering the question also.

Modal PopUp for the answering the question.

Watch this video tutorial

So here is the final saying in this blog.

Source Code

Get the source code from here

If you like this blog post then follow me here you will get the all the stuffs related to coding, programming and announcement from my YouTube channel.

If you’ve not subscribe my YouTube Channel yet then subscribe and hit the bell icon to never miss any updates.

Till then Do coding and build projects. Have a nice day. Will meet you soon in other blog with different projects.

Bye Bye

--

--

Code With Akky
Code With Akky

Written by Code With Akky

Founder of Code With Akky | Full Stack Developer | YouTuber | Blogger |

Responses (2)