Skip to content

Commit 5ecd7e1

Browse files
committed
revise SPFx overview page
- focus on WHAT & WHERE spfx can be used - refactor the WHY to seperate page +add to TOC
1 parent 034afc3 commit 5ecd7e1

File tree

3 files changed

+54
-29
lines changed

3 files changed

+54
-29
lines changed
Lines changed: 12 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,24 @@
11
---
22
title: Overview of the SharePoint Framework (SPFx)
33
description: SPFx is a page and web part model that provides full support for client-side SharePoint development, easy integration with SharePoint data, and extending Microsoft Teams.
4-
ms.date: 09/07/2021
4+
ms.date: 09/08/2021
55
ms.prod: sharepoint
66
localization_priority: Priority
77
---
88

9-
109
# Overview of the SharePoint Framework
1110

1211
The SharePoint Framework (SPFx) is a page and web part model that provides full support for client-side SharePoint development, easy integration with SharePoint data, and extending Microsoft Teams. With the SharePoint Framework, you can use modern web technologies and tools in your preferred development environment to build productive experiences and apps that are responsive and mobile-ready.
1312

14-
The latest version, and all previous versions, of the SharePoint Framework are hosted and available in SharePoint Online. It's also available for SharePoint Server 2016 (with Feature Pack 2) and SharePoint Server 2019.
13+
The SPFx is the recommended SharePoint customization and extensibility model for developers. Due to tight integration between SharePoint Online, Microsoft Teams, and Microsoft Viva Connections, developers can also use SFPx to customize and extend all of these products. In fact, the SPFx is the only extensibility and customization option for Viva Connections.
14+
15+
In addition to SharePoint Online, the SPFx is supported and can be used to customize SharePoint on-premises deployments going back to SharePoint Server 2016.
16+
17+
To learn more about where developers can use SPFx, see [Supported extensibility platforms](supported-extensibility-platforms-overview.md).
18+
19+
## Key features of the SharePoint Framework
1520

16-
Key features of the SharePoint Framework include:
21+
The following are some of the key features included as part of the SPFx:
1722

1823
- It runs in the context of the current user and connection in the browser. There are no iFrames for the customization (JavaScript is embedded directly to the page).
1924
- The controls are rendered in the normal page DOM.
@@ -30,41 +35,19 @@ The runtime model improves on the Script Editor web part. It includes a robust c
3035

3136
If you work primarily with C#, you want to learn more about client-side JavaScript development. Most of your existing JavaScript knowledge related to SharePoint, however, is transferable, as the data models haven't changed, and you’ll use the same [REST services](../sp-add-ins/get-to-know-the-sharepoint-rest-service.md) depending on your requirements. If you're a C# developer, TypeScript is a nice transition into the JavaScript world. The choice of IDE is up to you. Many developers like to use the cross-platform IDE [Visual Studio Code](https://code.visualstudio.com).
3237

33-
## Why the SharePoint Framework?
34-
35-
SharePoint was launched as an on-premises product in 2001. Over time, a large developer community has extended and shaped it in many ways. The developer community followed the same patterns and practices that the SharePoint product development team used, including web parts, SharePoint feature XML, and more. Many features were written in C#, compiled to DLLs, and deployed to on-premises server farms.
36-
37-
That architecture worked well in environments with only one enterprise, but it didn’t scale to the cloud, where multiple tenants run side by side on the same servers. As a result, we introduced two alternative models: client-side JavaScript injection, and SharePoint Add-ins. Both of these solutions have pros and cons.
38-
39-
### JavaScript injection
40-
41-
One of the most popular web parts in SharePoint Online is the Script Editor. You can add JavaScript to the Script Editor web part and have that JavaScript execute when the page renders. It’s simple but effective. It runs in the same browser context as the page, and is in the same DOM, so it can interact with other controls on the page. It's also relatively performant, and simple to use.
42-
43-
There are a few downsides to this approach. First, while you can package your solution so that end users can drop the control onto the page, you can't easily provide configuration options. Also, the end user can edit the page and modify the script, which can break the web part. Another significant problem is that the Script Editor web part isn't marked as **"Safe For Scripting"**. Most self-service site collections (my-sites, team sites, group sites) have a feature known as **"NoScript"** enabled. Technically, it is the removal of the Add/Customize Pages (ACP) permission in SharePoint. This means that the Script Editor web part will be blocked from executing on these sites.
44-
45-
### SharePoint Add-in model
46-
47-
The current option for solutions that run in NoScript sites is the add-in/app-part model introduced in SharePoint Server 2013. This implementation creates an **iFrame** where the actual experience resides and executes. The advantage is that because it's external to the system and has no access to the current DOM/connection, it's easier for information workers to trust and deploy. End users can install add-ins on NoScript sites.
48-
49-
There are some downsides to this approach as well. First, they run in an **iFrame**. iFrames are slower than the Script Editor web part, because it requires a new request to another page. The page has to go through the complete authentication and authorization, make its own calls to get SharePoint data, load various JavaScript libraries, and more. A Script Editor web part might typically take, for example, 100 milliseconds to load and render, while an app part might take 2 seconds or more. Additionally, the **iFrame** boundary makes it more difficult to create responsive designs and inherit CSS and theming information. iFrames do have stronger security, which can be useful for you (your page is inaccessible by other controls on the page) and for the end user (the control has no access to their connection to Microsoft 365).
50-
51-
### SharePoint Framework
52-
53-
Historically, we created web parts as full trust C# assemblies that were installed on the cloud servers. However, current development models for the most part involve JavaScript running in a browser making REST API calls to the SharePoint and Microsoft 365 back-end workloads. C# assemblies don’t work in this world. We needed a new development model. The SharePoint Framework is the next evolution in SharePoint development.
54-
55-
## SharePoint Framework License
38+
## SharePoint Framework license
5639

