Maid Finder: A Student Project
Maid Finder: A Student Project
On
“Maid Finder”
Submitted By
“Sahil Take”
Mumbai
(2022-2023)
1
Certificate
This is to certify that Sahil Take has successfully
completed
the project titled
“ Maid Finder ”
under our guidance towards the partial fulfilment
of degree of Bachelors of Science (Computer Science
– SEM VI) submitted to Ramniranjan Jhunjhunwala
College, Ghatkopar (W) during the academic year
2022-2023 as specified by University of Mumbai
2
INDEX
Sr no. Topic Page no.
1. Acknowledgement 4
2. Declaration 5
3. Feasibility Study 6
3.1 Economic Feasibility 6
3.2 Technical Feasibility 7
3.3 Operational Feasibility 7
4. Scope of the System 8
5. Existing System & it’s Disadvantages 9
6. Purposed System & it’s Advantages 9
6.1 Employment 9
6.2 Easy to Earn 9
6.3 Accessibility 9
7. Technical Requirement 10
8. Software Development Model 11
9. Gantt Chart 14
10. System Analysis 18
10.1 E-R Diagram 18
10.2 Class Diagram 21
10.3 Package Diagram 25
10.4 Object Diagram 27
10.5 Activity Diagram 30
10.6 Sequence Diagram 33
10.7 Use Case Diagram 39
11. System Design 42
11.1 Component Diagram 42
11.2 Deployment Diagram 45
12. Table Design 47
13. System Coding & Conventions 48
12.1 Program Source-Code 48
12.2 Screen Layout 59
14. System Testing 66
13.1 Validation 67
15. Future Enhancements 68
16. References 68
3
Acknowledgement
Thanking You,
Sahil Take
4
Declaration
______________
Sahil Take
5
Feasibility Study
1. Development Cost
➢ Whatever required for the project are easily available online.
➢ Equipment required for developing the software are easily
available.
➢ Equipment maintenance is also minimum.
➢ Once the required hardware and software requirements
get fulfilled there is no need for the users of our system
to spend for any additional overhead.
2. Benefits which cannot be measured
➢ Increased customer Loyalty.
➢ Increased customer satisfaction.
➢ User friendly.
➢ Easy to use.
6
3.2 Technical Feasibility
Technical feasibility evaluates the technical complexity of the
expert system and often involves determining whether the expert system
can be implemented with state-of-the-art techniques and tools.
7
Scope of the System
“Maid Finder” an app designed for skilled or professional maid
who are seeking for work, this platform can be help such people to be of
greater use by providing them employment and enhance their skills.
This platform has not been introduced to the world or system yet
and targets all the maid to join this team and enhance their identity and
with the help of rating, feedbacks they get from the customer who’ve
hired them.
As such there is no service for maid that provide job employment
and it is also difficult for customers to search for maid who are excellent
in cleaning household chores even if they get a maid, the quality and
service they provide can’t be judged.
This system allows the customer to hire an available maid in
locality for an hour, day or for month and the maid will be paid on the
work they are hired for. The work they covered will be to clean
household chores like floor cleaning, cook, dish wash, cloths wash, etc.
8
Existing System & it’s Disadvantages
The system of keeping maid for daily house work has been in
existence in India for a long time but in recent times it has grown in
manifold and become a trend. This web project system will help to find
maid from nearby locations. Maid can also get a job search just by
logging onto the website and setting up the profile. In this maid finder
system, there are three entities namely, Admin, Maid, and User. Admin
can login, manage maid profiles by adding new records and update their
profiles. Admin can also check for the registered users. Users can
register and login; maid profiles can be viewed by users.
1. Employment
Most of the maid are in search of jobs due to improper platform
to seek for jobs, this will enhance the chance of them getting
jobs based on their experience.
2. Easy to Earn
As this platform provide employment to maid, it also makes
earning easier.
3. Accessibility
It makes both customer and maid to operate the app very easily
and hire the maid just by the rating provided by the previous
customers.
9
Technical Requirement
1. Programming Language
• Front-end
o HTML (Hypertext Markup Language)
o CSS (Cascading Style Sheet)
o JavaScript
o Bootstrap (Framework of CSS and JavaScript)
• Back-end
o Python (Server-Side Language)
o SQLite (Database)
o Django (Framework)
2. Hardware Requirement
• Mouse
• Laptop
• Keyboard
10
Software Development Model
V-Model
The V-model is an SDLC model where execution of processes happens in a
sequential manner in a V-shape. It is also known as Verification & Validation
model.
The V-Model is an extension of the waterfall model and is based on the
association of a testing phase for each corresponding development stage. This
means that for every single phase in the development cycle, there is a directly
associated testing phase. This is a highly-disciplined model and the next phase
starts only after completion of the previous phase.
1. Requirement Analysis
This is the first phase in the development cycle where the product
requirements are understood from the customer’s perspective. This phase
involves detailed communication with the customer to understand his
expectations and exact requirement. This is a very important activity and needs to
be managed well, as most of the customers are not sure about what exactly they
need. The acceptance test design planning is done at this stage as business
requirements can be used as an input for acceptance testing.
2. System Design
Once you have the clear and detailed product requirements, it is time to
design the complete system. The system design will have the understanding and
detailing the complete hardware and communication setup for the product under
development. The system test plan is developed based on the system design.
Doing this at an earlier stage leaves more time for the actual test execution later.
3. Architectural Design
Architectural specifications are understood and designed in this phase.
Usually more than one technical approach is proposed and based on the technical
and financial feasibility the final decision is taken. The system design is broken
down further into modules taking up different functionality. This is also referred
to as High Level Design (HLD). The data transfer and communication between
the internal modules and with the outside world (other systems) is clearly
understood and defined in this stage. With this information, integration tests can
be designed and documented during this stage.
11
4. Module Design
In this phase, the detailed internal design for all the system modules is
specified, referred to as Low Level Design (LLD). It is important that the design
is compatible with the other modules in the system architecture and the other
external systems. The unit tests are an essential part of any development process
and helps eliminate the maximum faults and errors at a very early stage. These
unit tests can be designed at this stage based on the internal module designs.
5. Coding Phase
In this phase, the detailed internal design for all the system modules is
specified, referred to as Low Level Design (LLD). It is important that the design
is compatible with the other modules in the system architecture and the other
external systems. The unit tests are an essential part of any development process
and helps eliminate the maximum faults and errors at a very early stage. These
unit tests can be designed at this stage based on the internal module designs.
6. Validation Phase
The different Validation Phases in V-Model are explained in detail
below.
i. Unit testing
Unit tests designed in the module design phase are executed on the code
during this validation phase. Unit testing is the testing at code level and
helps eliminate bugs at an early stage, though all defects cannot be
uncovered by unit testing.
ii. Integration Testing
Integration testing is associated with the architectural design
phase. Integration tests are performed to test the coexistence and
communication of the internal modules within the system.
iii. System Testing
System testing is directly associated with the system design phase. System
tests check the entire system functionality and the communication of the
system under development with external systems. Most of the software
and hardware compatibility issues can be uncovered during this system
test execution.
12
iv. Acceptance Testing
Acceptance testing is associated with the business requirement
analysis phase and involves testing the product in user
environment. Acceptance tests uncover the compatibility issues
with the other systems available in the user environment. It also
discovers the non-functional issues such as load and
performance defects in the actual user environment.
13
Gantt Chart
Gantt Charts are the visual representation of the project task /
activity displayed against time. These charts typically outline all the
activity that are performed in a project in a systematic order to represent
critical piece of information.
A Gantt chart is made up of several different elements. Below
given are 8 key components to know how to read a Gantt chart:
• Task list: Runs vertically down the left of the Gantt chart to
describe project work and may be organized into groups and
subgroups.
• Timeline: Runs horizontally across the top of the Gantt chart and
shows months, weeks, days, and years.
• Dateline: A vertical line that highlights the current date on the
Gantt chart.
• Bars: Horizontal markers on the right side of the Gantt chart that
represent tasks and show progress, duration, and start and end
dates.
• Milestones: Yellow diamonds that call out major events, dates,
decisions, and deliverables.
• Dependencies: Light Gray lines that connect tasks that need to
happen in a certain order.
• Progress: Shows how far along work is and may be indicated
by % Complete and/or bar shading.
• Resource assigned: Indicates the person or team responsible for
completing a task.
14
Title Start Date End Date Duration (days)
Requirement Analysis
Preliminary investigation 2nd July 6th July 5
Project Topic Discussion 7th July 12th July 6
Current System Description 13th July 18th July 6
Proposed System Description 19th July 22nd July 4
Feasibility Study 23nd July 30th July 8
System Analysis
ER Diagram 2nd August 6th August 5
Class Diagram 7th August 12th August 6
Object Diagram 13th August 17th August 5
Activity Diagram 18th August 25th August 7
Sequence Diagram 26th August 1st September 6
Use Case Diagram 2nd September 8th September 7
System Design
Component Design 9th September 12th September 4
Deployment Diagram 13th September 15th September 3
15
16
17
System Analysis
18
• Attribute
An attribute describes the property of an entity. An attribute is
represented as Oval in an ER diagram.
There are four types of attributes:
1. Key attribute
2. Composite attribute 20
3. Multivalued attribute
4. Derived attribute
• Relationship
A relationship is represented by diamond shape in ER
diagram, it shows the relationship among entities. There are four
types of relationship:
1. One to One
2. One to Many
3. Many to One
4. Many to Many
• ER Diagram Symbol
Relationship Multivalued
Attribute
19
Entity Relation Diagram
20
Class Diagram
A class diagram in the Unified Modelling Language (UML) is a
type of static structure diagram that describes the structure of a system
by showing the system's classes, their attributes, operations (or
methods), and the relationships among objects.
It is a model which is used to show the classes constituting a
system and their interrelationship. It is based on UML. Only the
important attributes and methods are shown in Class diagrams. In the
initial period of analysis, the important attributes of the classes, which
must be captured and the functionalities provided by the class may not
be very clear. As the analysis progresses, the attributes and methods
may be added. If more focus is on interrelationships of classes, then the
attributes and methods may not be shown in the class diagram.
The class diagram is used to identify and classify the objects which
constitute a system. It also includes the important attributes of the
objects which must be captured.
Purpose of Class Diagrams
• Shows static structure of classifiers in a system
• Diagram provides a basic notation for other structure diagrams
prescribed by UML
• Helpful for developers and other team members too
• Business Analysts can use class diagrams to model systems from a
business perspective
A UML class diagram is made up of:
• A set of classes and
• A set of relationships between classes.
21
Class Notation
A class notation consists of three parts:
Class Name
➢ The name of the class appears in the first partition.
Class Attributes
➢ Attributes are shown in the second partition.
➢ The attribute type is shown after the colon.
➢ Attributes map onto member variables (data members) in code.
Class Operations (Methods)
➢ Operations are shown in the third partition. They are services the
class provides.
➢ The return type of a method is shown after the colon at the end of
the method signature.
➢ The return type of method parameters is shown after the colon
following the parameter name.
➢ Operations map onto class methods in code.
Name Visibility
Customer
+Display()
Text -Add()
-Remove()
#Delete()
Class Diagram
22
Class Relation Diagram
Association
Class A Class B
Aggregation
Class A Class B
Composition
Class A Class B
Association
Inheritance
Realization/
implementation
> Dependency
Aggregation
Composition
23
Class Diagram
Customer
-query: String
Name booking Hire
Email address
Username -query: String -query: String
Name Name
type course
Administrator
-query: String
Name
Email address
Username
24
Package Diagram
Package diagram are structural diagrams used to show the
organization and arrangement of various model elements in the form of
packages. A package is a grouping of UML elements, such as diagrams,
documents, classes, or even other packages. Each element is nested
within the package, which is depicted as a file folder, within the
diagram, then arranged hierarchically within the diagram. Package
diagrams are most commonly used to provide a visual organization of
the layered architecture within any UML classifier, such as a software.
Basic component of a package diagram
The makeup of a package diagram is relatively simple. Each diagram
includes only two symbols:
Symbol Image Symbol Name Description
Groups common
elements based on
Package data, behaviour, or
user interaction
Depicts the
relationship between
Dependency one element (package,
named element, etc)
and another
25
Here are the basic components you’ll find within a package
diagram:
• Package: A namespace used to group together logically related
elements within a system. Each element contain within a package
should be packageable elements and have unique name.
• Packageable Element: A named element possibly owned directly by
package. These can include events, components, use cases and
packages themselves. Packaging elements can also be rendered as
rectangle within a package, labelled with appropriate name.
26
Object Diagram
An object diagram is a graph of instances, including objects and
data values. A static object diagram is an instance of a class diagram; it
shows a snapshot of the detailed state of a system at a point in time.
Object diagrams and class diagrams are closely related and use
almost identical notation. Both diagrams are meant to visualize static
structure of a system. While class diagrams show classes, object
diagrams display instances of classes (objects).
Object diagrams are more concrete than class diagrams. They are
often used to provide examples or act as test cases for class diagrams.
Only aspects of current interest in a model are typically shown on an
object diagram.
Object diagrams are derived from class diagrams so object
diagrams are dependent upon class diagrams.
27
diagram represents an instance at a particular moment, which is
concrete in nature.
• It means the object diagram is closer to the actual system
behaviour. The purpose is to capture the static view of a system at
a particular moment.
• The purpose of the object diagram can be summarized as –
o Forward and reverse engineering
o Object relationships of a system.
o Static view of interaction.
o Understand object behaviour and their relationship from
practical perspective.
Basic Object Diagram Symbol and Notations
Object Name:
Every object is actually symbolized like a rectangle, that offers the
name from the object and its class underlined as well as divided
with a colon.
Link
Links tend to be instances associated with associations. You can
draw a link while using the lines utilized in class diagrams.
Notations:
Object Name: Classifier Name
+Attributes
28
Object Diagram
user
Sahil
SAH1L
Sahiltake98@[Link]
service Maid
hire the maid maid username
maid experience
maid Charges
Administrator
Sahil
SAH1L
Sahiltake98@[Link]
29
Activity Diagram
Activity diagram is another important diagram in UML to describe
the dynamic aspects of the system.
Activity diagram is basically a flowchart to represent the flow from
one activity to another activity. The activity can be described as an
operation of the system.
The control flow is drawn from one operation to another. This flow
can be sequential, branched, or concurrent. Activity diagrams deal with
all type of flow control by using different elements such as fork, join,
etc
30
different things that require coordination, or how the events in a single
use case relate to one another, in particular, use cases where activities
may overlap and require coordination. It is also suitable for modelling
how a collection of use cases coordinates to represent business
workflows
1. Identify candidate use cases, through the examination of
business workflows.
2. Identify pre- and post-conditions (the context) for use cases.
3. Model workflows between/within use cases.
4. Model complex workflows in operations on objects.
5. Model in detail complex activities in a high-level activity
Diagram.
The most important shape types:
• Rounded rectangle represents activities.
• Diamonds represent decisions.
• Bars represent the start (split) or end (join) of concurrent activities.
• A black circle represents the start (initial state) of the workflow.
• An encircled black circle represents the end (final state).
• Arrows run from the start towards the end and represent the order
in which activities happen.
31
Activity Diagram
Login/register
Check for
permissions
32
Sequence Diagram
A sequence diagram describes interactions among classes in terms
of an “Exchange of message over time”. Sequence diagrams are used to
depict the time sequence of message exchanged between objects.
Message can correspond to operation on class or an event trigger.
Notations of a Sequence Diagram include:
• Lifeline: It is a vertical dashed line that represents the “lifetime”
of an object.
• Arrows: They indicate flow of message between objects.
Activation: It is a thin rectangle showing period of time, during which
an object is performing an action.
Purpose of Sequence Diagram
• Model high-level interaction between active objects in a system.
• Model the interaction between object instances within a
collaboration that realizes a use case.
• Model the interaction between objects within a collaboration that
realizes an operation.
• Either model generic interactions (showing all possible paths
through the interaction) or specific instances of an interaction
(showing just one path through the interaction).
Basic Sequence Diagram Notations
• Class Roles or Participants
Class roles describe the way an object will behave in context. Use the
UML object symbol to illustrate class roles, but don't list object
attributes.
:Object component
33
• Activation or Execution Occurrence
Activation boxes represent the time an object needs to complete a task.
When an object is busy executing a process or waiting for a reply
message, use a thin grey rectangle placed vertically on its lifeline.
Messages
Messages are arrows that represent communication between objects.
Use half-arrowed lines to represent asynchronous messages.
Asynchronous messages are sent from an object that will not wait for a
response from the receiver before continuing its tasks. For message
types, see below.
:Object :Object
messages
34
Lifelines
Lifelines are vertical dashed lines that indicate the object's presence
over time.
:Object :Object
Lifeline
Destroying Objects
Objects can be terminated early using an arrow labelled "<< destroy >>"
that points to an X. This object is removed from memory. When that
object's lifeline ends, you can place an X at the end of its lifeline to
denote a destruction occurrence.
Loops
A repetition or loop within a sequence diagram is depicted as a
rectangle. Place the condition for exiting the loop at the bottom left
corner in square brackets [ ].
Types of Messages in Sequence Diagram
Synchronous Messages
A synchronous message requires a response before the interaction can
continue. It's usually drawn using a line with a solid arrowhead pointing
from one object to another.
synchronous
Asynchronous Messages
35
Asynchronous messages don't need a reply for interaction to continue.
Like synchronous messages, they are drawn with an arrow connecting
two lifelines; however, the arrowhead is usually open and there's no
return message depicted.
Simple, also used for asynchronous
Self-Message
A message an object sends to itself, usually shown as a U-shaped arrow
pointing back to itself.
Self-message
Create Message
This is a message that creates a new object. Similar to a return message,
it's depicted with a dashed line and an open arrowhead that points to the
rectangle representing the object created.
<<create>>
create message
36
Delete Message
This is a message that destroys an object. It can be shown by an arrow
with an X at the end.
<<destroy>>
X Delete Message
Found Message
A message sent from an unknown recipient, shown by an arrow from an
endpoint to a lifeline.
Found message
Lost Message
A message sent to an unknown recipient. It's shown by an arrow going
from a lifeline to an endpoint, a filled circle or an x.
Lost message
37
Sequence Diagram
38
Use Case Diagram
To model a system, the most important aspect is to capture the
dynamic behaviour. Dynamic behaviour means the behaviour of the
system when it is running/operating. Only static behaviour is not
sufficient to model a system rather dynamic behaviour is more
important than static behaviour.
In UML, there are five diagrams available to model the dynamic
nature and use case diagram is one of them. Now as we have to discuss
that the use case diagram is dynamic in nature, there should be some
internal or external factors for making the interaction.
These internal and external agents are known as actors. Use case
diagrams consists of actors, use cases and their relationships. The
diagram is used to model the system/subsystem of an application. A
single use case diagram captures a particular functionality of a system.
Hence to model the entire system, a number of use case diagrams
are used.
Purpose of Use Case Diagrams
The purpose of use case diagram is to capture the dynamic aspect
of a system. However, this definition is too generic to describe the
purpose, as other four diagrams (activity, sequence, collaboration, and
State chart) also have the same purpose. We will look into some specific
purpose, which will distinguish it from other four diagrams.
Use case diagrams are used to gather the requirements of a system
including internal and external influences. These requirements are
mostly design requirements. Hence, when a system is analysed to gather
its functionalities, use cases are prepared and actors are identified.
When the initial task is complete, use case diagrams are modelled
to present the outside view.
39
In brief, the purposes of use case diagrams can be said to be as follows-
• Used to gather a requirement of the system.
• Used to get an outside view of a system.
• Identify an external and internal factor influencing the system.
• Show the interactions among the requirement are actors.
How to draw a Use Case Diagram?
Use case diagrams are considered for high level requirement
analysis of a system. When the requirements of a system are analysed,
the functionalities are captured in use cases.
We can say that use cases are nothing but the system
functionalities written in an organized manner. The second thing which
is relevant to use cases are the actors. Actors can be defined as
something that interacts with the system.
Actors can be a human user, some internal applications, or may be
some external applications. When we are planning to draw a use case
diagram, we should have the following items identified.
• Functionalities to be represented as use case
• Actors
• Relationships among the use cases and actors.
Use case diagrams are drawn to capture the functional
requirements of a system. After identifying the above items, we have to
use the following guidelines to draw an efficient use case diagram
• The name of a use case is very important. The name should be
chosen in such a way so that it can identify the functionalities
performed.
• Give a suitable name for actors.
• Show relationships and dependencies clearly in the diagram.
• Do not try to include all types of relationships, as the main
purpose of the diagram is to identify the requirements.
• Use notes whenever required to clarify some important points.
40
Use case diagrams can be used for−
• Requirement analysis and high-level design.
• Model the context of a system.
• Reverse engineering.
• Forward engineering
Use Case Diagram
41
System Design
Component Diagram
Component diagrams are different in terms of nature and
behaviour. Component diagrams are used to model the physical aspects
of a system.
Now the question is, what are these physical aspects? Physical
aspects are the elements such as executables, libraries, files, documents,
etc. which reside in a node. Component diagrams are used to visualize
the organization and relationships among components in a system.
These diagrams are also used to make executable systems.
Purpose of Component Diagram
Component diagram is a special kind of diagram in UML. The
purpose is also different from all other diagrams discussed so far. It
does not describe the functionality of the system but it describes the
components used to make those functionalities.
Thus, from that point of view, component diagrams are used to
visualize the physical components in a system. These components are
libraries, packages, files, etc.
Component diagrams can also be described as a static
implementation view of a system. Static implementation represents the
organization of the components at a particular moment.
A single component diagram cannot represent the entire system but
a collection of diagrams is used to represent the whole.
The purpose of the component diagram can be summarized as −
• Visualize the components of a system.
• Construct executables by using forward and reverse engineering.
• Describe the organization and relationships of the components.
Component diagrams can be used to –
• Model the components of a system.
• Model the database schema.
• Model the executables of an application.
42
• Model the system's source code
Component Diagram
43
44
Deployment Diagram
Deployment diagram is a structure diagram which shows
architecture of the system as deployment (distribution) of software
artifacts to deployment targets.
Artifacts represent concrete elements in the physical world that are
the result of a development process. Deployment Diagram is usually
represented by a node which is either hardware device or some software
execution environment. Nodes could be connected through
communication paths to create networked systems of arbitrary
complexity.
Note, that component was directly deployed to nodes in UML 1.x
deployment diagrams. In UML 2.x artifacts are deployed to nodes, and
artifacts could manifest (implement) components. Components are
deployed to nodes indirectly through artifacts.
Deployment diagrams could describe architecture at specification
level (also called type level) or at instance level (similar to class
diagrams and object diagrams).
Specification level deployment diagram shows some overview of
deployment of artifacts to deployment targets, without referencing
specific instances of artifacts or nodes.
Instance level deployment diagram shows deployment of instances
of artifacts to specific instances of deployment targets. It could be used
for example to show differences in deployments to development,
staging or production.
Purpose of Deployment Diagrams
• They show the structure of the run-time system.
• They capture the hardware that will be used to implement the
system and the links between different items of hardware.
• They model physical hardware elements and the communication
paths between them.
• They can be used to plan the architecture of a system.
• They are also useful for Document the deployment of software
components or nodes.
45
Deployment Diagram
46
Table Design
• ADMIN LOGIN
Sr. No. Field Name Datatype Size Constraint Description
1. Admin_id Varchar(50) 50 Not null Holds Admin_id
2. Password Varchar(50) 5 Not null Holds Password of admin
• CUSTOMER INFO
Sr. No. Field Name Datatype Size Constraint Description
1. Customer_id Varchar(50) 50 Not null Holds customer’s id
2. Name Varchar(50) 50 Not null Holds name of customer
3. Contact_no Varchar(50) 50 Not null Holds contact no of
customer
4. Email Varchar(50) 50 Not null Holds email of customer
5. Password Varchar(50) 50 Not null Holds password of
customer
6. Address Varchar(50) 50 Not null Holds address of customer
• MAID DETAILS
Sr. No. Field Name Datatype Size Constraint Description
1. Maid_id Varchar(50) 50 Not null Holds maid’s id
2. Name Varchar(50) 50 Not null Holds name of maid
3. Contact_no Varchar(50) 50 Not null Holds contact no of maid
4. Email Varchar(50) 50 Not null Holds email of maid
5. Password Varchar(50) 50 Not null Holds password of maid
6. Address Varchar(50) 50 Not null Holds address of maid
47
System Coding & Conventions
12.1 Program Source-Code
• Homepage:
{% extends '[Link]' %}
{% load static %}
{% block body %}
<div class="w3l_banner_info">
<div class="slider">
<div class="callbacks_container">
<ul class="rslides" id="slider3">
<li>
<div class="slider-img">
<div class="slider_banner_info">
<div class="text">
<h3 class="" style="background-color : white ;
color:black;font-size:40px">We Are The Best Home Service For Making Your Home
Shine</h3>
</div>
</div>
</div>
</li>
<li>
<div class="slider-img-2">
<div class="slider_banner_info">
<div class="text">
<h3 class="wisteria" style="background-color : white ;
color:black;font-size:40px">Making your Home Shine and Spotless Is Our Business And
Priority</h3>
</div>
</div>
</div>
</li>
<li>
<div class="slider-img-3">
<div class="slider_banner_info">
<div class="text">
<h3 class="wisteria" style="background-color : white ;
color:black;font-size:40px">Our Home Service Providers will Make You Proud in
Society</h3>
</div>
</div>
</div>
</li>
</ul>
</div>
</div>
</div>
<!-- //banner-slider -->
</div>
</header>
<section class="bannerbottom py-lg-5 py-md-4 py-md-3 py-2" style="margin-top:%">
<h1 align="center" style="font-weight:bold;font-family : 'Monotype Corsiva' ; color
: #E6120E ;">All Services</h1>
48
<div class="container">
<div class="row">
{% for i in ser %}
<div class="col-md-4 col-sm-12 w3_ban1">
<div class="card">
<img class="card-img-top" src="{{[Link]}}" style = "height : 300px" alt="Card
image cap">
<div class="card-body">
<h5 class="card-title">{{[Link]}} <span style="color:red">(<span
style="color:black;font-weight:bold">{{[Link]}}</span>)</span></h5>
<p class="card-text">{{[Link]}}</p>
<a href="{% url 'explore_services' [Link] %}" class="btn btn-primary">Explore</a>
</div>
</div>
</div>
{% endfor %}
</div>
</div>
</div>
</section>
{% endblock %}
• Login:
{% extends '[Link]' %}
{% load static %}
{% block body %}
<style>
a:hover {
background-color: yellow;
padding:20px;
border-radius:8px;
}
</style>
49
<div class="callbacks_container">
<ul class="rslides" id="slider3">
<li>
<div class="slider1-img" style="height:10px">
<div class="slider_banner_info">
</div>
</div>
</li>
</ul>
</div>
</div>
</div>
<!-- //banner-slider -->
</div>
</header>
50
</div>
</div>
</section>
</section>
<!-- //contact -->
{% endblock %}
Signup page:
{% extends '[Link]' %}
{% load static %}
{% block body %}
{% ifequal error "create" %}
<script>
alert('Registration Successful');
[Link]=('{% url 'login' %}');
</script>
{% endifequal %}
<!-- //header -->
</div>
</div>
</li>
</ul>
</div>
</div>
</div>
<!-- //banner-slider -->
</div>
</header>
51
enctype="multipart/form-data">
{% csrf_token %}
<div class="row">
<div class="col-md-6">
<label for="contactusername">Username</label>
<input class="form-control" type="text"
name="uname" placeholder="Username" required="">
</div>
<div class="col-md-6">
<label for="contactemail">Password</label>
<input class="form-control" type="password"
name="pwd" placeholder="Password" required="">
</div>
</div>
<div class="row">
<div class="col-md-6">
<label for="contactusername">First name</label>
<input class="form-control" type="text"
name="fname" placeholder="First Name" required="">
</div>
<div class="col-md-6">
<label for="contactemail">Last Name</label>
<input class="form-control" type="text"
name="lname" placeholder="Last Name" required="">
</div>
</div>
<div class="row">
<div class="col-md-6">
<label for="contactusername">Email</label>
<input class="form-control" type="email"
name="email" placeholder="Email address" required="">
</div>
<div class="col-md-6">
<label for="contactusername">Image</label>
<input class="form-control" type="file"
name="image" required="">
</div>
</div>
<div class="row">
<div class="col-md-12">
<label for="contactusername">Contact</label>
<input class="form-control" type="text"
name="contact" placeholder="Phone Number" required="">
</div>
</div>
<div class="row">
<div class="col-md-12">
<label for="contactemail">Address</label>
<input class="form-control" type="text"
name="address" placeholder="Address" required="">
</div>
</div>
<div class="form-group">
<div class="col-md-12">
<label for="contactemail">Select User Type</label>
<p style="margin-
bottom:4%;padding:9px;border:1px solid lightgrey;border-radius:2px">Maid <input
type="radio" name="type" value="service_man"> <span style="margin-
left:2%">Customer</span> <input type="radio" name="type" value="customer"></p>
</div>
</div>
<button type="submit" class="btn btn-info btn-
block">Register</button>
52
</form>
</div>
<!-- //contact form grid ends here -->
</div>
<!-- contact details -->
<!-- contact map grid -->
{% endblock %}
• Serviceman Detail:
{% extends 'admin_navigation.html' %}
{% load static %}
{% block body %}
<div class="climate">
<div class="container" style="width:80%">
<h1 style="font-weight:bold;font-family : 'Monotype Corsiva' ; color :
#E6120E ;margin-top:2%" align="center">SERVICE MAN DETAIL</h1><hr>
<div class="climate-grid1">
<h3 style="padding:20px;background-color:Darkslategrey;color:white;font-
weight:bold">Service Man Detail</h3>
<div class="climate-gd1-top">
<div class="col-md-6 climate-gd1top-left">
<h4>Full Name : {{[Link].first_name}} {{[Link].last_name}}</h4>
<h4>Contact : {{[Link]}}</h4>
<h4>Email : {{[Link]}}</h4>
<h4>Date of join : {{[Link]}}</h4>
<h4>Date of Birth : {{[Link]}}</h4>
<h4>Address : {{[Link]}}</h4>
<h4>Service : {{pro.service_name}}</h4>
</div>
<div class="col-md-6 climate-gd1top-right">
<h4><img src="{{[Link]}}" style="width:25%;height:110px"></h4>
{% if pro.id_card %}
<h4><img src="{{pro.id_card.url}}"
style="width:50%;height:115px"></h4>
{% else %}
<h2>ID Card not Available</h2>
{% endif %}
<h4 style="color:white">Service : {{pro.service_name}}</h4>
<h4>Experience : {{[Link]}} year</h4>
</div>
53
• View all Serviceman:
% extends 'admin_navigation.html' %}
{% load static %}
{% block body %}
<div class="chit-chat-layer1">
<div class="col-md-12 chit-chat-layer1-left">
<div class="work-progres">
<div class="chit-chat-heading">
All Services
</div>
<div class="table-responsive">
<table class="table table-hover">
<thead>
<tr>
<th>#</th>
<th>Id</th>
<th>Service Name</th>
<th>Image</th>
<th>Description</th>
<th>Action</th>
</tr>
</thead>
<tbody>
{% for i in ser %}
<tr>
<td>{{[Link]}}</td>
<td>{{[Link]}}</td>
<td>{{[Link]}}</td>
<td><img src="{{[Link]}}"
style="width:90px;height:80px" /></td>
<td>{{[Link]}}</td>
<td style="width:100px"><a href="{% url
'edit_service' [Link] %}" ><button class="btn btn-success"><i class="fa fa-
edit"></i></button></a>
<a href="{% url 'delete_service' [Link] %}" ><button
class="btn btn-danger" onclick="return confirm('Are you sure?')"><i class="fa fa-
trash-o"></i></button></a></td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
</div>
</div>
</div>
{% endblock %}
• Add Service:
{% extends 'admin_navigation.html' %}
{% load static %}
{% block body %}
54
lightgrey"></textarea>
<input type="submit" value="Add Service" style="margin-top:10%">
</form>
</div>
</div>
{% if error %}
<script>
alert('Add 1 new service Successfully');
[Link] = "{% url 'view_service' %}";
</script>
{% endif %}
{% endblock %}
• Serviceman booking:
{% extends '[Link]' %}
{% load static %}
{% block body %}
{% if terror %}
<script>
alert('Booking Successful,we will contact you soon');
[Link]=('{% url 'customer_order' %}');
</script>
{% endif %}
</div>
</div>
</li>
</ul>
</div>
</div>
</div>
</div>
</header>
55
enctype="multipart/form-data">
{% csrf_token %}
<div class="row">
<div class="col-md-12">
<label for="contactusername">Name</label>
<input class="form-control" type="text"
name="name" value="{{[Link].first_name}}" readonly required="">
</div>
<div class="col-md-12">
<label for="contactemail">Mobile</label>
<input class="form-control" type="text"
name="contact" value="{{[Link]}}" required="" readonly>
</div>
</div>
<div class="row">
<div class="col-md-12">
<label for="contactusername">Address</label>
<input class="form-control" type="text"
name="add" value="{{[Link]}}" required="" readonly>
</div>
<div class="col-md-12">
<label for="contactemail">Date</label>
<input class="form-control" type="date"
name="date" required="">
</div>
</div>
<div class="row">
<div class="col-md-12">
<label for="contactusername">Days</label>
<select class="form-control" name="day"
required="">
<option>Select Days</option>
<option>1</option>
<option>2</option>
<option>4</option>
<option>7</option>
<option>15</option>
<option>30</option>
</select>
</div>
<div class="col-md-12">
<label for="contactusername">Hours</label>
<select class="form-control" name="hour"
required="">
<option>Select Hours</option>
<option>1-2</option>
<option>2-4</option>
<option>4-6</option>
<option>6-8</option>
</select>
</div>
</div>
56
</div>
</section>
</section>
<!-- //contact -->
{% endblock %}
• Booking Details:
{% extends '[Link]' %}
{% load static %}
{% block body %}
<style>
th{
color:black;
font-weight:bold;
}
</style>
</div>
</div>
</li>
</ul>
</div>
</div>
</div>
<!-- //banner-slider -->
</div>
</header>
57
{{[Link].service_name}}</li>
<li>Booking Date :- {{order.book_date}}</li>
<li>Booking Days :- {{order.book_days}}
Days</li>
<li>Booking Hours :- {{order.book_hours}}
Hours</li>
</ul>
</div>
<div class="col-md-4">
<img src="{{[Link].id_card.url}}"
style="width:75%">
<h4>{{[Link].id_type}}</h4>
</div>
</div>
</div>
</div>
{% endblock %}
58
12.2 Screen Layout
Homepage:
View Services:
59
Search maid:
60
User signup:
User login:
61
Maid Detail:
Maid Booking:
62
63
Maid Signup:
64
About Us:
65
System Testing
System testing of software or hardware is testing conducted on a complete,
integrated system to evaluate the system's compliance with its specified
requirements. System testing falls within the scope of black-box testing, and as
such, should require no knowledge of the inner design of the code or logic. As a
rule, system testing takes, as its input, all of the "integrated" software
components that have passed integration testing and also the software system
itself integrated with any applicable hardware system(s). The purpose of
integration testing is to detect any inconsistencies between the software units that
are integrated together (called assemblages) or between any of the assemblages
and the hardware. System testing is a more limited type of testing; it seeks to
detect defects both within the "inter-assemblages" and also within the system as a
whole.
Testing the whole system:
System testing is performed on the entire system in the context of a
Functional Requirement Specification(s) (FRS) and/or a System
Requirement Specification (SRS). System testing tests not only the
design, but also the behaviour and even the believed expectations of the
customer. It is also intended to test up to and beyond the bounds defined
in the software/hardware requirements specification(s).
Testing Used:
• At the beginning when Graphical User Interface (GUI) and functioning
of application were incorporated together voice processing wasn’t as
smooth as expected for that various set of functions has to be created to
implement the whole program.
• Testing of every function with real human voice was done at the
beginning it took time for processing but as machine got use to words
and voice-based inputs, processing became smoother as compared to
early stage.
Application was tested by human voice with different values, numbers, words
and pitch to test the computing and voice processing.
66
13.1 Validation
Test Cases, Test Results and Test Data
What is Test Case?
“A Test Case has a component that describe an input, action or event expected
response, to determine if a feature of an application is working correctly.”
Software testing can be stated as the process of validating and verifying that a
computer program/application/product:
• Meets the requirements that guided its design and development.
• Works as expected
• Can be implemented with the same characters.
• And satisfies the needs of Stakeholders.
Why we Write Test Case?
A Test Case in Software Engineering is a set of conditions or variables under
which a tester will determine whether an application, software system or one of
its features is working as it was originally established for it to do. Test Cases
bring some sort of standardization and minimize the ad-hoc approach in testing.
Test Case:
Case:
Purpose: Check for response of webpage
Assumptions: Webpage has been launched.
Steps: • Click on search maid and select
maid
• Assign the task you want your
maid to perform and select for
your preferable time.
67
Future Enhancement
This web application involves almost all the basic features of the online
maid finder and booking system. The future implementation will be
online help for the users and chatting with website administrator.
References
• Link Reference:
o Wikipedia
o [Link]
o [Link]
o [Link]
o [Link]
• Book Reference:
o Two scoops of Django for 1.11 by Daniel Greenfeld’s and
Audrey Greenfield
o Lightweight Django by Elman and Mark Lavin
68