Netzke is a framework for building modular rich internet applications (RIAs) using Ruby on Rails and Ext JS. It allows developers to create common UI components like grids, forms, and explorers and combine them into applications. The document discusses Netzke's component-based approach, provides examples of common components, and outlines how to test and contribute to Netzke.

1. Rapid RIA development
with Netzke
a modular approach
@nomadcoder @rubyshift 2011

2. Introduction
Netzke is...
@nomadcoder @rubyshift

3. Introduction
Netzke is...
all about...
@nomadcoder @rubyshift

4. Introduction
Netzke is...
all about...
front end
+ back end
@nomadcoder @rubyshift

5. Introduction
Netzke is...
all about...
front end
+ back end
~ components ~
@nomadcoder @rubyshift

6. Sencha Ext JS
@nomadcoder @rubyshift

7. Sencha Ext JS
m e!
we so
A
@nomadcoder @rubyshift

8. CRUD app in 7 minutes
http://netzke.org => “Start here”
@nomadcoder @rubyshift

9. Demo
YANIT - Yet Another (Netzke) Issue Tracker
Issue
yanit.heroku.com
name
assignee_id
project_id
...
1..n 1..n
Project User Ruby 1.9.2
name name Rails 3.1.1
... ...
Ext JS 4.0.2a
@nomadcoder @rubyshift

10. Key gems
@nomadcoder @rubyshift

11. Components
• <Model>Grid
• <Model>Form
• <Model(s)>Explorer
• <Model>Inspector
@nomadcoder @rubyshift

12. Components: layout
@nomadcoder @rubyshift

13. Components: layout
IssueGrid
@nomadcoder @rubyshift

14. Components: layout
@nomadcoder @rubyshift

15. Components: layout
UserGrid
@nomadcoder @rubyshift

16. Components: layout
@nomadcoder @rubyshift

17. Components: layout
UserIssueExplorer
@nomadcoder @rubyshift

18. Components: layout
@nomadcoder @rubyshift

19. Components: layout
ProjectInspector
@nomadcoder @rubyshift

20. Components: layout
@nomadcoder @rubyshift

21. Components: layout
Workspace
@nomadcoder @rubyshift

22. Components: layout
@nomadcoder @rubyshift

23. Components: layout
Navigator
@nomadcoder @rubyshift

24. Components: layout
@nomadcoder @rubyshift

25. Components: layout
Apilication
@nomadcoder @rubyshift

26. Components: layout
@nomadcoder @rubyshift

27. Components: grids
@nomadcoder @rubyshift

28. Components: forms
@nomadcoder @rubyshift

29. Components: forms
@nomadcoder @rubyshift

30. OneToManyExplorer
container
# additionally...
collection
@nomadcoder @rubyshift

31. Application component
# cut version
# in the view
@nomadcoder @rubyshift

32. Component testing
@nomadcoder @rubyshift

33. Component testing
example from netzke_basepack using Cucumber + Pickle
& Capybara
@nomadcoder @rubyshift

34. TODO
tutorials showcases
Mongoid
i18n logo
DataMapper
documentation
new components (re)tweets :)
@nomadcoder @rubyshift

35. TODO
tutorials showcases
Mongoid
i18n logo
DataMapper
documentation
new components (re)tweets :)
~ Contribute! ~
@nomadcoder @rubyshift

36. Credits
• VisualCube Inc, USA - for sponsoring
component development
• Netzke community - for patches and feedback
netzke.org
@netzke
@nomadcoder @rubyshift

37. Thanks
Questions
@nomadcoder @rubyshift