This is the PowerPoint for my project's technical defense. Presentation notes are at http://www.slideshare.net/robattfield1/technical-defense-presentation-notes.
More information about my project can be reached at the following links:
Project Wiki: https://project.ict.op.ac.nz/Project/2013_Projects/Madmax_Development
Project Blog: http://robertattfield.com/project
2. Dragons Den presentation/pitch
Literature review
Paper-based prototyping party
Project wiki and work blog updated regularly and on time
3. Target deployment environment: responsive web
User capabilities: standard
PC’s, laptops, notebooks, smartphones, iPads,…
Accessible overWorldWide Web – with reliable internet
connection
4. Primary development language – PHP
Reasons:
Open source
Fast performance
Easily integrated into L.A.M.P stacks
Light-weight – compared to Ruby and ASP.NET
Integrates well with chosen I.D.E
5. Chosen I.D.E – NetBeans
Reasons:
Supports more than one version control system
(Git, Subversion, Mercurial, and others)
Is an open-source I.D.E
A comprehensive set of programming languages is supported
Extra capability available via community and vendor developed
plugins
6. Chosen PHP framework – Yii
Reasons:
A thriving community and support network
Support for Object Relational Mapping (ORM) is provided – with the
use ofActive Record
It provides full support and development with the M.V.C structural
pattern
Excellent performance speeds – including efficient use of AJAX
It is one of the most secure PHP frameworks in use
7. Yii architectural structure and
work flow
Example URL:
http://www.example.com/
index.php?r=post/show&id=1
Source: http://www.yiiframework.com
8. Chosen libraries and third-party tools:
DHTMLX – comprehensive tools for charts, U.I components,AJAX
integration
HTML5 Boilerplate – tools for making web application responsive
9. Version control tools:
Git
Subversion
Atlassian BitBucket
Project management tools
Project wiki
Work log (www.robertattfield.com/project)
Daily organiser
11. • Demonstration of C.R.U.D operations at
http://kate.ict.op.ac.nz/~attfire1/yiitest/
12. • Displaying retrieved statistics in visual forms (charts and graphs)
• Retrieving, storing, and displaying energy usage statistics of
Dunedin as a whole
• Creating high impact display of real-time energy use
• Measuring present and future energy literacy of Dunedin
MinimumViable Product:
Notas del editor
Hi everyone, I’m Rob Attfield, and I am the sole member of Mad Max Development. For this presentation, I will discuss progress to date, go over some of the technical aspects of this project, and discuss the project’s expected development pathway.
For the project so far, I have achieved three main deliverables. These are:Dragons Den Pitch – this enabled me to receive some good constructive feedback I could use in the project, as well as point out some concerns to think about for the rest of the project.Literature Review – this helped me gain a wider understanding of the problems my project aims to solve. Involved looking at various case studies of similar-themed projects.Paper-based Prototyping Party – This enabled me to help cement my knowledge of use cases, functional requirements, and task analysis, by seeing how people interacted with a representation of my project. The next parts of the presentation will now focus primary on technical aspects of the project.
The target deployment platform chosen for the energy meter is web-based. This platform was chosen because it can reach people on a wide scope – people will be able to see the energy meter on many different types of web-enabled devices - such as smartphones, laptops and notebooks, desktop P.C’s, and iPads.
As PHP has extensive community support, room for flexibility, is open-source, and provides excellent learning materials, it has been selected as the primary programming language for this project. PHP is also built into web development server stacks – in particular, the L.A.M.P (Linux, Apache, MySQL, and PHP) stacks. With other projects also using PHP as their language of choice, there will be access to real person-to-person advice and mentor-ship. PHP also integrates easily with other languages, and is also widely used – popular examples include Facebook, Google, and Wikipedia. As these sites have a clear ability to handle large data through it’s PHP backend, it was one of the deciding factors for it to be the chosen language. Additionally, it performs two times faster than my second alternative language – Ruby on Rails. As it is open-source, it was also a deciding factor over another alternative language – ASP.NET.
To decide on the right I.D.E for my project was quite difficult – I’ve had 4 years experience using various versions of Adobe Dreamweaver, so it was quite hard to remain unbiased in my choice. I ended up choosing NetBeans as my logical choice of I.D.E, because:Support for more than one versioning control system is availableGitSubversion (SVN)MercurialAnd othersNetBeans is available to developers on an open-source basisA more comprehensive set of programming languages is supportedExtra capabilities can be added by community-developed and official NetBeans-created plug-insExcellent community support and resources
For this project, I have decided to use the Yii framework. The reasons why I have made the selection include:A thriving community and support networkExcellent learning resourcesSupport for Object Relational Mapping (ORM) is provided – with the use of Active RecordIt provides full support and development with the M.V.C structural patternExcellent performance speeds – including efficient use of AJAXThe framework offering a well-developed plugin for my chosen I.D.E , NetBeansIt is one of the most secure PHP frameworks in use, with functionality to help mitigate security breaches - such as SQL injections, Cross Site Scripting attacks (XSS), Cross Site Request Forgery attacks (CSRF), and input/output validation.
Application Logic ArchitectureAs I have chosen Yii as my coding framework of choice, I will be following the M.V.C logical structure. The diagram on this slide, directly sourced from Yii's online documentation, shows the logical structure of a Yii-based web application.The following list describes the work-flow displayed in the above diagram in a series of logical steps:A user makes a request with the URL http://www.example.com/index.php?r=post/show&id=1 and the Web server handles the request by executing the bootstrap script index.php.The bootstrap script creates an Application instance and runs it.The Application obtains detailed user request information from an application component named request.The application determines the requested controller and action with the help of an application component named urlManager. For this example, the controller is post, which refers to the PostController class; and the action is show, whose actual meaning is determined by the controller.The application creates an instance of the requested controller to further handle the user request. The controller determines that the action show refers to a method named actionShow in the controller class. It then creates and executes filters (e.g. access controls, benchmarking) associated with this action. The action is executed if it is allowed by the filters.The action reads a Post model whose ID is 1 from the database.The action renders a view named show with the Post model.The view reads and displays the attributes of the Post model.The view executes some widgets.The view rendering result is embedded in a layout.The action completes the view rendering and displays the result to the user.
DHTMLXis a feature-packed Javascript-based library with numerous tools for web developers. Here are some of the reasons why DHTMLX is one of the most preferred libraries amongst developers:Provides a complete Javascript toolkit with expert supportProvides comprehensive open-source library, and impressive Commercial equivalentQuickly build web U.I with dhtmlxLayoutUse visual designer to build application U.IProvides a global data store for all DHTMLX components used in a web-based applicationClient-server data communicationOnline skin builderI also looked at using the popular jQuery library to create implementations for charts, AJAX-powered animations, and dynamic data visualizations, but I saw that DHTMLX offered far more features – especially ones for charting and displaying dynamically changing data.HTML5 BoilerplateTo aid in making the project responsive to a wide range of devices, HTML5 Boilerplate was chosen to achieve those objectives. This library allows the web developer to use a series of pre-built HTML5 and CSS3 templates to create great looking sites compatible across many devices. The developer can also make customizations the way they see fit – making the most out of the developer’s talents and HTML5 Boilerplate’s convenient features.
GitI intend to use Git for version control because it integrates very well with AtlassianBitbucket – which works very well with integrating source code with development, staging, and production servers. Git also has a substantial support and community network – which will prove important if I encounter issues I cannot solve on my own. Git is also open-source, and has been proven to handle both small and very large projects. Examples of well-known companies using Git are Google, Facebook, Twitter, Microsoft, and LinkedIn.While working with source code and Git together, I will be creating development, staging, and production branches to manage source code across each environment. Code will first be developed on the development machine, then be committed to the staging branch and pushed to the staging server – where functionality testing will be carried out. Once testing on the staging server passes, code will then be committed to the production branch and pushed to the production machine – the live web server. If bugs occur in either the staging or production branches, I can pull from either branch into the development branch, and rectify the issues causing the bugs. Subversion (SVN)SVN is another well-known tool for versioning control – it comes with a simple Graphical User Interface (G.U.I) that allows people to simply commit file revisions to a SVN server. Unfortunately, SVN is not supported by AtlassianBitbucket, but it integrates very well with most I.D.E’s – including my chosen I.D.E, NetBeans.I have been using SVN to back up documentation and materials since the beginning of the project, without any significant issues. I will be continuing use of SVN to source-control my documentation.AtlassianBitbucketI have chosen to work with AtlassianBitbucket because it integrates well with Git, and allows me to commit and push files between my development, staging, and production servers. BitBucket is not open-source; however, it does offer free usage for up to five team members, and also free unlimited repositories. In my Workflow Pattern, I will be describing how I plan to integrate BitBucket with Git, and how I plan to use it during actual development.
This diagram represents the general work-flow I intend on following during development. Step 1 – Commit code on development branch to BitBucket serverStep 2 – Pull code on development branch from BitBucket to staging branch on staging serverStep 3 – Once code is successfully tested, put code from staging to production branch, then push to BitBucketStep 4 – Push code from production branch on BitBucket to production branch on Production serverStep 5 – If bugs are found on Production server, push them to BitBucketStep 6 – Pull buggy code to staging server, find out cause of bug, then create a bug fix branchStep 7 – Push bug fix branch to BitBucketStep 8 – Pull bug fix branch to Development machine, fix bug, merge bug fix branch with Development branch, then commit steps 1 through 4
For the Minimal Viable Product, the main concern will be retrieving data required to produce energy usage statistics. This will include analysing:Finding out how the data is stored on the external server/sSeeing what format the data is stored inHow to format data to suitable storage on Debian MySQL DBMSFinding out what data can be accessed and provided for useOnce these areas are looked at, necessary refinements to the database structure will need to be made. From there, a minimum viable product will be able to be developed, which will include the below functionality:Retrieving, storing, and displaying energy usage statistics of Dunedin as a wholeDisplaying retrieved statistics in visual forms (charts and graphs)Creating high impact display of real-time energy use – an energy meter in the style of a gaugeThe web application being responsive across many types and sizes of devicesMeasuring current energy literacy of Dunedin – done by surveys, and discussions with environmental groups