Ce diaporama a bien été signalé.
Nous utilisons votre profil LinkedIn et vos données d’activité pour vous proposer des publicités personnalisées et pertinentes. Vous pouvez changer vos préférences de publicités à tout moment.

Reef - ESUG 2010

1 786 vues

Publié le

Reef is a AJAX/Javascript framework for Seaside, works in Pharo and Gemstone Smalltalk

Publié dans : Technologie
  • Soyez le premier à commenter

  • Soyez le premier à aimer ceci

Reef - ESUG 2010

  1. 1. Reef Ajax the way it should be viernes 8 de octubre de 2010
  2. 2. Who am I? • Esteban Lorenzano, 38 • In the community since 2007 • Started “Smallworks” with two friends, to work on Smalltalk projects (Mostly). • Other community projects: Mars, SqueakDBX, Gofer Project Loader viernes 8 de octubre de 2010
  3. 3. Seaside is cool... For all the reasons you already know So, why we need another tool? viernes 8 de octubre de 2010
  4. 4. So, what’s Reef? Javascript/Ajax component framework for Seaside viernes 8 de octubre de 2010
  5. 5. The problem We want to provide a transparent model, where all the diferent kinds of interactions are handled the same way. viernes 8 de octubre de 2010
  6. 6. Architecture Server Browser Dispatcher at client side handles browser- Dispatcher to-smalltalk interaction. Page viernes 8 de octubre de 2010
  7. 7. Architecture • Uses jQuery • First version uses both: prototype and jQuery, but that was ugly and fortunately deprecated viernes 8 de octubre de 2010
  8. 8. Architecture • “Some kind” Model-View-Controller • but, as Seaside, Reef components has view- controller at the same place. viernes 8 de octubre de 2010
  9. 9. Architecture • You can add any component (with any complexity) as a Seaside component. • call #asComponent viernes 8 de octubre de 2010
  10. 10. Relax moment viernes 8 de octubre de 2010
  11. 11. Component model • You create your components • by extending a REContainer (can be REPanel, REForm, etc.) • or creating a widget structure inside a Seaside component. • Right now, just those widgets I needed... but extensible any time. viernes 8 de octubre de 2010
  12. 12. Demo viernes 8 de octubre de 2010
  13. 13. Conventions • Buttons should trigger an action, not a form submission. (#callback:) • Forms should allow triggering (#trigger, #triggerThenDo:) • Form widgets also • Just panels can be refreshed (#refresh, #refreshThenDo:) viernes 8 de octubre de 2010
  14. 14. Demo viernes 8 de octubre de 2010
  15. 15. Using callbacks • Simple callbacks. It fires a “dispatch” action, which is a simple “jQuery load” (but you don’t do it). • Client callbacks. Generates a jQuery script, which is executed in the browser. • Page callbacks. It renders a new page. viernes 8 de octubre de 2010
  16. 16. Demo viernes 8 de octubre de 2010
  17. 17. Context • Some times you need to force some behavior, and you need to know if you are inside a Reef callback or a normal callback. • REContext • #isInContext • #inPage:, #inClient: • Example: REComponent>>#answer renders a new page viernes 8 de octubre de 2010
  18. 18. Demo viernes 8 de octubre de 2010
  19. 19. Relax moment viernes 8 de octubre de 2010
  20. 20. Decorations • Just like Seaside, your components can be decorated to add behavior • Unlike Seaside, you can decorate widgets too. It allows elegant adding of plugins. • Numeric format on text field • Date format on text field viernes 8 de octubre de 2010
  21. 21. Demo viernes 8 de octubre de 2010
  22. 22. Plugins • You can easily add jQuery plugins, just need to find the right insertion point • Most of the times they can be added to existing widgets through decorations (e.g. RETextField>>#beDate) viernes 8 de octubre de 2010
  23. 23. No more demos viernes 8 de octubre de 2010
  24. 24. What’s next? • Add more components • Getting some feedback from the community • Please, use it! viernes 8 de octubre de 2010
  25. 25. Questions? http://squeaksource.com/Reef viernes 8 de octubre de 2010

×