Material from Vu Dinh Khoi (a developer at Silicon Straits Saigon) "I'm a Rails developer. I've just started to do AngularJS for 2 weeks and I feel really excited with the way Angular do to design client-side applications. And I just want to share about 'How to integrate AngularJS to Rails', so easy." Connect with him here: http://www.linkedin.com/pub/khoi-vu-dinh/5a/6a/276

1. Awesome web apps with
Rails + AngularJS
o0khoiclub0o

2. Why I call it’s awesome
● Rich javascript
● Client-side develop
● Single-page application

3. Approachs
Designer
HTML
Model/ API
Developer

4. jQuery
AngularJS
different in approachs
•
Library
•
Design a page, and then you make it dynamic
•
•
•
Framework
Design your application in ‘Angular way’
Should only do DOM manipulation in a directive extensions of HTML
jQuery & AngularJS can work together, but we should stop using jQuery, try to think about how to
do in Angular way
http://net.tutsplus.com/tutorials/javascript-ajax/5-awesome-angularjs-features/

5. Techniques
HTML, CSS, JS(UI)
Bootstrap
JS Framework
AngularJS
Rest API
Rails
Database
Postgres

6. Organize your app
Goals
• Write app in simple way
• App is compiled & minified automatically
• Easy to manage packages/ assets
JS
Coffee
HTML
Haml

7. Organize your app
We had rails folder structure like this
/app
..assets
../controllers
../models
../views
../helpers
/public
...

8. How others do
Angular App
Rails app
Packages/ assets
Un-compiled Angular app
3rd tools
/app
..assets
../controllers
../models
3rd tools
Compiled Angular app
../views
../helpers
/public
...

9. and how I do
/app
--/assets
----/javascripts
------/controllers
--------/<module>/
<Action>Ctrl.js.coffee
--------/<module>.js.coffee.erb
----/templates
------/<module>/<action>.html.haml
...
/public
...
●
Use rails to compile app
●
More simple, don’t use
extra tools, less build step,
minification included

10. Result

11. https://developers.google.com/webmasters/ajax-crawling/