Submit Search
Upload
新版阿尔法城背后的前端MVC实践
•
91 likes
•
4,317 views
Dexter Yang
Follow
Practice MVC as features, not frameworks / 新版阿尔法城背后的前端MVC实践
Read less
Read more
Technology
Report
Share
Report
Share
1 of 52
Download now
Download to read offline
Recommended
Evaluation and prototyping of an HTML5 Client for iOS devices
Evaluation and prototyping of an HTML5 Client for iOS devices
Mario Gonzalez
Angular js gtg-27feb2013
Angular js gtg-27feb2013
Nitya Narasimhan
A nodejs application
A nodejs application
Robbie Clutton
Evaluation and prototyping of an HTML5 Client for iOS devices
Evaluation and prototyping of an HTML5 Client for iOS devices
Mario Gonzalez
Sai Sharan_UI_Resume
Sai Sharan_UI_Resume
Sai Sharan Madisetty
Introduction to backbone_js
Introduction to backbone_js
Mohammed Saqib
Introduction to backbone js
Introduction to backbone js
Mindfire Solutions
Tikal's Backbone_js introduction workshop
Tikal's Backbone_js introduction workshop
Tikal Knowledge
Recommended
Evaluation and prototyping of an HTML5 Client for iOS devices
Evaluation and prototyping of an HTML5 Client for iOS devices
Mario Gonzalez
Angular js gtg-27feb2013
Angular js gtg-27feb2013
Nitya Narasimhan
A nodejs application
A nodejs application
Robbie Clutton
Evaluation and prototyping of an HTML5 Client for iOS devices
Evaluation and prototyping of an HTML5 Client for iOS devices
Mario Gonzalez
Sai Sharan_UI_Resume
Sai Sharan_UI_Resume
Sai Sharan Madisetty
Introduction to backbone_js
Introduction to backbone_js
Mohammed Saqib
Introduction to backbone js
Introduction to backbone js
Mindfire Solutions
Tikal's Backbone_js introduction workshop
Tikal's Backbone_js introduction workshop
Tikal Knowledge
Web components - An Introduction
Web components - An Introduction
cherukumilli2
Building Custom Visual Composer Elements
Building Custom Visual Composer Elements
Burak Dogan
2013 04-02-server-side-backbone
2013 04-02-server-side-backbone
SC5.io
125 고성능 web view-deview 2013 발표 자료_공유용
125 고성능 web view-deview 2013 발표 자료_공유용
NAVER D2
What's this jQuery? Where it came from, and how it will drive innovation
What's this jQuery? Where it came from, and how it will drive innovation
Marakana Inc.
One APK to rule them all
One APK to rule them all
Dominik Helleberg
BBUI
BBUI
Anoop Nayak
Introduction to require js
Introduction to require js
Ahmed Elharouny
SEE 2009: Improving Mobile Web Developer Experience
SEE 2009: Improving Mobile Web Developer Experience
Tasneem Sayeed
Wheel.js
Wheel.js
baccigalupi
Building native Win8 apps with YUI
Building native Win8 apps with YUI
Tilo Mitra
LinkedIn Mobile: How do we do it?
LinkedIn Mobile: How do we do it?
phegaro
Web design v roku 2013
Web design v roku 2013
vibration.sk
Front-End Frameworks: a quick overview
Front-End Frameworks: a quick overview
Diacode
Java Script
Java Script
university of education,Lahore
Drupal goes Mobile
Drupal goes Mobile
zezzi Castillo
Client-Side Packages
Client-Side Packages
Domenic Denicola
Test
Test
Siva Prakash
Be German About Your Frontend
Be German About Your Frontend
Arush Sehgal
Javascript library toolbox
Javascript library toolbox
Skysoul Pty.Ltd.
Spring 3 MVC CodeMash 2009
Spring 3 MVC CodeMash 2009
kensipe
Mvc architecture
Mvc architecture
Surbhi Panhalkar
More Related Content
What's hot
Web components - An Introduction
Web components - An Introduction
cherukumilli2
Building Custom Visual Composer Elements
Building Custom Visual Composer Elements
Burak Dogan
2013 04-02-server-side-backbone
2013 04-02-server-side-backbone
SC5.io
125 고성능 web view-deview 2013 발표 자료_공유용
125 고성능 web view-deview 2013 발표 자료_공유용
NAVER D2
What's this jQuery? Where it came from, and how it will drive innovation
What's this jQuery? Where it came from, and how it will drive innovation
Marakana Inc.
One APK to rule them all
One APK to rule them all
Dominik Helleberg
BBUI
BBUI
Anoop Nayak
Introduction to require js
Introduction to require js
Ahmed Elharouny
SEE 2009: Improving Mobile Web Developer Experience
SEE 2009: Improving Mobile Web Developer Experience
Tasneem Sayeed
Wheel.js
Wheel.js
baccigalupi
Building native Win8 apps with YUI
Building native Win8 apps with YUI
Tilo Mitra
LinkedIn Mobile: How do we do it?
LinkedIn Mobile: How do we do it?
phegaro
Web design v roku 2013
Web design v roku 2013
vibration.sk
Front-End Frameworks: a quick overview
Front-End Frameworks: a quick overview
Diacode
Java Script
Java Script
university of education,Lahore
Drupal goes Mobile
Drupal goes Mobile
zezzi Castillo
Client-Side Packages
Client-Side Packages
Domenic Denicola
Test
Test
Siva Prakash
Be German About Your Frontend
Be German About Your Frontend
Arush Sehgal
Javascript library toolbox
Javascript library toolbox
Skysoul Pty.Ltd.
What's hot
(20)
Web components - An Introduction
Web components - An Introduction
Building Custom Visual Composer Elements
Building Custom Visual Composer Elements
2013 04-02-server-side-backbone
2013 04-02-server-side-backbone
125 고성능 web view-deview 2013 발표 자료_공유용
125 고성능 web view-deview 2013 발표 자료_공유용
What's this jQuery? Where it came from, and how it will drive innovation
What's this jQuery? Where it came from, and how it will drive innovation
One APK to rule them all
One APK to rule them all
BBUI
BBUI
Introduction to require js
Introduction to require js
SEE 2009: Improving Mobile Web Developer Experience
SEE 2009: Improving Mobile Web Developer Experience
Wheel.js
Wheel.js
Building native Win8 apps with YUI
Building native Win8 apps with YUI
LinkedIn Mobile: How do we do it?
LinkedIn Mobile: How do we do it?
Web design v roku 2013
Web design v roku 2013
Front-End Frameworks: a quick overview
Front-End Frameworks: a quick overview
Java Script
Java Script
Drupal goes Mobile
Drupal goes Mobile
Client-Side Packages
Client-Side Packages
Test
Test
Be German About Your Frontend
Be German About Your Frontend
Javascript library toolbox
Javascript library toolbox
Viewers also liked
Spring 3 MVC CodeMash 2009
Spring 3 MVC CodeMash 2009
kensipe
Mvc architecture
Mvc architecture
Surbhi Panhalkar
Is SQLcl the Next Generation of SQL*Plus?
Is SQLcl the Next Generation of SQL*Plus?
Zohar Elkayam
Linux 系列分享[1] 概览
Linux 系列分享[1] 概览
rainoxu
浅谈 Javascript 性能优化
浅谈 Javascript 性能优化
rainoxu
Steve Jobs Announces iTown - Douban Special Event, Jan 2012
Steve Jobs Announces iTown - Douban Special Event, Jan 2012
Dexter Yang
SQLcl overview - A new Command Line Interface for Oracle Database
SQLcl overview - A new Command Line Interface for Oracle Database
Jeff Smith
Learning JavaScript in Three Web Apps(中文)
Learning JavaScript in Three Web Apps(中文)
Dexter Yang
通用JS时代的模块机制和编译工具
通用JS时代的模块机制和编译工具
Dexter Yang
Git 零基础介绍
Git 零基础介绍
Ethan Zhang
PHP MVC Tutorial
PHP MVC Tutorial
Yang Bruce
A Good PHP Framework For Beginners Like Me!
A Good PHP Framework For Beginners Like Me!
Muhammad Ghazali
Oracle SQL Developer Tips & Tricks
Oracle SQL Developer Tips & Tricks
Jeff Smith
不断归零的前端人生 - 2016 中国软件开发者大会
不断归零的前端人生 - 2016 中国软件开发者大会
Joseph Chiang
Web前端性能优化 2014
Web前端性能优化 2014
Yubei Li
基于原型的JavaScript面向对象编程
基于原型的JavaScript面向对象编程
zhangdaiping
Node way
Node way
Ethan Zhang
Mvp in practice
Mvp in practice
彥彬 洪
使用 Visual Studio Code 建構 JavaScript 應用程式
使用 Visual Studio Code 建構 JavaScript 應用程式
Will Huang
Frontend django, Django Web 前端探索
Frontend django, Django Web 前端探索
Tim (文昌)
Viewers also liked
(20)
Spring 3 MVC CodeMash 2009
Spring 3 MVC CodeMash 2009
Mvc architecture
Mvc architecture
Is SQLcl the Next Generation of SQL*Plus?
Is SQLcl the Next Generation of SQL*Plus?
Linux 系列分享[1] 概览
Linux 系列分享[1] 概览
浅谈 Javascript 性能优化
浅谈 Javascript 性能优化
Steve Jobs Announces iTown - Douban Special Event, Jan 2012
Steve Jobs Announces iTown - Douban Special Event, Jan 2012
SQLcl overview - A new Command Line Interface for Oracle Database
SQLcl overview - A new Command Line Interface for Oracle Database
Learning JavaScript in Three Web Apps(中文)
Learning JavaScript in Three Web Apps(中文)
通用JS时代的模块机制和编译工具
通用JS时代的模块机制和编译工具
Git 零基础介绍
Git 零基础介绍
PHP MVC Tutorial
PHP MVC Tutorial
A Good PHP Framework For Beginners Like Me!
A Good PHP Framework For Beginners Like Me!
Oracle SQL Developer Tips & Tricks
Oracle SQL Developer Tips & Tricks
不断归零的前端人生 - 2016 中国软件开发者大会
不断归零的前端人生 - 2016 中国软件开发者大会
Web前端性能优化 2014
Web前端性能优化 2014
基于原型的JavaScript面向对象编程
基于原型的JavaScript面向对象编程
Node way
Node way
Mvp in practice
Mvp in practice
使用 Visual Studio Code 建構 JavaScript 應用程式
使用 Visual Studio Code 建構 JavaScript 應用程式
Frontend django, Django Web 前端探索
Frontend django, Django Web 前端探索
Similar to 新版阿尔法城背后的前端MVC实践
Sugarcoating your frontend one ViewModel at a time
Sugarcoating your frontend one ViewModel at a time
Einar Ingebrigtsen
Single Page Application Development with backbone.js and Simple.Web
Single Page Application Development with backbone.js and Simple.Web
Chris Canal
JavaScript in Universal Windows Platform apps
JavaScript in Universal Windows Platform apps
Timmy Kokke
大規模環境でRailsと4年間付き合ってきて@ クックパッド * 食べログ合同勉強会
大規模環境でRailsと4年間付き合ってきて@ クックパッド * 食べログ合同勉強会
Takayuki Kyowa
Rhodes
Rhodes
jwallace41
6 weeks 6 months live project summer industrial training in cmc limited 2012
6 weeks 6 months live project summer industrial training in cmc limited 2012
CMC Limited
Single Page Applications - Desert Code Camp 2012
Single Page Applications - Desert Code Camp 2012
Adam Mokan
Getting Started with Docker
Getting Started with Docker
visual28
Ruby on Rails : 簡介與入門
Ruby on Rails : 簡介與入門
Wen-Tien Chang
Tech io spa_angularjs_20130814_v0.9.5
Tech io spa_angularjs_20130814_v0.9.5
Ganesh Kondal
Mobile Vue.js – From PWA to Native
Mobile Vue.js – From PWA to Native
MartinSotirov
Talk Paris Infovis 091207132953 Phpapp01(2)
Talk Paris Infovis 091207132953 Phpapp01(2)
johnnybiz
Using Web Standards to create Interactive Data Visualizations for the Web
Using Web Standards to create Interactive Data Visualizations for the Web
philogb
20120306 dublin js
20120306 dublin js
Richard Rodger
20120802 timisoara
20120802 timisoara
Richard Rodger
Large Scale Drupal - Behind the Scenes
Large Scale Drupal - Behind the Scenes
Boyan Borisov
WCM-7 Surfing with CMIS
WCM-7 Surfing with CMIS
Alfresco Software
CUST-2 New Client Configuration & Extension Points in Share
CUST-2 New Client Configuration & Extension Points in Share
Alfresco Software
Android Development 201
Android Development 201
Tomáš Kypta
Getting Started with the ArcGIS API for JavaScript, Esri, Julie Powell, Antoo...
Getting Started with the ArcGIS API for JavaScript, Esri, Julie Powell, Antoo...
Esri Nederland
Similar to 新版阿尔法城背后的前端MVC实践
(20)
Sugarcoating your frontend one ViewModel at a time
Sugarcoating your frontend one ViewModel at a time
Single Page Application Development with backbone.js and Simple.Web
Single Page Application Development with backbone.js and Simple.Web
JavaScript in Universal Windows Platform apps
JavaScript in Universal Windows Platform apps
大規模環境でRailsと4年間付き合ってきて@ クックパッド * 食べログ合同勉強会
大規模環境でRailsと4年間付き合ってきて@ クックパッド * 食べログ合同勉強会
Rhodes
Rhodes
6 weeks 6 months live project summer industrial training in cmc limited 2012
6 weeks 6 months live project summer industrial training in cmc limited 2012
Single Page Applications - Desert Code Camp 2012
Single Page Applications - Desert Code Camp 2012
Getting Started with Docker
Getting Started with Docker
Ruby on Rails : 簡介與入門
Ruby on Rails : 簡介與入門
Tech io spa_angularjs_20130814_v0.9.5
Tech io spa_angularjs_20130814_v0.9.5
Mobile Vue.js – From PWA to Native
Mobile Vue.js – From PWA to Native
Talk Paris Infovis 091207132953 Phpapp01(2)
Talk Paris Infovis 091207132953 Phpapp01(2)
Using Web Standards to create Interactive Data Visualizations for the Web
Using Web Standards to create Interactive Data Visualizations for the Web
20120306 dublin js
20120306 dublin js
20120802 timisoara
20120802 timisoara
Large Scale Drupal - Behind the Scenes
Large Scale Drupal - Behind the Scenes
WCM-7 Surfing with CMIS
WCM-7 Surfing with CMIS
CUST-2 New Client Configuration & Extension Points in Share
CUST-2 New Client Configuration & Extension Points in Share
Android Development 201
Android Development 201
Getting Started with the ArcGIS API for JavaScript, Esri, Julie Powell, Antoo...
Getting Started with the ArcGIS API for JavaScript, Esri, Julie Powell, Antoo...
Recently uploaded
Partners Life - Insurer Innovation Award 2024
Partners Life - Insurer Innovation Award 2024
The Digital Insurer
Factors to Consider When Choosing Accounts Payable Services Providers.pptx
Factors to Consider When Choosing Accounts Payable Services Providers.pptx
Katpro Technologies
[2024]Digital Global Overview Report 2024 Meltwater.pdf
[2024]Digital Global Overview Report 2024 Meltwater.pdf
hans926745
Unblocking The Main Thread Solving ANRs and Frozen Frames
Unblocking The Main Thread Solving ANRs and Frozen Frames
Sinan KOZAK
Top 5 Benefits OF Using Muvi Live Paywall For Live Streams
Top 5 Benefits OF Using Muvi Live Paywall For Live Streams
Roshan Dwivedi
Salesforce Community Group Quito, Salesforce 101
Salesforce Community Group Quito, Salesforce 101
Paola De la Torre
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Miguel Araújo
Developing An App To Navigate The Roads of Brazil
Developing An App To Navigate The Roads of Brazil
V3cube
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
HampshireHUG
2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...
Martijn de Jong
CNv6 Instructor Chapter 6 Quality of Service
CNv6 Instructor Chapter 6 Quality of Service
giselly40
How to convert PDF to text with Nanonets
How to convert PDF to text with Nanonets
naman860154
Data Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt Robison
Anna Loughnan Colquhoun
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...
Igalia
Histor y of HAM Radio presentation slide
Histor y of HAM Radio presentation slide
vu2urc
Kalyanpur ) Call Girls in Lucknow Finest Escorts Service 🍸 8923113531 🎰 Avail...
Kalyanpur ) Call Girls in Lucknow Finest Escorts Service 🍸 8923113531 🎰 Avail...
gurkirankumar98700
Scaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organization
Radu Cotescu
The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024
Rafal Los
Presentation on how to chat with PDF using ChatGPT code interpreter
Presentation on how to chat with PDF using ChatGPT code interpreter
naman860154
The Codex of Business Writing Software for Real-World Solutions 2.pptx
The Codex of Business Writing Software for Real-World Solutions 2.pptx
Malak Abu Hammad
Recently uploaded
(20)
Partners Life - Insurer Innovation Award 2024
Partners Life - Insurer Innovation Award 2024
Factors to Consider When Choosing Accounts Payable Services Providers.pptx
Factors to Consider When Choosing Accounts Payable Services Providers.pptx
[2024]Digital Global Overview Report 2024 Meltwater.pdf
[2024]Digital Global Overview Report 2024 Meltwater.pdf
Unblocking The Main Thread Solving ANRs and Frozen Frames
Unblocking The Main Thread Solving ANRs and Frozen Frames
Top 5 Benefits OF Using Muvi Live Paywall For Live Streams
Top 5 Benefits OF Using Muvi Live Paywall For Live Streams
Salesforce Community Group Quito, Salesforce 101
Salesforce Community Group Quito, Salesforce 101
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Developing An App To Navigate The Roads of Brazil
Developing An App To Navigate The Roads of Brazil
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...
CNv6 Instructor Chapter 6 Quality of Service
CNv6 Instructor Chapter 6 Quality of Service
How to convert PDF to text with Nanonets
How to convert PDF to text with Nanonets
Data Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt Robison
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...
Histor y of HAM Radio presentation slide
Histor y of HAM Radio presentation slide
Kalyanpur ) Call Girls in Lucknow Finest Escorts Service 🍸 8923113531 🎰 Avail...
Kalyanpur ) Call Girls in Lucknow Finest Escorts Service 🍸 8923113531 🎰 Avail...
Scaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organization
The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024
Presentation on how to chat with PDF using ChatGPT code interpreter
Presentation on how to chat with PDF using ChatGPT code interpreter
The Codex of Business Writing Software for Real-World Solutions 2.pptx
The Codex of Business Writing Software for Real-World Solutions 2.pptx
新版阿尔法城背后的前端MVC实践
1.
Practice MVC as
features, not frameworks MVC DexterYy @
2.
3.
4.
http://site.douban.com/118836/
5.
6.
) •
“ ” LBS • “ ” 3D • “AJAX ” • web app Flash •
7.
XD
8.
XD •
MVC • MVC
9.
“
” • “ ” —— WASD • —— vs Graph • —— “ ”
10.
“
” • Bring real-life to software, rethought for the web Google+ slogan XX • 3D • GUI Metaphor
11.
“AJAX
” • / viewport google maps • JSON • —— web • “ ” overlap widget
12.
“
” web app • Single Page App wiki • GUI —— layout • —— layout
13.
“
” • View CouchDB • “ ” • • “ ”
14.
zhuangbility...
15.
• •
URL • • • • webapp
16.
MVC
17.
MVC
18.
MVC •
MVC • MVC
19.
MVC •
MVC • MVC MVC
20.
MVC •
MVC • MVC MVC MVC
21.
MVC •
MVC • MVC MVC MVC
22.
23.
• • •
24.
MVC
&
25.
1. •
OzJS • CommonJS module • • • JS
26.
• •
Model View • “MVC ”
27.
•
“ ” micro-framework • Thomas Fuchs: Zepto and the rise of the JavaScript Micro-Frameworks • Dustin Diaz: Ender.js - The open submodule library
28.
2.
message passing • Alan Kay: "OOP to me means only messaging, ..." • PubSub / EventEmitter / CustomEvent / ... • Observer • MVC
29.
•
Observer • View Controller •
30.
•
Observer • reset
31.
•
Observer event / / “ ” “ ” ==
32.
3.
URL Router • web • Single-page WebApp URL SEO • URL DOM • URL • URL • UNIX Plan 9 • “Plan 9 ” • URL WebApp “ ”
33.
•
url • router 30
34.
4. UI
delegate • uiproxy • UI • DOM
35.
•
className • class • UI View View DOM • View UI • ——> ——> ——>
36.
5.
Render • 1 2 • 1 2 DOM • API DOM SVG Canvas
37.
5.
Render • 1 2 • 1 2 DOM • API DOM SVG Canvas • API
38.
HTML4
39.
•
template • format python • convertTpl micro-templating John Resig/Underscore
40.
•
DomCanvas layout • DOM Canvas API • ie6 • SVG raphael.js
41.
6.
DataSource • Model •
42.
•
43.
module M V
C XD MVC
44.
Model •
Model URL • Model View Controller Model • Model Model make Controller •
45.
View •
+ UI View widget/ View • View Model Controller / Martin Fowler Passive View • View web MVC web GUI UI DOM View View DOM
46.
View •
View UI Controller • UI DOM • web UI / • Google+ circle • Cocoa UI View View DOM View
47.
Controller •
URL routing API widget • View Model • App MVC
48.
MVC
Server Model Pluggable Server Contorller Widgets http / / Model Controller / View / App / URL UI/DOM HTML / /
49.
MVC Smalltalk-80
Ruby On Rails ASP.NET Cocoa Model View Controller: History, theory and usage
50.
We need SMART
Models, THIN Controllers, and DUMB Views
51.
MVC
It's no big deal
52.
MVC
It's no big deal Thanks • http://www.douban.com/people/Dexter_Yy/ • blog http://www.limboy.com • http://site.douban.com/118836/ • MVC module https://github.com/dexteryy/OzJS/tree/master/ mod
Download now