Project Report On Real State Web App
Project Report On Real State Web App
A PROJECT REPORT
Submitted by:
Supervised by:
October – 2019
CERTIFICATE
This is certified that the work presented in this thesis on “Real-Estate Web App” is
completed and demonstrated by the following group of students of 16BS(CS) batch
themselves under the supervision of honorable Sir Mr. Muhammad Amir Bhutto.
__________________________ __________________________
Mr. Muhammad Amir Bhutto Dr. Muhammad Saleem Vighio
SUPERVISOR CHAIRMAN
_________________________
EXTERNAL EXAMINER
ii
ABSTRACT
The aim of this project was to build a real estate web application using Django
framework and Postgresql. The programming environment was VS code using the
Python programming language. The real estate system provides functionality for
buyers, allowing them to search for houses. It provides functionality for the seller,
allowing them to log into the system and add new listings or delete existing ones. For
this purpose, each user is provided a login account with login ID and password access.
This web application makes use of Django framework, including web controls, html
controls, custom web controls, CSS, error handling. The programming tasks included
building the customer web controls and deploying these on server.
ii
Acknowledgement
ACKNOWLEDGEMENT
We take this opportunity to express our thoughtful sense of gratitude and respect to all
those who helped us throughout the duration of my project. The beatitude, bliss and
euphoria that accompany the successful completion of any task would not be completed
without the expression of appreciation of simple gratitude to the organization and people
who made it possible.
We are highly indebted to our University for providing us with such a intellectual
platform and support to carry out our project work successfully.
We wish to express out deep sense of gratitude to, Mr. Amir Bhutto, Assistant
Professor, QUEST Nawabshah for his able guidance and useful suggestions, which
helped us in completing the project work, in time.
I express my heartfelt thanks and gratitude to the chairman of the department Prof.
Saleem Vighio, for giving me an opportunity to undertake this project.
Words are inadequate in offering thanks to all my teachers for their constant guidance
and support throughout this project work.
Finally, yet importantly, we would like to express my heartfelt thanks to our beloved
parents for their blessings, out friends for their help and wishes for the successful
completion of this project.
Project Team
Contents
CONTENTS
CERTIFICATE-------------------------------------------------------------------ii
ABSTRACT------------------------------------------------------------------------ii
ACKNOWLEDGEMENT------------------------------------------------------iii
Appendix I: Overview-----------------------------------------------------------------47
A.I.1 Software Specification
A.I.2 Physical Specification
Bibliography ---------------------------------------------------------------------------118
Chapter I: Introduction
1|Page
1.1 Introduction
Modern technology has been industrialized to the extent that even search for land,
apartments is made possible over the internet. The process of searching of dream house
or apartment can be done over the internet. Customer looking to buy or rent a new
home, apartment or any other property can search over the internet.
Customer looking to buy or rent a new home, apartment or any other property can
search over the internet, while sitting at their home. Now customers will not have to go
to the agents personally they can search for their desired home or apartment of a
reasonable rate which suits their pocket.
Customer looking to buy or rent a new home, apartment or any other property
can search over the internet.
They can specify the no of rooms ,bathroom they need and then can make the
search
They can also describe what all facilities they want near their house like schools,
malls, garage, shops etc.
They can search for apartment or plot which suits there budget they can also
specify the amount by entering the cost.
. Now customers will not have to go to the agents personally they can search for
their desired home or apartment of a reasonable rate which suits their pocket.
And they can also have the view of apartment online
2|Page
The application will be a windows-based, self-contained and independent software product.
Retrieve Data
3|Page
BLOCK DIAGRAM
Search property
Contact
Home
User Login
Product &services
Real-estate
website About us
Specialty
Employee Login
Staff
Employee profile
Username & password
Login
View Search property
property
Address
Contact
us Telephone
Update Add new Select
property property the seller Email id
listing listing of month Quick
search
4|Page
1.2 Objectives
5|Page
1.3 Scope of Project
6|Page
1.4 ADVANTAGES
Data collection can be done through various sources like interviews, questionnaire,
Data about the brief description of organization is collected through Internet i.e. through
BTrealstate.com
99 acres.com
Magic bricks.com
Scribd.com
7|Page
1.5.2 DATA COLLECTION THROUGH INTERVIEW
Interview is an easy way to interact with the customer. The objective of conducting an
interview is to understand the customer’s expectations from the software. Are you
Data is also collected by various documents which demonstrate the working of the system
8|Page
Chapter II: Literature Review
9|Page
2.1 Literature Survey
Past studies concerning the relationship between the Internet and real estate can be
classified into a few dominating themes. One direction is how the Internet has become
and continues to be a very important tool for marketing real estate and related services.
Rodriquez, Lipscomb and Yancey (1996) identified four different types of real-estate
related sites, including those that offered both real estate for sale and real estate
services, and provided an extensive list of these sites. Bond, Seiler, Seiler and Blake
(2000) examined the explosive growth of real estate-related websites and determined
the reasons why Ohio real estate brokerage firms did or did not use websites in their
businesses, the information contained in their sites and the technical requirements that
were necessary for maintaining them. Similarly, Muhanna (2000) examined how real
estate firms adapted to the use of the Internet and assessed their perceptions regarding
its potential.
A growing body of literature looks at the effect of the Internet on retail sales,
property and service (e.g., Mander, 1996; Wheaton, 1996; Schwarz, 1997; Borsuk,
1999; Hemel and Schmidt, 1999; Baen, 2000; and Miller, 2000). For example, Baen
and Guttery (1997) examined how the Internet threatened the traditional relationship
among licensees, real estate buyers and sellers, and how these developments would
create savings for real estate consumers. Similarly, Thrall (1998) discussed the
emerging trends and changes in the Internet for other real estate service providers,
including lenders, appraisers and commercial brokers. Baen (2000) examined the
impact of e- commerce on traditional retail sales, as well as its potential impact on
commercial property values and percentage rents. Tse and Webb (2002) studied the
impact of information technology on real estate brokerage in Hong Kong, using
regression models to investigate how page ‘‘views’’on the Internet affect real estate
transactions and commissions. Finally, Lucas (2001) believes that since information
technology facilitated the design of new types of organizations, institutions and
partnering arrangements, its implementation would have second-order effects on
demand for physical space of manufacturing, retailing and offices in the industrialized
world.
In older days when we want purchase a property we can’t directly communicate with
the owners. We must contact with the help of mediators, but the mediators takes lot of
amount and it is also time consuming process. In older days the property dealing
procedure consist of many steps like finding agent, appoint correct meeting time,
location and so on. Up till now there was no Security in Online Real Estate System,
Registration form improves the security by limiting user.
10 | P a g e
2.2 Risks in E-commerce
An expansive list of studies examines the risks in e-commerce transactions (e.g., Jung,
Han and Suh 1999; Hsiung, Scheurich and Ferrante, 2001; and Chan, 2001). One focus
is on how to develop technological methods to deal with these risks. For example,
Skevington (1998) outlined some of the technologies that were developed to address
security concerns and to apply them to facilitate trust in electronic trading. Atif (2002)
described a proposal for a trust web model based on a distributed search algorithm and
a network of trusted intermediaries that can establish a trusted channel through which
terminal transacting parties deal virtually directly and risk-free with each other.
However, the traditional models of trust between vendors and buyers fall short of the
requirements for an electronic marketplace, where anonymous transactions cross
territorial and legal boundaries, as well as traditional value-chain structures. To
overcome this problem, Manchala (2000) introduced a notion of quantifiable trust to
evaluate the transaction risk in such an environment. Another direction of the literature
focuses on the managerial perspective of the
transaction risks of e-commerce. Using case studies, Lee and Clark (1997) presented
suggestions on the analysis, design and implementation of electronic market systems by
market-making firms. Brice (2001) discussed some of the risks and considerations
involved in the use of electronic signatures. Westland (2002) developed a model for
evaluating and managing transaction risk in e-commerce in the migration from broker
mediated to electronic markets.
Stage 1: Property listing. In the past, real estate agents listed houses and entered them
into a Multiple Listing Service (MLS) database. The MLS is today an online network
of properties listed for sale and supported by the NAR. In effect, the MLS created a
cartel-like role in managing information and virtually ensures that the agent will have a
pivotal role in the real estate transaction. However, this situation has since changed
with the introduction of websites in the market that provide property listings. Asurvey
by Muhanna (2000) found that about 23% of real estate agents actually list their
properties on their own websites. In addition, Fletcher (1997) found that their owners
were listing many homes for sale on websites. For example, on Microsoft’s network
system, Home Advisor (www.homeadvisor.msn.com), and national selling services,
such as Abele Owners Network, any seller’s listing can be posted for a nominal fee
(Guttery, Baen and Benjamin, 2000; and Bond, Seiler, Seiler and Blake, 2000).
Stage 2: Buyer search. Although potential buyers can search for homes on their own
through browsing newspaper advertisements or call owners directly, most prospective
buyers generally seek homes through agents that have access to MLS listings.
Nevertheless, buyers can now perform their own searches on the Internet easily. Many
MLS listings can now be reached directly (Aalberts and Townsend, 2002), such as the
11 | P a g e
NAR’s website (www.realtor.com) with more than a million listings. Established real
estate players, such as Coldwell Banker (www.coldwellbanker.com) and Prudential
(www.realbid.com) also have their own listings. Moreover, there are also upstarts doing
the same, including the For-Sale-By-Owner (FSBO) listing and Microsoft’s
Homeadvisor. Finally, some local newspapers provide their own websites
for real estate listings. For example, the Classified Federation, a subsidiary of the
Newspaper Association of America, created www.realfind.com, which is a free service
through which potential buyers may request a copy of the weekend real estate section
of newspapers in major markets and can link directly with the newspaper classifieds via
the Internet
12 | P a g e
Chapter III: Design & Implementation
13 | P a g e
3.1 System Requirements
FRONTEND PAGES
Home
About
Listings
Single Listing
Search
Register
Login
Dashboard (Inquiries)
DESIGN SPECS
FUNCTIONALITY SPECS
Manage listings, realtors, contact inquiries and website users via admin
Role based users (staff and non-staff)
Display listings in app with pagination
Ability to set listings to unpublished
Search listings by keyword, city, state, bedrooms and price (Homepage &
search page)
List realtors on about page with “seller of the month” (Control via admin)
Listing page should have fields listed below
Listing page should have 5 images with lightbox
Lightbox should scroll through images
Listing page should have a form to submit inquiry for that property listing
Form info should go to database and notify realtor(s) with an email
Frontend register/login to track inquiries
Both unregistered and registered users can submit form. If registered, can only
submit one per listing
14 | P a g e
LISTING PAGE FIELDS
Title
Address, city, state, zip
Price
Bedrooms
Bathrooms
Square Feet
Lot Size
Garage
Listing Date
Realtor – Name & Image
Main image and 5 other images
15 | P a g e
DESCRIPTION OF ‘INPUT TO’ AND ‘OUTPUT OF’ OF PROCESSES
16 | P a g e
3.2 System Design
The system objective outlined during the system analysis serve as the basis from which
the work of system design is initiated. Much of the activities elaborate at this stage is of
the active involvement of the user. The user has a vigorous role to play at this stage too.
As we know that data collected during the system requirement analysis will be utilized
systematically at this stage. Depending on the plan of system analysis, the level of
detailed study will differ and the system design stage will also differ in the amount of
investigations that still need to be done. This study is generally an activity during the
system design as the designer need to study the minute details in all aspects of the system.
Designing a new system is a creative process which calls for logical as well as lateral
thinking. The logical approach involves systematic moves towards the end product
keeping in mind the know-hows of the personnel and the equipment at each decision
making step. Lateral thought implies including of ideas beyond the usual functions and
equipment’s.
17 | P a g e
3.2.1 SYSTEM DESIGN CONSTRAINTS
The system design process is not a step by step adherence of clear procedures and
guidelines. When designer starts working on system design he will face different types
of problems. Many of these will be due to the constraints imposed by the use or
Of course to deliver the requirements as specified in the SRS. In general, the following
Practicality: The system must be stable and can be operated by people with
average IQ.
system output.
Cost: It is desirable to aim for a system with a minimum cost subject to the
of the user.
Security: This is very important aspect of the design and should cover areas of
18 | P a g e
3.2.3 MAJOR SYSTEM DESIGN ACTIVITIES
Several development activities are carried out during structured design. They are data
base design, implementation planning, system test preparation, and system interface
Database Design: This activity deals with the design of the physical database. A
System and Program Test Preparation: Each aspect of the system has a
separate test requirement. System testing is done after all programming and
testing is completed. The test cases cover every aspect of the proposed system,
19 | P a g e
3.2.4 Use case Diagram:
A use case diagram is a diagram which consists of set of usecases and actors enclosed by
system boundary, and association between usecases and actors. Usecases diagram
especially important in organizing, modeling the behavior of the system.
Use case is a set of scenarios tied together by a common user goal. A scenario is a
sequence of steps describing the interaction between a user and system.
HOME PAGE
REAL ESTATE
WEB APP
VIEW
PROPERTIES
User
ENTER DETAILS FOR
DESIRED PROPERTY
CONTACT THE
REALTOR
20 | P a g e
Use case Diagram for Admin:
Admin
21 | P a g e
3.3 Table Structures
CATEGORY
EMPLOYEE
Empid Fname Lname Password Areacode Phone Email Gender Username Datestarted
Auto Text text Text text Text text text text text
number
LIST PROPERTY
Listgid Desclong Avaliability Acres Sqrfeet Numbath Numbed Streetnum Street Zip
Auto no Memo Text text number number number text text text
PROPERTY
CONTACT
22 | P a g e
Chapter IV: Flowcharts & Data Flow Diagrams
23 | P a g e
4.1 System Flow Charts
24 | P a g e
USER SEARCH FOR PROPERTY
Listing
25 | P a g e
VIEW PROPERTY DETAILS
26 | P a g e
3.2 Data Flow Diagrams
A graphical tool used to describe and analyze the moment of data through a system
manual or automated including the process, stores of data, and delays in the system. Data
Flow Diagrams are the central tool and the basis from which other components are
developed. The transformation of data from input to output, through processes, may be
described logically and independently of the physical components associated with the
system. The DFD is also known as a data flow graph or a bubble chart.
A graphical tool used to describe and analyze the moment of data through a system
manual or automated including the process, stores of data, and delays in the system.
Data Flow Diagrams are the central tool and the basis from which other components are
developed. The transformation of data from input to output, through processes, may be
described logically and independently of the physical components associated with the
system. The DFD is also known as a data flow graph or a bubble chart.
27 | P a g e
3.3 Entity Relationship Diagram
28 | P a g e
Chapter V: Testing
29 | P a g e
5.1 System Testing
In this stages the test group of the development team, using the cases and the test data
already prepared will test the programs. Only after all the functions are tested singularly,
an integrated testing will be performed to see that inter-function dependability is
satisfied. Separate test cases and test data will be worked out for the integrated testing.
Any system, to be successful, must be thoroughly tested, and well managed test plan
should be prepared before actual testing is being performed. “Modules” have been
developed and need to be tested in a manner that can reduce occurring of defects as low
as possible. Following are the activities we planned to test the system.
2. One test activity “Basis Path Testing” that will try to cover all paths in the system.
This activity identifies all paths that provide different functionality of the system,
and also other paths to reach at that functionality.
3. Other testing activity is “Control Structure Testing”, which will test each and
every condition with positive and negative data combination.
4. This testing activity will also perform “Data Flow Testing” in which it will be
tested how the data re following the system. And will also check whether the data
entered from one procedure, is reflected whenever it requires or not.
5. All conditions will be tested with “Boundary Value Analysis” where different
input will be given to test whether the system is functioning with boundary values
or not.
6. Along with the boundary value analysis, the system is also tested with “Range
Value Tested” where editable values will be tested with ranges of values.
7. The system is being tested in “Unit Testing” manner where at the completion of
one unit that is tested thoroughly with above mentioned testing activities.
8. The integration testing will also be performed to ensure that the integrated unit is
working properly with other units or not.
30 | P a g e
5.2 Test Levels
Interface design model is reviewed to ensure that generic quality criteria established for
all user interfaces have been achieved and that application specific interface design issue
has been properly addressed.
Interface futures are tested to ensure that design rules, aesthetics and related
visual content are available for the user without error.
When a user interacts with a system, the interaction occurs through one or more interface
mechanisms.
31 | P a g e
Forms: -
Labels correctly identified fields within the form and that mandatory fields are
identified visually for the user.
The server receives all information content within the form and their no data are
lost in the transmission between client and server.
Appropriate defaults are used when the user does not select from a pull down
menu or set of buttons.
Boundary test minimum and maximum number of item that can be placed in to
shopping chart.
Test to determine whether the system can be record co-ordinate content at some
future date.
Define a set of usability testing categories and identify goal for each.
32 | P a g e
Develop a mechanism for assessing the usability of the system.
Layout- Are navigation mechanism, content and function place in a manner that allows
the user to find them quickly?
Aesthetics- Do layout color, typeface, and related characteristics lead to ease of use?
Display Characteristics- Does the system make optimal use of screen size and
resolution?
Time Sensitivity- Can important features, functions and content be used in a timely
manner?
33 | P a g e
5.3 Testing Methods
Analyze and check system representation such as the requirement document, design
diagrams and the program source code. They may be applied at all stages of the process.
Unit Testing
Module Testing
Sub-system
Testing
System Testing
Acceptance
Testing
34 | P a g e
There are different Models of testing. On the basis of testing methods there are two types
of testing:
1. White-box testing.
2. Black-box testing
1. WHITE-BOX TESTING
White-box testing sometimes called glass-box testing, is a test case design method that
users the control structure of the procedural design to drive the test case.
We often believe that a logical path is not likely to be executed when in fact it
may be executed on a regular basis. The logical flow of a program times counter
intuitive.
2. BLACK-BOX TESTING:
For our project periodically we have tested our software using black-box testing.
Thinking as a client we have evaluated the software for its easy going and convenience.
Unit Testing:
During the programming stages each and every form, modules and class treated unit has
been put into the test data. Every module is tested independently. The steps are follows:
Integration Testing:
After our individual’s modules were tested out we go the integrated to create a complete
system. This integration process involves building the system and testing the resultant
system for problems that arise from component interaction.
35 | P a g e
Performance Testing:
Performance testing is designed to test the runtime performance of the system within the
context of the system. These tests were performed as module level as well as system
level. Individual modules were tested for required performance.
Condition Testing:
Performance testing is a test case design method that exercises the logical conditions.
Interface Testing:
Interface sting is integral part of integration. We examined the code to be tested and
explicitly list each call to an external component. In the system standards tests for GUIs
have been performed, which are as follows:
The position and related labels for all controls were checked.
Validations for all inputs were done.
Pull down controls was verified for proper functionality.
Whether the non-editable text controls disabling and it was also verified that it
doesn’t exceed the maximum allowed length.
36 | P a g e
Chapter VI: Samples
37 | P a g e
6.1 Output Samples
Home Page
About Us
38 | P a g e
Featured Listing
Login
39 | P a g e
Register
Search
40 | P a g e
Dashboard
LighBox
41 | P a g e
Chapter VI: Conclusion
42 | P a g e
7.1 Conclusion
This Real Estate Web App is a typical web application using Django framework,
PostgreSQL database in Python programming language.
It uses a client/server architecture based on the HTTP protocol. It is developed
in VS Code editor in python programming environment.
The buyer performs a search for the property listings by putting either Zip
code/City/State in the search textbox. The business logic tier communicates with
the database tier requesting the results of the query sent by it.
The results obtained by the database are displayed on the data grid, by refreshing
the grid rather than refreshing the entire web page. Efficiency of the application
is improved by the using such a high level framework for web development.
The performance of this application is evaluated by rigorously testing it against
various test scenarios. Some ways in which this system could be enhanced with
additional functionalities are discussed in the section.
This project is developed as a master’s project and still gives lot of scope for its
extension which could be made to the project if it is going to be developed as
commercial product.
We can use pure object-oriented domain model to deal the database access tier
using VS Code editor. In doing this, we can get a better architecture design which
will improve code efficiency and running performance.
This project just deals with the Home page and Search page to search for property
listings, more functionality can be added for searching the agents and offices
making it a complete application.
The feature of providing Google Maps within this application can adds up to the
functionality of the website. With the advancement of technology, dynamic maps
can be generated which help the buyer can locate a particular area where the
property is located in the Google Map.
Buyer testimonials can also be add in future if the it need it.
43 | P a g e
Inclusion of all these features would make the application feature rich. The
advantages of putting these functionalities in the project are described in detail in
the following sections.
44 | P a g e
Appendix I: Overview
45 | P a g e
APPENDIX-I
the users will have with the software. Use cases are also known as functional
DESIGN SPECIFICATION
FUNCTIONAL SPECIFICATION
46 | P a g e
does not typically define the inner workings of the proposed system, it means it does not
yet include the specification how the system function will be implemented. Instead, it
focuses on what various outside agents (people using the program, computer peripherals,
or other computers, for example) might "observe" when interacting with the system
The PDS acts as an initial boundary in the development of products. However, it will
naturally evolve as it is progressed through the different stages of the design process.[2]
REQUIREMENTS ANALYSIS
47 | P a g e
models for such processes, each describing approaches to a variety of tasks or activities
that take place during the process.
USE OF A SPECIFICATION
A product specification does not necessarily prove the product to be correct. Just because
an item is stamped with a specification number does not, by itself, indicate that the item
is fit for any particular use. The people who use the item (engineers, trade unions, etc) or
specify the item (building codes, government, industry, etc) have the responsibility to
consider the available specifications, specify the correct one, enforce compliance, and
use the item correctly. Validation of suitability is necessary.
48 | P a g e
SPECIFICATION AND DESCRIPTION LANGUAGE
SYSTEM REQUIREMENTS
To be used efficiently, all computer software needs certain hardware components or other
software resources to be present on a computer system. These pre-requisites are known
as (computer) system requirements and are often used as a guideline as opposed to an
absolute rule. Most software defines two sets of system requirements: minimum and
recommended. With increasing demand for higher processing power and resources in
newer versions of software, system requirements tend to increase over time. Industry
analysts suggest that this trend plays a bigger part in driving upgrades to existing
computer systems than technological advancements
49 | P a g e
A I.2 PHYSICAL SPECIFICATIONS
It is common practice for a designer to draw a context-level DFD first which shows the
interaction between the system and outside entities. The DFD is designed to show how a
system is divided into smaller portions and to highlight the flow of data between those
parts. This context-level DFD is then "exploded" to show more detail of the system being
modeled.
Data flow diagrams were invented by Larry Constantine, the original developer of
structured design, based on Martin and Estrin's "data flow graph" model of computation.
Data flow diagrams (DFDs) are one of the three essential perspectives of Structured
Systems Analysis and Design Method SSADM. The sponsor of a project and the end
users will need to be briefed and consulted throughout all stages of a system's evolution.
With a dataflow diagram, users are able to visualize how the system will operate, what
the system will accomplish, and how the system will be implemented. The old system's
dataflow diagrams can be drawn up and compared with the new system's dataflow
can be used to provide the end user with a physical idea of where the data they input
ultimately has an effect upon the structure of the whole system from order to dispatch to
restock. How any system is developed can be determined through a dataflow diagram.
Developing a DFD helps in identifying the transaction data in the data model.
There are different notations to draw data flow diagrams, defining different visual
50 | P a g e
It is common practice for a designer to draw a context-level DFD first which shows the
interaction between the system and outside entities. The DFD is designed to show how a
system is divided into smaller portions and to highlight the flow of data between those
parts. This context-level DFD is then "exploded" to show more detail of the system being
modeled.
Data flow diagrams were invented by Larry Constantine, the original developer of
structured design, based on Martin and Estrin's "data flow graph" model of computation.
Data flow diagrams (DFDs) are one of the three essential perspectives of Structured
Systems Analysis and Design Method SSADM. The sponsor of a project and the end
users will need to be briefed and consulted throughout all stages of a system's evolution.
With a dataflow diagram, users are able to visualize how the system will operate, what
the system will accomplish, and how the system will be implemented. The old system's
dataflow diagrams can be drawn up and compared with the new system's dataflow
can be used to provide the end user with a physical idea of where the data they input
ultimately has an effect upon the structure of the whole system from order to dispatch to
restock. How any system is developed can be determined through a dataflow diagram.
51 | P a g e
ENTITY- RELATIONSHIP MODEL
Originally proposed in 1976 by Peter Chen, many variants of the process have
subsequently been devised.
The first stage of information system design uses these models during the requirements
analysis to describe information needs or the type of information that is to be stored in a
database. The data modeling technique can be used to describe any ontology (i.e. an
overview and classifications of used terms and their relationships) for a certain universe
of discourse (i.e. area of interest). In the case of the design of an information system that
is based on a database, the conceptual data model is, at a later stage (usually called logical
design), mapped to a logical data model, such as the relational model; this in turn is
mapped to a physical model during physical design. Note that sometimes, both of these
phases are referred to as "physical design".
An entity may be a physical object such as a house or a car, an event such as a house sale
or a car service, or a concept such as a customer transaction or order. Although the term
entity is the one most commonly used, following Chen we should really distinguish
between an entity and an entity-type. An entity-type is a category. An entity, strictly
speaking, is an instance of a given entity-type. There are usually many instances of an
52 | P a g e
entity-type. Because the term entity-type is somewhat cumbersome, most people tend to
use the term entity as a synonym for this term.
A relationship captures how two or more entities are related to one another. Relationships
can be thought of as verbs, linking two or more nouns.
Entities and relationships can both have attributes. Examples: an employee entity might
have a Social Security Number (SSN) attribute; the proved relationship may have a date
attribute. Attributes are represented as ellipses connected to their owning entity sets by a
line.
Every entity (unless it is a weak entity) must have a minimal set of uniquely identifying
attributes, which is called the entity's primary key.
Lines are drawn between entity sets and the relationship sets they are involved in. If all
entities in an entity set must participate in the relationship set, a thick or double line is
drawn. This is called a participation constraint. If each entity of the entity set can
participate in at most one relationship in the relationship set, an arrow is drawn from the
entity set to the relationship set. This is called a key constraint. To indicate that each
entity in the entity set is involved in exactly one relationship, a thick arrow is drawn.
53 | P a g e
Appendix II: Glossary
54 | P a g e
APPENDIX-II
A II.1 CODING
The given code is of front end which in Html some Sass as well as it has some Jinja
syntax, so the given following code is just the theme of our project for loading this in
project we use some Jinja syntax and the Django framework for rendering it. It is given
here because it can be use globally for the theme by making some changes in frontend
for any web app then the backend will be created by using Django, React, JQuery for
Index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
</head>
<body>
55 | P a g e
<!-- Top Bar -->
<div class="container">
<div class="row">
<div class="col-md-4">
</div>
<div class="col-md-4">
</div>
<div class="col-md-4">
<a href="#">
</a>
<a href="#">
</a>
<a href="#">
</a>
<a href="#">
</a>
<a href="#">
56 | P a g e
<i class="fab fa-pinterest"></i>
</a>
</div>
</div>
</div>
</div>
</section>
<div class="container">
</a>
target="#navbarNavAltMarkup">
<span class="navbar-toggler-icon"></span>
</button>
<ul class="navbar-nav">
</li>
57 | P a g e
</li>
</li>
</ul>
</li>
Login</a>
</li>
</ul>
</div>
</div>
</nav>
<section id="showcase">
58 | P a g e
<div class="home-search p-5">
</h1>
<div class="search">
<form action="search.html">
<div class="form-row">
<label class="sr-only">Keywords</label>
</div>
<label class="sr-only">City</label>
</div>
<label class="sr-only">State</label>
59 | P a g e
<select name="state" class="form-control">
<option value="AL">Alabama</option>
<option value="AK">Alaska</option>
<option value="AZ">Arizona</option>
<option value="AR">Arkansas</option>
<option value="CA">California</option>
<option value="CO">Colorado</option>
<option value="CT">Connecticut</option>
<option value="DE">Delaware</option>
<option value="FL">Florida</option>
<option value="GA">Georgia</option>
<option value="HI">Hawaii</option>
<option value="ID">Idaho</option>
<option value="IL">Illinois</option>
<option value="IN">Indiana</option>
<option value="IA">Iowa</option>
<option value="KS">Kansas</option>
<option value="KY">Kentucky</option>
<option value="LA">Louisiana</option>
<option value="ME">Maine</option>
<option value="MD">Maryland</option>
<option value="MA">Massachusetts</option>
<option value="MI">Michigan</option>
60 | P a g e
<option value="MN">Minnesota</option>
<option value="MS">Mississippi</option>
<option value="MO">Missouri</option>
<option value="MT">Montana</option>
<option value="NE">Nebraska</option>
<option value="NV">Nevada</option>
<option value="OH">Ohio</option>
<option value="OK">Oklahoma</option>
<option value="OR">Oregon</option>
<option value="PA">Pennsylvania</option>
<option value="TN">Tennessee</option>
<option value="TX">Texas</option>
<option value="UT">Utah</option>
<option value="VT">Vermont</option>
<option value="VA">Virginia</option>
<option value="WA">Washington</option>
61 | P a g e
<option value="WV">West Virginia</option>
<option value="WI">Wisconsin</option>
<option value="WY">Wyoming</option>
</select>
</div>
</div>
<div class="form-row">
<label class="sr-only">Bedrooms</label>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
</select>
</div>
62 | P a g e
<select name="price" class="form-control" id="type">
<option value="100000">$100,000</option>
<option value="200000">$200,000</option>
<option value="300000">$300,000</option>
<option value="400000">$400,000</option>
<option value="500000">$500,000</option>
<option value="600000">$600,000</option>
<option value="700000">$700,000</option>
<option value="800000">$800,000</option>
<option value="900000">$900,000</option>
<option value="1000000">$1M+</option>
</select>
</div>
</div>
form</button>
</form>
</div>
</div>
</div>
</div>
</section>
63 | P a g e
<section id="listings" class="py-5">
<div class="container">
<div class="row">
<div class="card-img-overlay">
<h2>
</h2>
</div>
<div class="card-body">
<p>
02062</p>
</div>
<hr>
<div class="col-6">
<div class="col-6">
64 | P a g e
<i class="fas fa-car"></i> Garage: 2</div>
</div>
<div class="col-6">
<div class="col-6">
</div>
<hr>
<div class="col-6">
</div>
<div class="col-6">
</div>
<hr>
</div>
</div>
</div>
65 | P a g e
<div class="card listing-preview">
<div class="card-img-overlay">
<h2>
</h2>
</div>
<div class="card-body">
<p>
</div>
<hr>
<div class="col-6">
<div class="col-6">
</div>
<div class="col-6">
<div class="col-6">
66 | P a g e
</div>
<hr>
<div class="col-6">
</div>
<div class="col-6">
</div>
<hr>
</div>
</div>
</div>
<div class="card-img-overlay">
</div>
<div class="card-body">
67 | P a g e
<h4 class="text-primary">187 Woodrow Street</h4>
<p>
</div>
<hr>
<div class="col-6">
<div class="col-6">
</div>
<div class="col-6">
<div class="col-6">
</div>
<hr>
<div class="col-6">
</div>
<div class="col-6">
68 | P a g e
</div>
<hr>
</div>
</div>
</div>
</div>
</div>
</section>
<div class="container">
<div class="col-md-4">
<hr>
<h3>Consulting Services</h3>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Incidunt, debitis
</div>
<div class="col-md-4">
<hr>
<h3>Propery Management</h3>
69 | P a g e
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Incidunt, debitis
</div>
<div class="col-md-4">
<hr>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Incidunt, debitis
</div>
</div>
</div>
</section>
Copyright ©
</footer>
</body>
</html>
70 | P a g e
About.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
</head>
<body>
<div class="container">
<div class="row">
<div class="col-md-4">
71 | P a g e
</div>
<div class="col-md-4">
</div>
<div class="col-md-4">
<a href="#">
</a>
<a href="#">
</a>
<a href="#">
</a>
<a href="#">
</a>
<a href="#">
</a>
</div>
</div>
</div>
</div>
72 | P a g e
</section>
<div class="container">
</a>
target="#navbarNavAltMarkup">
<span class="navbar-toggler-icon"></span>
</button>
<ul class="navbar-nav">
</li>
</li>
</li>
</ul>
73 | P a g e
<ul class="navbar-nav ml-auto">
</li>
Login</a>
</li>
</ul>
</div>
</div>
</nav>
<div class="container">
<div class="col-md-12">
<p class="lead">Lorem ipsum dolor sit, amet consectetur adipisicing elit. Sunt,
pariatur!</p>
</div>
</div>
74 | P a g e
</div>
</section>
<div class="container">
<nav aria-label="breadcrumb">
<ol class="breadcrumb">
<li class="breadcrumb-item">
<a href="index.html">
</li>
</ol>
</nav>
</div>
</section>
<div class="container">
<div class="row">
<div class="col-md-8">
<p class="lead">Lorem ipsum dolor sit, amet consectetur adipisicing elit. Sunt,
pariatur!</p>
75 | P a g e
<img src="assets/img/about.jpg" alt="">
neque quod accusamus rem quia magnam magni dolorum facilis ullam minima
</div>
<div class="col-md-4">
<div class="card">
month">
<div class="card-body">
content.
</p>
</div>
</div>
</div>
</div>
</div>
</section>
76 | P a g e
<!-- Work -->
<h4>Lorem ipsum dolor sit amet consectetur adipisicing elit. Autem velit aperiam,
<hr>
Featured Listings</a>
</section>
<div class="container">
<div class="col-md-4">
<h4>Kyle Brown</h4>
<p class="text-success">
<hr>
<p>
<p>
77 | P a g e
</div>
<div class="col-md-4">
<h4>Mark Hudson</h4>
<p class="text-success">Realtor</p>
<hr>
<p>
<p>
</div>
<div class="col-md-4">
<h4>Jenny Johnson</h4>
<p class="text-success">Realtor</p>
<hr>
<p>
<p>
</div>
</div>
</div>
78 | P a g e
</section>
Copyright ©
</footer>
</body>
</html>
79 | P a g e
Listings.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
</head>
<body>
<div class="container">
<div class="row">
<div class="col-md-4">
80 | P a g e
</div>
<div class="col-md-4">
</div>
<div class="col-md-4">
<a href="#">
</a>
<a href="#">
</a>
<a href="#">
</a>
<a href="#">
</a>
<a href="#">
</a>
</div>
</div>
</div>
</div>
81 | P a g e
</section>
<div class="container">
</a>
target="#navbarNavAltMarkup">
<span class="navbar-toggler-icon"></span>
</button>
<ul class="navbar-nav">
</li>
</li>
</li>
</ul>
82 | P a g e
<ul class="navbar-nav ml-auto">
</li>
Login</a>
</li>
</ul>
</div>
</div>
</nav>
<div class="container">
<div class="col-md-12">
<p class="lead">Lorem ipsum dolor sit, amet consectetur adipisicing elit. Sunt,
pariatur!</p>
</div>
</div>
83 | P a g e
</div>
</section>
<div class="container">
<nav aria-label="breadcrumb">
<ol class="breadcrumb">
<li class="breadcrumb-item">
<a href="index.html">
</li>
</ol>
</nav>
</div>
</section>
<div class="container">
<div class="row">
84 | P a g e
<div class="card listing-preview">
<div class="card-img-overlay">
<h2>
</h2>
</div>
<div class="card-body">
<p>
02062</p>
</div>
<hr>
<div class="col-6">
<div class="col-6">
</div>
<div class="col-6">
<div class="col-6">
85 | P a g e
<i class="fas fa-bath"></i> Bathrooms: 2</div>
</div>
<hr>
<div class="col-12">
</div>
<div class="col-6">
</div>
<hr>
</div>
</div>
</div>
<div class="card-img-overlay">
<h2>
</h2>
86 | P a g e
</div>
<div class="card-body">
<p>
</div>
<hr>
<div class="col-6">
<div class="col-6">
</div>
<div class="col-6">
<div class="col-6">
</div>
<hr>
<div class="col-6">
</div>
87 | P a g e
<div class="row text-secondary pb-2">
<div class="col-6">
</div>
<hr>
</div>
</div>
</div>
<div class="card-img-overlay">
<h2>
</h2>
</div>
<div class="card-body">
<p>
</div>
88 | P a g e
<hr>
<div class="col-6">
<div class="col-6">
</div>
<div class="col-6">
<div class="col-6">
</div>
<hr>
<div class="col-6">
</div>
<div class="col-6">
</div>
<hr>
</div>
89 | P a g e
</div>
</div>
<div class="card-img-overlay">
<h2>
</h2>
</div>
<div class="card-body">
<p>
</div>
<hr>
<div class="col-6">
<div class="col-6">
</div>
90 | P a g e
<div class="row py-2 text-secondary">
<div class="col-6">
<div class="col-6">
</div>
<hr>
<div class="col-6">
</div>
<div class="col-6">
</div>
<hr>
</div>
</div>
</div>
91 | P a g e
<div class="card-img-overlay">
<h2>
</h2>
</div>
<div class="card-body">
<p>
03827</p>
</div>
<hr>
<div class="col-6">
<div class="col-6">
</div>
<div class="col-6">
<div class="col-6">
</div>
92 | P a g e
<hr>
<div class="col-6">
</div>
<div class="col-6">
</div>
<hr>
</div>
</div>
</div>
<div class="card-img-overlay">
<h2>
</h2>
</div>
<div class="card-body">
93 | P a g e
<div class="listing-heading text-center">
<p>
01731</p>
</div>
<hr>
<div class="col-6">
<div class="col-6">
</div>
<div class="col-6">
<div class="col-6">
</div>
<hr>
<div class="col-6">
</div>
94 | P a g e
<div class="col-6">
</div>
<hr>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<ul class="pagination">
</li>
</li>
<li class="page-item">
</li>
<li class="page-item">
95 | P a g e
</li>
<li class="page-item">
</li>
</ul>
</div>
</div>
</div>
</section>
Copyright ©
</footer>
</body>
</html>
96 | P a g e
Dashboard.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<!-- Font Awesome -->
<link rel="stylesheet" href="assets/css/all.css">
<!-- Bootstrap -->
<link rel="stylesheet" href="assets/css/bootstrap.css">
<!-- Custom -->
<link rel="stylesheet" href="assets/css/style.css">
<body>
<!-- Top Bar -->
<section id="top-bar" class="p-3">
<div class="container">
<div class="row">
<div class="col-md-4">
<i class="fas fa-phone"></i> (617)-555-5555
</div>
<div class="col-md-4">
<i class="fas fa-envelope-open"></i> [email protected]
</div>
<div class="col-md-4">
<div class="social text-right">
<a href="#">
<i class="fab fa-twitter"></i>
</a>
<a href="#">
<i class="fab fa-facebook"></i>
</a>
<a href="#">
<i class="fab fa-linkedin"></i>
</a>
<a href="#">
<i class="fab fa-instagram"></i>
</a>
<a href="#">
<i class="fab fa-pinterest"></i>
</a>
</div>
</div>
97 | P a g e
</div>
</div>
</section>
Login</a>
</li>
</ul>
</div>
</div>
</nav>
98 | P a g e
</div>
</div>
</div>
</section>
99 | P a g e
<tr>
<td>31</td>
<td>12 Samson Ave</td>
<td>
<a class="btn btn-light" href="#">View Listing</a>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</section>
</html>
100 | P a g e
Search.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<!-- Font Awesome -->
<link rel="stylesheet" href="assets/css/all.css">
<!-- Bootstrap -->
<link rel="stylesheet" href="assets/css/bootstrap.css">
<!-- Custom -->
<link rel="stylesheet" href="assets/css/style.css">
<body>
<!-- Top Bar -->
<section id="top-bar" class="p-3">
<div class="container">
<div class="row">
<div class="col-md-4">
<i class="fas fa-phone"></i> (617)-555-5555
</div>
<div class="col-md-4">
<i class="fas fa-envelope-open"></i> [email protected]
</div>
<div class="col-md-4">
<div class="social text-right">
<a href="#">
<i class="fab fa-twitter"></i>
</a>
<a href="#">
<i class="fab fa-facebook"></i>
</a>
<a href="#">
<i class="fab fa-linkedin"></i>
</a>
<a href="#">
<i class="fab fa-instagram"></i>
</a>
<a href="#">
<i class="fab fa-pinterest"></i>
</a>
</div>
</div>
101 | P a g e
</div>
</div>
</section>
Login</a>
</li>
</ul>
</div>
</div>
</nav>
102 | P a g e
<div class="form-row">
<div class="col-md-4 mb-3">
<label class="sr-only">Keywords</label>
<input type="text" name="keywords" class="form-control"
placeholder="Keyword (Pool, Garage, etc)">
</div>
103 | P a g e
<option value="NC">North Carolina</option>
<option value="ND">North Dakota</option>
<option value="OH">Ohio</option>
<option value="OK">Oklahoma</option>
<option value="OR">Oregon</option>
<option value="PA">Pennsylvania</option>
<option value="RI">Rhode Island</option>
<option value="SC">South Carolina</option>
<option value="SD">South Dakota</option>
<option value="TN">Tennessee</option>
<option value="TX">Texas</option>
<option value="UT">Utah</option>
<option value="VT">Vermont</option>
<option value="VA">Virginia</option>
<option value="WA">Washington</option>
<option value="WV">West Virginia</option>
<option value="WI">Wisconsin</option>
<option value="WY">Wyoming</option>
</select>
</div>
</div>
<!-- Form Row 2 -->
<div class="form-row">
<div class="col-md-6 mb-3">
<label class="sr-only">Bedrooms</label>
<select name="bedrooms" class="form-control">
<option selected="true" disabled="disabled">Bedrooms (Any)</option>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
<option>10</option>
</select>
</div>
<div class="col-md-6 mb-3">
<select name="price" class="form-control">
<option selected="true" disabled="disabled">Max Price (All)</option>
<option value="100000">$100,000</option>
<option value="200000">$200,000</option>
<option value="300000">$300,000</option>
<option value="400000">$400,000</option>
<option value="500000">$500,000</option>
<option value="600000">$600,000</option>
<option value="700000">$700,000</option>
104 | P a g e
<option value="800000">$800,000</option>
<option value="900000">$900,000</option>
<option value="1000000">$1M+</option>
</select>
</div>
</div>
<button class="btn btn-secondary btn-block mt-4" type="submit">Submit
form</button>
</form>
</div>
</div>
</div>
</section>
105 | P a g e
<p>
<i class="fas fa-map-marker text-secondary"></i> Norwood MA,
02062</p>
</div>
<hr>
<div class="row py-2 text-secondary">
<div class="col-6">
<i class="fas fa-th-large"></i> Sqft: 3200</div>
<div class="col-6">
<i class="fas fa-car"></i> Garage: 2</div>
</div>
<div class="row py-2 text-secondary">
<div class="col-6">
<i class="fas fa-bed"></i> Bedrooms: 3</div>
<div class="col-6">
<i class="fas fa-bath"></i> Bathrooms: 2</div>
</div>
<hr>
<div class="row py-2 text-secondary">
<div class="col-12">
<i class="fas fa-user"></i> Kyle Brown</div>
</div>
<div class="row text-secondary pb-2">
<div class="col-6">
<i class="fas fa-clock"></i> 2 days ago</div>
</div>
<hr>
<a href="listing.html" class="btn btn-primary btn-block">More Info</a>
</div>
</div>
</div>
106 | P a g e
<div class="col-6">
<i class="fas fa-th-large"></i> Sqft: 3200</div>
<div class="col-6">
<i class="fas fa-car"></i> Garage: 1</div>
</div>
<div class="row py-2 text-secondary">
<div class="col-6">
<i class="fas fa-bed"></i> Bedrooms: 4</div>
<div class="col-6">
<i class="fas fa-bath"></i> Bathrooms: 2.5</div>
</div>
<hr>
<div class="row py-2 text-secondary">
<div class="col-6">
<i class="fas fa-user"></i> Mark Hudson</div>
</div>
<div class="row text-secondary pb-2">
<div class="col-6">
<i class="fas fa-clock"></i> 5 days ago</div>
</div>
<hr>
<a href="listing.html" class="btn btn-primary btn-block">More Info</a>
</div>
</div>
</div>
107 | P a g e
<div class="col-6">
<i class="fas fa-bed"></i> Bedrooms: 4</div>
<div class="col-6">
<i class="fas fa-bath"></i> Bathrooms: 3</div>
</div>
<hr>
<div class="row py-2 text-secondary">
<div class="col-6">
<i class="fas fa-user"></i> Mark Hudson</div>
</div>
<div class="row text-secondary pb-2">
<div class="col-6">
<i class="fas fa-clock"></i> 5 days ago</div>
</div>
<hr>
<a href="listing.html" class="btn btn-primary btn-block">More Info</a>
</div>
</div>
</div>
108 | P a g e
<div class="row py-2 text-secondary">
<div class="col-6">
<i class="fas fa-user"></i> Jenny Johnson</div>
</div>
<div class="row text-secondary pb-2">
<div class="col-6">
<i class="fas fa-clock"></i> 5 days ago</div>
</div>
<hr>
<a href="listing.html" class="btn btn-primary btn-block">More Info</a>
</div>
</div>
</div>
109 | P a g e
<div class="col-6">
<i class="fas fa-clock"></i> 5 days ago</div>
</div>
<hr>
<a href="listing.html" class="btn btn-primary btn-block">More Info</a>
</div>
</div>
</div>
110 | P a g e
</div>
</div>
</div>
</div>
</div>
</section>
</html>
111 | P a g e
Login.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<!-- Font Awesome -->
<link rel="stylesheet" href="assets/css/all.css">
<!-- Bootstrap -->
<link rel="stylesheet" href="assets/css/bootstrap.css">
<!-- Custom -->
<link rel="stylesheet" href="assets/css/style.css">
<body>
<!-- Top Bar -->
<section id="top-bar" class="p-3">
<div class="container">
<div class="row">
<div class="col-md-4">
<i class="fas fa-phone"></i> (617)-555-5555
</div>
<div class="col-md-4">
<i class="fas fa-envelope-open"></i> [email protected]
</div>
<div class="col-md-4">
<div class="social text-right">
<a href="#">
<i class="fab fa-twitter"></i>
</a>
<a href="#">
<i class="fab fa-facebook"></i>
</a>
<a href="#">
<i class="fab fa-linkedin"></i>
</a>
<a href="#">
<i class="fab fa-instagram"></i>
</a>
<a href="#">
<i class="fab fa-pinterest"></i>
</a>
</div>
112 | P a g e
</div>
</div>
</div>
</section>
Login</a>
</li>
</ul>
</div>
</div>
</nav>
113 | P a g e
<div class="card-header bg-primary text-white">
<h4>
<i class="fas fa-sign-in-alt"></i> Login</h4>
</div>
<div class="card-body">
<form action="index.html">
<div class="form-group">
<label for="username">Username</label>
<input type="text" name="username" class="form-control" required>
</div>
<div class="form-group">
<label for="password2">Password</label>
<input type="password" name="password" class="form-control" required>
</div>
</html>
114 | P a g e
Register.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<!-- Font Awesome -->
<link rel="stylesheet" href="assets/css/all.css">
<!-- Bootstrap -->
<link rel="stylesheet" href="assets/css/bootstrap.css">
<!-- Custom -->
<link rel="stylesheet" href="assets/css/style.css">
<body>
<!-- Top Bar -->
<section id="top-bar" class="p-3">
<div class="container">
<div class="row">
<div class="col-md-4">
<i class="fas fa-phone"></i> (617)-555-5555
</div>
<div class="col-md-4">
<i class="fas fa-envelope-open"></i> [email protected]
</div>
<div class="col-md-4">
<div class="social text-right">
<a href="#">
<i class="fab fa-twitter"></i>
</a>
<a href="#">
<i class="fab fa-facebook"></i>
</a>
<a href="#">
<i class="fab fa-linkedin"></i>
</a>
<a href="#">
<i class="fab fa-instagram"></i>
</a>
<a href="#">
<i class="fab fa-pinterest"></i>
</a>
</div>
</div>
115 | P a g e
</div>
</div>
</section>
Login</a>
</li>
</ul>
</div>
</div>
</nav>
116 | P a g e
<h4>
<i class="fas fa-user-plus"></i> Register</h4>
</div>
<div class="card-body">
<form action="index.html">
<div class="form-group">
<label for="first_name">First Name</label>
<input type="text" name="first_name" class="form-control" required>
</div>
<div class="form-group">
<label for="last_name">Last Name</label>
<input type="text" name="last_name" class="form-control" required>
</div>
<div class="form-group">
<label for="username">Username</label>
<input type="text" name="username" class="form-control" required>
</div>
<div class="form-group">
<label for="email">Email</label>
<input type="email" name="email" class="form-control" required>
</div>
<div class="form-group">
<label for="password2">Password</label>
<input type="password" name="password" class="form-control" required>
</div>
<div class="form-group">
<label for="password">Confirm Password</label>
<input type="password" name="password2" class="form-control" required>
</div>
<input type="submit" value="Register" class="btn btn-secondary btn-
block">
</form>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Footer -->
<footer id="main-footer" class="py-4 bg-primary text-white text-center">
Copyright ©
<span class="year"></span> BT Real Estate
</footer>
117 | P a g e
Bibliography
BIBLIOGRAPHY
SOFTWARE USED:
Framework: Django
Front-end: HTML, CSS, SASS and Jinja.
Back-end: Python, Django, JavaScript.
118 | P a g e