![Page 1: Developing SPI applications using Grails and AngularJS](https://reader033.vdocuments.us/reader033/viewer/2022060107/554c6394b4c9053e308b5857/html5/thumbnails/1.jpg)
@alvaro_sanchez - Odobo
Álvaro Sánchez-Mariscal
Developing SPI applications using Grails and AngularJS
![Page 2: Developing SPI applications using Grails and AngularJS](https://reader033.vdocuments.us/reader033/viewer/2022060107/554c6394b4c9053e308b5857/html5/thumbnails/2.jpg)
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.
![Page 3: Developing SPI applications using Grails and AngularJS](https://reader033.vdocuments.us/reader033/viewer/2022060107/554c6394b4c9053e308b5857/html5/thumbnails/3.jpg)
• HTML5 games platform for:
• Game developers.
• Casinos.
![Page 4: Developing SPI applications using Grails and AngularJS](https://reader033.vdocuments.us/reader033/viewer/2022060107/554c6394b4c9053e308b5857/html5/thumbnails/4.jpg)
Typical Grails Architecture
This is about architecture.Grails is essentially MVC.This can be fine for some projects, but may have drawbacks in large projects
![Page 5: Developing SPI applications using Grails and AngularJS](https://reader033.vdocuments.us/reader033/viewer/2022060107/554c6394b4c9053e308b5857/html5/thumbnails/5.jpg)
Monolithic!
Although the individual Grails artifacts can be developed in a modular way, it still has the views and the business logic on the same artifact.
![Page 6: Developing SPI applications using Grails and AngularJS](https://reader033.vdocuments.us/reader033/viewer/2022060107/554c6394b4c9053e308b5857/html5/thumbnails/6.jpg)
Slow GSP rendering!
Slow startup time!
Memory consumption, reloading issues...
Sitemesh and the GSP rendering engine it’s not the fastest thing in the world...Large projects may suffer slow startup times, intensive resource usage, ....
![Page 7: Developing SPI applications using Grails and AngularJS](https://reader033.vdocuments.us/reader033/viewer/2022060107/554c6394b4c9053e308b5857/html5/thumbnails/7.jpg)
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.
Although there are plugins to solve this, it’s not that agile to have different renderings for different devices.Changes on the UI will require to redeploy the whole thing.The development efforts must be synchronized.
![Page 8: Developing SPI applications using Grails and AngularJS](https://reader033.vdocuments.us/reader033/viewer/2022060107/554c6394b4c9053e308b5857/html5/thumbnails/8.jpg)
Grails 3.0 will have application profiles
The Grails roadmap is already embracing the change, and 3.0 will offer different profiles:- Classic MVC.- Netty.- Vert.x.- Etc.
![Page 9: Developing SPI applications using Grails and AngularJS](https://reader033.vdocuments.us/reader033/viewer/2022060107/554c6394b4c9053e308b5857/html5/thumbnails/9.jpg)
So... WTF is a Single Page Application?
SPI or SPA.
![Page 10: Developing SPI applications using Grails and AngularJS](https://reader033.vdocuments.us/reader033/viewer/2022060107/554c6394b4c9053e308b5857/html5/thumbnails/10.jpg)
![Page 11: Developing SPI applications using Grails and AngularJS](https://reader033.vdocuments.us/reader033/viewer/2022060107/554c6394b4c9053e308b5857/html5/thumbnails/11.jpg)
• 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.
![Page 12: Developing SPI applications using Grails and AngularJS](https://reader033.vdocuments.us/reader033/viewer/2022060107/554c6394b4c9053e308b5857/html5/thumbnails/12.jpg)
Did you say Javascript??
Seriously??
WTF!?!?
![Page 13: Developing SPI applications using Grails and AngularJS](https://reader033.vdocuments.us/reader033/viewer/2022060107/554c6394b4c9053e308b5857/html5/thumbnails/13.jpg)
I like Javascript!
Oh yeah me too!
![Page 14: Developing SPI applications using Grails and AngularJS](https://reader033.vdocuments.us/reader033/viewer/2022060107/554c6394b4c9053e308b5857/html5/thumbnails/14.jpg)
![Page 15: Developing SPI applications using Grails and AngularJS](https://reader033.vdocuments.us/reader033/viewer/2022060107/554c6394b4c9053e308b5857/html5/thumbnails/15.jpg)
I’m fine with Grails. Why should I care
about SPI?
![Page 16: Developing SPI applications using Grails and AngularJS](https://reader033.vdocuments.us/reader033/viewer/2022060107/554c6394b4c9053e308b5857/html5/thumbnails/16.jpg)
• It’s faster.
• It has better user experience.
• It may be easier for the developer.
• How to gracefully degrade?
• How to deal with communication failures?
• Can I use the application offline?
• Do I need to duplicate the MVC?
The applications are usually faster and more responsive, so the user experience is better.It may be easier for developers, as they don’t need to deal with callbacks, the views are updated automatically.----What if there is no Javascript enabled?How to handle network issues?Are we going to have duplicated efforts?
![Page 17: Developing SPI applications using Grails and AngularJS](https://reader033.vdocuments.us/reader033/viewer/2022060107/554c6394b4c9053e308b5857/html5/thumbnails/17.jpg)
• You get ready to expose a public API.
• It allows you to update the UI frequently.
• It’s easier to create mobile apps.
• You can organize/scale your teams better.
Other benefits
Separating the view you get ready for exposing an API.The UI can be redeployed frequently, without affecting the platform.It’s easier to create different views, for different devices.The dev teams can be reorganized and some development can be done in parallel.
![Page 18: Developing SPI applications using Grails and AngularJS](https://reader033.vdocuments.us/reader033/viewer/2022060107/554c6394b4c9053e308b5857/html5/thumbnails/18.jpg)
You got me!! How can I do that with Grails!!
![Page 19: Developing SPI applications using Grails and AngularJS](https://reader033.vdocuments.us/reader033/viewer/2022060107/554c6394b4c9053e308b5857/html5/thumbnails/19.jpg)
• Use Grails 2.3 REST capabilities.
• Define your backend: GORM? Other web services?
• Make it a robust, powerful black box for the front end.
Grails 2.3 comes with significant improvements to build REST API’s.You can still use all Groovy ecosystem to consume any backend.Then, you can concentrate on building a robust, tested, black boxed Grails layer.
![Page 20: Developing SPI applications using Grails and AngularJS](https://reader033.vdocuments.us/reader033/viewer/2022060107/554c6394b4c9053e308b5857/html5/thumbnails/20.jpg)
• Focus on:
• Transactions.
• Efficient data manipulation.
• Security.
• Scalability.
![Page 21: Developing SPI applications using Grails and AngularJS](https://reader033.vdocuments.us/reader033/viewer/2022060107/554c6394b4c9053e308b5857/html5/thumbnails/21.jpg)
What are the alternatives for the
client side?
![Page 22: Developing SPI applications using Grails and AngularJS](https://reader033.vdocuments.us/reader033/viewer/2022060107/554c6394b4c9053e308b5857/html5/thumbnails/22.jpg)
AngularJS, Ember, Backbone...
![Page 23: Developing SPI applications using Grails and AngularJS](https://reader033.vdocuments.us/reader033/viewer/2022060107/554c6394b4c9053e308b5857/html5/thumbnails/23.jpg)
todomvc.com
• Todo app implemented in lot of frameworks
![Page 24: Developing SPI applications using Grails and AngularJS](https://reader033.vdocuments.us/reader033/viewer/2022060107/554c6394b4c9053e308b5857/html5/thumbnails/24.jpg)
Similar featuresGrails AngularJS
Domain class Model
GSP’s and templates Views and templates
${} {{ }}
Controllers Controllers
URL Mappings Routing
![Page 25: Developing SPI applications using Grails and AngularJS](https://reader033.vdocuments.us/reader033/viewer/2022060107/554c6394b4c9053e308b5857/html5/thumbnails/25.jpg)
Grails & Angular
• Angular will issue an OPTIONS request as per CORS:
• Use cors plugin.
• Manually configure URL mappings to avoid 405 responses.
![Page 26: Developing SPI applications using Grails and AngularJS](https://reader033.vdocuments.us/reader033/viewer/2022060107/554c6394b4c9053e308b5857/html5/thumbnails/26.jpg)
Demo
![Page 27: Developing SPI applications using Grails and AngularJS](https://reader033.vdocuments.us/reader033/viewer/2022060107/554c6394b4c9053e308b5857/html5/thumbnails/27.jpg)
@alvaro_sanchez - Odobo
Álvaro Sánchez-Mariscal
Developing SPI applications using Grails and AngularJS