YAY! A Wondrous Experience of Sound, Light, and Code                Cappuccino and SproutCore   in 45 Minutes  Johannes  F...
starstwins.comDonnerstag, 12. Mai 2011
Intro & Similarities                                                        Capp in 10                                    ...
SimilaritiesDonnerstag, 12. Mai 2011
Similarities        Desktop-ishDonnerstag, 12. Mai 2011
Similarities        Desktop-ish                No PluginDonnerstag, 12. Mai 2011
Similarities        Desktop-ish                   No Plugin                           Cocoa-                           ins...
Similarities        Desktop-ish                   No Plugin                           Cocoa-                           ins...
SimilaritiesDonnerstag, 12. Mai 2011
CappuccinoDonnerstag, 12. Mai 2011
Intro                           1/10Donnerstag, 12. Mai 2011
Intro           • Objective-J and JavaScript                           1/10Donnerstag, 12. Mai 2011
Intro           • Objective-J and JavaScript           • Port of Apple’s Cocoa framework                           1/10Don...
Intro           • Objective-J and JavaScript           • Port of Apple’s Cocoa framework           • Low learning curve fo...
Intro           • Objective-J and JavaScript           • Port of Apple’s Cocoa framework           • Low learning curve fo...
Intro           • Objective-J and JavaScript           • Port of Apple’s Cocoa framework           • Low learning curve fo...
Intro           • Objective-J and JavaScript           • Port of Apple’s Cocoa framework           • Low learning curve fo...
Installation           1. git clone git://github.com/280north/cappuccino.git           2. Run ./bootstrap.sh           3. ...
New Project                           3/10Donnerstag, 12. Mai 2011
New Project           1. capp gen –t NibApplication my_awesome_app                           3/10Donnerstag, 12. Mai 2011
New Project           1. capp gen –t NibApplication my_awesome_app           2. Run nib2cib Resources/MainMenu.xib        ...
New Project           1. capp gen –t NibApplication my_awesome_app           2. Run nib2cib Resources/MainMenu.xib        ...
New Project           1. capp gen –t NibApplication my_awesome_app           2. Run nib2cib Resources/MainMenu.xib        ...
Edit the UI                           4/10Donnerstag, 12. Mai 2011
Edit the UI           1. cd MyAwesomeApp                           4/10Donnerstag, 12. Mai 2011
Edit the UI           1. cd MyAwesomeApp           2. Run xcodecapp                           4/10Donnerstag, 12. Mai 2011
Edit the UI           1. cd MyAwesomeApp           2. Run xcodecapp           3. Edit the UI in Xcode                     ...
Edit the UI           1. cd MyAwesomeApp           2. Run xcodecapp           3. Edit the UI in Xcode                     ...
Edit the UI                           4/10Donnerstag, 12. Mai 2011
Edit the UI                           4/10Donnerstag, 12. Mai 2011
Edit the UI                           4/10Donnerstag, 12. Mai 2011
Edit the UI                           4/10Donnerstag, 12. Mai 2011
Objective-J                           5/10Donnerstag, 12. Mai 2011
Objective-J                                   Class name                           5/10Donnerstag, 12. Mai 2011
Objective-J                                   Class name                                            Superclass            ...
Objective-J                                   Class name                                            Superclass            ...
Objective-J                                   Class name                                            Superclass            ...
Objective-J                           5/10Donnerstag, 12. Mai 2011
Hook Up UI                           6/10                   wallpaper110.com &                  United Plankton PicturesDo...
Hook Up UI                           6/10                   wallpaper110.com &                  United Plankton PicturesDo...
Hook Up UI                           6/10                   wallpaper110.com &                  United Plankton PicturesDo...
Hook Up UI                           6/10                   wallpaper110.com &                  United Plankton PicturesDo...
Advanced Features                           7/10                www.botanicalgarden.ubc.caDonnerstag, 12. Mai 2011
Advanced Features                           in din gs                 B                           7/10                www....
Advanced Features                                             KVO                           in din gs             /KV     ...
Advanced Features                                             KVO                           in din gs             /KV     ...
Advanced Features                                               KVO                           in din gs               /KV ...
Testing                              https://github.com/280north/OJTest                                      •Unit Tests  ...
Deployment           1. Run jake release           2. Copy everything to any server, its just static files           3. Or ...
License                      10/10Donnerstag, 12. Mai 2011
License                      10/10Donnerstag, 12. Mai 2011                              LGPL
Donnerstag, 12. Mai 2011
Donnerstag, 12. Mai 2011
Donnerstag, 12. Mai 2011
http://bit.ly/jsconf-cappDonnerstag, 12. Mai 2011
SproutCoreDonnerstag, 12. Mai 2011
Intro                           1/10Donnerstag, 12. Mai 2011
Intro           • Straight JavaScript, HTML, CSS                           1/10Donnerstag, 12. Mai 2011
Intro           • Straight JavaScript, HTML, CSS           • Partly inspired by Apple’s Cocoa framework                   ...
Intro           • Straight JavaScript, HTML, CSS           • Partly inspired by Apple’s Cocoa framework           • Partly...
Intro           • Straight JavaScript, HTML, CSS           • Partly inspired by Apple’s Cocoa framework           • Partly...
Intro           • Straight JavaScript, HTML, CSS           • Partly inspired by Apple’s Cocoa framework           • Partly...
Intro           • Straight JavaScript, HTML, CSS           • Partly inspired by Apple’s Cocoa framework           • Partly...
Installation                           2/10Donnerstag, 12. Mai 2011
Installation           • gem install sproutcore                           2/10Donnerstag, 12. Mai 2011
Installation           • gem install sproutcore           • gem install sproutcore --pre (to get the latest beta)         ...
Installation           • gem install sproutcore           • gem install sproutcore --pre (to get the latest beta)         ...
New Project                           3/10Donnerstag, 12. Mai 2011
New Project           • sc-init my_awesome_app                           3/10Donnerstag, 12. Mai 2011
New Project           • sc-init my_awesome_app           • cd my_awesome_app                           3/10Donnerstag, 12....
New Project           • sc-init my_awesome_app           • cd my_awesome_app           • Run sc-server                    ...
New Project           • sc-init my_awesome_app           • cd my_awesome_app           • Run sc-server           • Open ht...
New Project           • sc-init my_awesome_app           • cd my_awesome_app           • Run sc-server           • Open ht...
Edit the UI                           4/10Donnerstag, 12. Mai 2011
Edit the UI                           4/10Donnerstag, 12. Mai 2011
Hook Up UI                           5/10                    image from apple.comDonnerstag, 12. Mai 2011
Hook Up UI                           5/10Donnerstag, 12. Mai 2011
Hook Up UI                           5/10Donnerstag, 12. Mai 2011
Hook Up UI                           5/10Donnerstag, 12. Mai 2011
Hook Up UI                           5/10Donnerstag, 12. Mai 2011
Hook Up UI                           5/10Donnerstag, 12. Mai 2011
Templates                           6/10                    image from sproutcore.comDonnerstag, 12. Mai 2011
Templates             http://guides.sproutcore.com/getting_started.html                           6/10                    ...
Advanced Features                           7/10                www.botanicalgarden.ubc.caDonnerstag, 12. Mai 2011
Advanced Features                      Tou ch                           7/10                www.botanicalgarden.ubc.caDonn...
Advanced Features                                             Mo                      Tou ch                   dule       ...
Advanced Features                                             Mo                      Tou ch                   dule       ...
Advanced Features                                               Mo                      Tou ch                     dule   ...
Testing                           8/10Donnerstag, 12. Mai 2011
Deployment           1. Run sc-build -rc my_awesome_app           2. Copy everything to any server, its just static files  ...
License                      10/10Donnerstag, 12. Mai 2011
License                      10/10Donnerstag, 12. Mai 2011
Donnerstag, 12. Mai 2011
Donnerstag, 12. Mai 2011
http://bit.ly/jsconf-scDonnerstag, 12. Mai 2011
or   ?                           starstwins.comDonnerstag, 12. Mai 2011
CAPPUCCINO OR                            SPROUTCORE?                  NEITHER, USE FLASH!by BubbachrissyDonnerstag, 12. Ma...
Majd (@jtaby)      Randy (@me1000)                                FUN!          "@jtaby @me1000          "@me1000 @jtaby  ...
Grazie mille!  Johannes  Fahrenkrug                    @jfahrenkrug  springenwerk.comDonnerstag, 12. Mai 2011
Upcoming SlideShare
Loading in …5
×

