# Homeo - Real Estate Marketplace

***

## Intro

<figure><img src="/files/gB3uGhHckHvc8yJ6VfzI" alt=""><figcaption></figcaption></figure>

## Links

🖥️[ Preview link](https://homeotemplatecopy.bubbleapps.io/)

🌐[ Template page on Bubble Marketplace](https://bubble.io/template/real-estate-marketplace-1649762386069x607944019303465000)

***

## Screenshots

<div align="center" data-full-width="false"><figure><img src="/files/cUPAw9kU1fyK4nCrUGjf" alt=""><figcaption><p>Index page</p></figcaption></figure> <figure><img src="/files/17n7MRVSlu9nWnwD6j36" alt=""><figcaption><p>Features</p></figcaption></figure> <figure><img src="/files/oVEmyYM9hZahB3VbxaZ8" alt=""><figcaption><p>Properties page</p></figcaption></figure> <figure><img src="/files/LtNmG7uO3Ms0qK1PMN9L" alt=""><figcaption><p>Agents page</p></figcaption></figure> <figure><img src="/files/gtcmYHGBmXRPQQByOuTe" alt=""><figcaption><p>About us</p></figcaption></figure> <figure><img src="/files/EZ55YcujA93AzzugrJt2" alt=""><figcaption><p>Profile page</p></figcaption></figure></div>

***

## Template details

Homeo is a template that is perfect for someone who wants to open their own real estate agency for renting or selling real estate. This #nocode template which allows the administrator to publish an existing property, and the user to select what is already there and apply to view the selected property.

Homeo template features the following:&#x20;

✅ Responsive design \
✅ Signup/Login \
✅ Admin dashboard \
✅ User dashboard \
✅ Create and edit the property \
✅ Add and edit the agents \
✅ Assigning existing real estate to agents \
✅ Apply to view property \
✅ Reviewing received applications

We tried to keep all the workflows and design architecture simple for beginner-intermediate users to use and adjust. However, we recommend having at least moderate experience with Bubble to be able to fully use and edit the app’s backend.&#x20;

If you need any assistance to customize this template for your personal or business project, feel free to reach out to our team via <dev@appassion.io>.&#x20;

We are always there to help build new products and mobile/web applications. We hope this template would become a great starting point for your project.

{% hint style="warning" %}
*<mark style="color:red;">**Removing the banner**</mark>*

*<mark style="color:red;">**1. Open the app in Bubble editor**</mark>*&#x20;

*<mark style="color:red;">**2. Go to settings -> SEO/Metatags**</mark>*&#x20;

*<mark style="color:red;">**3. Remove the content of "Script in the body"**</mark>*
{% endhint %}

***

## User flows&#x20;

**Main user flow:**&#x20;

-> Sign up/login -> Property search -> View property description -> Apply to view property -> Review of applications submitted

***

## Key features

<table data-view="cards"><thead><tr><th></th><th align="center"></th><th></th><th data-hidden data-card-cover data-type="files"></th><th data-hidden data-type="checkbox"></th></tr></thead><tbody><tr><td></td><td align="center"><mark style="color:orange;"><strong>PROPERTY LISTINGS</strong></mark></td><td></td><td></td><td>true</td></tr><tr><td></td><td align="center"><mark style="color:orange;"><strong>ADVANCED SEARCH FILTERS</strong></mark></td><td></td><td></td><td>false</td></tr><tr><td></td><td align="center"><mark style="color:orange;"><strong>INTERACTIVE MAPS</strong></mark> </td><td></td><td></td><td>true</td></tr><tr><td></td><td align="center"><mark style="color:orange;"><strong>VIRTUAL TOURS</strong></mark> </td><td></td><td></td><td>true</td></tr><tr><td></td><td align="center"><mark style="color:orange;"><strong>BOOKING AND INQUIRY</strong></mark> </td><td></td><td></td><td>true</td></tr><tr><td></td><td align="center"><mark style="color:orange;"><strong>SYSTEM USER PROFILES AND FAVORITES</strong></mark></td><td></td><td></td><td>false</td></tr></tbody></table>

## Homeo Overview | Starter tips&#x20;

Based on your commonly asked questions we've prepared a list of basic tips, for those who are just starting on Bubble and want to find your way around in the project for you dream project.

For any questions feel free to leave a comment or reach out to us via <dev@appassion.io>

## Workflows&#x20;

### Primary colors and their purposes

### **Green**

Emphasizes actions related to creating or modifying records in the database, indicating successful operation completion.

**For example:**

{% tabs %}
{% tab title="Example 1" %}

<figure><img src="/files/cN17LaPlPtvsTnOaisa3" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="Example 2" %}

<figure><img src="/files/wCtrP0hVgYCQgf1jsI3Y" alt=""><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}

