Transforming SharePoint customizations to add-in model training package
New and updated version of “Transforming SharePoint customizations to add-in model” training package has been released for public consumption. This training is based on the learning's and practices from the Office 365 Developer Patterns and Practices program, which is based on real world community contributions and the work what Microsoft has done with enterprise customers on the add-in model transformation.
Updated on 28th of September 2015 – Added videos for modules 4 and 7.
Training package contains lot of relevant models and patterns for any enterprise developers when you want to implement typical SharePoint customizations using add-in model techniques for Office 365 or for on-premises. Material concentrates on the different customization options and how they can be achieved.
This updated package is based on the material originally created for the Microsoft Virtual Academy training, but it has been further evolved based on the real life learning's from customer projects.
Here’s full list of modules included in this training package
- Introduction to add-in model transition
- Managing site settings using add-in model
- Branding with add-in model techniques
- Building UX components with add-in model
- Using Remote Event Receivers and Remote Timer Jobs
- Site Collection and Site Provisioning Using add-in model
- User Personalization and One Drive for Business Operations Using add-in model
- Using Enterprise Content Management Capabilities with add-in model
- Using Search Capabilities with add-in model
- Transformation guidance from farm solutions to add-in model
You can find more detailed description to each module further down on this post with links to module resources. Each module has video, presentations, demos and hands on labs available. Hands on labs from module 1 to 9 are done with Office 365 and module 10 hands on labs require on-premises SharePoint deployment.
Instructors in the recorded videos
We have 5 different instructors in the videos. Here’s short introduction for each of them.
Bert Jansen Service Engineer Office 365, Microsoft @O365Bert | |
Frank Marasco Principal Consultant Services, Microsoft @frank_marasco | |
Richard diZerega Principal Service Delivery Engineer TED Services & Devices, Microsoft @richdizz | |
Vesa Juvonen Senior Program Manager Office 365 CXP CAT, Microsoft @vesajuvonen |
Module introduction
Here’s short introduction to all modules and links to the key resources.
Module 1 - Introduction to add-in model transition
This is the introduction module for the general add-in model transformation or transition. We concentrate on the reasoning behind the add-in model and on the process off approaching these kind of projects. We'll also tackle some of the key questions around farm solutions, sandbox solutions and the add-in model, including their differences and reasoning why we recommend the add-in model as the de-facto option for Office 365 and on-premises customizations.
Video is available from Office 365 Developer Patterns and Practices section at Channel 9.
Agenda
- Introduction to add-in model transition topic
- Transition process
- Add-in model principles
- Customization considerations
Key recommendations
- Move gradually to add-in model
- Align with service and product roadmap
- Concentrate on end user experience and business requirements
- Avoid sandbox solutions
Lab - Requesting Office 365 Trial Tenant Demonstrates process of provisioning a new Office 365 tenant and set up the basic environment which will be used for other exercises.
Hands on lab material and presentation for this module is available for use from Office Developer Training GitHub repository.
Module 2 - Managing site settings using add-in model
Introduction to generic site management operations using the add-in model. We cover capabilities like modification of pages by adding web parts to them and how to take advantage of so called "JavaScript Embed" pattern, which can be used to modify the end user experience without a need of using a custom master page.
Video is available from Office 365 Developer Patterns and Practices section at Channel 9.
Agenda
- Introduction to site management with add-in model
- Page and content modifications
- JavaScript Embed pattern
- Controlling site settings using CSOM
Key recommendations
- Use JavaScript Embed pattern carefully
- Dynamic loading of scripts for JavaScript Embedding
- Concentrate on end user experience and business requirements
- Avoid Sandbox solutions
Lab - Modification of SharePoint Sites Using SP Add-Ins In first lab you will learn how to modify wiki pages using SharePoint Add-Ins and in second exercise we will concentrate on the JavaScript embedding pattern.
Demos
This video contains following demos, which are also available as separate videos:
- How to modify wiki pages using the add-in model
- How to update your SharePoint pages via the embedding of JavaScript
- How to use client side caching to optimize the performance of your add-ins
Hands on lab material and presentation for this module is available for use from Office Developer Training GitHub repository.
Module 3 - Branding with add-in model techniques
Introduction to different branding capabilities using the add-in model techniques. We cover different options to modify the end user experience and discuss what the key considerations are when your making your implementation decision. Session also covers topics related on where the assets used for branding should be stored in order to ease future maintenance.
Video is available from Office 365 Developer Patterns and Practices section at Channel 9.
Agenda
- Introduction to branding with add-in model
- Themes and other other branding techniques
- Controlling publishing (WCM) capabilities using add-in model techniques
- Updating existing sites with new branding changes
Key recommendations
- Avoid custom master pages
- Use Office 365 themes when possible
- Consider using Alternate CSS for advance settings
- SharePoint themes can be used to control colour and fonts
Lab - Modification of SharePoint Sites Using SP add-ins In this exercise you will create your own custom theme using the SharePoint Color Palette Tool, and then apply the theme from the provider hosted add-in to the host web.
Demos
This video contains following demos, which are also available as separate videos:
- Applying and using custom SharePoint themes with add-in model
- Using Office 365 themes to provide branding elements in Office 365
- Using alternate CSS for providing custom branding in SharePoint site
Hands on lab material and presentation for this module is available for use from Office Developer Training GitHub repository.
Module 4 - Building UX components with add-in model
Introduction on how to build typical user interface functionalities using add-in model capabilities. We cover different kind of client side rendering mechanisms to provide similar end user experiences as with classic server side code.
Video is available from Office 365 Developer Patterns and Practices section at Channel 9.
Agenda
- Introduction to building UX components using add-in model
- UX customizations with add-in model
- Client Side Rendering
- Practices for client side techniques
Key recommendations
- It’s not just about add-in parts
- Remote provisioning and configuration
- Do not modify suite bar (top navigation)
- Careful JavaScript embedding is an option
Lab - Modification of SharePoint User Experience In this lab you will learn how to modify SharePoint User Experience using SharePoint add-ins. In first lap you will be adding second level of navigation to out of the box master page without actual master page modifications by using JavaScript Embedding model. Second lab shows alternative for add-in part based experience on providing still end users capability to add new parts on the pages with responsive support.
Demos
This module contains following demos, which are available as separate videos and NOT embedded to this module video.
- Embedding second level navigation
- Web part templates and add-in script part
- Add-in model dialogs
- Client side rendering
Hands on lab material and presentation for this module is available for use from Office Developer Training GitHub repository.
Module 5 - Using Remote Event Receivers and Remote Timer Jobs
This module covers two very important topics for the add-in model development, which are remote event receivers and remote timer jobs. We cover both of the topics one by one and explain the different characteristics of both. Remote timer jobs can be used to replace classic event receivers in some level and the remote timer job pattern shows how to implement scheduled or on-demand asynchronous operations using the add-in model.
Video is available from Office 365 Developer Patterns and Practices section at Channel 9.
Agenda
- Introduction to remote event receivers and remote timer jobs
- Remote timer jobs
- Remote event receivers
- Add-in events
Key recommendations
- Remote timer jobs for scheduled tasks
- You can use Azure WebJobs also for asynchronous tasks
- Remote event receivers is not for synchronization tasks
- Avoid long operations in add-in events
Lab - Using Remote Event Receivers and Remote Timer Jobs In this lab you will create a remote event receiver and associate it to the host web to execute code during end user events and build a simple remote timer job.
Demos
This video contains following demos, which are also available as separate videos:
- You can still have timer jobs using the add-in model
- How to use remote event receivers for your SharePoint add-ins
- How to use Azure Service Bus to debug your remote event receivers
Hands on lab material and presentation for this module is available for use from Office Developer Training GitHub repository.
Module 6 - Site Collection and Site Provisioning Using add-in model
SharePoint has always been about site provisioning. Before you can start collaborating or before you can start publishing content in publishing Intranet, you will need to provision a site collection and/or a sub site, apply the needed configuration and branding. Site provisioning really is the heart and soul of the customizations in the add-in model implementation and it can be customized in similar ways as with the classic farm solution based approach. We'll concentrate on the remote provisioning pattern and how you can use the add-in model to provision site collections and sub sites with the needed configurations.
Video is available from Office 365 Developer Patterns and Practices section at Channel 9.
Agenda
- Site provisioning patterns - past, present and future
- Site provisioning with client side object model (CSOM)
- Hybrid models for site provisioning
- Updating existing site collections after initial creation
Key recommendations
- Do not use site or web templates
- Use Remote Provisioning pattern
- Deploy artefacts without features
- Updates using Remote Management pattern
Lab - Site Collection and Site Provisioning Using CAM In this lab you will create a self-service site collection creation experience for end users in cloud to provision new site collections.
Demos
This video contains following demos, which are also available as separate videos:
- Asynchronous remote provisioning solution for self service site collection creation
- Using remote provisioning pattern for sub site creation
Hands on lab material and presentation for this module is available for use from Office Developer Training GitHub repository.
Module 7 - User Personalization and One Drive for Business Operations Using add-in model
In this module we concentrate on user profile based solutions and how the user profile service can be used with the add-in model. We'll cover the remote API possibilities and how you can use remote APIs to manage personal or other users profile attributes. We also cover customization patterns related on the OneDrive for Business customizations and how you can provide needed configurations, including branding, cross individual personal OneDrive for Business sites.
Video is available from Office 365 Developer Patterns and Practices section at Channel 9.
Agenda
- Introduction to user profile, personalization and OneDrive for Business
- Custom attribute replication
- Yammer integration with sites for social experience
- OneDrive for Business customization patterns
Key recommendations
- Use CSOM for user profile operations
- Use Yammer for social capabilities
- Avoid customizations in OneDrive for Business sites
- Avoid metadata in OneDrive for Business sites
Lab - User Personalization and OneDrive for Business Operations Using CAM Patterns In this lab you will create an automated synchronization tool to synchronize user profile attributes from on-premises to the cloud and in second lab you will manage the Branding and Functionalities of OneDrive for Business Sites
Demos
- User Profile Manipulation with CSOM
- Yammer integration to team sites - Manual association for Yammer feeds to SharePoint
- Optionally you can do automated Yammer association to team sites
- Applying branding automatically to OneDrive for Business sites (Async model) - Only with classic experience
Hands on lab material and presentation for this module is available for use from Office Developer Training GitHub repository.
Module 8 - Using Enterprise Content Management Capabilities with add-in model
Module covers different patterns for enabling or implementation enterprise content management capabilities using the add-in model techniques. We cover the typical technical implementation for information management architecture and for other enterprise content management capabilities such as implementing governance processes for your deployment using add-in techniques.
Video is available from Office 365 Developer Patterns and Practices section at Channel 9.
Agenda
- Content types and site columns
- Managed Metadata CSOM
- Library and list templates with add-in model
- Document management automation
Key recommendations
- Create elements using CSOM, no XML
- Taxonomy CSOM is extremely powerful
- Stop using xml list templates
- Remote timer job based governance solutions
Lab - Using Enterprise Content Management Capabilities with add-in model In first lab you will create custom cross site collection navigation based on the term configuration in taxonomy store. In second lab you will build a small taxonomy tool which can be used for creating and reading terms in the Office 365. You can use this kind of process to access your on-premises farm terms and then replicate them to the cloud.
Demos
- Creating content types and site columns with CSOM
- Introduction to Managed Metadata CSOM
- Document and list templates with app model
Hands on lab material and presentation for this module is available for use from Office Developer Training GitHub repository.
Module 9 - Using Search Capabilities with add-in model
This module concentrates on using SharePoint Enterprise Search capabilities with the add-in model. We cover how you can modify the SharePoint search end user experience and also how you can utilize search using remote APIs from your own applications.
Video is available from Office 365 Developer Patterns and Practices section at Channel 9.
Agenda
- Overview
- Search Building Blocks
- Extending Search Center
- Search Based Apps
Key recommendations
- Out of the box capabilities can be easily extended
- Remote APIs for customizations
- Display templates are really powerful
- Exporting and importing search settings with CSOM
Lab - Using Search Capabilities with add-in model patterns In first lab you will build personalized search results based on a particular user's user profile property values. In second lab you will modify the display templates for the search results to provide customized end user presentation.
Demos
This video contains following demos, which are also available as separate videos:
- How to Export and Import Search Configurations with CSOM
- How to perform personalized search queries with CSOM
- How to build SharePoint add-ins that leverage search
- How to customize a Search Center with SharePoint add-ins
Hands on lab material and presentation for this module is available for use from Office Developer Training GitHub repository.
Module 10 - Transformation guidance from farm solutions to add-in model
This module concentrates on the actual transformation process and covers more detailed different techniques which you can take while transforming existing farm solutions to add-in model implementations. We also cover recommendations around farm solutions, which will help you to perform transition in the future. These farm solution principles can be used for new farm solutions to help the future add-in model transition, if you still need to develop farm solutions in on-premises.
Video is available from Office 365 Developer Patterns and Practices section at Channel 9.
Agenda
- Transformation process
- Transformation approaches
- Element Replacement approaches
- Farm solution considerations
Key recommendations
- Make sure that you have detailed inventory of your customizations
- Use analyses tooling for technical analyses
- Transform end user experience, not code - it's not one to one code analyses
- Understand impact of farm solutions
Lab 1 - Replacement of files provisioned via Modules in farm solutions In this lab you will learn how to replace existing master pages and page layouts which have been deployed to an On-Premises SharePoint Server via Modules in a Full Trust Solution. This will involve deploying new files to replace those deployed via Modules and updating the existing usages of these files to remove the dependency on the files which were deployed via declarative means.
Lab 2 - Replacement of lists provisioned from list templates in farm solutions In this lab you will learn how to detect existing lists and libraries, which have been created from a custom list template deployed into an On-Premises SharePoint Server in a Full Trust Solution. This will involve creating new lists to replace those, configuring them appropriately then transferring the existing content from the original list.
Lab 3 - Content Type and Site columns replacements In this lab you will learn how to replace existing content types by deploying new content types and updating the content to the new content type with new site columns using remote provisioning.
Lab 4 - Replacement of web parts with add-in parts In this lab you will learn how to replace existing web parts by deploying a SharePoint Provider hosted add-in and updating the content to use an add-in Part hosted in the Provider hosted add-in in place of Web Parts using Full Trust Code.
Demos
- SPCAF tooling in practice - Demonstration of free SPCAF tool for app model inventory
- App pre-register and side loading
Hands on lab material and presentation for this module is available for use from Office Developer Training GitHub repository.
Can I use this material in my own trainings?
Yes. Feel free to use this training material anyway you like for online web casts, in-class deliveries, other trainings or for your personal self study. If you have any feedback or enhance suggestions, please use the Office 365 Developer Patterns and Practices Yammer group for this input. Our Core team will be watching closely all activity on this Yammer group.
What is Office 365 Developer Patterns and Practices (PnP)?
PnP is community driven open source project where Microsoft and external community members are sharing their learning's around implementation practices for Office 365 and SharePoint on-premises (add-in model). Active development and contributions happen our GitHub project under Dev branch and each month there will be a master merge (monthly release) with more comprehensive testing and communications.
This is work done by the community for the community without any actual full time people. It’s been great to find both internal and external people who are willing to assist and share their learning's for the benefit of others. This way we can build on the common knowledge of us all. Currently program is facilitated by Microsoft, but already at this point we have multiple community members as part of the Core team and we are looking to extend the Core team with more community members.
Notice that since this is open source community program, there’s no SLAs for the support what we provide from program. There is however highly active PnP Yammer group, where you can get fast support on any questions around the existing materials. If you are interested on getting more closely involved, please check the following guidance from our GitHub wiki.
Main resources around PnP program
- PnP under dev.office.com – https://aka.ms/OfficeDevPnP
- One location for all the resources
- PnP GitHub - https://aka.ms/OfficeDevPnPGitHub
- PnP MSDN pages - https://aka.ms/OfficeDevPnPMSDN
- PnP Yammer group - https://aka.ms/OfficeDevPnPYammer
- PnP Videos at Channel 9 - https://aka.ms/OfficeDevPnPVideos
- PnP Guidance Repository – https://aka.ms/OfficeDevPnPGuidance