SlideShare a Scribd company logo
1 of 60
Download to read offline
MVC
Jace Ju
MVC
• http://huoding.com/2011/05/02/64
•            Xerox PARC
  Smalltalk
MVC
•              UI

•         UI
MVC
MVC




Controller           View




             Model
MVC




Controller                    View

                 Controller   Model
             (                        )



             Model
MVC




Controller                           View
             Controller     View


                                   View   Model



                   Model
MVC


                            View




Controller           View




             Model
MVC


     Controller




Controller                View




                  Model
MVC




     Controller            View


Controller
                          Model   View
  Model



                  Model
MVC




         View



Controller              View




                Model
MVC
•                     Controller

• View   Controller


•
MVP
MVP




Presenter            View




            Model
MVP



                                         View




Presenter                         View
            View      Presenter




                   Model
MVP




Presenter                         View

            Presenter     Model




              Model
MVP


                                    View




Presenter                         View
            View      Presenter




                   Model
MVP




  Presenter            View


Persenter
     Model


              Model
MVP



                               View




Presenter               View
            Presenter
            Model
               View




            Model
MVP
•          View
    View

• Presenter          Controller
              View

•          WinForms

•                    Supervising Controller
    Passive View
Supervising Controller
•    View        Model


•      MVC   Controller
Passive View
•    Presenter       Model
       View

• View           Model

• Presenter
• View
MVC / MVP
...
Web Application
MVC
Web MVC
•       Web MVC       Java      Model 2

•        Java     Struts

• PHP      PHPMVC

•               Ruby on Rails

•               Web Framework
   Web MVC
<?php
//        (index.php)
$link = mysql_connect('127.0.0.1', 'username', 'password');
mysql_query('SET NAMES utf8');
mysql_select_db('mvc', $link);
?>
<!DOCTYPE html>
<html>
<head><meta charset="UTF-8" /><title>News</title></head>
<body>
<?php
$sql = "SELECT * FROM news "
      . "WHERE onlineDateTime <= NOW() "
      . "AND NOW() < offlineDateTime ORDER BY id";
$result = mysql_query($sql, $link);
?>
<ul class="posts">
<?php while ($row = mysql_fetch_assoc($result)): ?>
<li><a href="detail.php?id=<?php echo intval($row['id']); ?>">
<?php echo htmlspecialchars($row['title']); ?>
</a></li>
<?php endwhile; ?>
</ul>
</body>
</html>
<?php
mysql_close($link);
?>
<?php
//        (detail.php)
$link = mysql_connect('127.0.0.1', 'username', 'password');
mysql_query('SET NAMES utf8');
mysql_select_db('mvc', $link);
?>
<!DOCTYPE html>
<html>
<head><meta charset="UTF-8" /><title>News</title></head>
<body>
<?php
$id = (int) $_GET['id'];
$sql = "SELECT * FROM news "
      . "WHERE onlineDateTime <= NOW() "
      . "AND NOW() < offlineDateTime AND id = $id";
$result = mysql_query($sql, $link);
?>
<div class="post">
<?php if ($row = mysql_fetch_assoc($result)): ?>
<h1><?php echo htmlspecialchars($row['title']); ?></h1>
<div><?php echo nl2br(htmlspecialchars($row['content'])); ?></div>
<?php endif; ?>
</div>
</body>
</html>
<?php
mysql_close($link);
?>
View
View
<?php
class View {
    private $_vars = array();

    public function __set($name, $val) {
        $this->_vars[$name] = $val;
    }

    public function __get($name) {
        return isset($this->_vars[$name])
             ? $this->_vars[$name]
             : null;
    }

    public function display($tpl) {
        include $tpl;
    }
}
<?php
//       (index.php)
$link = mysql_connect('127.0.0.1', 'username', 'password');
mysql_query('SET NAMES utf8');
mysql_select_db('mvc', $link);

$sql = "SELECT * FROM news "
     . "WHERE onlineDateTime <= NOW() "
     . "AND NOW() < offlineDateTime ORDER BY id";
$result = mysql_query($sql, $link);

$newsList = array();
while ($row = mysql_fetch_assoc($result)) {
    $newsList[] = $row;
}

require_once 'View.php';
$view = new View();
$view->newsList = $newsList;
$view->display('index.tpl');

mysql_close($link);
?>


<!DOCTYPE html>
<html>
<head><meta charset="UTF-8" /><title>News</title></head>
<body>
<ul class="posts">
<?php foreach ($this->newsList as $row): ?>
<li><a href="detail.php?id=<?php echo intval($row['id']); ?>">
<?php echo htmlspecialchars($row['title']); ?>
</a></li>
<?php endforeach; ?>
</ul>
</body>
Model
Model
<?php
// News.php
class News {

    private $_link = null;

    public function __construct() {
        $this->_link = mysql_connect('127.0.0.1', 'username', 'password');
        mysql_query('SET NAMES utf8');
        mysql_select_db('mvc', $this->_link);
    }

    public function __destruct() {
        mysql_close($this->_link);
    }
Model (           )
    public function findAll() {

        $sql = "SELECT * FROM news "
             . "WHERE onlineDateTime <= NOW() "
             . "AND NOW() < offlineDateTime ORDER BY id";
        $result = mysql_query($sql, $this->_link);

        $newsList = array();
        while ($row = mysql_fetch_assoc($result)) {
            $newsList[] = $row;
        }
        return $newsList;
    }

    public function find($id) {
        $sql = "SELECT * FROM news "
             . "WHERE onlineDateTime <= NOW() "
             . "AND NOW() < offlineDateTime AND id = $id";
        $result = mysql_query($sql, $this->_link);

        return mysql_fetch_assoc($result);
    }
}
Model
<?php
//      (index.php)

require_once 'News.php';

$newsModel = new News();
$newsList = $newsModel->findAll();

require_once 'View.php';
$view = new View();
$view->newsList = $newsList;
$view->display('index.tpl');
?>


<?php
//      (detail.php)

require_once 'News.php';


$id = (int) $_GET['id'];
$newsModel = new News();
$row = $newsModel->find($id);

require_once 'View.php';
$view = new View();
$view->row = $row;
$view->display('detail.tpl');
?>
Controller
Controller
<?php

class Controller {

