2. Jenkins NS
Modern Workplace Solution
Architect
International Speaker
Trainer
Independent Consultant
Blogger
@jenkinsns
jenkinsns@gmail.com
http://www.jenkinsblogs.com
Founder, JPOWER4
jenkinsns@jpower4.com
http://www.jpower4.com
SPEAKER
SPFx: https://www.facebook.com/spfxinfo/
MS Teams: https://www.facebook.com/msteamsinfo
Github : https://github.com/jenkinsns
Other References
3. What I’ll cover
Introducing the SharePoint Framework (SPFx)
Configuring your SPFx Development Environment
SharePoint Framework (SPFx) Web Parts
SharePoint Framework (SPFx) Extensions
SharePoint Framework (SPFx) Library Componentdsdwsd
4. Introducing the SharePoint Framework (SPFx)
What is the SharePoint Framework?
Where is the SharePoint Framework supported?
Configuring your Office 365 developer tenant for SPFx development
5. SharePoint UX – Evolving cross versions
2009
SharePoint
Server 2010
2006
Office SharePoint
Server 2007
2003
SharePoint
Portal Server 2003
2001
SharePoint
Portal Server 2001
2012
SharePoint
Server 2013
2016 …
SharePoint
Server 2016, SPO
6. SPFx Version History
SharePoint Framework is a new development model for building
SharePoint customization. In the last three years, we have seen
many number of releases for SharePoint Framework.
17 Feb 2017 - GA(1.0.0), 1.0.1, 1.0.2, 1.1.0, 1.1.1, 1.1.3, 1.2.0, 1.3.0, 1.3.1, 1.3.2, 1.3.4, 1.4.0, 1.4.1, 1.5.0,
1.5.1, 1.6.0, 1.7.0, 1.7.1, 1.8.0, 1.8.1, 1.8.2, 1.9.0, 1.9.1
Aug 2016 - Drop 1, Drop 2, Drop 3, Drop 4, Drop 5, Drop 6, RC0
Always Microsoft recommend to use latest version, but in reality it is very
difficult to manage with team based development, since we always don't
upgrade to a new version.
27. Interacting with SPFx Web Parts in Modern Pages
Adding client-side web parts to modern pages
Introducing the new reactive property pane
Validating local SPFx development environment
41. Tenant Wide Deployment
Centralized control of which extensions are available across entire tenant
Consistent end-user experience across all sites
Consistent deployment across all sites
Automatically enable functionality on newly created sites
43. List: Tenant Wide Extensions
Column Type Description
Title string Title of the entry. Can be descriptive entry for the registration. Doesn’t
have to match anything, just for your reference
Component ID GUID Manifest ID of the component. Has to be in GUID format and
component must exists in the app catalog.
Component
Properties
string Optional component properties.
Web Template string Can be used to target extension only to specific web template.
List Template int List type as a number.
Location string Location of the entry. There are different support locations for
application customizers and List View Command Sets.
Sequence int Sequence of the entry in rendering.
Disabled Boolean Enabled state of the deployment.
52. Deploying Field Customizers as a Site Column
ClientSideComponentId="fcedd96a-1c34-4ac8-9ad8-5aaf4cb1e993"
ClientSideComponentProperties=
"{"greenMinLimit":"85","yellowMinLimit":"70&
quot;}"
64. List: Tenant Wide Extensions
Column Type Description
Title string Title of the entry. Can be descriptive entry for the registration.
Doesn’t have to match anything, just for your reference
Component ID GUID Manifest ID of the component. Has to be in GUID format and
component must exists in the app catalog.
Component
Properties
string Optional component properties.
Web Template string Can be used to target extension only to specific web template.
List Template int List type as a number.
Location string Location of the entry. There are different support locations for
application customizers and List View Command Sets.
Sequence int Sequence of the entry in rendering.
Disabled Boolean Enabled state of the deployment.
72. Call to action
Join Office 365 developer program
https://dev.office.com/devprogram
to leverage all resources for Office 365
development learning
Build applications on Office 365 platform
Attend MVP led local community events to
continue learning on Office 365 development
Share your feedback on Bootcamp at
https://aka.ms/Microsoft365DevBootcampSurvey2019
Editor's Notes
Tahoe/SPS 2001 – ASP Based, Single Box
SP 2003 – Moved to ASP.NET, scale out, enterprise manageability
SP 2007 – Added ECM, Publishing, Shared Services
SP 2010 – FAST acquisition, search driven portals, scaled up doclibs
SP 2013 – Multitenant, base for our cloud based release
SP 2016 – First version migrated back from Cloud
Over the past several years, with the evolution of Office 365, development of SharePoint solutions has encountered a new set of challenges: while on one hand IT and Tenant administrators require a new set of tools to control how data get accessed and consumed in their tenancies, developers, on the other hand, want to programmatically control the whole lifecycle, experience, and data access capabilities of a Site.
Unfortunately, developers today find themselves constraint around building app parts as a result of iFrames, a reduced set of APIs, and no integration with cross Office 365 workloads. This in turn limits their ability to develop powerful portals that extend SharePoint.
The client-side development framework will deliver capabilities that will help both first party and third party developers build powerful, rich applications and provide an enjoyable web experience in Office 365 for end users that are both intuitive and simple to consume.
Built into the SharePoint mobile apps
Client-side rendered using Open Source web tech
CDN deployed web apps with client side interactivity and fast page routing
Client-side web parts
Client-side and persisted caches
Mobile optimized (responsive)
To build and deploy client-side web parts using the the SharePoint Framework, you will need an Office 365 Tenant.
Main point: Keep light on vision, more on outline for today and why we are investing in our innovation areas influenced by where we are seeing the most usage (outside circle), consistently influenced by our productivity pillars (inside circle)