Zero to Hero: Complete Tutorial on Building SharePoint Embedded Apps

[@Andrew_Connell]

New to SharePoint Embedded? Check out my overview video kzbin.info/www/bejne/nXa4aYGug7x_eas & get the steps from this video and download the code from my site ➡ vtns.io/ytvspetutorial

[@OleBergtun]

Something tells me that you had a great time creating this content 🤜🤛🖖

[@Andrew_Connell]

I do! I love creating these in-depth tutorials!

[@OleBergtun]

Hi @@Andrew_Connell , i should be doing other stuff, but my mind keeps thinking of use-cases

[@Andrew_Connell]

Right? This has been something SharePoint developers have wanted for years!!!

[@gorw9542]

Is version history supported?

[@Andrew_Connell]

Yup... your solutions have access to ALL the features SharePoint document libraries have to offer.

[@gorw9542]

Thank you

[@Andrew_Connell]

@@gorw9542 You bet!

[@perrya3550]

Hey Andrew! Big fan of your content. I owe my career to Mastering the SharePoint framework. Seriously one of the most complete courses I've ever taken. My head's spinning with possibilities here. A few questions: If consumers of my app wanted to invite users from outside of their organization to collaborate, how would authentication work? Having trouble wrapping my head around this. I saw your note about public facing upload in your previous video, but I noticed the API returns a SharePoint weburl. Does that mean the consumer would have to invite external users into their tenant for co-authoring? Can we add metadata to containers (IE document library columns)? Can we trigger Power Automate flows like we can with traditional document libraries?

[@Andrew_Connell]

Thanks for the kind comments about my SPFx course! 🙏 Let me tackle your questions: 1) WRT external users - yes, you can control external user access from the tenant (ie: allow/disallow), but your web app can also allow external users to login and interact with the content. If they have permissions to consume it (ie: Reader role), they can access it. While the URL is a SharePoint web URL, don't think "SharePoint"... that's just how it's stored. The permission model is not the same as SharePoint's. Furthermore, a user with permissions can share a link to the file to view/edit it (think about the same file sharing experience you have in OneDrive - you can share a link, or you can send an email-based invite. 2) Yup... Containers can have name-value pairs (think property bag) but they can also have columns where the files within the Container can have values assigned to those columns (aka: fields). 3) Yup... provided you have enabled Microsoft 365 Content Discovery for your Container (default = disabled), the Container will be visible in all Microsoft 365 experiences, like search, Power Automate, Office desktop clients, etc.

[@alexanderk.567]

Great video, thanks! Do you have any idea on how to grant more restricted permissions to additional apps in an App-Only authentication context? I assume the additional app must be added when registering the container type (at least that works), however I can’t find any information on what permissions are available besides “full”

[@Andrew_Connell]

Have you seen this page in the docs? learn.microsoft.com/sharepoint/dev/embedded/concepts/app-concepts/sharing-and-perm#container-roles You can't make something more restrictive (like you can by breaking inheritance in SharePoint document libraries) - SPE only supports additive permissions.

[@alexanderk.567]

Thanks! I did, it seems to be related to delegated authentication?! As for App-only calls, the docs (SharePoint Embedded -> Concepts -> Authentication, my comment seems to get deleted when I use a link) have the following statements in the section Authorization: "For App-only calls, SharePoint Embedded authorization is determined by the configured permissions tied to the AppID-ContainerTypeID pair." and "App1 has Create, Read, and Write permissions to ContainerType1" indicating that it seems to be possible to grant App specific permissions?!

[@Andrew_Connell]

@alexanderk.567 that’s correct, you can grant ANOTHER app different permissions if you wish.

[@etiennemarques533]

Thank you, Andrew! Is it possible to embed a shp list in a spa and manipulate it (crud)? If not, could you make a lesson showing how to manipulate a sharepoint list from a spa react? I'm searching for it and didn't find at all. I'm sure that lesson would become viral! ;) Thank you