    private $_action = 'index';

    private $_newsModel = null;

    private $_view = null;

    public function __construct() {
        if (isset($_GET['action'])) {
            $action = strtolower($_GET['action']);
            if (method_exists($this, $action)) {
                $this->_action = $action;
            }
        }
        $this->_init();
        call_user_func(array($this, $this->_action));
    }

    protected function _init() {
        require_once 'News.php';
        $this->_newsModel = new News();

        require_once 'View.php';
        $this->_view = new View();
    }
Controller (              )
    public function index() {
        $this->_view->newsList = $this->_newsModel->findAll();
        $this->_view->display('index.tpl');
    }

    public function detail() {
        $id = (int) $_GET['id'];
        $this->_view->row = $this->_newsModel->find($id);
        $this->_view->display('detail.tpl');
    }
}


<?php
//       (index.php)
require_once 'Controller.php';
$controller = new Controller();
View
<!DOCTYPE html>
<html>
<head><meta charset="UTF-8" /><title>News</title></head>
<body>
<ul class="posts">
<?php foreach ($this->newsList as $row): ?>
<li><a href="index.php?action=detail&amp;id=<?php echo intval($row
['id']); ?>">
<?php echo htmlspecialchars($row['title']); ?>
</a></li>
<?php endforeach; ?>
</ul>
</body>


                           detail.php?id=<?php echo intval($row['id']); ?>
Web MVC
•            http request              MVC


•         View            Model
         Observer Pattern

• View          Controller
                             http request
    Controller
Web MVC



 Dispatcher                               Multi-formats

Route                                          Template
              Controller           View


                       Model

                      Business
                       Logic

                     Data Access
Web Framework
 MVC
Controller

