Makers of all backgrounds are turning to Bubble to build powerful software with our no code toolset. Bubble's visual editor simplifies the process of designing and developing applications of all kinds. Customers have used Bubble to build marketplaces, directories, and even social networks.

This post will walk through the process of using Bubble to build a white labeled version of Quora. Quora is a renowned Q&A platform where users can submit questions or answer those submitted by the community.

Whether you’re looking to build a no code Quora community of your own, or you’re just interested in utilizing some of the core features from the platform, this guide will share how to start building the underlying logic for your product.

Throughout this guide, we’ll highlight how to build the following key features from Quora:

  • User profiles - displaying a user’s info and listing their recent activity
  • A function for users to submit questions to the site
  • Search function for questions - The ability for users to search for specific questions based on a query
  • The ability for community members to submit answers to each question

The steps to build a Quora clone with no code include:

Get Started

To get started, you’ll need to register your free Bubble account. Then you can follow along as we build a no-code Quora clone.

Register your account on Bubble

We also recommend completing our introductory lessons, which will guide you through the step-by-step process of the most common Bubble features. This will help you get a running start when building your Quora clone.

When kickstarting your project, you can choose to start by wireframing your product design, or building the necessary fields within your database.

In this case, we’ll start by using the visual design tool to shape the user-interface of our product. If you’re replicating the Quora platform, some of the core pages you’ll want to include will be:

  • Home page - Including a search bar, a repeating group of community questions, and any relevant navigation menus
  • User profiles - A page where your users can access and update their information
  • A page where users can submit questions
  • A page to host each unique question - This will include the question itself, community answers, and a section for users to contribute new answers

A major feature within Bubble is the ability to send data to a page. This means that you only need to create one generic version of a page that can reflect information about specific users or things from your database.

In the case of your Quora clone, you’ll only need to create one page to host your individual questions. We can then write the necessary logic to display only the relevant content for each question when it’s required (we’ll cover this in more detail soon).

Configuring your database

Once you’ve mapped out the display of your product, you can focus on creating the necessary data fields to power your application. We’ll rely on these fields to connect the logic behind your product.

Creating a database in Bubble is a seamless process. Start by listing your top-level data types, then add the necessary fields within each category.

When replicating Quora as an MVP, we’ll need to create the following data types & fields:

Data Type: User
Fields:

  • Name
  • Bio
  • Photo
  • Credentials/title
  • Submitted questions - Note: Creating a list based on an overall data type will allow you to seamlessly integrate all of its relevant data fields without having to create additional field values.
  • Submitted answers
Bubble No Code Quora Clone User Data Type Fields

Data Type: Submitted Questions
Fields:

  • Question title
  • Question content
  • Category
  • Answers
Bubble No Code Quora Clone Question Data Type Fields

Data Type: Answers
Fields:

  • Original question
  • Answer content

Note: Bubble will automatically pull data about the creator of any new ‘things’ created in your database. This will allow you to seamlessly build on top of  a creators specific data like their name, profile photo, etc.

Bubble No Code Quora Clone Answer Data Type Fields

Building logic

Now that you’ve structured both the design and database for your application, it’s time to start stitching everything together and making your product functional.

In Bubble, the main way to do this is with “workflows.” Each workflow happens when an “event” occurs (e.g. a user clicks on a button), and then runs a series of “actions” in response (e.g. “sign the user up,” “make a change to the database,” etc.)

Creating a user account

Let’s start by building the logic that enables a user to first create a new profile. Within Bubble, we’ve made this process as intuitive as possible.

Once you’ve created a dedicated login page, it’s possible to reuse elements from our existing library. Within the page dropdown, select the login/sign-up element.

Bubble login signup element

You can easily copy the element template from this page onto your own account register page.

By using the input fields provided, you can then create a workflow that triggers when a user clicks the sign up button.

Bubble Signup Edit Workflow

Within your workflow editor, you’ll then select to sign the user up.

Bubble Signup Action Walkthrough

From here, you’ll then match the input fields from the on-page elements with the necessary fields to create a users profile.

Bubble sign user up action inputs tutorial

Just like that, a new user profile is added to your platform. You can even select to remember the user and send them an automated confirmation email.

Updating user profile details

Once a user has created a new account, they may also need to update their full details, including; their name, profile photo, and bio.

By creating a dedicated profile settings page, we can use additional input fields to add this data into a users profile.

Once a user has added their relevant details within each input, they’ll click the submit button to update this data.

Update Button Quora Bubble Workflow

Using the workflow editor, you can select to make changes to a thing within your database upon this action.

Bubble Update Button Workflow

In this instance, you’ll want to make changes to the relevant inputs within your database. Start mapping each data field you’d like to change against each of the relevant inputs.

Bubble No Code User Workflow Tutorial

Now, when the ‘update profile’ button is pressed, it will update all of the relevant fields with any new values.

Additionally, you can now display this data on a user’s profile by using elements that match the data fields provided.

