JENGO

_____________________________________________________________

A NEW PROPERTY MANAGEMENT WEB & MOBILE APPLICATION FOR BOTH

LANDLORDS AND TENANTS

by

LEONARD NOVATI

Advisor

DR. DANIEL PLANTE

A final senior research paper submitted in fulfillment of the requirements

for the degree of Bachelor of Science

in the Department of Mathematics and Computer Science

in the College of Arts and Science

at Stetson University

DeLand, Florida

Spring Term

2015

1

TABLE OF CONTENTS

ABSTRACT ............................................................................................................................. 2

1. Introduction .................................................................................................................. 3

2. Related Work ............................................................................................................... 4

3. Implementation ............................................................................................................ 6

3.1 Front End

3.1.1 Bootstrap Framework

3.1.2 Why Bootstrap

3.2 Back End

3.2.1 Amazon EC2

3.2.2 Why Amazon EC2

3.2.3 Yii Framwork

3.2.4 Why Yii Framwork

3.3 WePay

3.4 Mobile

3.5 Designing Tools

3.6 Testing Tools

4. Conclusion.................................................................................................................. 33

REFERENCES ....................................................................................................................... 34

2

ABSTRACT

The purpose of this senior research project is to create a convenient and

affordable property management application. The Jengo Property Management System

has features available to both landlords and tenants, simplifying communication

between the two. Jengo provides property managers with easy access to data related to

their properties while allowing tenants access to information on their unit, maintenance

requests, and rental payments.

Most property management systems do not include a tenant portal. The lack of

tenant interface limits them the ability to communicate with their landlords and obtain

the services they require in the appropriate time. Jengo fills this gap by providing a

unified solution that satisfies the needs of both user types. In this research project

already available tools, libraries and packages are utilized to help rapid the application's

development. This paper explore Jengo's features, as well the technologies used to

develop it and how they were used.

3

1. Introduction

With the rapid growth of technology, companies and individuals have developed

software and web applications that assist property managers administrating their

properties easier and faster. However, most of these applications were developed for big

property management firms. Landlords owning only few properties and operating on

limited budgets find these products too expensive to purchase.

Also, these applications usually have few features in the tenants portal. The most

common feature found in these existing applications is a payment system that allows

renters to pay and view rental history online. Jengo's goal is to provide tenants with more

features than simply remaining abreast with payments. The targeted audience for Jengo

includes; Personal, Apartment Rental buildings, and Real Estate Management

Companies.

Modern day web application does not have to be developed fully from scratch.

Developers have developed public tools that anybody can use in their project.

Incorporating existing technologies into a project is not always easy. However if these

technologies are studied well, it saves developers a lot time. This technique is being used

more rapidly, hence it was given an acronym: RAD (Rapid Application Development).

Jengo as well used this method. Some of the tools utilized include Bootstrap, Amazon

EC2 server, Yii framework, WePay, MySQL workbench, fluidui, Postman - REST

Client, and Xampp

4

2. Related Work

While a number of property management applications exist in the market, the

three that appear as the leaders are: Buildium[1], AppFolio[9] and Yardi[10]. Each

application has its own model, however researching them deeper, they are considerable

similarities between them. In this paper take a look in more detail Buildium Property

Management.

Buildium Property Management[1]

Buildium property management is a web-based application that allows for large

property management firms to manage their properties. Buildium gives these firms

complete control of their business..

Buildium has partners that allow it to list available properties. Companies such as

Zillow, Trulia, and Craigslist, play a big role behind the success of Buildium. Also,

Buildium has its own free marketing website, where users can fill out their rental

applications on their website. The applications are then saved into Buildiums database.

Buildiums most effective feature is being able to do online tenant screening for running

background checks.

One of its best rated service is being able to provide customer support 24/7 both

online and on the phone. They provide services without making their clients sign a

contract or pay annual fees. Users can try this application for 15 days free of charge. If

they decide to cancel the membership before the trial ends, they do not get charged.

While Buildium has many attractive and useful features on the manager side, on

the tenants' portal, it only provides a payment system.

5

Buildium's pricing is scaled to fit the number of units managed by a business. The

cost for managing 50 units is $50 a month, 100 units for $100 and 500 units for