### **Red**

Designated for actions involving deletion or resetting of values, aiding users in quickly identifying them.

**For example:**

{% tabs %}
{% tab title="Example 1" %}

<figure><img src="/files/45qjebDaS2tKRneZxTvb" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="Example 2" %}

<figure><img src="/files/2Byh4UotFU46Wfae0LuM" alt=""><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}

### **Blue**

Reserved for actions that do not impact application resources, such as opening or closing pop-up windows.

**For example:**

{% tabs %}
{% tab title="Example 1" %}

<figure><img src="/files/9j5e8vLFVSA55z1DxGCo" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="Example 2" %}

<figure><img src="/files/5uTF8EDYiQciVlsn0r4u" alt=""><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}

### **Orange**

Used for actions related to app navigation, providing ease of orientation within the interface.

**For example:**

{% tabs %}
{% tab title="Example 1" %}

<figure><img src="/files/Vc1kKa0iRs6rHxZIc5U7" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="Example 2" %}

<figure><img src="/files/8b8KmzAHaWvNKqZiRBNV" alt=""><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}

### **Brown**

&#x20;Utilized for custom workflows and API work, highlighting these actions among others.

**For example:**

{% tabs %}
{% tab title="Example 1" %}

<figure><img src="/files/HpL5LDwxtjWj1LWa1V8D" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="Example 2" %}

<figure><img src="/files/3RwL8doXvgIPjqHnncm8" alt=""><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}

### **Purple**

Left to the developer's discretion for assigning color to actions as they see fit.

**For example:**

{% tabs %}
{% tab title="Example 1" %}

<figure><img src="/files/rtsJzGpVhUjvZ9PYzoAQ" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="Example 2" %}

<figure><img src="/files/Hi71nXpemYyfKJUP4iC1" alt=""><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}

### **Cyan**

&#x20;**I**ntended for actions involving the use of Custom Events, ensuring ease of perception for complex operations.

**For example:**

{% tabs %}
{% tab title="Example 1" %}

<figure><img src="/files/R4w6uTXL9aVb0Zso0Px6" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="Example 2" %}

<figure><img src="/files/4ER96y7w32854vk1JAMB" alt=""><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}

### **Grey**

Employed for all other actions not covered by other colors, aiding in making the interface clear and balanced.

For example:

{% tabs %}
{% tab title="Example 1" %}

<figure><img src="/files/Bdeyz6IBSXQhnU4PLnrt" alt="" width="352"><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}

{% hint style="warning" %}
These standards are purely recommendations. Possible discrepancies do not affect the functionality of the application.
{% endhint %}

***

## Pages

*Below, you will find a list of all the pages available on this platform, along with a brief description of their functionality.*

\ <mark style="color:orange;">**Index:**</mark> Explore our landing page for insights on the template, featuring descriptions, a company directory and useful information.

<mark style="color:orange;">**Agents page:**</mark> Contain information about all agents who have registered on the site.

<mark style="color:orange;">**Log In:**</mark> This is the page where you can log in.

<mark style="color:orange;">**User Dashboard:**</mark> A user dashboard providing essential and up-to-date information.

* Information about your account where you can edit and change something information.
* Your favorite properties that you watched and liked.
* Requests with all the necessary information about property and agent.
* The offer we offer based on your choices and interests.

<mark style="color:orange;">**Properties:**</mark> The most important page where all the properties are located with all the information and the ability to use filters to show only those properties that you need.

<mark style="color:orange;">**Register page:**</mark> This is the page where you can register.

<mark style="color:orange;">**Update Email:**</mark>This is the page where you can update email.

<mark style="color:orange;">**About Us:**</mark> on this page you can see information about us and you can also contact us.

<mark style="color:orange;">**Reset Password:**</mark> This is the page where you can reset password.

<mark style="color:orange;">**Admin Dashboard:**</mark> A admin dashboard providing essential and up-to-date information about properties, agents and users where you can change or delete it.

<mark style="color:orange;">**Agent page:**</mark> This page was created for agents where you can see all the necessary information about their properties that they trade.

<mark style="color:orange;">**Product page:**</mark> On this page you can find all the information you have about properties.

<mark style="color:orange;">**Privacy Policy:**</mark> This is the page where you can reset password.

<mark style="color:orange;">**Send Update Password:**</mark> This is the page where you can send update password.