[@Andrew_Connell]

Yes, you can create a SPA that does CRUD operations against a SharePoint list. If you host the SPA within SharePoint, you can use the SPFx API to to use the SharePoint REST API to read/write to the list... you wouldn't embed the list within the SPA... rather you just treat it as a data source.

[@mrkjartanvalur]

Great video😊 Is it possible to sync the containers to a drive on the customers devices? And is it possible to open the office file in the custom app and edit instead of just download annd upload? If so, can you point me to the right direction?

[@Andrew_Connell]

There’s no sync built in, but under the covers it’s very much just like a document library from a data access or storage POV. As for Office, you dont have to download. You can use the Office web apps and edit that way. Or, use the APIs to edit the files directly at rest.

[@mrkjartanvalur]

@@Andrew_Connell thanks! Regarding office web apps. I've had trouble finding documentation or examples regarding opening and editing offfice documents from a custom web app. Do you know of any?

[@Andrew_Connell]

There's a property on the file in the REST response that when you send the user to it, it opens the file in the Office web client. Look at the `driveItem.webUrl` property

[@mrkjartanvalur]

@@Andrew_Connell Thank you so much for your time and awesome channel

[@4Dibakar]

Thanks Andrew. It is a great application but why client will move on SP Embedded with payment model when they have free SharePoint given through M365?

[@Andrew_Connell]

Have you seen my other video on SharePoint Embedded? kzbin.info/www/bejne/nXa4aYGug7x_eas In that video, I address some common scenarios. For example, if you want a specific workflow & process for users to follow, or if you want people who aren't in your M365 tenant to have the ability to upload/contribute files to it. Also, if your scenario needs to have full control over the UX working with files, SPE is ideal since you own the entire UX and access story, where as in SPO, you'd have to tell users to not use the document library UX or any of the other ways you can access content in the libraries (search/Teams/REST APIs, etc).

[@antwit]

Hi Andrew, any idea if the roadmap for this will include lists?

[@Andrew_Connell]

No, not heard anything about that. I doubt it tho as this is only intended for documents.

[@alexk7837]

Given the complexity, I need help to visualize the real-world use case scenarios and benefits. Why would you develop a UI if you already have a native SharePoint UI? Who are this's direct competitors? Can you use Terraform to deploy it? Finally, what is the maintenance (upgrade), backup, and recovery mechanism?

[@Andrew_Connell]

Have you seen my overview video on SPE? That might help set the context for you: kzbin.info/www/bejne/nXa4aYGug7x_eas But, the point is to add document centric capabilities to your new/existing app without having to build those features yourself. SPE makes sense when your app needs to own the UX, NOT rely on the SP UX. Think about a document submission and processing experience. You're just developing a web app, it's simply using SPE as it's data store. So you can use any of the existing CI/CD, or provisioning tools you use today (like Azure ARM/Bicep, Terraform, etc). Same story with maintenance of your code. As for backup, restore, security & compliance... all of that is handled with the existing offers from Microsoft 365 (M365 Backup, Purview, etc).

[@mrkjartanvalur]

@Andrew_Conell I´m developing a multitenant project management app and I´m confused if I should create just a single container with folders for each project inside OR should I just create a container for every project? The projects can be tens of thousands for each container. What is your suggestion?

[@Andrew_Connell]

Great question... this information architecture question comes up a lot. While it's up to you, consider the following... SPE supports 100,000 Containers per Container Type (aka: an SPE app) _PER TENANT_ - this implies that Microsoft expects a single app to have lots of containers. I like to think of the security boundary. For example, consider a law firm with different cases (matter) that was using SPE to store it's document content. Each matter would have it's own container with it's own security model. Does that help? While I don't know exactly what your scenario is, I'd model out creating a seperate container PER project, rather than using folders for project organization.

[@mrkjartanvalur]