$350[Figure 14-Buildium's pricing]. Property managers with fewer than 50 units pay a

premium for using this software. For businesses with over 500 units, a small per-unit cost

in incurred.

Figure 14-Buildium's pricing

6

3. Implementation

For this research project, preexisting technologies and libraries were used to make

the development of this system efficient and easy to use. The frameworks and

technologies used on both the front and the back end are detailed below.

3.1 Front End

3.1.1 Bootstrap Framework[2]

Bootstrap provides tools that allowed web designers and developer to create

websites and web applications. Being a front end framework, It contains HTML and CSS

based design templates for text, forms[Figure 15-Simple-Form], buttons[Figure 16-

Simple-Buttons], navigation[Figure 17-Simple-Nav-Bar] and other components. Also, it

has JavaScript extensions that are open source and available on GitHub.

7

Bootstrap framework was developed by Mark Otto and Jacob Thornton

from Twitter . Their goal was to find a way to encourage consistency across internal

tools. Before Bootstrap, various libraries were used for interface development, which led

to headache because projects were not consistent. Maintenance under these circumstances

was difficult to manage. It was hard to determine how to adhere to consistent

programming standards for project with many developers. Since August 2011, bootstrap

has been released on GitHub as an open source product. There is no surprise that, in June

2014, it was the number one project on GitHub.

8

3.1.2 Why Bootstrap

Rather than ask why one should use Bootstrap, maybe the question should be why

doesn't every development team choose Bootstrap as their front end framework. With

Bootstrap, web developers do not have to spend a lot time writing HTML and CSS file to

customize the look of their website. Bootstrap takes care of all of the tedious work

associated with device dependency and independent browsers for the front end of an

application. Since the release of Bootstrap 3, the framework consists of mobile-first styles

throughout the entire library. This means that there's no need for checking if the user is

on a mobile or desktop browser to scale pages accordingly. It is supported by all popular

browsers. Its' responsive CSS adjusts to Desktops, Tablets, and Mobile phones. Because

Bootstrap is programmed in HTML, CSS, and JavaScript, learning Bootstrap is easy.

With just the knowledge of HTML and CSS anyone can use Bootstrap. Its Scaffolding

feature contains layout, grid system, fluid grid system, and responsive design. Its base

CSS contains classes for typography, tables, forms, buttons, images, and more. Bootstrap

has reusable components: icons, dropdowns, navigation bars, breadcrumbs, and alerts. Its

JavaScript Plugins contain over a dozen custom jQuery plugins. On the side note, it

allows developers to customize Bootstrap's components, LESS variables, and jQuery

plugins to create their own versions. The most import reason why bootstrap was used in

the Jengo project, it's because it works with yii framework which will be described

below.

9

3.2 Back End

3.2.1 Amazon EC2[3]

Amazon Elastic Compute Cloud or Amazon EC2 provides computing in the

Amazon Web Services (AWS) cloud. Using Amazon EC2 eliminates the need to invest in

hardware up front. Therefore, developers can develop and deploy applications more

quickly, making them available to the public faster. Amazon EC2 can be used to launch

as many or as few virtual servers as required. The developer has control over the system

and it's storage.

3.2.2 Why Amazon EC2

Amazon EC2 provides many features that developers find useful. The

following are useful features that Amazon EC2 offers.

Virtual computing environments known as instances.

It has preconfigured templates for instances, known as Amazon Machine Images

(AMIs). The machine includes an operating system and other software needed to

make a web application run. Jengo is currently using Linux AMI as an operating

system.

Instance types has various configurations of CPU, memory, storage, and

networking capacity for any instance.

It allows system administrators to manage their server and applications from

anywhere on the web. However, login the instance is very secure. It uses key pairs

(AWS stores the public key, and I store the private key in a secure place) which

allows developers to SSH into their instances.

10

If the instance is terminated, the data that was already there is not lost, Storage

volumes stores data .

The instance is available in multiple physical locations.

It has a firewall that enables developers to specify the protocols, ports, and source

IP ranges that can reach instances using security groups

Static Elastic IP addresses are available for dynamic cloud computing.

Currently all data of Jengo is up and running in the ec2 instance[4]. Amazon is

kind enough to give out a whole full year of cloud computing for free. Our instance is

running Linux AMI[Figure 18 -Amazon Linux AMI]. When an instance is created, it has

no packages installed in it. The programmer is responsible to install all packages that are

required for their website to run. Currently Jengo instance has more than 180 packages

installed[Figure 19 - packages installed]. These packages include current versions of

mysql and php. This free trial will be used to develop and test Jengo and hopefully when

the project gets into production.

11

12

3.2.3 Yii framwork[4]

Yii is a free, open source back end Web application development

framework written in PHP5 that has clean, DRY design and encourages fast

development. It makes application development fast and helps to ensure a very efficient,

extensible, and maintainable end product.

Being very performance improved , Yii is a perfect choice for the size of a

project like Jengo. Yii has been built with enterprise applications in mind. It gives

developers full control over the setup from beginning to end to obey rules of any project

development guidelines. It comes packaged with tools to help test and debug application,

and has clear, complete and thorough documentation. The name Yii is a (word made up

from the first letters of words) for "Yes It Is!".

3.2.4 Why yii

Yii comes with rich features: MVC, DAO/ActiveRecord, I18N/L10N,

caching , and role-based access control, testing, etc. The following features will reduce

development time of Jengo significantly.

Yii supports Model-View-Controller (MVC) design pattern.

it adopts the proven MVC architecture, which allows for clean separation of

concerns (SoC)[ Figure 19 - Yii MVC].

Form input and validation

Collecting form input is extremely easy and safe. It comes with a set of

valuators as well as numerous helper methods and widgets to simplify the task

for form input and validation.[Figure 20, 21]

13

Automatic code generation

it provides a set of intuitive and highly extensible code generation tools that help

developers quickly generate the code they need for features such as form input,

and Model, Controller and CRUD.

It has Database Access Objects , Query Builder, Active Record, DB Migration

which allows developers to model database data in terms of objects and avoid the

tedium and complexity of writing repetitive SQL statements.

AJAX-enabled widgets

Integrated with jQuery, Yii comes with a set of AJAX-enabled widgets, such as

auto-complete input field, tree view, data grid, which enables writing highly

efficient and versatile user interface extremely simple.

Web services

Supports automatic generation of complex WSDL service specifications and

management of Web service request handling.

Authentication and authorization

it has built-in authentication support. It also supports authorization via

hierarchical role-based access control (RBAC).

Security

Yii is equipped with many security measures to help prevent Web applications

from attacks such as SQL injection, cross-site scripting (XSS), cross site request forgery

(CSRF), and cookie tampering.

With the new version yii 2.0, implementing RESTful API have been modified to

14

be easier than one from yii 1.0. Jengo will be using a Restful Api to access information

from the database from mobile devices. such as, logging in, writing, reading and updating

into the database. Yii allows page contents to be parsed into Json objects. These objects

are then used to extract needed information to display on mobile devices. This techniques

saves the developer from having to write a separate backend model for just mobile

devices as only one can serve both mobile and browsers. However at the time of this

paper was written, Jengo programmers did not reach the stage of creating its android

version as they are still working on the web application.

15

3.3 WePay

WePay is an online payments processing service provider. It handles different

transactions for a variety of reasons. From donation campaigns, online merchants, to

events, WePay is a great platform to start accepting payments online. WePay is the most

flexible and easy to use payment processing solution designed specifically for platforms,

such as marketplaces, crowd funding sites and small business solutions.

It makes sense to use WePay for property managers to accept payments and for

tenants to pay their rents online. WePay has tons of features including:

All interactions with users

Checkout & onboarding experience

Merchants setup their own accounts

16

Own all of the customer relationship

Risk free

Chargebacks

Fraud detection

Account Takeovers

Money Laundering

They take care of:

1099-K tax filings

Visa, Mastercard & Amex compliance

PCI security to protect your customers

AML/BSA

Desktop or natively mobile optimized:

Easy-to-use documentation

SDKs

Code examples

24/7Team:

Integration design consultation

Developer support

Tier 2 support for your support teams

Support for your end-user, on request

Account management & success planning

A single API for US & Canada:

17

Same seamless experience in Canada

No additional work for developers

Plans to expand to the rest of the world

There is no need to worry about saving sensitive information about clients as

WePay takes care of that. Setting up WePay API is easy. All that needs to be done is

download WepPays sdk from gitHub. The sdk comes in different languages, from php to

ruby. In the case of Jengo, the php sdk is used as its backend is a mostly php. When the

sdk is downloaded, it comes with examples on how to create a merchant and buyer

account, how to make and receive payment. Developers create an account with WePay to

get access to their api calls for their platform. Basically each platform is given a token

that can only identify it, then the platform would allow its sellers and buyers to create

their own accounts.

3.4 Mobile

Jengo will have a mobile application to allow users to use its features from any devices.

Xamarin seems like a good product to use since is a Cross-platform development tool.

3.4.1 Xamarin.Mobile [5]

Xamarin.Mobile is a library that exposes a single set of APIs for accessing

common mobile device functionality across iOS, Android, and Windows

platforms. This increases the amount of code developers can share across mobile

platforms, making mobile app development easier and faster.

Xamarin.Mobile currently abstracts the contacts, camera, and geo-location

18

APIs across iOS, Android and Windows platforms. Future plans include

notifications and accelerometer services.

According to its documentations, A developer should be able to write an

app in c# and will be able to disturb it to multiple devices. This is a time saver of

having to create two separate mobile app for android and iphones.

However, Jengo developers ended up not using Xamarin as it is a tool that

requires time to learn it and such time was not available. It was decided to focus

on one mobile operating system for now until the web version was done. Eclipse

for Android[Figure 22: Eclipse for Android] was used to create and test an

android app of Jengo. As mentioned earlier in the yii framework under restful api,

data are pulled from a restful api on the server where Jengo is hosted then the data are

passed into the android sdk to display to the user in their mobile devices.

19

3.5 Designing Tools

For designing and modeling purposes , Mysql Workbench[Figure 7] and Fluidui

are used in this project.

Mysql Workbench

Mysql Workbench allows database designer to design and model their database

with full functionalities such entity relationship, primary keys, foreign keys and

normalization. Designers can connect their database model to their database administrator

software in this case phpMyAdmin. Any changes made in either side is synced by just a

push of a bottom[Figue 26 Jengo Database Model].

20

Figure 26 Jengo Database Model

21

Fluidui

Fluidui[all form figures you see here] was used to design front end pages

including forms. It is always a good idea to design views before implementing them.

Fluidui makes this processes easier. Forms and pages can be designed and exported for

the planning process. It has a feature where a designer can see how it would look like in

devices of different sizes; from computer, mobile, tablet to ipad browsers[Figure 23

Fluidui Views Design]. Views and pages can be mocked and have the links behave as

they have been implemented already .

3.6 Testing Tools used,

Postman

Postman is a REST Client used to test Restful apis. With Postman, developers can

construct simple as well and complex requests quickly from authentication,

GET, POST, PUT, PATCH, DELETE, and more. These requests can be saved for later

use and analyze the responses sent by the API[Figure 24 Postman restful api testing].

22

Postman can dramatically cut down the time required to test and develop a restful APIs.

Postman adapts itself for individual developers, small teams or big organizations equally

well. This is where Jengo Developer test Yiis restful api before is implemented for the

mobile application.

Xampp

XAMPP is a PHP development environment. XAMPP is a completely free, easy

to install Apache distribution containing MySQL, PHP, and Perl. The XAMPP open

source package is set up to be incredibly easy to install and to use. In the case of Jengo,

Xampp is used as a local sever. The entire application is developed and tested locally

before is put into preproduction review.

23

4 The Jengo Application

The word "Jengo" is a Swahili word that means building or property. The name

was chosen because it is easy to remember and it hasn't been used as a software or web

application product.

4.1 Type of users and their functionalities

At the moment, Jengo has three type of users; Admin[Figure 1-Admin

Homepage], Manager[Figure 2-Manager Homepage] and Tenant [Figure 3-Tenant

Homepage]. Each user type is given access levels so they can access functionalities that

fits them. All user types are given add, update and delete functionalities only to features

that have been granted to them according to their access level. Jengo has tons of features.

Some features are given to all user type while others can be accessed at a higher level.

24

Some of the functionality Jengo has at the time of writing this paper includes but not

limited to:

Admin

The admin is the highest user that a property can have. Admin is granted all

access that the manager and Tenant has. Plus feature that makes them distinct from other

user types[Figure 1-Admin Homepage].

Add, Update, Delete Admin [Figure 6-Add Admin]

Add, Update, Delete Manager [Figure 7-Add Manager]

Add, Update, Delete Property [Figure 8-Add Property]

Add, Update, Delete Structure [Figure 9-Add Structure]

Add, Update, Delete Unit [Figure 10-Add Unit]

Add, Update, Delete Payment Account[Figure 11-Setup Payment Account]

When a property owner signups with Jengo, a new account is created and given

an admin access to their company or properties. After the signup, an email is sent to the

their email they have provided in the sign up process. This email contains a link to their

Jengo portal, and information to get started. The admin is required to setup a Wepay

merchant account with Jengo before moving on to the next step. After setting up a WePay

account, they setup all properties that they would like to manage. A property has

structures. If the property does not have a structure, the property name becomes the

structure. Structures has units. Again if a structure does not have a unit, the structure

name is used as the unit.

After the admin adds properties, structures, and units, they can then add managers

25

with their appropriate properties to manage

Manager

Managers have no access to any of the admin features. Managers cannot adds,

update or delete properties, structures, and units. However, they can do the following plus

all tenants functionalities.

Add, Update, Delete Tenants

Tenant and lease tracking[Figure 4-Tenants-Tracking, Figure 5-Lease-Tracking]

Automated rent and late fee reminders

Rent collection online payments tenant portal.[ Figure 12-Making Payment]

Easy Reporting

Contracts, Lease Renewal, Lease Terms and Length

When managers is given properties to manage, an email is sent to them conforming that

they have been given a manger access level with login information and properties they

manage. After they conform and login, they can then start adding tenants.

Tenant

Tenant has few features then other two users type. However, they have been given

features that are suitable for a tenant user.

Automated rent and late fee reminders

Make payments online [Figure 12-Making Payment]

Maintenance Request with image(on mobile only) [Figure13-Mainenence-

Request]

Make Complaints/Safety Reminders

26

Tenants are not required to use Jengo however it is encouraged as it saves both

managers and tenants time. When a tenant is added, an email is sent to them with their

login credential and more information about the benefits of using Jengo. If they decide to

use Jengo, they are then asked to set up a WePay buyer account so they can start paying

their rent online.

27

28

29

30

31

32

33

5 Conclusion

As of today, numerous property management software products and web

applications exist in the market. Some of these applications are developed by individuals

or companies to help large property owners manage their properties easier and faster. For

landlords who do not own a many properties, it is difficult for them to find an affordable

tool that could meet their needs as most solutions require the manager to own at least five

properties. These applications also lack features for the tenant's portal.

The goal for Jengo is to give tenants more feature and make communication

between the property manager(landlord) and the tenant active and fast. Jengo is a solution

for most landlord and tenant problem; in addition, Jengo is a cross devices application.

Existing technologies, tools, and libraries were used in the development of Jengo.

Upon initial release of the product, additional features for both landlords and tenants will

be developed based on the customers' demands.

34

REFERENCES

[1] Buildium Property Managment Software. (n.d.).from http://www.buildium.com

[2] Bootstrap · The world's most popular mobile-first and responsive front-end

framework. (n.d.). from http://getbootstrap.com

[3] Amazon Web Services (AWS) - Cloud Computing Services. (n.d.). from

http://aws.amazon.com

[4] Testing website http://jengo.zapto.org//

[5] The Fast, Secure and Professional PHP Framework. (n.d.). from

http://www.yiiframework.com

[6] MySQL :: The world's most popular open source database. (n.d.). Retrieved from

http://www.mysql.com

[8] Join 208,761 designers in 189 countries who use Fluid UI to prototype their

mobile apps. (n.d.). from http://www.fluidui.com

[9] Property Management Software | AppFolio.com. (n.d.). from

http://www.appfolio.com/

[10] Property Management Software & Asset Management Solutions | Yardi Systems.

(n.d.). from http://www.yardi.com/

[11] Apache Friends. (n.d.). from https://www.apachefriends.org/index.html

[12] WePay. (n.d.), from https://www.wepay.com