introduction to the office dev sharepoint pnp core libraries
TRANSCRIPT
![Page 1: Introduction to the Office Dev SharePoint PnP Core Libraries](https://reader031.vdocuments.us/reader031/viewer/2022012416/617130e84828097bf32009b8/html5/thumbnails/1.jpg)
Introduction to the Office Dev SharePoint PnP
Core Libraries
Rob Windsor
@robwindsor
![Page 2: Introduction to the Office Dev SharePoint PnP Core Libraries](https://reader031.vdocuments.us/reader031/viewer/2022012416/617130e84828097bf32009b8/html5/thumbnails/2.jpg)
About Me
Lead SharePoint Consultant at PAIT Group
Technical Contributor to the Pluralsight On-Demand Library
Microsoft MVP, MCPD, MCT
Founder and Past-President of the North Toronto .NET UG
Co-author of Prof. Visual Basic 2012 and .NET 4.5 (Wrox)
![Page 3: Introduction to the Office Dev SharePoint PnP Core Libraries](https://reader031.vdocuments.us/reader031/viewer/2022012416/617130e84828097bf32009b8/html5/thumbnails/3.jpg)
What is SharePoint PnP?
Started as an internal initiative
Collect learnings around Add-in model
Went public as Office Dev PnP
Shared Add-in model learnings
Grew and evolved
Added components, included community
Changed name to SharePoint PnP
Now SP PnP = SP Developer Ecosystem
Manages all guidance and community activities
Motto: Learn, Reuse, Share
![Page 4: Introduction to the Office Dev SharePoint PnP Core Libraries](https://reader031.vdocuments.us/reader031/viewer/2022012416/617130e84828097bf32009b8/html5/thumbnails/4.jpg)
Documentation and guidance aka.ms/spdev-docs
• Consolidated location for
documentation and guidance
• SharePoint Framework,
including API reference
• SharePoint add-ins
• Declarative customizations
etc.
![Page 5: Introduction to the Office Dev SharePoint PnP Core Libraries](https://reader031.vdocuments.us/reader031/viewer/2022012416/617130e84828097bf32009b8/html5/thumbnails/5.jpg)
Videos and webcastsaka.ms/spdev-videos
• Web cast recordings
• Quick Guidance Videos
• Tutorial Videos
• Training Videos
• Weekly and monthly
community call recordings
>200 videos already
![Page 6: Introduction to the Office Dev SharePoint PnP Core Libraries](https://reader031.vdocuments.us/reader031/viewer/2022012416/617130e84828097bf32009b8/html5/thumbnails/6.jpg)
Samples and solutionsgithub.com/sharepoint
• SharePoint Framework
• Provider hosted Add-ins
• Reusable controls and
components
• PnP PowerShell and Scripts
• Build extensions
>300 samples
![Page 7: Introduction to the Office Dev SharePoint PnP Core Libraries](https://reader031.vdocuments.us/reader031/viewer/2022012416/617130e84828097bf32009b8/html5/thumbnails/7.jpg)
aka.ms/sppnp
![Page 8: Introduction to the Office Dev SharePoint PnP Core Libraries](https://reader031.vdocuments.us/reader031/viewer/2022012416/617130e84828097bf32009b8/html5/thumbnails/8.jpg)
Links
Main Site
aka.ms/sppnp
Docs and Guidance
aka.ms/spdev-docs
Videos
aka.ms/spdev-videos
Samples
github.com/sharepoint
PnP Developer Community Site
aka.ms/sppnp-community
Managed Core Library Repo
github.com/SharePoint/PnP-Sites-Core
JavaScript Core Library Repo
github.com/SharePoint/PnP-JS-Core
![Page 9: Introduction to the Office Dev SharePoint PnP Core Libraries](https://reader031.vdocuments.us/reader031/viewer/2022012416/617130e84828097bf32009b8/html5/thumbnails/9.jpg)
What is the PnP Core Managed Library?
Open source “extensions” to the Managed Client Object Model
Simplifies the use of existing capabilities
Does not add any new capabilities
Three versions
SharePoint 2013
SharePoint 2016
SharePoint Online
![Page 10: Introduction to the Office Dev SharePoint PnP Core Libraries](https://reader031.vdocuments.us/reader031/viewer/2022012416/617130e84828097bf32009b8/html5/thumbnails/10.jpg)
Creating a List with CSOM
private void CreateListButton_Click(object sender, EventArgs e)
{
using (var context = new ClientContext(SharePointTextBox.Text))
{
var web = context.Web;
var lci = new ListCreationInformation();
lci.Title = "CSOM Sample List";
lci.TemplateType = (int)ListTemplateType.GenericList;
CreateList(web, lci);
AddStatus("Operation complete");
}
}
private void CreateList(Web web, ListCreationInformation lci)
{
var context = web.Context;
var query = web.Lists.Where(l => l.Title == lci.Title);
var lists = context.LoadQuery(query);
context.ExecuteQuery();
if (lists.Count() == 0)
{
web.Lists.Add(lci);
context.ExecuteQuery();
AddStatus("Created list: " + lci.Title);
}
}
![Page 11: Introduction to the Office Dev SharePoint PnP Core Libraries](https://reader031.vdocuments.us/reader031/viewer/2022012416/617130e84828097bf32009b8/html5/thumbnails/11.jpg)
Creating a List with the PnP Core Library
private void CreateListButton_Click(object sender, EventArgs e)
{
using (var context = new ClientContext(SharePointTextBox.Text))
{
var web = context.Web;
var listName = "PnP Sample List";
var exists = web.ListExists(listName);
if (exists == false)
{
web.CreateList(ListTemplateType.GenericList, listName, false, true);
AddStatus("Created list: " + listName);
}
AddStatus("Operation complete");
}
}
![Page 12: Introduction to the Office Dev SharePoint PnP Core Libraries](https://reader031.vdocuments.us/reader031/viewer/2022012416/617130e84828097bf32009b8/html5/thumbnails/12.jpg)
What is the PnP JavaScript Core Library?
Open source wrapper around the JavaScript REST API
Simplifies the use of existing capabilities
Does not add any new capabilities
PnP JavaScript Core Library
pnp.js
ES6 Polyfills
fetch.js
es6-promise.min.js
![Page 13: Introduction to the Office Dev SharePoint PnP Core Libraries](https://reader031.vdocuments.us/reader031/viewer/2022012416/617130e84828097bf32009b8/html5/thumbnails/13.jpg)
Creating a List the REST API
function createList() {
UpdateFormDigest(_spPageContextInfo.webServerRelativeUrl, _spFormDigestRefreshInterval);
var call = jQuery.ajax({
url: _spPageContextInfo.webAbsoluteUrl + "/_api/Web/Lists",
type: "POST",
data: JSON.stringify({
"__metadata": { type: "SP.List" },
BaseTemplate: SP.ListTemplateType.tasks,
Title: "Tasks"
}),
headers: {
Accept: "application/json;odata=verbose",
"Content-Type": "application/json;odata=verbose",
"X-RequestDigest": jQuery("#__REQUESTDIGEST").val()
}
});
call.done(function (data, textStatus, jqXHR) {
var message = jQuery("#message");
message.text("List added");
});
call.fail(failHandler);
}
![Page 14: Introduction to the Office Dev SharePoint PnP Core Libraries](https://reader031.vdocuments.us/reader031/viewer/2022012416/617130e84828097bf32009b8/html5/thumbnails/14.jpg)
Creating a List with the PnP JS Core Library
function createList() {
var call = $pnp.sp.web.lists.add("TasksPnp", "Description", SP.ListTemplateType.tasks);
call.then(function (data) {
var message = jQuery("#message");
if (data.data.Created) {
message.text("List added");
}
});
call.catch(failHandler);
}
![Page 15: Introduction to the Office Dev SharePoint PnP Core Libraries](https://reader031.vdocuments.us/reader031/viewer/2022012416/617130e84828097bf32009b8/html5/thumbnails/15.jpg)
Using JS Core Library with SPFx
Import package
npm install sp-pnp-js –save
Import in TypeScript file
import pnp from "sp-pnp-js";
import { Web } from "sp-pnp-js";
Use JS Core Library
let web = new Web(this.context.pageContext.web.absoluteUrl);
result = web.lists.filter("(Hidden eq false)").get()
.then((response) => {
return {
value: response
}
});
![Page 16: Introduction to the Office Dev SharePoint PnP Core Libraries](https://reader031.vdocuments.us/reader031/viewer/2022012416/617130e84828097bf32009b8/html5/thumbnails/16.jpg)
Thank You
Big thanks to the organizers, sponsors and you for
making this event possible
Please fill out your evaluation
Please keep in touch
@robwindsor
blogs.msmvps.com/windsor