Online Mind Mapping and Brainstorming

Create your own awesome maps

Online Mind Mapping and Brainstorming

Even on the go

with our free apps for iPhone, iPad and Android

Get Started

Already have an account? Log In

Practical Web Applications Development by Mind Map: Practical Web Applications Development
5.0 stars - 8 reviews range from 0 to 5

Practical Web Applications Development



Who am I?


Live video streaming


Mind Maps




If I am violating somebodies copyrights, please, contact me! I will remove the picture or give you a credit.I follow the \\\\\\\\\\\\\\\"Fair Use Doctrine\\\\\\\\\\\\\\\". The purpose of the Fair Use Doctrine is to allow for limited and reasonable uses as long as the use does not interfere with owners’ rights or impede their right to do with the work as they wish.


Hangout on Air

1. Zend Framework. Easy, Simple, Fast!


Let's get our hands dirty

Development Stacks



Repositories (SCM, VCS)

SCM -Source Control Management System, VCS - Version Control System,


Cloud Approaches

Cloud Development Stacks

Cloud IDEs

Cloud free public repositories (hosting code)



Cloud Step By Step Tutorial

git (DSCM, VCS)

Cloud Design

tools, frameworks, distribution systems (networks), repositories

Deployment to AppFog


ZF2 cheatsheet

PSR-0 (Pretty Standard, Really)

Getting Started with composer packages


is a development tool, designed to help you achieve clean and working PHP code by using a technique derived from test-first development called (spec) behaviour driven developement, or SpecBDD.



Red Mind


Continuous integration

The best Server IDE combinations

PPI framework Skeleton Application

ZfcUser, BjyAuthorize and Doctrine working together

Naming coding standards


To install the ZFTool you can use one of the following methods or you can just download the PHAR package and use it.

2. MVC. Model View Controller.

HTML5 kingdom


OOP - Object Oriented Programing

Design Patterns

Solutions for common problems. In software engineering, a design pattern is a general reusable solution to a commonly occurring problem within a given context in software design.

Zend Framework 2

Zend Framework 2 (ZF2) is an open-source framework for developing web applications and services with PHP. ZF2 is implemented using 100% object-oriented code, with a component structure that incorporates a \\\\\\\\\\\\\\\"use-at-will\\\\\\\\\\\\\\\" design. The ZF2 architecture is extremely flexible, using events and listeners to shape application flow. Another powerful feature is service management, which allows developers to configure shared or unique services in order to build classes via factories which can inject parameters. Leveraging advanced PHP 5.3.x features such as namespaces and closures, ZF2 incorporates advanced design patterns, including MVC, publish/subscribe, and strategy, among others.

We don't have to know the entire technology in details to start working

3. Forms.

ZF2 sources of knowledge

ZF2 Di Theory

Event Manager

MVC architecutre of ZF2

Bridge the domain Model and the View layer

4. ORM. Object Relational Mapping.

Object-relational mapping (ORM, O/RM, and O/R mapping) in computer software is a programming technique for converting data between incompatible type systems in object-oriented programming languages.

Doctrine 2



"What is first, the chicken or the egg?"


Composer is used for the modules (Doctrine)

Local workflow

5. CRUD. Create Retrieve Update Delete.

WInSCP (native app) for the sensitive files

With Cloud 9


Creating new Controller in Application

Set MIME type



The progress in ZF2

The evolution

6. JS basics.

sources of knowledge


Getting Started Example