• Action Controller
• Command Object
Web MVC
Web MVP
WebForms
JavaScript
MVC      MVP
JavaScript MVC Framework
• JavaScriptMVC (http://javascriptmvc.com/)
• Backbone.js (http://
  documentcloud.github.com/backbone/)
• Spine (http://maccman.github.com/spine/)
JavaScript MVP
HTML
<!DOCTYPE html>
<html>
<head><meta charset="UTF-8" /><title>JavaScript MVP</title></head>
<body>
    <form action="">
        <input type="text" id="num" value="0" />
        <button type="button" id="increase">+</button>
        <button type="button" id="decrease">-</button>
    </form>
    <script src="jquery.js"></script>
    <script src="mvc.js"></script>
</body>
</html>
mvc.js (app)
var myapp = {};
mvc.js (Model)
myapp.Model = function () {
    var val = 0;
    this.add = function (v) {
        val += v;
    };
    this.sub = function (v) {
        val -= v;
    };
    this.getVal = function () {
        return val;
    };
};
mvc.js (Presenter)
myapp.Presenter = function () {
    var model = null;
    this.init = function () {
        model = new myapp.Model();
    };
    this.increase = function () {
        model.add(1);
    };
    this.decrease = function () {
        model.sub(1);
    };
    this.getModel = function () {
        return model;
    }
};
mvc.js (View)
myapp.view = {
    $increaseButton: null,
    $decreaseButton: null,
    $num: null,
    presenter: null,
    init: function () {
        this.presenter = new myapp.Presenter();
        this.$increaseButton = $('#increase');
        this.$decreaseButton = $('#decrease');
        this.$num = $('#num');
        this.presenter.init();
        this.bindEvents();
        this.$num.val(this.presenter.getModel().getVal());
    },
    bindEvents: function () {
        var view = this;
        var presenter = this.presenter;
        this.$increaseButton.click(function () {
            presenter.increase();
            view.$num.val(presenter.getModel().getVal());
        });
        this.$decreaseButton.click(function () {
            presenter.decrease();
            view.$num.val(presenter.getModel().getVal());
        });
    }
};
mvc.js (   )
var myapp = {};

myapp.Model = function () {
    // ...
};

myapp.Presenter = function () {
    // ...
};

myapp.view = {
    // ...
};

$(function () {
    myapp.view.init();
})
UI
MVP
MVC / MVP
深入淺出 MVC
深入淺出 MVC

More Related Content

What's hot

Zend Framework 1.8 Features Webinar
Zend Framework 1.8 Features WebinarZend Framework 1.8 Features Webinar
Zend Framework 1.8 Features WebinarRalph Schindler
 
Assetic (Symfony Live Paris)
Assetic (Symfony Live Paris)Assetic (Symfony Live Paris)
Assetic (Symfony Live Paris)Kris Wallsmith
 
ACL in CodeIgniter
ACL in CodeIgniterACL in CodeIgniter
ACL in CodeIgnitermirahman
 
You must know about CodeIgniter Popular Library
You must know about CodeIgniter Popular LibraryYou must know about CodeIgniter Popular Library
You must know about CodeIgniter Popular LibraryBo-Yi Wu
 
Extending the WordPress REST API - Josh Pollock
Extending the WordPress REST API - Josh PollockExtending the WordPress REST API - Josh Pollock
Extending the WordPress REST API - Josh PollockCaldera Labs
 
Single Page Web Applications with CoffeeScript, Backbone and Jasmine
Single Page Web Applications with CoffeeScript, Backbone and JasmineSingle Page Web Applications with CoffeeScript, Backbone and Jasmine
Single Page Web Applications with CoffeeScript, Backbone and JasminePaulo Ragonha
 
Introduction to AngularJS For WordPress Developers
Introduction to AngularJS For WordPress DevelopersIntroduction to AngularJS For WordPress Developers
Introduction to AngularJS For WordPress DevelopersCaldera Labs
 
Let's write secure drupal code! - Drupal Camp Pannonia 2019
Let's write secure drupal code! - Drupal Camp Pannonia 2019Let's write secure drupal code! - Drupal Camp Pannonia 2019
Let's write secure drupal code! - Drupal Camp Pannonia 2019Balázs Tatár
 
Creating REST Applications with the Slim Micro-Framework by Vikram Vaswani
Creating REST Applications with the Slim Micro-Framework by Vikram VaswaniCreating REST Applications with the Slim Micro-Framework by Vikram Vaswani
Creating REST Applications with the Slim Micro-Framework by Vikram Vaswanivvaswani
 
10 Things Every Plugin Developer Should Know (WordCamp Atlanta 2013)
10 Things Every Plugin Developer Should Know (WordCamp Atlanta 2013)10 Things Every Plugin Developer Should Know (WordCamp Atlanta 2013)
10 Things Every Plugin Developer Should Know (WordCamp Atlanta 2013)arcware
 
REST APIs in Laravel 101
REST APIs in Laravel 101REST APIs in Laravel 101
REST APIs in Laravel 101Samantha Geitz
 
Caldera Learn - LoopConf WP API + Angular FTW Workshop
Caldera Learn - LoopConf WP API + Angular FTW WorkshopCaldera Learn - LoopConf WP API + Angular FTW Workshop
Caldera Learn - LoopConf WP API + Angular FTW WorkshopCalderaLearn
 
Introduction To Django (Strange Loop 2011)
Introduction To Django (Strange Loop 2011)Introduction To Django (Strange Loop 2011)
Introduction To Django (Strange Loop 2011)Jacob Kaplan-Moss
 
Connecting Content Silos: One CMS, Many Sites With The WordPress REST API
 Connecting Content Silos: One CMS, Many Sites With The WordPress REST API Connecting Content Silos: One CMS, Many Sites With The WordPress REST API
Connecting Content Silos: One CMS, Many Sites With The WordPress REST APICaldera Labs
 
Single Page Web Apps As WordPress Admin Interfaces Using AngularJS & The Word...
Single Page Web Apps As WordPress Admin Interfaces Using AngularJS & The Word...Single Page Web Apps As WordPress Admin Interfaces Using AngularJS & The Word...
Single Page Web Apps As WordPress Admin Interfaces Using AngularJS & The Word...Caldera Labs
 
Django REST Framework
Django REST FrameworkDjango REST Framework
Django REST FrameworkLoad Impact
 
How to learn to build your own PHP framework
How to learn to build your own PHP frameworkHow to learn to build your own PHP framework
How to learn to build your own PHP frameworkDinh Pham
 
Let's write secure Drupal code! DUG Belgium - 08/08/2019
Let's write secure Drupal code! DUG Belgium - 08/08/2019Let's write secure Drupal code! DUG Belgium - 08/08/2019
Let's write secure Drupal code! DUG Belgium - 08/08/2019Balázs Tatár
 

What's hot (20)

Zend Framework 1.8 Features Webinar
Zend Framework 1.8 Features WebinarZend Framework 1.8 Features Webinar
Zend Framework 1.8 Features Webinar
 
Assetic (Symfony Live Paris)
Assetic (Symfony Live Paris)Assetic (Symfony Live Paris)
Assetic (Symfony Live Paris)
 
ACL in CodeIgniter
ACL in CodeIgniterACL in CodeIgniter
ACL in CodeIgniter
 
You must know about CodeIgniter Popular Library
You must know about CodeIgniter Popular LibraryYou must know about CodeIgniter Popular Library
You must know about CodeIgniter Popular Library
 
Extending the WordPress REST API - Josh Pollock
Extending the WordPress REST API - Josh PollockExtending the WordPress REST API - Josh Pollock
Extending the WordPress REST API - Josh Pollock
 
Single Page Web Applications with CoffeeScript, Backbone and Jasmine
Single Page Web Applications with CoffeeScript, Backbone and JasmineSingle Page Web Applications with CoffeeScript, Backbone and Jasmine
Single Page Web Applications with CoffeeScript, Backbone and Jasmine
 
Introduction to AngularJS For WordPress Developers
Introduction to AngularJS For WordPress DevelopersIntroduction to AngularJS For WordPress Developers
Introduction to AngularJS For WordPress Developers
 
Let's write secure drupal code! - Drupal Camp Pannonia 2019
Let's write secure drupal code! - Drupal Camp Pannonia 2019Let's write secure drupal code! - Drupal Camp Pannonia 2019
Let's write secure drupal code! - Drupal Camp Pannonia 2019
 
Creating REST Applications with the Slim Micro-Framework by Vikram Vaswani
Creating REST Applications with the Slim Micro-Framework by Vikram VaswaniCreating REST Applications with the Slim Micro-Framework by Vikram Vaswani
Creating REST Applications with the Slim Micro-Framework by Vikram Vaswani
 
10 Things Every Plugin Developer Should Know (WordCamp Atlanta 2013)
10 Things Every Plugin Developer Should Know (WordCamp Atlanta 2013)10 Things Every Plugin Developer Should Know (WordCamp Atlanta 2013)
10 Things Every Plugin Developer Should Know (WordCamp Atlanta 2013)
 
REST APIs in Laravel 101
REST APIs in Laravel 101REST APIs in Laravel 101
REST APIs in Laravel 101
 
Caldera Learn - LoopConf WP API + Angular FTW Workshop
Caldera Learn - LoopConf WP API + Angular FTW WorkshopCaldera Learn - LoopConf WP API + Angular FTW Workshop
Caldera Learn - LoopConf WP API + Angular FTW Workshop
 
Introduction To Django (Strange Loop 2011)
Introduction To Django (Strange Loop 2011)Introduction To Django (Strange Loop 2011)
Introduction To Django (Strange Loop 2011)
 
Connecting Content Silos: One CMS, Many Sites With The WordPress REST API
 Connecting Content Silos: One CMS, Many Sites With The WordPress REST API Connecting Content Silos: One CMS, Many Sites With The WordPress REST API
Connecting Content Silos: One CMS, Many Sites With The WordPress REST API
 
Single Page Web Apps As WordPress Admin Interfaces Using AngularJS & The Word...
Single Page Web Apps As WordPress Admin Interfaces Using AngularJS & The Word...Single Page Web Apps As WordPress Admin Interfaces Using AngularJS & The Word...
Single Page Web Apps As WordPress Admin Interfaces Using AngularJS & The Word...
 
Javascript laravel's friend
Javascript laravel's friendJavascript laravel's friend
Javascript laravel's friend
 
Phinx talk
Phinx talkPhinx talk
Phinx talk
 
Django REST Framework
Django REST FrameworkDjango REST Framework
Django REST Framework
 
How to learn to build your own PHP framework
How to learn to build your own PHP frameworkHow to learn to build your own PHP framework
How to learn to build your own PHP framework
 
Let's write secure Drupal code! DUG Belgium - 08/08/2019
Let's write secure Drupal code! DUG Belgium - 08/08/2019Let's write secure Drupal code! DUG Belgium - 08/08/2019
Let's write secure Drupal code! DUG Belgium - 08/08/2019
 

Similar to 深入淺出 MVC

PHP MVC Tutorial
PHP MVC TutorialPHP MVC Tutorial
PHP MVC TutorialYang Bruce
 
Model-View-Controller: Tips&Tricks
Model-View-Controller: Tips&TricksModel-View-Controller: Tips&Tricks
Model-View-Controller: Tips&TricksCiklum Ukraine
 
Patterns Are Good For Managers
Patterns Are Good For ManagersPatterns Are Good For Managers
Patterns Are Good For ManagersAgileThought
 
Developing ASP.NET Applications Using the Model View Controller Pattern
Developing ASP.NET Applications Using the Model View Controller PatternDeveloping ASP.NET Applications Using the Model View Controller Pattern
Developing ASP.NET Applications Using the Model View Controller Patterngoodfriday
 
[Bristol WordPress] Supercharging WordPress Development
[Bristol WordPress] Supercharging WordPress Development[Bristol WordPress] Supercharging WordPress Development
[Bristol WordPress] Supercharging WordPress DevelopmentAdam Tomat
 
MV* presentation frameworks in Javascript: en garde, pret, allez!
MV* presentation frameworks in Javascript: en garde, pret, allez!MV* presentation frameworks in Javascript: en garde, pret, allez!
MV* presentation frameworks in Javascript: en garde, pret, allez!Roberto Messora
 
MVC 1.0 als alternative Webtechnologie
MVC 1.0 als alternative WebtechnologieMVC 1.0 als alternative Webtechnologie
MVC 1.0 als alternative WebtechnologieOPEN KNOWLEDGE GmbH
 
Unit testing after Zend Framework 1.8
Unit testing after Zend Framework 1.8Unit testing after Zend Framework 1.8
Unit testing after Zend Framework 1.8Michelangelo van Dam
 
前后端mvc经验 - webrebuild 2011 session
前后端mvc经验 - webrebuild 2011 session前后端mvc经验 - webrebuild 2011 session
前后端mvc经验 - webrebuild 2011 sessionRANK LIU
 
Oracle Application Express & jQuery Mobile - OGh Apex Dag 2012
Oracle Application Express & jQuery Mobile - OGh Apex Dag 2012Oracle Application Express & jQuery Mobile - OGh Apex Dag 2012
Oracle Application Express & jQuery Mobile - OGh Apex Dag 2012crokitta
 
Prateek dayal backbonerails-110528024926-phpapp02
Prateek dayal backbonerails-110528024926-phpapp02Prateek dayal backbonerails-110528024926-phpapp02
Prateek dayal backbonerails-110528024926-phpapp02Revath S Kumar
 
Single Page Web Apps with Backbone.js and Rails
Single Page Web Apps with Backbone.js and RailsSingle Page Web Apps with Backbone.js and Rails
Single Page Web Apps with Backbone.js and RailsPrateek Dayal
 
Benefit of CodeIgniter php framework
Benefit of CodeIgniter php frameworkBenefit of CodeIgniter php framework
Benefit of CodeIgniter php frameworkBo-Yi Wu
 
Templates
TemplatesTemplates
Templatessoon
 
Synapseindia reviews sharing intro cakephp
Synapseindia reviews sharing intro cakephpSynapseindia reviews sharing intro cakephp
Synapseindia reviews sharing intro cakephpSynapseindiaComplaints
 
Intro To Mvc Development In Php
Intro To Mvc Development In PhpIntro To Mvc Development In Php
Intro To Mvc Development In Phpfunkatron
 

Similar to 深入淺出 MVC (20)

PHP MVC Tutorial
PHP MVC TutorialPHP MVC Tutorial
PHP MVC Tutorial
 
Model-View-Controller: Tips&Tricks
Model-View-Controller: Tips&TricksModel-View-Controller: Tips&Tricks
Model-View-Controller: Tips&Tricks
 
Codegnitorppt
CodegnitorpptCodegnitorppt
Codegnitorppt
 
Patterns Are Good For Managers
Patterns Are Good For ManagersPatterns Are Good For Managers
Patterns Are Good For Managers
 
Developing ASP.NET Applications Using the Model View Controller Pattern
Developing ASP.NET Applications Using the Model View Controller PatternDeveloping ASP.NET Applications Using the Model View Controller Pattern
Developing ASP.NET Applications Using the Model View Controller Pattern
 
[Bristol WordPress] Supercharging WordPress Development
[Bristol WordPress] Supercharging WordPress Development[Bristol WordPress] Supercharging WordPress Development
[Bristol WordPress] Supercharging WordPress Development
 
MV* presentation frameworks in Javascript: en garde, pret, allez!
MV* presentation frameworks in Javascript: en garde, pret, allez!MV* presentation frameworks in Javascript: en garde, pret, allez!
MV* presentation frameworks in Javascript: en garde, pret, allez!
 
MVC 1.0 als alternative Webtechnologie
MVC 1.0 als alternative WebtechnologieMVC 1.0 als alternative Webtechnologie
MVC 1.0 als alternative Webtechnologie
 
Unit testing after Zend Framework 1.8
Unit testing after Zend Framework 1.8Unit testing after Zend Framework 1.8
Unit testing after Zend Framework 1.8
 
前后端mvc经验 - webrebuild 2011 session
前后端mvc经验 - webrebuild 2011 session前后端mvc经验 - webrebuild 2011 session
前后端mvc经验 - webrebuild 2011 session
 
Oracle Application Express & jQuery Mobile - OGh Apex Dag 2012
Oracle Application Express & jQuery Mobile - OGh Apex Dag 2012Oracle Application Express & jQuery Mobile - OGh Apex Dag 2012
Oracle Application Express & jQuery Mobile - OGh Apex Dag 2012
 
Prateek dayal backbonerails-110528024926-phpapp02
Prateek dayal backbonerails-110528024926-phpapp02Prateek dayal backbonerails-110528024926-phpapp02
Prateek dayal backbonerails-110528024926-phpapp02
 
Single Page Web Apps with Backbone.js and Rails
Single Page Web Apps with Backbone.js and RailsSingle Page Web Apps with Backbone.js and Rails
Single Page Web Apps with Backbone.js and Rails
 
Valentine with AngularJS
Valentine with AngularJSValentine with AngularJS
Valentine with AngularJS
 
Benefit of CodeIgniter php framework
Benefit of CodeIgniter php frameworkBenefit of CodeIgniter php framework
Benefit of CodeIgniter php framework
 
Templates
TemplatesTemplates
Templates
 
Backbone js
Backbone jsBackbone js
Backbone js
 
Synapseindia reviews sharing intro cakephp
Synapseindia reviews sharing intro cakephpSynapseindia reviews sharing intro cakephp
Synapseindia reviews sharing intro cakephp
 
Basics of AngularJS
Basics of AngularJSBasics of AngularJS
Basics of AngularJS
 
Intro To Mvc Development In Php
Intro To Mvc Development In PhpIntro To Mvc Development In Php
Intro To Mvc Development In Php
 

More from Jace Ju

Advanced php testing in action
Advanced php testing in actionAdvanced php testing in action
Advanced php testing in actionJace Ju
 
Beginning PHPUnit
Beginning PHPUnitBeginning PHPUnit
Beginning PHPUnitJace Ju
 
如何打造 WebMVC Framework - 基礎概念篇
如何打造 WebMVC Framework - 基礎概念篇如何打造 WebMVC Framework - 基礎概念篇
如何打造 WebMVC Framework - 基礎概念篇Jace Ju
 
Refactoring with Patterns in PHP
Refactoring with Patterns in PHPRefactoring with Patterns in PHP
Refactoring with Patterns in PHPJace Ju
 
Patterns in Library Design (套件設計裡的模式)
Patterns in Library Design (套件設計裡的模式)Patterns in Library Design (套件設計裡的模式)
Patterns in Library Design (套件設計裡的模式)Jace Ju
 
購物車程式架構簡介
購物車程式架構簡介購物車程式架構簡介
購物車程式架構簡介Jace Ju
 
Patterns in Zend Framework
Patterns in Zend FrameworkPatterns in Zend Framework
Patterns in Zend FrameworkJace Ju
 
常見設計模式介紹
常見設計模式介紹常見設計模式介紹
常見設計模式介紹Jace Ju
 
PHPUnit 入門介紹
PHPUnit 入門介紹PHPUnit 入門介紹
PHPUnit 入門介紹Jace Ju
 
Web Refactoring
Web RefactoringWeb Refactoring
Web RefactoringJace Ju
 
jQuery 實戰經驗講座
jQuery 實戰經驗講座jQuery 實戰經驗講座
jQuery 實戰經驗講座Jace Ju
 
CSS 排版 - 基礎觀念篇
CSS 排版 - 基礎觀念篇CSS 排版 - 基礎觀念篇
CSS 排版 - 基礎觀念篇Jace Ju
 
PHP 防駭 - 基礎觀念篇
PHP 防駭 - 基礎觀念篇PHP 防駭 - 基礎觀念篇
PHP 防駭 - 基礎觀念篇Jace Ju
 
PHP 物件導向 - 基礎觀念篇
PHP 物件導向 - 基礎觀念篇PHP 物件導向 - 基礎觀念篇
PHP 物件導向 - 基礎觀念篇Jace Ju
 

More from Jace Ju (14)

Advanced php testing in action
Advanced php testing in actionAdvanced php testing in action
Advanced php testing in action
 
Beginning PHPUnit
Beginning PHPUnitBeginning PHPUnit
Beginning PHPUnit
 
如何打造 WebMVC Framework - 基礎概念篇
如何打造 WebMVC Framework - 基礎概念篇如何打造 WebMVC Framework - 基礎概念篇
如何打造 WebMVC Framework - 基礎概念篇
 
Refactoring with Patterns in PHP
Refactoring with Patterns in PHPRefactoring with Patterns in PHP
Refactoring with Patterns in PHP
 
Patterns in Library Design (套件設計裡的模式)
Patterns in Library Design (套件設計裡的模式)Patterns in Library Design (套件設計裡的模式)
Patterns in Library Design (套件設計裡的模式)
 
購物車程式架構簡介
購物車程式架構簡介購物車程式架構簡介
購物車程式架構簡介
 
Patterns in Zend Framework
Patterns in Zend FrameworkPatterns in Zend Framework
Patterns in Zend Framework
 
常見設計模式介紹
常見設計模式介紹常見設計模式介紹
常見設計模式介紹
 
PHPUnit 入門介紹
PHPUnit 入門介紹PHPUnit 入門介紹
PHPUnit 入門介紹
 
Web Refactoring
Web RefactoringWeb Refactoring
Web Refactoring
 
jQuery 實戰經驗講座
jQuery 實戰經驗講座jQuery 實戰經驗講座
jQuery 實戰經驗講座
 
CSS 排版 - 基礎觀念篇
CSS 排版 - 基礎觀念篇CSS 排版 - 基礎觀念篇
CSS 排版 - 基礎觀念篇
 
PHP 防駭 - 基礎觀念篇
PHP 防駭 - 基礎觀念篇PHP 防駭 - 基礎觀念篇
PHP 防駭 - 基礎觀念篇
 
PHP 物件導向 - 基礎觀念篇
PHP 物件導向 - 基礎觀念篇PHP 物件導向 - 基礎觀念篇
PHP 物件導向 - 基礎觀念篇
 

Recently uploaded

A Framework for Development in the AI Age
A Framework for Development in the AI AgeA Framework for Development in the AI Age
A Framework for Development in the AI AgeCprime
 
Generative Artificial Intelligence: How generative AI works.pdf
Generative Artificial Intelligence: How generative AI works.pdfGenerative Artificial Intelligence: How generative AI works.pdf
Generative Artificial Intelligence: How generative AI works.pdfIngrid Airi González
 
Français Patch Tuesday - Avril
Français Patch Tuesday - AvrilFrançais Patch Tuesday - Avril
Français Patch Tuesday - AvrilIvanti
 
Landscape Catalogue 2024 Australia-1.pdf
Landscape Catalogue 2024 Australia-1.pdfLandscape Catalogue 2024 Australia-1.pdf
Landscape Catalogue 2024 Australia-1.pdfAarwolf Industries LLC
 
Emixa Mendix Meetup 11 April 2024 about Mendix Native development
Emixa Mendix Meetup 11 April 2024 about Mendix Native developmentEmixa Mendix Meetup 11 April 2024 about Mendix Native development
Emixa Mendix Meetup 11 April 2024 about Mendix Native developmentPim van der Noll
 
WomenInAutomation2024: AI and Automation for eveyone
WomenInAutomation2024: AI and Automation for eveyoneWomenInAutomation2024: AI and Automation for eveyone
WomenInAutomation2024: AI and Automation for eveyoneUiPathCommunity
 
Microsoft 365 Copilot: How to boost your productivity with AI – Part one: Ado...
Microsoft 365 Copilot: How to boost your productivity with AI – Part one: Ado...Microsoft 365 Copilot: How to boost your productivity with AI – Part one: Ado...
Microsoft 365 Copilot: How to boost your productivity with AI – Part one: Ado...Nikki Chapple
 
JET Technology Labs White Paper for Virtualized Security and Encryption Techn...
JET Technology Labs White Paper for Virtualized Security and Encryption Techn...JET Technology Labs White Paper for Virtualized Security and Encryption Techn...
JET Technology Labs White Paper for Virtualized Security and Encryption Techn...amber724300
 
Connecting the Dots for Information Discovery.pdf
Connecting the Dots for Information Discovery.pdfConnecting the Dots for Information Discovery.pdf
Connecting the Dots for Information Discovery.pdfNeo4j
 
Manual 508 Accessibility Compliance Audit
Manual 508 Accessibility Compliance AuditManual 508 Accessibility Compliance Audit
Manual 508 Accessibility Compliance AuditSkynet Technologies
 
Accelerating Enterprise Software Engineering with Platformless
Accelerating Enterprise Software Engineering with PlatformlessAccelerating Enterprise Software Engineering with Platformless
Accelerating Enterprise Software Engineering with PlatformlessWSO2
 
Modern Roaming for Notes and Nomad – Cheaper Faster Better Stronger
Modern Roaming for Notes and Nomad – Cheaper Faster Better StrongerModern Roaming for Notes and Nomad – Cheaper Faster Better Stronger
Modern Roaming for Notes and Nomad – Cheaper Faster Better Strongerpanagenda
 
Microservices, Docker deploy and Microservices source code in C#
Microservices, Docker deploy and Microservices source code in C#Microservices, Docker deploy and Microservices source code in C#
Microservices, Docker deploy and Microservices source code in C#Karmanjay Verma
 
Genislab builds better products and faster go-to-market with Lean project man...
Genislab builds better products and faster go-to-market with Lean project man...Genislab builds better products and faster go-to-market with Lean project man...
Genislab builds better products and faster go-to-market with Lean project man...Farhan Tariq
 
Generative AI - Gitex v1Generative AI - Gitex v1.pptx
Generative AI - Gitex v1Generative AI - Gitex v1.pptxGenerative AI - Gitex v1Generative AI - Gitex v1.pptx
Generative AI - Gitex v1Generative AI - Gitex v1.pptxfnnc6jmgwh
 
A Glance At The Java Performance Toolbox
A Glance At The Java Performance ToolboxA Glance At The Java Performance Toolbox
A Glance At The Java Performance ToolboxAna-Maria Mihalceanu
 
UiPath Community: Communication Mining from Zero to Hero
UiPath Community: Communication Mining from Zero to HeroUiPath Community: Communication Mining from Zero to Hero
UiPath Community: Communication Mining from Zero to HeroUiPathCommunity
 
Transcript: New from BookNet Canada for 2024: BNC SalesData and LibraryData -...
Transcript: New from BookNet Canada for 2024: BNC SalesData and LibraryData -...Transcript: New from BookNet Canada for 2024: BNC SalesData and LibraryData -...
Transcript: New from BookNet Canada for 2024: BNC SalesData and LibraryData -...BookNet Canada
 
Glenn Lazarus- Why Your Observability Strategy Needs Security Observability
Glenn Lazarus- Why Your Observability Strategy Needs Security ObservabilityGlenn Lazarus- Why Your Observability Strategy Needs Security Observability
Glenn Lazarus- Why Your Observability Strategy Needs Security Observabilityitnewsafrica
 
QMMS Lesson 2 - Using MS Excel Formula.pdf
QMMS Lesson 2 - Using MS Excel Formula.pdfQMMS Lesson 2 - Using MS Excel Formula.pdf
QMMS Lesson 2 - Using MS Excel Formula.pdfROWELL MARQUINA
 

Recently uploaded (20)

A Framework for Development in the AI Age
A Framework for Development in the AI AgeA Framework for Development in the AI Age
A Framework for Development in the AI Age
 
Generative Artificial Intelligence: How generative AI works.pdf
Generative Artificial Intelligence: How generative AI works.pdfGenerative Artificial Intelligence: How generative AI works.pdf
Generative Artificial Intelligence: How generative AI works.pdf
 
Français Patch Tuesday - Avril
Français Patch Tuesday - AvrilFrançais Patch Tuesday - Avril
Français Patch Tuesday - Avril
 
Landscape Catalogue 2024 Australia-1.pdf
Landscape Catalogue 2024 Australia-1.pdfLandscape Catalogue 2024 Australia-1.pdf
Landscape Catalogue 2024 Australia-1.pdf
 
Emixa Mendix Meetup 11 April 2024 about Mendix Native development
Emixa Mendix Meetup 11 April 2024 about Mendix Native developmentEmixa Mendix Meetup 11 April 2024 about Mendix Native development
Emixa Mendix Meetup 11 April 2024 about Mendix Native development
 
WomenInAutomation2024: AI and Automation for eveyone
WomenInAutomation2024: AI and Automation for eveyoneWomenInAutomation2024: AI and Automation for eveyone
WomenInAutomation2024: AI and Automation for eveyone
 
Microsoft 365 Copilot: How to boost your productivity with AI – Part one: Ado...
Microsoft 365 Copilot: How to boost your productivity with AI – Part one: Ado...Microsoft 365 Copilot: How to boost your productivity with AI – Part one: Ado...
Microsoft 365 Copilot: How to boost your productivity with AI – Part one: Ado...
 
JET Technology Labs White Paper for Virtualized Security and Encryption Techn...
JET Technology Labs White Paper for Virtualized Security and Encryption Techn...JET Technology Labs White Paper for Virtualized Security and Encryption Techn...
JET Technology Labs White Paper for Virtualized Security and Encryption Techn...
 
Connecting the Dots for Information Discovery.pdf
Connecting the Dots for Information Discovery.pdfConnecting the Dots for Information Discovery.pdf
Connecting the Dots for Information Discovery.pdf
 
Manual 508 Accessibility Compliance Audit
Manual 508 Accessibility Compliance AuditManual 508 Accessibility Compliance Audit
Manual 508 Accessibility Compliance Audit
 
Accelerating Enterprise Software Engineering with Platformless
Accelerating Enterprise Software Engineering with PlatformlessAccelerating Enterprise Software Engineering with Platformless
Accelerating Enterprise Software Engineering with Platformless
 
Modern Roaming for Notes and Nomad – Cheaper Faster Better Stronger
Modern Roaming for Notes and Nomad – Cheaper Faster Better StrongerModern Roaming for Notes and Nomad – Cheaper Faster Better Stronger
Modern Roaming for Notes and Nomad – Cheaper Faster Better Stronger
 
Microservices, Docker deploy and Microservices source code in C#
Microservices, Docker deploy and Microservices source code in C#Microservices, Docker deploy and Microservices source code in C#
Microservices, Docker deploy and Microservices source code in C#
 
Genislab builds better products and faster go-to-market with Lean project man...
Genislab builds better products and faster go-to-market with Lean project man...Genislab builds better products and faster go-to-market with Lean project man...
Genislab builds better products and faster go-to-market with Lean project man...
 
Generative AI - Gitex v1Generative AI - Gitex v1.pptx
Generative AI - Gitex v1Generative AI - Gitex v1.pptxGenerative AI - Gitex v1Generative AI - Gitex v1.pptx
Generative AI - Gitex v1Generative AI - Gitex v1.pptx
 
A Glance At The Java Performance Toolbox
A Glance At The Java Performance ToolboxA Glance At The Java Performance Toolbox
A Glance At The Java Performance Toolbox
 
UiPath Community: Communication Mining from Zero to Hero
UiPath Community: Communication Mining from Zero to HeroUiPath Community: Communication Mining from Zero to Hero
UiPath Community: Communication Mining from Zero to Hero
 
Transcript: New from BookNet Canada for 2024: BNC SalesData and LibraryData -...
Transcript: New from BookNet Canada for 2024: BNC SalesData and LibraryData -...Transcript: New from BookNet Canada for 2024: BNC SalesData and LibraryData -...
Transcript: New from BookNet Canada for 2024: BNC SalesData and LibraryData -...
 
Glenn Lazarus- Why Your Observability Strategy Needs Security Observability
Glenn Lazarus- Why Your Observability Strategy Needs Security ObservabilityGlenn Lazarus- Why Your Observability Strategy Needs Security Observability
Glenn Lazarus- Why Your Observability Strategy Needs Security Observability
 
QMMS Lesson 2 - Using MS Excel Formula.pdf
QMMS Lesson 2 - Using MS Excel Formula.pdfQMMS Lesson 2 - Using MS Excel Formula.pdf
QMMS Lesson 2 - Using MS Excel Formula.pdf
 

深入淺出 MVC

  • 3. MVC • UI • UI
  • 4. MVC
  • 5. MVC Controller View Model
  • 6. MVC Controller View Controller Model ( ) Model
  • 7. MVC Controller View Controller View View Model Model
  • 8. MVC View Controller View Model
  • 9. MVC Controller Controller View Model
  • 10. MVC Controller View Controller Model View Model Model
  • 11. MVC View Controller View Model
  • 12. MVC • Controller • View Controller •
  • 13. MVP
  • 14. MVP Presenter View Model
  • 15. MVP View Presenter View View Presenter Model
  • 16. MVP Presenter View Presenter Model Model
  • 17. MVP View Presenter View View Presenter Model
  • 18. MVP Presenter View Persenter Model Model
  • 19. MVP View Presenter View Presenter Model View Model
  • 20. MVP • View View • Presenter Controller View • WinForms • Supervising Controller Passive View
  • 21. Supervising Controller • View Model • MVC Controller
  • 22. Passive View • Presenter Model View • View Model • Presenter • View
  • 25.
  • 27. Web MVC Java Model 2 • Java Struts • PHP PHPMVC • Ruby on Rails • Web Framework Web MVC
  • 28. <?php // (index.php) $link = mysql_connect('127.0.0.1', 'username', 'password'); mysql_query('SET NAMES utf8'); mysql_select_db('mvc', $link); ?> <!DOCTYPE html> <html> <head><meta charset="UTF-8" /><title>News</title></head> <body> <?php $sql = "SELECT * FROM news " . "WHERE onlineDateTime <= NOW() " . "AND NOW() < offlineDateTime ORDER BY id"; $result = mysql_query($sql, $link); ?> <ul class="posts"> <?php while ($row = mysql_fetch_assoc($result)): ?> <li><a href="detail.php?id=<?php echo intval($row['id']); ?>"> <?php echo htmlspecialchars($row['title']); ?> </a></li> <?php endwhile; ?> </ul> </body> </html> <?php mysql_close($link); ?>
  • 29. <?php // (detail.php) $link = mysql_connect('127.0.0.1', 'username', 'password'); mysql_query('SET NAMES utf8'); mysql_select_db('mvc', $link); ?> <!DOCTYPE html> <html> <head><meta charset="UTF-8" /><title>News</title></head> <body> <?php $id = (int) $_GET['id']; $sql = "SELECT * FROM news " . "WHERE onlineDateTime <= NOW() " . "AND NOW() < offlineDateTime AND id = $id"; $result = mysql_query($sql, $link); ?> <div class="post"> <?php if ($row = mysql_fetch_assoc($result)): ?> <h1><?php echo htmlspecialchars($row['title']); ?></h1> <div><?php echo nl2br(htmlspecialchars($row['content'])); ?></div> <?php endif; ?> </div> </body> </html> <?php mysql_close($link); ?>
  • 30. View
  • 31. View <?php class View { private $_vars = array(); public function __set($name, $val) { $this->_vars[$name] = $val; } public function __get($name) { return isset($this->_vars[$name]) ? $this->_vars[$name] : null; } public function display($tpl) { include $tpl; } }
  • 32. <?php // (index.php) $link = mysql_connect('127.0.0.1', 'username', 'password'); mysql_query('SET NAMES utf8'); mysql_select_db('mvc', $link); $sql = "SELECT * FROM news " . "WHERE onlineDateTime <= NOW() " . "AND NOW() < offlineDateTime ORDER BY id"; $result = mysql_query($sql, $link); $newsList = array(); while ($row = mysql_fetch_assoc($result)) { $newsList[] = $row; } require_once 'View.php'; $view = new View(); $view->newsList = $newsList; $view->display('index.tpl'); mysql_close($link); ?> <!DOCTYPE html> <html> <head><meta charset="UTF-8" /><title>News</title></head> <body> <ul class="posts"> <?php foreach ($this->newsList as $row): ?> <li><a href="detail.php?id=<?php echo intval($row['id']); ?>"> <?php echo htmlspecialchars($row['title']); ?> </a></li> <?php endforeach; ?> </ul> </body>
  • 33. Model
  • 34. Model <?php // News.php class News { private $_link = null; public function __construct() { $this->_link = mysql_connect('127.0.0.1', 'username', 'password'); mysql_query('SET NAMES utf8'); mysql_select_db('mvc', $this->_link); } public function __destruct() { mysql_close($this->_link); }
  • 35. Model ( ) public function findAll() { $sql = "SELECT * FROM news " . "WHERE onlineDateTime <= NOW() " . "AND NOW() < offlineDateTime ORDER BY id"; $result = mysql_query($sql, $this->_link); $newsList = array(); while ($row = mysql_fetch_assoc($result)) { $newsList[] = $row; } return $newsList; } public function find($id) { $sql = "SELECT * FROM news " . "WHERE onlineDateTime <= NOW() " . "AND NOW() < offlineDateTime AND id = $id"; $result = mysql_query($sql, $this->_link); return mysql_fetch_assoc($result); } }
  • 36. Model <?php // (index.php) require_once 'News.php'; $newsModel = new News(); $newsList = $newsModel->findAll(); require_once 'View.php'; $view = new View(); $view->newsList = $newsList; $view->display('index.tpl'); ?> <?php // (detail.php) require_once 'News.php'; $id = (int) $_GET['id']; $newsModel = new News(); $row = $newsModel->find($id); require_once 'View.php'; $view = new View(); $view->row = $row; $view->display('detail.tpl'); ?>
  • 38. Controller <?php class Controller { private $_action = 'index'; private $_newsModel = null; private $_view = null; public function __construct() { if (isset($_GET['action'])) { $action = strtolower($_GET['action']); if (method_exists($this, $action)) { $this->_action = $action; } } $this->_init(); call_user_func(array($this, $this->_action)); } protected function _init() { require_once 'News.php'; $this->_newsModel = new News(); require_once 'View.php'; $this->_view = new View(); }
  • 39. Controller ( ) public function index() { $this->_view->newsList = $this->_newsModel->findAll(); $this->_view->display('index.tpl'); } public function detail() { $id = (int) $_GET['id']; $this->_view->row = $this->_newsModel->find($id); $this->_view->display('detail.tpl'); } } <?php // (index.php) require_once 'Controller.php'; $controller = new Controller();
  • 40. View <!DOCTYPE html> <html> <head><meta charset="UTF-8" /><title>News</title></head> <body> <ul class="posts"> <?php foreach ($this->newsList as $row): ?> <li><a href="index.php?action=detail&amp;id=<?php echo intval($row ['id']); ?>"> <?php echo htmlspecialchars($row['title']); ?> </a></li> <?php endforeach; ?> </ul> </body> detail.php?id=<?php echo intval($row['id']); ?>
  • 41. Web MVC • http request MVC • View Model Observer Pattern • View Controller http request Controller
  • 42. Web MVC Dispatcher Multi-formats Route Template Controller View Model Business Logic Data Access
  • 48.
  • 49. JavaScript MVC Framework • JavaScriptMVC (http://javascriptmvc.com/) • Backbone.js (http:// documentcloud.github.com/backbone/) • Spine (http://maccman.github.com/spine/)
  • 51. HTML <!DOCTYPE html> <html> <head><meta charset="UTF-8" /><title>JavaScript MVP</title></head> <body> <form action=""> <input type="text" id="num" value="0" /> <button type="button" id="increase">+</button> <button type="button" id="decrease">-</button> </form> <script src="jquery.js"></script> <script src="mvc.js"></script> </body> </html>
  • 53. mvc.js (Model) myapp.Model = function () { var val = 0; this.add = function (v) { val += v; }; this.sub = function (v) { val -= v; }; this.getVal = function () { return val; }; };
  • 54. mvc.js (Presenter) myapp.Presenter = function () { var model = null; this.init = function () { model = new myapp.Model(); }; this.increase = function () { model.add(1); }; this.decrease = function () { model.sub(1); }; this.getModel = function () { return model; } };
  • 55. mvc.js (View) myapp.view = { $increaseButton: null, $decreaseButton: null, $num: null, presenter: null, init: function () { this.presenter = new myapp.Presenter(); this.$increaseButton = $('#increase'); this.$decreaseButton = $('#decrease'); this.$num = $('#num'); this.presenter.init(); this.bindEvents(); this.$num.val(this.presenter.getModel().getVal()); }, bindEvents: function () { var view = this; var presenter = this.presenter; this.$increaseButton.click(function () { presenter.increase(); view.$num.val(presenter.getModel().getVal()); }); this.$decreaseButton.click(function () { presenter.decrease(); view.$num.val(presenter.getModel().getVal()); }); } };
  • 56. mvc.js ( ) var myapp = {}; myapp.Model = function () { // ... }; myapp.Presenter = function () { // ... }; myapp.view = { // ... }; $(function () { myapp.view.init(); })