SPFxFebruary 10, 20267 min read

Using PnP JS in SPFx: The Easiest Way to Read SharePoint Data

PnP JS simplifies SharePoint REST API calls. Query lists, add items, and batch requests with clean TypeScript.

Why PnP JS?

Fluent, chainable API with TypeScript support instead of raw REST.

npm install @pnp/sp @pnp/logging

Get items:

const items = await sp.web.lists.getByTitle('Tasks').items();

Add item:

await sp.web.lists.getByTitle('Tasks').items.add({ Title: 'New' });

Batching:
Combine multiple requests into one HTTP call for better performance.