Creating a question

One of Quora’s core features is the ability for users to create and publish new questions. The workflow that powers user-generated posts will also follow a familiar structure to the profile editing function, only this time, you’ll want to create a new thing within your database.

On the question submission page, you’ll trigger a workflow when the ‘submit’ is pressed.

Bubble No Code Quora Clone Submit Button Workflow

You’ll then create a new thing within your database, with data type set to ‘submitted questions’.

Submit Button Bubble Actions

Once again, you’ll match the relevant fields necessary to structure your post.

Bubble Questions Submit Button Values

Display dynamic content in a feed

Once you’ve started generating question submissions, it’s time to start writing the logic on your home page to display these as a dynamic list. This can be achieved by utilizing our repeating group element.

Repeating groups integrate with your database to display and update a list of dynamic content.

When using a repeating group, you’ll need to first link the element to a data type within your database. In this instance, you’ll classify the type of content as ‘submitted questions’.

You’ll also need to set the data source as a list of all the submitted questions from your database.

Bubble Repeating Group Workflow

Now you’re ready to start structuring the dynamic content that will be displayed within the grid. Simply map out the top column with the relevant content you’d like to show, then this powerful element will populate the remaining columns based on your existing data.

Bubble Quora Dynamic Content Flow

Within a repeating group, it’s also possible to create events based on each individual row.

This feature will become useful when building navigational features across your platform. Quora’s homepage only displays a feed of questions, including their description and the creator. It doesn’t, however, display the full list of answers until a user clicks-through to the full question page. This additional content will need to be hosted on your ‘question page’ for each unique submission.

To achieve this event, you’ll need to start by creating a workflow that redirects a user to your question page when the questions title is clicked.

Bubble Quora No Code Question Workflow

When creating this workflow, use a navigation event to send a user to another page. From here, select the destination page type to be the question (posted) page.

You’ll then need to send additional data to this page so the Bubble editor knows which specific question to display. The data you’ll need to display is that of the current cells question.

Bubble Quora No Code Question Workflow

Display dynamic content on a questions page

When someone is directed to a specific answer page, you can easily pull this event data and display the relevant content for each question.

In order to build this function, you’ll first need to ensure that the destination page type matches the data property that you’re sending within the workflow. In this case, you’ll need to set the ‘answers page’ to a questions (posted) property.

Bubble Quora No Code Question Answer Workflow

By classifying the type of content of a page, Bubble can easily pull and send relevant data from existing sources.

You can now start adding dynamic content into the fields that display information from a particular question.

Bubble Quora No Code Question Answer Workflow

Submitting and displaying answers

On the page that displays the full question with its existing answers, you’ll also need to add an additional field that allows users to publish new submissions.

Bubble Quora No Code Submit Answer Workflow

Contributing an answer to a question follows the same process of creating a new question itself - only this time, you’ll need to create a new answer, ensuring you properly integrate it with the current question at hand.

Bubble Quora No Code Create Answer Workflow

On your answer page, both the list of answers and the input fields to submit an answer will be stacked on top of each other. When a user submits their own answer, this repeating group will update in real-time to match your database.

Searching for questions

To allow users to search and click-through to a specific question, you can utilize a search element on your home page that will index all of the current questions in your database.

By selecting the search field as ‘question title’ it will index all entries and even offer search suggestions as they’re typed.

Bubble Quora No Code Search Answer Workflow

To send a user to the relevant question page, navigate to your workflow editor, then create a new event that is triggered when the value of an input is changed.

Bubble Quora No Code Search Answer Workflow Tutorial

You’ll then create a navigation event, setting the destination page as your answer page, and sending the data source of the search box’s current value.

Bubble Quora No Code Search Answer Workflow Walkthrough

Additional features

Once you’re familiar with creating custom data fields and displaying dynamic content, you can start getting creative with the experiences you build.

Privacy & Security: Now that you have the basics of your app, don't forget to start setting some privacy rules and conditionals to keep your data secure - starting with roles in the 'Privacy' section of your Data tab. You can also check if you're unintentionally exposing any data with an API checker.

Additionally, you can:

  • Include additional content fields within questions - photos & video
  • Create groups for topical interests
  • Upvote and downvote for answers

Launch

Hiring a developer or dev team to build this app would cost thousands, if not tens-of-thousands of dollars. Well, now you can treat yourself to a vacation, because you can build and launch your app in Bubble for free.

As you launch and grow in users, paid plans allow you to host the app on your own custom domain, and these start as low as $25 per month. Some templates and plugins may cost more, but you can build all the functionality of a forum without any additional costs.

Templates

If you don’t want to build your Quora clone from scratch, you can purchase one of the templates made by our community members. Some similar templates to Quora include:

Start Building

Bubble can help you build a Quora clone or any other product you choose! It’s never been easier to build something incredible without having to code.

To get started for free, sign up here.

You can also connect with other passionate makers building with Bubble on our community forum.

Bubble-CTA@2x-3