1. Gold Sponsors Bronze SponsorsSilver Sponsors
Portable single page
applications with AngularJS
in SharePoint
Roger Noble
CTO – Coritsu Group

2. CTO @
• SharePoint design and development
• Business Intelligence
• Web Development
Who am I?

3. A brief overview…
History of SharePoint Development

4. A brief overview…
History of SharePoint Development
2007

5. A brief overview…
History of SharePoint Development
2010

6. A brief overview…
History of SharePoint Development
2013

7. 1. Provide users with the easiest discovery, purchase, and installation process.
2. Give administrators the safest SharePoint extensions.
3. Provide you with the simplest marketing and sales system based on a
Microsoft online app store.
4. Maximize your flexibility in developing future upgrades.
5. Maximize your ability to take advantage of your existing non-SharePoint
programming skills.
6. Integrate cloud-based resources in smoother and more flexible ways.
7. Enable your extension to have permissions that are distinct from the
permissions of the user who is running the app.
8. Enable you to use cross-platform standards, including HTML, REST, OData,
JavaScript, and OAuth.
9. Enable you to take advantage of the SharePoint cross-domain JavaScript
library to access SharePoint data. Alternatively, you can use a Microsoft-
provided secure token service that is OAuth-compatible or use digital
certificates to get authorization to SharePoint data.
Benefits of App Model
http://msdn.microsoft.com/en-us/library/office/jj163114(v=office.15).aspx#AppWhenYouCan)

8. 1. Maximize your ability to take advantage of your
existing non-SharePoint programming skills.
2. Integrate cloud-based resources in smoother and
more flexible ways.
3. Enable you to use cross-platform standards,
including HTML, REST, OData, JavaScript, and
OAuth.
Benefits of App Model
http://msdn.microsoft.com/en-us/library/office/jj163114(v=office.15).aspx#AppWhenYouCan)

9. Flipping server-side code on its head
Use the server as a source of data, rather than
generating angle brackets
Get the client to do the work
Browsers are incredibly good at rendering HTML
SPA (Fat client)

10. JAVASCRIPT!!!

11. What is AngularJS?

12. What is AngularJS?
Keep business logic on the server
Move presentation to the client
Two way data-binding
Dependency injection

13. Basic app
demonstration

14. Apps are very quick to develop and deploy
Can use existing skills
Can develop outside of SharePoint!!!
Testable
Example…
Why should you care?

15. Font Awesome
Other useful open source tools

16. Bootstrap
Other useful open source tools

17. Google fonts
Other useful open source tools

18. All together
demonstration

19. Can easily package files into an App using VS
Even lazier, deploy them to a document library 
Deployment

20. Deployment
demonstration

21. Use your favourite tool
Develop locally as much as possible
Use tools as much as possible – don’t reinvent the
wheel
Reference CDN for speed
Development strategies

22. Develop offline
demonstration

23. Summary

24. Questions?
Comments?
More info
roger@coritsu.com
http://rogernoble.com
https://angularjs.org/
http://fontawesome.io/
http://angular-ui.github.io/bootstrap/
https://www.google.com/fonts
http://www.coritsu.com

25. Gold Sponsors Bronze SponsorsSilver Sponsors
Thanks for listening
Remember to submit your feedback so you go in the
draw to win prizes at the end of the day