(function(){ window.onload = function(e){ var elements, i=0; elements = document.getElementsByTagName(\\\\\\\\\\\\\\\'h1\\\\\\\\\\\\\\\'); for (i=0; i < elements.length; i++) { alert(elements[i]); elements[i].style.color = \\\\\\\\\\\\\\\'red\\\\\\\\\\\\\\\'; } };})();


Really, just like any other variable


Programming Styles


Example 1

var deferer = window.setInterval(functionToExecute, 42); // 24 frames per second

Example 2


Architecture of an app

7. JS toolkits. (frameworks???)

Dojo Toolkit

Dojo Toolkit, an Open Source DHTML toolkit written in JavaScript.


jQuery, a JavaScript framework that provides an Ajax framework and other utilities, and jQuery UI, a plug-in that provides abstractions for low-level interaction and animation, advanced effects and high-level, themeable widgets


Prototype, a JavaScript framework that provides Ajax and other utilities, and, a plug-in for animations and interface development


MooTools, a compact and modular JavaScript framework best known for its visual effects and transitions.

YUI Library

YUI Library, a set of utilities and controls, for building richly interactive web applications using techniques such as DOM scripting, DHTML and Ajax

Ext JS

Ext JS, a library that extends Prototype, Jquery and YUI until version 1.0. Since version 1.1 a standalone Ajax framework.


Backbone.js, loosely based on the Model-View-Controller application design paradigm

Server Side JS

AngularJS by Google

Twitter Bootstrap

BootstrapSleek, intuitive, and powerful front-end framework for faster and easier web development.

8. JS Zend integration.

Create a Layout

Switch the Layout in the actions

// in an action\\\\\\\\ $this->layout(\\\\\\\\\\\\\\\'layout/student\\\\\\\\\\\\\\\');

Load different JS files in the view


Use widgets (Dojo, jQuery)

View Helper Json


Disabling the layout in Zend Framework 2


Disable the layout and the view


Communicate to the server (ZF2)

Deploy to AppFog

Change the layout for a module



ini_set(\\\\\\\\\\\\\\\'display_errors\\\\\\\\\\\\\\\', 1);

9. Ajax.

Pure JS




JSON service

10. HTML5 CSS3.


What is a Web Development?

Web development is a broad term for the work involved in developing a web site for the Internet (World Wide Web) or an intranet (a private network).

What is the Web Application Development?

Web application development is the process and practice of developing web applications.

Web Application

A web application is an application that is accessed by users over a network such as the Internet or an intranet.[1] The term may also mean a computer software application that is coded in a browser-supported programming language (such as JavaScript, combined with a browser-rendered markup language like HTML) and reliant on a common web browser to render the application executable.

Software engineering

Software engineering (SE) is the application of a systematic, disciplined, quantifiable approach to the design, development, operation, and maintenance of software, and the study of these approaches; that is, the application of engineering to software.

The topics

I hold the rights to change the topics as we go.

Used tools

Lessons Learned

About using Mind Maps and Google+ Hangout for doing technical presentations

MInd Maps

Google+ Hangout


Other technologies for recording


Use HD, at least 720p

Use screen resolution of 1280x720p for YouTbe HD

codenvy was giving me [ERROR] on git push zend but no changes have been made



Cloud 9

Maybe we don't need AppFog for the students

pay atention

workflow (idea)

some students don't use the original repo to create their modules

some students keep css, js, images in the folder module

some students don't add $this->basePath() to the URLs in the layout

some students use <? echo $this->basePath(); ?>

correct the paths in css files also

codenvy approaches

frequent mistakes

12 weeks

5 projects

Open source project


Documents shared in Google Drive



JS toolkits


coding naming standards

Self project vs Zfc

Shell we use modules vs building them from scratch?

Shell we use modules vs building them from scratch? This is what we are going to use: Information for Zend: Coding Naming standards: Git Workflows: Workflow!workflow-centralized CMS systems-

Git HowTo

Skeleton App how to start?


NetBeans (very good IDE)


ideas for name

1) In composer lower case dashescoolcsn/csn-usercoolcsn/csn-cms - for composer and github/bitbucket. On github or bitbucket can be called coolcsn/CsnCMs but for the packge in composer should be lower case with dashescoolcsn/csn-user - composer name (the repo could be coolcsn/CsnUser)coolcsn/csn-aclcoolcsn/csn-menuetc. 2) In gitHub/bitbucketCan be Pascal Camel Casecollcsn/CsnUserlibracms/Libra CMS - bitbucketordoctrine/ or evenzf2-mustache-module kapitchi/KapitchiEntity 3) The module in ZF2 is Pascal Camel CaseCsnUserCsnCmsCsnAcl Notice how it is Prefixed by the name of the vendor In the composer example lower case with dashes is used for the name of the repo and packagistrepopackagist: acme/hello-worldgithub: Example: DoctrineORMModule

Lessons Learnd

DB Naming convensions


mysqladmin change password