​@@Andrew_Connell That´s exactly my model! This is for law firms to handle their cases. But I´m worried about search for files for all cases (search between containers) would then be hard. Ain´t that true that search between containers is not possible? Then I would have to mirror the files metadata in another database or search index to handle search. And that also becomes more complicated when you have access permissions between cases. But thank you so much for this excellent and quick response and all the work you do!

[@Andrew_Connell]

"Ain´t that true that search between containers is not possible? " Nope... not true at all. Remember, a Container is _JUST_ a SharePoint document library. So when you search, all content is indexed and can be returned in the search results. By default, search returns everything (just like Microsoft 365 search) the user performing the search as permissions to see, but you can apply filters to only include a specific library (or libraries). Also, by default the content is _NOT_ visible to the rest of Microsoft 365, but you can opt-in to including it if you like. "But thank you so much for this excellent and quick response and all the work you do!" You're welcome!

[@maxfaust892]

As an app creator building an app that uses SharePoint Embedded containers, what access do I have to the files uploaded to the containers? What capacity as app creator would I have to restrict my own access to or assign roles to access the files uploaded to embedded containers? Also, I found a typo on the Introduction to Sharepoint Embedded Overview & Configuration, unit 2 of 8, in the third paragraph from the top of the page: "Some organizations have recreated these capabilities in their products them while others have built their products on top of SharePoint." Did you mean "...recreated these capabilities in their products while others...?"

[@Andrew_Connell]

Good catch on the typo... "... products them while... " should be "products while". I'll submit a PR to get that fixed. To your other question, as the app developer you implement the functionality to give a user with the required permissions (Owner/Manage) to control who has access to the content within the container. The app can use application permissions to access the content within it though. Is that what you're asking?

[@OleBergtun]

Just a small question about container. So a Container is actually a SharePointish site? So, if you select multi-tenant, any organisation that runs SharePoint and have the SharePoint embedded option enabled can access/consume the embedded solution? But, no "not-microsoft-org" will be able to?

[@Andrew_Connell]

No... a container is like a "drive" in OneDrive, or you can think of it as a document library. It's not a SharePoint site. As for single vs. multi-tenant, that's a feature of the Entra ID (Azure AD) application that can access the content. In the single-tenant scenario, only your app & org can access the containers. This would make sense if you were building an app that will store content in YOUR tenant. But in a multi-tenant scenario, you're building an app you want your customers to store data in THEIR tenants. This makes sense if you're an ISV creating an app for your customer to use (and store their content in their SharePoint Embedded containers in THEIR tenants.

[@mrkjartanvalur]

@Andrew_Connell This is a great demo but It would be awesome to see a demo for the multitenant scenario as well. You could use the sandbox tenant option that Microsoft provides developers for this kind of scenario. I can´t find any demo that covers the multitenant aspect.

[@Andrew_Connell]

Thanks for the feedback. I working on a refresh of the tutorial now that SPE is GA to account for some changes. Agree that multitenant could be another good angle. Thanks for the feedback!

[@mrkjartanvalur]

@@Andrew_Connell Great news! I cannot wait to see that! Any ETA on that?

[@Andrew_Connell]

@@mrkjartanvalur I can't say... quite swamped at the moment. Make sure you're subscribed to my channel to see when I release it.

[@mrkjartanvalur]

@@Andrew_Connell Already subscribed 😁

[@mrkjartanvalur]

@@Andrew_Connell It would also be really useful to have the server be an Dotnet application.

[@devmarceloribeiro]

I didnd understand what it is 🤔 it will run inside a SharePoint Site collection? it will replace the SPFX WebPart? thank you

[@Andrew_Connell]

Check my overview video out... it might make more sense: kzbin.info/www/bejne/nXa4aYGug7x_eas The premise of your question is off - no, this doesn't run inside a site collection. This _IS_ SharePoint, except without a UX. You build the web app to interface with the storage. The storage is SharePoint, it's just separate form the rest of "your SharePoint" and all data access is done via Microsoft Graph.