5740
The SharePoint Framework components are licensed under this [Microsoft EULA](https://unpkg.com/@microsoft/[email protected]/EULA/Microsoft%20Sharepoint%20Framework%20-%20Standalone%20(free)%20Use%20Terms.docx).
5841

5942
## Questions?
6043

6144
If you have any questions, post them on [SharePoint StackExchange](https://sharepoint.stackexchange.com/). Tag your questions and comments with [#spfx](https://sharepoint.stackexchange.com/tags/spfx/), [#spfx-webparts](https://sharepoint.stackexchange.com/tags/spfx-webparts/), and [#spfx-tooling](https://sharepoint.stackexchange.com/tags/spfx-tooling/).
6245

63-
You can also post issues, questions, or feedback about the docs or the SharePoint Framework in our [GitHub repo](https://github.com/SharePoint/sp-dev-docs/issues).
46+
You can also post issues, questions, or feedback about the docs at the following GitHub issue list [sharepoint/sp-dev-docs/issues](https://github.com/SharePoint/sp-dev-docs/issues).
6447

6548
## See also
6649

6750
- [Overview of SharePoint client-side web parts](./web-parts/overview-client-side-web-parts.md)
6851
- [Overview of SharePoint Framework Extensions](./extensions/overview-extensions.md)
69-
- [SharePoint development](https://docs.microsoft.com/sharepoint/dev/)
52+
- [SharePoint development](/sharepoint/dev)
7053
- [SharePoint glossary](../general-development/sharepoint-glossary.md)

docs/spfx/sharepoint-framework-why.md

Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
---
2+
title: Why the SharePoint Framework?
3+
description: Learn why Microsoft introduced and now recommends the SharePoint Framework for customer SharePoint extensibility and customizations.
4+
ms.date: 09/08/2021
5+
ms.prod: sharepoint
6+
localization_priority: Priority
7+
---
8+
9+
# Why the SharePoint Framework?
10+
11+
SharePoint was initially launched as an on-premises product in 2001. Over time, a large developer community has extended and shaped it in many ways. The developer community followed the same patterns and practices that the SharePoint product development team used, including web parts, SharePoint feature XML, and more. Many features were written as server-side customizations using C#, compiled to DLLs, and deployed to on-premises server farms.
12+
13+
That architecture worked well in environments with only one enterprise, but it didn’t scale to the cloud, where multiple tenants run side by side on the same servers. As a result, we introduced two alternative models: client-side JavaScript injection, and SharePoint Add-ins. Both of these solutions have pros and cons.
14+
15+
## JavaScript injection
16+
17+
One of the most popular web parts in SharePoint Online is the **Script Editor**. You can add JavaScript to the Script Editor web part and have that JavaScript execute when the page renders. It’s simple & effective. It runs in the same browser context as the page, and is in the same DOM, so it can interact with other controls on the page. It's also relatively performant, and simple to use.
18+
19+
There are a few downsides to this approach:
20+
21+
- While you can package your solution so that end users can drop the control onto the page, you can't easily provide configuration options.
22+
- The end user can edit the page and modify the script, which can break the web part.
23+
- The Script Editor web part isn't marked as **Safe For Scripting**. Most self-service site collections (my-sites, team sites, group sites) have a feature known as **"NoScript"** enabled. Technically, it is the removal of the Add/Customize Pages (ACP) permission in SharePoint. This means that the Script Editor web part will be blocked from executing on these sites.
24+
25+
## SharePoint Add-in model
26+
27+
One option for solutions that run in NoScript sites is the add-in/app-part model introduced in SharePoint Server 2013. This implementation creates an **iFrame** where the actual experience resides and executes. The advantage is that because it's external to the system and has no access to the current DOM/connection, it's easier for information workers to trust and deploy. End users can install add-ins on NoScript sites.
28+
29+
There are some downsides to this approach as well
30+
31+
- They run in an **iFrame**. iFrames are slower than the Script Editor web part, because it requires a new request to another page. The page has to go through the complete authentication and authorization, make its own calls to get SharePoint data, load various JavaScript libraries, and more. A Script Editor web part might typically take, for example, 100 milliseconds to load and render, while an app part might take 2 seconds or more.
32+
- The **iFrame** boundary makes it more difficult to create responsive designs and inherit CSS and theming information. iFrames do have stronger security, which can be useful for you (your page is inaccessible by other controls on the page) and for the end user (the control has no access to their connection to Microsoft 365).
33+
34+
## SharePoint Framework
35+
36+
Historically, developers created web parts as full trust C# assemblies that were installed on the cloud servers.
37+
38+
However, current development models usually involve JavaScript running in a browser making REST API calls to the SharePoint and Microsoft 365 back-end workloads. C# assemblies don’t work in this world. Developers needed a new development model.
39+
40+
The SharePoint Framework is the next evolution in SharePoint development.

docs/toc.yml

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -125,6 +125,8 @@
125125
items:
126126
- name: Overview
127127
href: spfx/sharepoint-framework-overview.md
128+
- name: Why the SharePoint Framework?
129+
href: spfx/sharepoint-framework-why.md
128130
- name: Getting started
129131
items:
130132
- name: Set up Microsoft 365 tenant

0 commit comments

Comments
 (0)