Angular.js in XPages
Download as PPTX, PDF6 likes9,923 views
This document discusses using Angular.js with XPages applications. It begins with an introduction to Angular.js and how it can integrate with XPages. A demonstration is then shown of a basic people application built with Angular.js that can run independently on Domino, within another application, and on different Domino servers. The document concludes by discussing how Angular.js allows writing applications once that can run anywhere, and more demonstrations are proposed of data binding and running XPages applications inside other platforms like Bluemix, Connections, and SharePoint.
![[Srijan Wednesday Webinars] Developing Large Scale Applications in AngularJS](https://cdn.slidesharecdn.com/ss_thumbnails/srijanwednesdaywebinars-angularjs-141001063445-phpapp02-thumbnail.jpg?width=560&fit=bounds)
Ad
More Related Content
What's hot (20)
Similar to Angular.js in XPages (20)
Ad
Recently uploaded (20)
![Download Wondershare Filmora Crack [2025] With Latest](https://cdn.slidesharecdn.com/ss_thumbnails/neo4j-howkgsareshapingthefutureofgenerativeaiatawssummitlondonapril2024-240426125209-2d9db05d-250419-250428115407-a04afffa-thumbnail.jpg?width=560&fit=bounds)
![Get & Download Wondershare Filmora Crack Latest [2025]](https://cdn.slidesharecdn.com/ss_thumbnails/revolutionizingresidentialwi-fi-250422112639-60fb726f-250429170801-59e1b240-thumbnail.jpg?width=560&fit=bounds)
Ad
Angular.js in XPages
- 1. Write once, run anywhere Angular.js in XPages Mark Roden PSC Group LLC Senior Solutions Architect MWLUG 2014
- 2. About Marky Over 17 years IBM Notes Domino® work Senior Solutions Architect at PSC Group • XPages Developer • Project Leader • Angular.js Protagonist Contact Information – Blog: http://www.xomino.com – Email: [email protected] – Twitter: @markyroden – Skype: marky.roden – "Come work for us - it will be fun" www.psclistens.com @pscgroup
- 4. Angular.js in XPages • What is Angular.js ? • How does Angular.js integrate with XPages ? • Why do I care ? • Demonstration • Behind the demonstration • Ok I care – so now what ?
- 6. Angular.js in XPages • What is Angular.js ? • AngularJS is a structural framework for dynamic web apps. It lets you use HTML as your template language and lets you extend HTML's syntax to express your application's components clearly and succinctly. Angular's data binding and dependency injection eliminate much of the code you currently have to write.
- 7. Angular.js in XPages • What is Angular.js ? • MVC web framework to model your application using client side JavaScript as opposed to Server side code. – The Model is the data created by the application – The View is the HTML representation of the data through the use of Templates – The Controller is the application code which is used to determine the way the Model is populated and displayed.
- 8. Angular.js in XPages • How does Angular.js integrate with XPages ? http://xomino.com/category/angular-in-xpages/ • Domino is the original NoSQL database – Secure – XPages is Domino with a Java Server Faces server – Multiple options for data retrieval • Domino Data Services • Custom Rest Service • ExtLib Rest Service • ?ReadViewEntries
- 9. Angular.js in XPages • How does Angular.js integrate with XPages ? • An application written using Angular.js uses 4 main things – HTML Pages – JavaScript files – CSS – A Data Service • One or many of those can be “XPages”
- 10. Angular.js in XPages • How does Angular.js integrate with XPages ? • HTML and JavaScript in the WebContent folder
- 11. Angular.js in XPages • How does Angular.js integrate with XPages ? • Data from the server via Domino Data Services
- 12. Angular.js in XPages • How does Angular.js integrate with XPages ? • Code written in *anything* including (but mostly excluding) Domino Designer – Notepad – Notepad++ – JetBrainsWebStorm
- 13. Angular.js in XPages • How does Angular.js integrate with XPages ? – Hook WebStorm up to the On Disk Structure of your DB
- 14. Angular.js in XPages • How does Angular.js work? – Model • Domino Data – View • HTML – Controller • JavaScript
- 15. Angular.js in XPages • How does Angular.js work? Model View
- 16. Angular.js in XPages • How does Angular.js work? – PersonDetailCtrl C .createPerson() R .getPerson() U .savePerson() D .deletePerson()
- 17. Angular.js in XPages • How does Angular.js work? Controller
- 18. Angular.js in XPages • Why do I care? • Business Perspective – Requirements – Customers • Personal Perspective – Web development – Increasingly popular – Too bleeding edge for Enterprise today but they will catch up eventually
- 19. Angular.js in XPages • Why do I care? • Requirements – Mixed technology production environment – Multiple Web Server environment – Pressure on existing Notes applications to Modernize or Die?
- 20. Angular.js in XPages • Why do I care? • Requirements – Because you want a subset of one application’s functionality to appear in another application – Dashboards • Charts • Reports – Functional decision making across systems
- 21. Angular.js in XPages • Demonstration • People application 1. Running independently on Domino 2. Running within another application 3. Running on different Domino Server
- 22. Angular.js in XPages • Demonstration • Basic People application – Add new People – Edit – Delete
- 23. Angular.js in XPages • Demonstration
- 24. Angular.js in XPages • Demonstration
- 25. Angular.js in XPages • Demonstration
- 26. Angular.js in XPages • Demonstration – Including the application to a new Domino site
- 27. Angular.js in XPages • Demonstration
- 28. Angular.js in XPages • Demonstration – Running the same app on a different Domino Server
- 29. Angular.js in XPages • Demonstration
- 30. Angular.js in XPages • Behind the demonstration – Cross-Origin Resource Sharing (CORS) • Browser security • Preventing cross site scripting attacks • https://developer.mozilla.org/en- US/docs/Web/HTTP/Access_control_CORS
- 31. Angular.js in XPages • Behind the demonstration – Consolidating the inclusion code
- 32. Angular.js in XPages • Behind the demonstration – Consolidating the inclusion code
- 33. Angular.js in XPages • Directives – Angular.js “plugins” to run a batch of code based on an HTML attribute – Portable code which can be plugged into any application at any time.
- 34. Angular.js in XPages • Ok I care – so now what ? – A new paradigm of business application integration Write once – run anywhere? Seriously !
- 35. Angular.js in XPages • Ok I care – so now what ? – More Demonstrations
- 36. Angular.js in XPages • Demonstration – Data Binding with an Angular Driven Chart Directive
- 37. Angular.js in XPages • Bluemix
- 38. Angular.js in XPages • Bluemix
- 39. Angular.js in XPages • Demonstration – XPages application running inside of Connections
- 40. Angular.js in XPages • Demonstration – XPages application running inside of Connections using the Connections Business Card API
- 41. Angular.js in XPages • Demonstration – Context specific, integrated Charting within Connections
- 42. Angular.js in XPages • Demonstration – XPages application running inside of SharePoint
- 43. Angular.js in XPages • Conclusion – Angular.js: MVC front end client side framework – Use Domino as a NoSQL app server – Modernize Domino Applications smartly – Running Domino apps within other server platforms – Make your application code portable
- 44. Angular.js in XPages Questions ? For more information on Angular.js, XPages and Application Modernization [email protected] twitter: marky.roden skype: marky.roden