Download - With jQuery & CakePHP to World Domination
![Page 1: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/1.jpg)
With jQuery & CakePHP to
World Domination
by Felix Geisendörfer
CakeFest Orlando 2008
![Page 2: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/2.jpg)
About me
• Felix Geisendörfer, 20 years old, Germany
• Blogger / Programmer / Entrepreneur
• Used jQuery & CakePHP in all battle fields
• School projects, small business sites, 300++ DB table monster project
![Page 3: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/3.jpg)
ThinkingPHP.org
Blog about CakePHP
![Page 4: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/4.jpg)
Deep inside the CakePHP core
ThinkingPHP.org
![Page 5: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/5.jpg)
Deep inside the CakePHP core
ThinkingPHP.orgSometimes things just go wrong
![Page 6: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/6.jpg)
World Domination
![Page 7: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/7.jpg)
World Domination
![Page 8: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/8.jpg)
World Domination
![Page 9: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/9.jpg)
World Domination
![Page 10: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/10.jpg)
Many empires tried to achieve it
![Page 11: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/11.jpg)
World Domination
American Empire
Persian Empire
Macedonian Empire
Mauryan Empire
Roman Empire
Arab Caliphate
Mongol Empire
Ming Empire Portuguese empire
Habsburg EmpireSpanish Empire
French Empire
British Empire
Soviet Union
Japanese Empire
Nazi Germany
American Empire
Persian Empire
Macedonian Empire
Mauryan Empire
Roman Empire
Arab Caliphate
Mongol Empire
Ming Empire Portuguese empire
Habsburg EmpireSpanish Empire
French Empire
British Empire
Soviet Union
Japanese Empire
Nazi Germany
![Page 12: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/12.jpg)
World Domination
American Empire
Persian Empire
Macedonian Empire
Mauryan Empire
Roman Empire
Arab Caliphate
Mongol Empire
Ming Empire Portuguese empire
Habsburg EmpireSpanish Empire
French Empire
British Empire
Soviet Union
Japanese Empire
Nazi Germany
American Empire
Persian Empire
Macedonian Empire
Mauryan Empire
Roman Empire
Arab Caliphate
Mongol Empire
Ming Empire Portuguese empire
Habsburg EmpireSpanish Empire
French Empire
British Empire
Soviet Union
Japanese Empire
Nazi Germany
PhpNut
&
Chuck
Norri
s
![Page 13: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/13.jpg)
CakePHP&
jQuery
![Page 14: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/14.jpg)
Quick battle analysis
![Page 15: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/15.jpg)
The problems
• No jQuery JS helper available
• No manual on using jQuery + CakePHP
• No jQuery / CakePHP framework (except Jamal)
![Page 16: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/16.jpg)
Why jQuery?
• Embraces succinct code
• Huge number of plugins out there
• Plays nice with other libraries
![Page 17: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/17.jpg)
Why CakePHP?
just kidding ...
![Page 18: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/18.jpg)
Why CakePHP?
... well actually
![Page 19: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/19.jpg)
Jaxer: The new guy in town
• Write entire web applications in JavaScript
• MySQL, SQLite, SMTP, File system access
• Server process stays alive
![Page 20: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/20.jpg)
• No Linux version yet
• Might not scale
• No Framework yet
Jaxer: Why not?
Jaxer also works with (Cake)PHP
![Page 21: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/21.jpg)
So let’s take over the world ...
![Page 22: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/22.jpg)
Getting your JS included
Layout (app/views/layouts/default.ctp)
View (app/views/posts/index.ctp)
Controller (app/controllers/posts_controller.php)
The Quick & Easy
![Page 23: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/23.jpg)
Problems you’ll run into
![Page 24: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/24.jpg)
Not DRY
![Page 25: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/25.jpg)
Not DRY
![Page 26: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/26.jpg)
Confusing
WTF, where does w
hat
include come from?
![Page 27: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/27.jpg)
How to KISS this?
• Have a central place to define JS includes
• Only one reference to each JS file
• Simple rules for inclusion on a per action basis
![Page 28: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/28.jpg)
Rule based JS inclusion
app/config/js_includes.php (custom approach, not in cake core!)
![Page 29: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/29.jpg)
The inclusion rule parser
(Google “33 Lines of Magic Code”)
The Flexible
Will talk about this in tomorrows talks
![Page 30: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/30.jpg)
Automatic JS inclusion
• If “app/webroot/js/views/layouts/{layout}.js” exists -> load it
• If “app/webroot/js/views/{controller}/{view}.js” exists -> load it
![Page 31: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/31.jpg)
Getting controller data to JS
Yummy function for your AppController
![Page 32: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/32.jpg)
Getting controller data to JS
How to make a list of $posts available in JS
![Page 33: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/33.jpg)
Getting controller data to JS
How to export your $jsonVars array to JavaScript
(put this in your layouts <head> section)
![Page 34: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/34.jpg)
Getting controller data to JS
How to access jsonVars in JavaScript
![Page 35: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/35.jpg)
World Domination
![Page 36: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/36.jpg)
PostTask.com
• Personal time management
• Next step: Becoming the best project management tool
• After that: World Domination
Commercial Break
![Page 37: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/37.jpg)
jayDom
Microformats on steriods
![Page 38: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/38.jpg)
Controller
View
MVC concept
ModelHTML / DOM
CSS
JavaScript
![Page 39: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/39.jpg)
Microformats
• A collection of standardized HTML snippets
• Can be parsed by spiders, making your site semantic in a way thats actually useful
• Examples: hCard, rel-license, adr, geo ...
Ask audience who has heard about Microformat
![Page 40: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/40.jpg)
jayDom Microformats
• Usually non-standardized formats, custom to your application
• Can change as your app evolves
• You are already using them
![Page 41: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/41.jpg)
jayDom Microformat Example
![Page 42: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/42.jpg)
jayDom Microformat Example
Task.id Task.date
![Page 43: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/43.jpg)
jayDom Microformat Example
Task.time_doneTask.progress Task.time_total
Task.name
![Page 44: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/44.jpg)
Microformat I/O
• In order to read data from our microformat, we need to parse it
• If we want to update our data we also need to be able to write to the microformat
![Page 45: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/45.jpg)
Reading Microformat data
Microformat snippet we are interested in
How to parse the encoded progress value
Task.progressAsk: Anybody who doesn’t know regex?
![Page 46: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/46.jpg)
Writing Microformat data
Microformat snippet we are interested in
How to encode progress value of “75”
![Page 47: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/47.jpg)
Writing Microformat data
Microformat snippet we are interested in
How to encode progress value of “75”
![Page 48: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/48.jpg)
jayDom way of semantic encoding
Get:
Set:
Beats
Beats
![Page 49: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/49.jpg)
Mapping DOM accessors
Get:
Set:
![Page 50: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/50.jpg)
A real world example
![Page 51: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/51.jpg)
jayDom Microformat Example
Task.id
![Page 52: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/52.jpg)
jayDom Microformat Example
Task.id Task.date
![Page 53: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/53.jpg)
jayDom Microformat Example
Task.progress
![Page 54: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/54.jpg)
jayDom Microformat Example
Task.time_doneTask.progress
![Page 55: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/55.jpg)
jayDom Microformat Example
Task.time_doneTask.progress Task.time_total
![Page 56: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/56.jpg)
jayDom Microformat Example
Task.time_doneTask.progress Task.time_total
Task.name
![Page 57: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/57.jpg)
World Domination
![Page 58: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/58.jpg)
jQuery Selectors on steriods
Select all tasks with the name ‘New Task’
Select all tasks that are more then half done
![Page 59: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/59.jpg)
jQuery Selectors on steriods
• Find all Posts
• That have at least one Comment written by Felix
• Only return posts that visible (not hidden)
![Page 60: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/60.jpg)
Easy Ajax
![Page 61: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/61.jpg)
jayDom Advantages
• Put your semantics to use
• Save tons of bandwidth on server calls using JSON
• Hassle-less client server communication
![Page 62: With jQuery & CakePHP to World Domination](https://reader038.vdocuments.us/reader038/viewer/2022103000/55546014b4c905a5798b48ba/html5/thumbnails/62.jpg)
Questions
• Thanks for listening
• Thanks for helping the CakePHP project grow
Slides will be available on ThinkingPHP.org shortly!