![Page 1: SPC Adriatics 2016 - Alternative Approaches to Solution Development in Office 365](https://reader035.vdocuments.us/reader035/viewer/2022070516/586fcefd1a28aba24c8b7ddf/html5/thumbnails/1.jpg)
Alternative Approaches to Solution Development in SharePoint and Office 365
MARC D ANDERSONPRESIDENT, SYMPRAXIS CONSULTING LLC
![Page 2: SPC Adriatics 2016 - Alternative Approaches to Solution Development in Office 365](https://reader035.vdocuments.us/reader035/viewer/2022070516/586fcefd1a28aba24c8b7ddf/html5/thumbnails/2.jpg)
SPONSORS
![Page 3: SPC Adriatics 2016 - Alternative Approaches to Solution Development in Office 365](https://reader035.vdocuments.us/reader035/viewer/2022070516/586fcefd1a28aba24c8b7ddf/html5/thumbnails/3.jpg)
Co-Founder and President of Sympraxis Consulting LLC, located in the Boston suburb of Newton, MA, USA. Sympraxis focuses on enabling collaboration throughout the enterprise using the SharePoint application platform.
Over 30 years of experience in technology professional services and software development. Over a wide-ranging career in consulting as well as line manager positions, Marc has proven himself as a problem solver and leader who can solve difficult technology problems for organizations across a wide variety of industries and organization sizes.
Author of SPServicesAwarded Microsoft MVP for SharePoint Server 2011-2016
Who Is Marc?
![Page 4: SPC Adriatics 2016 - Alternative Approaches to Solution Development in Office 365](https://reader035.vdocuments.us/reader035/viewer/2022070516/586fcefd1a28aba24c8b7ddf/html5/thumbnails/4.jpg)
We regularly hear about the importance of building Apps Add-Ins from the Microsoft folks. But in many cases, that approach is overkill. Even in enterprises, all solutions aren’t "enterprise scale".
It’s always been possible to build solid solutions or solution components using Data View Web Parts or the trusty Content Editor Web Part to hold some HTML, JavaScript, and CSS, and those are still viable approaches. With a few other more modern tricks, we can even build solutions that span many pages using a common code base.
Join me as I kick around the plusses and minuses of “sanctioned development” versus smaller, lighter-touch approaches. Feel free to bring along your own questions and challenges so that we can make it a discussion.
Based on a discussion with Scot Hillier on the ITUnity Dev Pulse
Session Overview
![Page 5: SPC Adriatics 2016 - Alternative Approaches to Solution Development in Office 365](https://reader035.vdocuments.us/reader035/viewer/2022070516/586fcefd1a28aba24c8b7ddf/html5/thumbnails/5.jpg)
The Middle Tier Manifesto: An Alternative Approach to Development with Microsoft SharePoint
Flying in the Cloud: New Ways to Develop for SharePoint Create a Business Solution, Step by Step, with No
Managed Code SharePoint Solutions with SPServices SharePoint Solutions with KnockoutJS Single-Page Applications (SPAs) in SharePoint Using
SPServices
Are We Talking About Something New?
There have always been alternatives;they have just become more accepted
![Page 6: SPC Adriatics 2016 - Alternative Approaches to Solution Development in Office 365](https://reader035.vdocuments.us/reader035/viewer/2022070516/586fcefd1a28aba24c8b7ddf/html5/thumbnails/6.jpg)
So how do we do this?
![Page 7: SPC Adriatics 2016 - Alternative Approaches to Solution Development in Office 365](https://reader035.vdocuments.us/reader035/viewer/2022070516/586fcefd1a28aba24c8b7ddf/html5/thumbnails/7.jpg)
Use your favorite toolsChoose your favorite frameworksWrite your solutions with HTML, CSS, and JavaScript
Watch your users smile
SharePoint Development Is [Becoming] Web Development
![Page 8: SPC Adriatics 2016 - Alternative Approaches to Solution Development in Office 365](https://reader035.vdocuments.us/reader035/viewer/2022070516/586fcefd1a28aba24c8b7ddf/html5/thumbnails/8.jpg)
High Level Structure of Building SharePoint Solutions
Data Access / Initial Manipulation
"Document Ready"
ViewModel / Application Logic
Templates
JavaScript
HTML
Application Styling
CSS
•Has to coexist with SharePoint's CSS•Be very specific with your selectors
•Avoid hauling in SharePoint's baggage unless you need it
![Page 9: SPC Adriatics 2016 - Alternative Approaches to Solution Development in Office 365](https://reader035.vdocuments.us/reader035/viewer/2022070516/586fcefd1a28aba24c8b7ddf/html5/thumbnails/9.jpg)
Many Data Sources SharePoint Lists and Libraries Office Microsoft Graph External data sources
Many exposed via Odata-compliant REST endpoints
![Page 10: SPC Adriatics 2016 - Alternative Approaches to Solution Development in Office 365](https://reader035.vdocuments.us/reader035/viewer/2022070516/586fcefd1a28aba24c8b7ddf/html5/thumbnails/10.jpg)
Important Tools•Development tools – you choose
• Visual Studio (any flavor)• SharePoint Designer• WebStorm• Sublime Text• Notepad++
•Debugging tools – your browser• Chrome• Firefox with Firebug• Internet Explorer
• Testing tools…• Build tools …
Yo SharePointTypeScript
Gulp, etc.
SharePoint Framework Dashboard
![Page 11: SPC Adriatics 2016 - Alternative Approaches to Solution Development in Office 365](https://reader035.vdocuments.us/reader035/viewer/2022070516/586fcefd1a28aba24c8b7ddf/html5/thumbnails/11.jpg)
Adding a User Custom Action allows you to load the first JavaScript file with a ScriptLink
RequireJS (or several alternatives – see system.js) allow you to bootstrap the rest of your code into the page
Because your script references are built in code, you can even do versioning
Bootstrapping
![Page 12: SPC Adriatics 2016 - Alternative Approaches to Solution Development in Office 365](https://reader035.vdocuments.us/reader035/viewer/2022070516/586fcefd1a28aba24c8b7ddf/html5/thumbnails/12.jpg)
Isolation•Code Isolation•"Time to glass"•Pushing processing from server to client
![Page 13: SPC Adriatics 2016 - Alternative Approaches to Solution Development in Office 365](https://reader035.vdocuments.us/reader035/viewer/2022070516/586fcefd1a28aba24c8b7ddf/html5/thumbnails/13.jpg)
Solution Artifacts•Document Library(ies)•Style Library• In the master page gallery at _catalogs/masterpage
•Can be unique to a Site Collection or stored centrally for better reuse•FaaS approach
![Page 14: SPC Adriatics 2016 - Alternative Approaches to Solution Development in Office 365](https://reader035.vdocuments.us/reader035/viewer/2022070516/586fcefd1a28aba24c8b7ddf/html5/thumbnails/14.jpg)
Choose a Framework•Don't be caught up in the "shiny penny" syndrome•Compare your known requirements with the frameworks' capabilities•Ask yourself:•What types of solutions do we need to build?•What does our governance tell us about our deployment model?•How big is the development team?•What are our current skills?
![Page 15: SPC Adriatics 2016 - Alternative Approaches to Solution Development in Office 365](https://reader035.vdocuments.us/reader035/viewer/2022070516/586fcefd1a28aba24c8b7ddf/html5/thumbnails/15.jpg)
User Custom Actions•Works without activating the Publishing Infrastructure•No master page customization (current "guidance")
•PnP Approaches• CDN Manager – Scot Hillier•Manage UserCustomAction using SharePoint Add-In - André Lage
•The easiest way to add Script and Brand your SharePoint and SharePoint Online - John Liu
![Page 16: SPC Adriatics 2016 - Alternative Approaches to Solution Development in Office 365](https://reader035.vdocuments.us/reader035/viewer/2022070516/586fcefd1a28aba24c8b7ddf/html5/thumbnails/16.jpg)
Load JavaScript Conditionally• Can be driven by:• Page URL• Page content• Current user• IP address• Time of day• Presence of data in a list
Any characteristic of the current context
![Page 17: SPC Adriatics 2016 - Alternative Approaches to Solution Development in Office 365](https://reader035.vdocuments.us/reader035/viewer/2022070516/586fcefd1a28aba24c8b7ddf/html5/thumbnails/17.jpg)
Some Better Practices• Store configuration variables in a Configuration list• Use Title for the parameter name• Second column for parameter value: Multiple lines of text• Can store strings, XML, JSON, etc. – any text-based data
constructs• Generalize wherever possible• Build a centralized set of FaaS• Use consistent namespacing
• Consider a build process• Many places you would have built a workflow can be
handled in code
![Page 18: SPC Adriatics 2016 - Alternative Approaches to Solution Development in Office 365](https://reader035.vdocuments.us/reader035/viewer/2022070516/586fcefd1a28aba24c8b7ddf/html5/thumbnails/18.jpg)
Misconceptions•"Pure" JavaScript is better than jQuery or other libraries•Large JavaScript files clog up the network•You don't have to care about design•Meeting the requirements is enough
![Page 19: SPC Adriatics 2016 - Alternative Approaches to Solution Development in Office 365](https://reader035.vdocuments.us/reader035/viewer/2022070516/586fcefd1a28aba24c8b7ddf/html5/thumbnails/19.jpg)
Truths•Frameworks can be hard to learn•Change is going to be rapid•Learning mindset is required
•Opens up the talent pool•Web developers may be easier to find and hire
![Page 20: SPC Adriatics 2016 - Alternative Approaches to Solution Development in Office 365](https://reader035.vdocuments.us/reader035/viewer/2022070516/586fcefd1a28aba24c8b7ddf/html5/thumbnails/20.jpg)
Demos
![Page 21: SPC Adriatics 2016 - Alternative Approaches to Solution Development in Office 365](https://reader035.vdocuments.us/reader035/viewer/2022070516/586fcefd1a28aba24c8b7ddf/html5/thumbnails/21.jpg)
thank youquestions?
live ratingsSYMPMARC.COM@SYMPMARC
spca.biz/TXPH
![Page 22: SPC Adriatics 2016 - Alternative Approaches to Solution Development in Office 365](https://reader035.vdocuments.us/reader035/viewer/2022070516/586fcefd1a28aba24c8b7ddf/html5/thumbnails/22.jpg)
Contact InformationEmail [email protected]
Twitter @sympmarcBlog http://sympmarc.com
SPServices http://spservices.codeplex.comSPXSLT http://spxslt.codeplex.comBooks http://sympmarc.com/books
The Middle Tier Manifesto http://bit.ly/middletier