JSConf.it 2011: A Wondrous Experience of Sound, Light, and Code

2,210 views
2,178 views

Published on

My JSConf.it 2011 presentation about the Cappuccino and SproutCore JavaScript application frameworks. Unfortunately the videos are missing...

Published in: Technology, Travel
0 Comments
3 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
2,210
On SlideShare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
18
Comments
0
Likes
3
Embeds 0
No embeds

No notes for slide

JSConf.it 2011: A Wondrous Experience of Sound, Light, and Code

  1. 1. YAY! A Wondrous Experience of Sound, Light, and Code Cappuccino and SproutCore in 45 Minutes Johannes Fahrenkrug @jfahrenkrug springenwerk.com herzpoetin.deDonnerstag, 12. Mai 2011
  2. 2. starstwins.comDonnerstag, 12. Mai 2011
  3. 3. Intro & Similarities Capp in 10 Video! SC in 10 Video! Wrap Up & Recommendations Q &A starstwins.comDonnerstag, 12. Mai 2011
  4. 4. SimilaritiesDonnerstag, 12. Mai 2011
  5. 5. Similarities Desktop-ishDonnerstag, 12. Mai 2011
  6. 6. Similarities Desktop-ish No PluginDonnerstag, 12. Mai 2011
  7. 7. Similarities Desktop-ish No Plugin Cocoa- inspiredDonnerstag, 12. Mai 2011
  8. 8. Similarities Desktop-ish No Plugin Cocoa- inspired ouramericangeneration.orgDonnerstag, 12. Mai 2011
  9. 9. SimilaritiesDonnerstag, 12. Mai 2011
  10. 10. CappuccinoDonnerstag, 12. Mai 2011
  11. 11. Intro 1/10Donnerstag, 12. Mai 2011
  12. 12. Intro • Objective-J and JavaScript 1/10Donnerstag, 12. Mai 2011
  13. 13. Intro • Objective-J and JavaScript • Port of Apple’s Cocoa framework 1/10Donnerstag, 12. Mai 2011
  14. 14. Intro • Objective-J and JavaScript • Port of Apple’s Cocoa framework • Low learning curve for iOS/Mac developers 1/10Donnerstag, 12. Mai 2011
  15. 15. Intro • Objective-J and JavaScript • Port of Apple’s Cocoa framework • Low learning curve for iOS/Mac developers • No need to use HTML/JS/CSS 1/10Donnerstag, 12. Mai 2011
  16. 16. Intro • Objective-J and JavaScript • Port of Apple’s Cocoa framework • Low learning curve for iOS/Mac developers • No need to use HTML/JS/CSS • Design UIs in Xcode’s Interface Builder 1/10Donnerstag, 12. Mai 2011
  17. 17. Intro • Objective-J and JavaScript • Port of Apple’s Cocoa framework • Low learning curve for iOS/Mac developers • No need to use HTML/JS/CSS • Design UIs in Xcode’s Interface Builder • http://cappuccino.org 1/10Donnerstag, 12. Mai 2011
  18. 18. Installation 1. git clone git://github.com/280north/cappuccino.git 2. Run ./bootstrap.sh 3. Add export PATH=”/usr/local/narwhal/bin:$PATH” to your ~/.profile or ~/.zshrc 4. Run jake sudo-install 5. That’s it! 2/10Donnerstag, 12. Mai 2011
  19. 19. New Project 3/10Donnerstag, 12. Mai 2011
  20. 20. New Project 1. capp gen –t NibApplication my_awesome_app 3/10Donnerstag, 12. Mai 2011
  21. 21. New Project 1. capp gen –t NibApplication my_awesome_app 2. Run nib2cib Resources/MainMenu.xib 3/10Donnerstag, 12. Mai 2011
  22. 22. New Project 1. capp gen –t NibApplication my_awesome_app 2. Run nib2cib Resources/MainMenu.xib 3. Open index.html 3/10Donnerstag, 12. Mai 2011
  23. 23. New Project 1. capp gen –t NibApplication my_awesome_app 2. Run nib2cib Resources/MainMenu.xib 3. Open index.html 3/10Donnerstag, 12. Mai 2011
  24. 24. Edit the UI 4/10Donnerstag, 12. Mai 2011
  25. 25. Edit the UI 1. cd MyAwesomeApp 4/10Donnerstag, 12. Mai 2011
  26. 26. Edit the UI 1. cd MyAwesomeApp 2. Run xcodecapp 4/10Donnerstag, 12. Mai 2011
  27. 27. Edit the UI 1. cd MyAwesomeApp 2. Run xcodecapp 3. Edit the UI in Xcode 4/10Donnerstag, 12. Mai 2011
  28. 28. Edit the UI 1. cd MyAwesomeApp 2. Run xcodecapp 3. Edit the UI in Xcode 4/10Donnerstag, 12. Mai 2011
  29. 29. Edit the UI 4/10Donnerstag, 12. Mai 2011
  30. 30. Edit the UI 4/10Donnerstag, 12. Mai 2011
  31. 31. Edit the UI 4/10Donnerstag, 12. Mai 2011
  32. 32. Edit the UI 4/10Donnerstag, 12. Mai 2011
  33. 33. Objective-J 5/10Donnerstag, 12. Mai 2011
  34. 34. Objective-J Class name 5/10Donnerstag, 12. Mai 2011
  35. 35. Objective-J Class name Superclass 5/10Donnerstag, 12. Mai 2011
  36. 36. Objective-J Class name Superclass Ivars 5/10Donnerstag, 12. Mai 2011
  37. 37. Objective-J Class name Superclass Ivars Methods 5/10Donnerstag, 12. Mai 2011
  38. 38. Objective-J 5/10Donnerstag, 12. Mai 2011
  39. 39. Hook Up UI 6/10 wallpaper110.com & United Plankton PicturesDonnerstag, 12. Mai 2011
  40. 40. Hook Up UI 6/10 wallpaper110.com & United Plankton PicturesDonnerstag, 12. Mai 2011
  41. 41. Hook Up UI 6/10 wallpaper110.com & United Plankton PicturesDonnerstag, 12. Mai 2011
  42. 42. Hook Up UI 6/10 wallpaper110.com & United Plankton PicturesDonnerstag, 12. Mai 2011
  43. 43. Advanced Features 7/10 www.botanicalgarden.ubc.caDonnerstag, 12. Mai 2011
  44. 44. Advanced Features in din gs B 7/10 www.botanicalgarden.ubc.caDonnerstag, 12. Mai 2011
  45. 45. Advanced Features KVO in din gs /KV B C 7/10 www.botanicalgarden.ubc.caDonnerstag, 12. Mai 2011
  46. 46. Advanced Features KVO in din gs /KV B C NativeHost 7/10 www.botanicalgarden.ubc.caDonnerstag, 12. Mai 2011
  47. 47. Advanced Features KVO in din gs /KV B C NativeHost Categorie 7/10 s www.botanicalgarden.ubc.caDonnerstag, 12. Mai 2011
  48. 48. Testing https://github.com/280north/OJTest •Unit Tests •Specs •Mocks •Auto-Testing •Code Coverage 8/10Donnerstag, 12. Mai 2011
  49. 49. Deployment 1. Run jake release 2. Copy everything to any server, its just static files 3. Or run jake desktop for NativeHost 9/10Donnerstag, 12. Mai 2011
  50. 50. License 10/10Donnerstag, 12. Mai 2011
  51. 51. License 10/10Donnerstag, 12. Mai 2011 LGPL
  52. 52. Donnerstag, 12. Mai 2011
  53. 53. Donnerstag, 12. Mai 2011
  54. 54. Donnerstag, 12. Mai 2011
  55. 55. http://bit.ly/jsconf-cappDonnerstag, 12. Mai 2011
  56. 56. SproutCoreDonnerstag, 12. Mai 2011
  57. 57. Intro 1/10Donnerstag, 12. Mai 2011
  58. 58. Intro • Straight JavaScript, HTML, CSS 1/10Donnerstag, 12. Mai 2011
  59. 59. Intro • Straight JavaScript, HTML, CSS • Partly inspired by Apple’s Cocoa framework 1/10Donnerstag, 12. Mai 2011
  60. 60. Intro • Straight JavaScript, HTML, CSS • Partly inspired by Apple’s Cocoa framework • Partly inspired by Ruby on Rails 1/10Donnerstag, 12. Mai 2011
  61. 61. Intro • Straight JavaScript, HTML, CSS • Partly inspired by Apple’s Cocoa framework • Partly inspired by Ruby on Rails • Usable for desktop-ish AND "classic" applications 1/10Donnerstag, 12. Mai 2011
  62. 62. Intro • Straight JavaScript, HTML, CSS • Partly inspired by Apple’s Cocoa framework • Partly inspired by Ruby on Rails • Usable for desktop-ish AND "classic" applications • Touch & mobile support built-in 1/10Donnerstag, 12. Mai 2011
  63. 63. Intro • Straight JavaScript, HTML, CSS • Partly inspired by Apple’s Cocoa framework • Partly inspired by Ruby on Rails • Usable for desktop-ish AND "classic" applications • Touch & mobile support built-in • http://sproutcore.com 1/10Donnerstag, 12. Mai 2011
  64. 64. Installation 2/10Donnerstag, 12. Mai 2011
  65. 65. Installation • gem install sproutcore 2/10Donnerstag, 12. Mai 2011
  66. 66. Installation • gem install sproutcore • gem install sproutcore --pre (to get the latest beta) 2/10Donnerstag, 12. Mai 2011
  67. 67. Installation • gem install sproutcore • gem install sproutcore --pre (to get the latest beta) • Installer from http://www.sproutcore.com 2/10Donnerstag, 12. Mai 2011
  68. 68. New Project 3/10Donnerstag, 12. Mai 2011
  69. 69. New Project • sc-init my_awesome_app 3/10Donnerstag, 12. Mai 2011
  70. 70. New Project • sc-init my_awesome_app • cd my_awesome_app 3/10Donnerstag, 12. Mai 2011
  71. 71. New Project • sc-init my_awesome_app • cd my_awesome_app • Run sc-server 3/10Donnerstag, 12. Mai 2011
  72. 72. New Project • sc-init my_awesome_app • cd my_awesome_app • Run sc-server • Open http://localhost:4020 3/10Donnerstag, 12. Mai 2011
  73. 73. New Project • sc-init my_awesome_app • cd my_awesome_app • Run sc-server • Open http://localhost:4020 3/10Donnerstag, 12. Mai 2011
  74. 74. Edit the UI 4/10Donnerstag, 12. Mai 2011
  75. 75. Edit the UI 4/10Donnerstag, 12. Mai 2011
  76. 76. Hook Up UI 5/10 image from apple.comDonnerstag, 12. Mai 2011
  77. 77. Hook Up UI 5/10Donnerstag, 12. Mai 2011
  78. 78. Hook Up UI 5/10Donnerstag, 12. Mai 2011
  79. 79. Hook Up UI 5/10Donnerstag, 12. Mai 2011
  80. 80. Hook Up UI 5/10Donnerstag, 12. Mai 2011
  81. 81. Hook Up UI 5/10Donnerstag, 12. Mai 2011
  82. 82. Templates 6/10 image from sproutcore.comDonnerstag, 12. Mai 2011
  83. 83. Templates http://guides.sproutcore.com/getting_started.html 6/10 image from apple.comDonnerstag, 12. Mai 2011
  84. 84. Advanced Features 7/10 www.botanicalgarden.ubc.caDonnerstag, 12. Mai 2011
  85. 85. Advanced Features Tou ch 7/10 www.botanicalgarden.ubc.caDonnerstag, 12. Mai 2011
  86. 86. Advanced Features Mo Tou ch dule s 7/10 www.botanicalgarden.ubc.caDonnerstag, 12. Mai 2011
  87. 87. Advanced Features Mo Tou ch dule s DataStore 7/10 www.botanicalgarden.ubc.caDonnerstag, 12. Mai 2011
  88. 88. Advanced Features Mo Tou ch dule s DataStore Themes 7/10 www.botanicalgarden.ubc.caDonnerstag, 12. Mai 2011
  89. 89. Testing 8/10Donnerstag, 12. Mai 2011
  90. 90. Deployment 1. Run sc-build -rc my_awesome_app 2. Copy everything to any server, its just static files 3. Or use the strobe gem (http://strobecorp.com) 9/10Donnerstag, 12. Mai 2011
  91. 91. License 10/10Donnerstag, 12. Mai 2011
  92. 92. License 10/10Donnerstag, 12. Mai 2011
  93. 93. Donnerstag, 12. Mai 2011
  94. 94. Donnerstag, 12. Mai 2011
  95. 95. http://bit.ly/jsconf-scDonnerstag, 12. Mai 2011
  96. 96. or ? starstwins.comDonnerstag, 12. Mai 2011
  97. 97. CAPPUCCINO OR SPROUTCORE? NEITHER, USE FLASH!by BubbachrissyDonnerstag, 12. Mai 2011
  98. 98. Majd (@jtaby) Randy (@me1000) FUN! "@jtaby @me1000 "@me1000 @jtaby says @cappuccino is says @sproutcore is so much better than so much better than @sproutcore. Is that @cappuccino. Is that true?" true?"Donnerstag, 12. Mai 2011
  99. 99. Grazie mille! Johannes Fahrenkrug @jfahrenkrug springenwerk.comDonnerstag, 12. Mai 2011

×