Client-side MVC frameworks like AngularJS are getting more popular over time. They represent a big architectural change to what web developers are used to: moving from server-side MVC to a browser based one. In this talk I will speak about how Grails can fit with a single-page architecture and discuss the pros and cons of developing that kind of applications. I will also do a live demo of a sample web application using AngularJS and Grails.

1. Developing SPI
Applications using
Grails and Angular JS
Álvaro Sánchez-Mariscal
Web Architect – odobo
!
@alvaro_sanchez

2. About me
• Passionate software developer.
• Founded Salenda in 2005.
• Co-founded Escuela de Groovy in 2009.
• Groovy/Grails lover since 2007.
• Working now at Odobo as Web Architect.

3. • HTML5 games platform for:
• Game developers.
• Casinos.
• We are hiring!
• http://bit.ly/odobo-grails-job

4. Typical Grails
Architecture

5. Monolithic!

6. Slow GSP rendering!
!
Slow startup time!
!
Memory consumption,
reloading issues...

7. From official Grails
documentation…

9. It’s like….

10. Other problems
• It’s tricky to decouple the view layer to
render views for different devices.
• It’s difficult to do frequent deployments.
• It’s hard to scale development teams.

11. Ok... WTF is a Single
Page Application?

13. • A webapp where you can navigate
without any page refresh.
• Ajax/REST is used to communicate with
the server.
• The MVC is in the browser, written in
Javascript.

14. Seriously??
WTF!?!?
Did you say
Javascript??

15. Oh yeah me
too!
I like
Javascript!

16. I’m fine with Grails,
thanks. Why should I
care about SPI?

17. The front end revolution

18. Grails 3.0 will have
application profiles

19. Grails is evolving
• It already happened with Hibernate.
• GORM is now decoupled from relational
DB’s.
• It will happen with Spring MVC as well.

20. • Faster.
• Better user
experience.
Graceful
•degradation?
Communication
•failures?
• Ops-friendly. •Offline usage?
• Easier for
Effort
•duplication?
the developer.

21. Other benefits
• You get ready to expose a public API.
• Each layer can be sized, scaled and
redeployed independently.
• It allows frequent UI updates.
• It’s easier to create mobile apps.
• You can organize/scale your teams better.
• Development efforts in parallel.

22. I’m sold!! How can I do
that with Grails??

23. • Build an API.
• Use Grails 2.3 REST capabilities.
• Define your backend: GORM? Other web
services?
• Make it a robust, tested, powerful black
box for the front end.

24. •
Focus on:
• Testing.
• Efficient data manipulation / caching.
• Security.
• Scalability.

25. T is much
RES
than just
more
ing JSON.
return

26. RESTful is about*
Client / server.
Stateless.
Cacheable.
Layered.
* Source: Wikipedia.

27. What are the
alternatives for the
client side?

29. Tools a fronted
developer will love

30. todomvc.com
• Todo app implemented in lot of
frameworks

31. Similar features
Grails
AngularJS
Domain class
Model
GSP’s and templates
Views and templates
${}
{{ }}
Controllers
Controllers
URL Mappings
Routing

32. Grails & Angular
• Angular will issue an OPTIONS request
as per CORS:
• Use cors plugin.
• Manually configure URL mappings to
avoid 405 responses.

33. Also bear in mind
• Think about deployment.
• Do you really need a full servlet
container?
• Document your API.
• Swagger.

35. Create a Swagger
plugin for Grails 2.3+

36. Demo
http://bit.ly/grails-angular

37. Thanks!
Álvaro Sánchez-Mariscal
Web Architect – odobo
!
@alvaro_sanchez