<mark style="color:orange;">**Terms Conditions:**</mark> This is the page where you can watch terms conditions.

<mark style="color:orange;">**Update Password:**</mark> This is the page where you can update password.

***

## Reusable elements

1. **Header** - the top part of a web page containing the logo, application name, navigation elements, and other important components. <mark style="color:orange;">Found on all application pages.</mark>
2. **Footer** - a section at the bottom of a web page containing additional information such as contacts and links. <mark style="color:orange;">Found on all application pages.</mark>

***

## Data Types

### Advertisement

This data type is designed for storing all advertisement related information.

| Field name  | Type    | Notes               |
| ----------- | ------- | ------------------- |
| `Body text` | `Text`  | Advertisement text  |
| `Image`     | `Image` | Advertisement image |
| `Main Text` | `Text`  | Advertisement title |

### Agent

This data type is designed for storing all agent related information.

| Field name       | Type                                    | Notes                   |
| ---------------- | --------------------------------------- | ----------------------- |
| `Description`    | `Text`                                  | Agent description       |
| `Dribble Link`   | `Text`                                  | Agent dribble           |
| `Email`          | `Text`                                  | Agent Email             |
| `Facebook Link`  | `Text`                                  | Agent facebook          |
| `Fax`            | `Text`                                  | Agent fax               |
| `Image`          | `Image`                                 | Agent image             |
| `Inlink Link`    | `Text`                                  | Agent inlink            |
| `Job`            | [`Agent Job`](#agent-job)               | Agent job               |
| `Message`        | `List of` [`Messages`](#message)        | Agent messages          |
| `Name`           | `Text`                                  | Agent  name             |
| `Overview`       | `Text`                                  | Agent overview          |
| `Phone`          | `Text`                                  | Agent phone             |
| `Property Count` | `Number`                                | Agent properties number |
| `Proprietes`     | `List of` [`Propertieses`](#properties) | Agent properties        |
| `Role`           | [`Usertype`](#usertype)                 | Agent role              |
| `Twitter Link`   | `Text`                                  | Agent twitter           |
| `User`           | `User`                                  | Agent user type         |
| `Website`        | `Text`                                  | Agent website           |

### Agent Job

This data type is designed for storing all agent job related information.

| Field name | Type   | Notes          |
| ---------- | ------ | -------------- |
| `Name`     | `Text` | Agent job name |

### Articles

This data type is designed for storing all articles related information.

| Field name | Type    | Notes         |
| ---------- | ------- | ------------- |
| `Image`    | `Image` | Article image |
| `Name`     | `Text`  | Article name  |

### Cities

This data type is designed for storing all cities related information.

| Field name    | Type    | Notes             |
| ------------- | ------- | ----------------- |
| `Logo`        | `Image` | Cities logo       |
| `Name`        | `Text`  | Cities name       |
| `Proprieties` | `Text`  | Cities properties |

### Looking For

This data type is designed for storing search related information.

| Field name    | Type    | Notes              |
| ------------- | ------- | ------------------ |
| `Description` | `Text`  | Search description |
| `Icon`        | `Image` | Search icon        |
| `Title`       | `Text`  | Search title       |

### Message

This data type is designed for storing all message related information.

| Field name | Type                        | Notes            |
| ---------- | --------------------------- | ---------------- |
| `Agent`    | [`Agent`](#agent)           | Agent message    |
| `Property` | [`Properties`](#properties) | Agent properties |

### Partners

This data type is designed for storing all information related to partners.<br>

| Field name | Type    | Notes         |
| ---------- | ------- | ------------- |
| `Logo`     | `Image` | Partners logo |

### Properties

This data type is designed for storing all properties related information.<br>

| Field name    | Type                                                    |                              |
| ------------- | ------------------------------------------------------- | ---------------------------- |
| `Address`     | `Text`                                                  | Properties address           |
| `Agent`       | [`Agent`](#agent)                                       | Properties agent             |
| `Amenities`   | `List of` [`Property Amenitieses`](#property-amenities) | Properties amenities         |
| `Bath`        | [`Property Baths`](#property-baths)                     | Properties baths number      |
| `Beds`        | [`Property Beds`](#property-beds)                       | Properties beds number       |
| `Description` | `Text`                                                  | Properties description       |
| `Favorit`     | `List of` [`Users`](#user)                              | Users who like properties    |
| `Featured`    | `Yes/No`                                                | Properties feature           |
| `Floor`       | [`Property Floor`](#property-floor)                     | Properties tie floors number |
| `Garage`      | [`Property Garage`](#property-garage)                   | Properties garage number     |
| `Guests`      | [`Property Guests`](#property-guests)                   | Properties guests number     |
| `Home Area`   | `Number`                                                | Properties area              |
| `Images`      | `List of Images`                                        | Properties images            |
| `Location`    | `Geographic address`                                    | Properties location          |
| `Name`        | `Text`                                                  | Properties name              |
| `Overview`    | `Text`                                                  | Properties overview          |
| `Photo`       | `Image`                                                 | Properties photo             |
| `Price`       | `Number`                                                | Properties price             |
| `Regions`     | [`Property Regions`](#property-region)                  | Properties region            |
| `Rooms`       | [`Property Rooms`](#property-rooms)                     | Properties rooms number      |
| `Status`      | [`Property Status`](#property-status)                   | Properties status            |
| `Type`        | [`Property Type`](#property-type)                       | Properties type              |

### Property Amenities

This data type is designed for storing property amenities related information.<br>

| Field name | Type     |                  |
| ---------- | -------- | ---------------- |
| `Icons`    | `Image`  | Amenities icons  |
| `Name`     | `Text`   | Amenities name   |
| `Select`   | `Yes/No` | Amenities status |

### Property Baths

This data type is designed for storing all property baths related information.

| Field name |          |                       |
| ---------- | -------- | --------------------- |
| `Number`   | `Number` | Property baths number |

### Property Beds

This data type is designed for storing all property bed related information.

| Field name |          |                      |
| ---------- | -------- | -------------------- |
| `Number`   | `Number` | Property beds number |

### Property Floor

This data type is designed for storing all property floor related information.

| Field name |          |                        |
| ---------- | -------- | ---------------------- |
| `Number`   | `Number` | Property floors number |

### Property Garage

This data type is designed for storing all property garage related information.

| Field name |          |                         |
| ---------- | -------- | ----------------------- |
| `Number`   | `Number` | Property garages number |

### Property Guests

This data type is designed for storing all property guests related information.

| Field name |          |                        |
| ---------- | -------- | ---------------------- |
| `Guests`   | `Number` | Property guests number |

### Property Region

This data type is designed for storing all property region related information.

| Field name    |        |                      |
| ------------- | ------ | -------------------- |
| `Region Name` | `Text` | Property region name |

### Property Rooms

This data type is designed for storing all property rooms related information.

| Field name |          |                       |
| ---------- | -------- | --------------------- |
| `Number`   | `Number` | Property rooms number |

### Property Status

This data type is designed for storing all property status related information.

| Field name |        |                             |
| ---------- | ------ | --------------------------- |
| `Status`   | `Text` | Property status description |

### Property Type

This data type is designed for storing all property type related information.

| Field name |        |                           |
| ---------- | ------ | ------------------------- |
| `Type`     | `Text` | Property type description |

### Subscribes

This data type is designed for storing all subscribe related information.

| Field name |        |                 |
| ---------- | ------ | --------------- |
| `Email`    | `Text` | Subscribe email |

### User

This data type is designed for storing all user related information.

| Field name   |                         |                        |
| ------------ | ----------------------- | ---------------------- |
| `Agent`      | [`Agent`](#agent)       | User agent             |
| `Demo Admin` | `Yes/No`                | User demo admin status |
| Demo User    | `Yes/No`                | User demo user status  |
| Image        | `Image`                 | User image             |
| Name         | `Text`                  | User name              |
| Phone        | `Number`                | User phone             |
| Usertype     | [`Usertype`](#usertype) | User type              |
| Email        | `Text`                  | User email             |

### User Type

This data type is designed for storing all property user type information.

| Field name |          |                |
| ---------- | -------- | -------------- |
| `Id`       | `Number` | User type id   |
| `Name`     | `Text`   | User type name |

***

<figure><img src="/files/L41kpROt0hrXuSFOer2z" alt=""><figcaption></figcaption></figure>

The template is available in its current form, however, further alterations can be negotiated.&#x20;

Don't hesitate to reach out to us with any questions, and we'll gladly explore options to accommodate your concepts – Visit us at [<mark style="color:orange;">https://appassion.io/</mark>](https://appassion.io/) or email us at <mark style="color:orange;"><dev@appassion.io></mark>

<mark style="color:orange;">**We are always at your service through:**</mark> [Upwork](< https://www.upwork.com/agencies/1472948949083369472/>), [Clutch](https://clutch.co/profile/appassion#highlights). \ <br>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://appassion.gitbook.io/homeo/homeo-real-estate-marketplace.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.