Adding the PowerApp to SharePoint

To put our app on a page within SharePoint, we need to use a modern page. Modern pages are those that are completely mobile responsive and are designed to function within the SharePoint mobile app, as shown in the following screenshot. They differ greatly to the classic pages, which make use of web part zones to place components on the page.

When you create a SharePoint site from the SharePoint home page, you can create either a communication site or a team site. Both of these site templates are modern, therefore allowing you to use your PowerApps.
Figure 4.6: A modern SharePoint team site

When we edit the page, we can add components to the page in the form of web parts. These modern web parts include a PowerApps web part, which at the time of writing is in preview. To add a web part to a page, you must begin editing the page using the Edit option in the top-right area of your SharePoint page:

Figure 4.7: The edit option in SharePoint Online

Once the page is in edit mode, you can add new web parts to your page. This is done by hovering over the desired area so that you see the + icon, which you can then click on to open up the web part toolbox:

Figure 4.8: Add a web part button

Once the toolbox is open, you can either scroll down until you find the Microsoft PowerApps web part or use the search box at the top of the toolbox to filter:

Figure 4.9: The PowerApps web part in the toolbox

Once you have located it, click on the web part so that it will be placed onto the page. The web part properties blade will automatically open on the right-hand side of the screen. The web part properties section is where you can add either the App web link or ID that we identified earlier, and where you can specify whether there is a border around the app or not:

Figure 4.10: Configuring the PowerApps web part

As soon as you paste in the App web link or ID, it will immediately start to render on the page and display the last published version of the app. This is then available to you and your users to interact with on your SharePoint site, as shown in the following screenshot:

Figure 4.11: The app being displayed on the page
It is worth keeping in mind that it can take a second or two for your app to actually load, so consider the burden on the browser if you have multiple PowerApps embedded on a single page.

The final step is to publish your SharePoint page, which is achieved by pressing Publish, which can be found in the top-right corner. Once that has been done, any standard users of your SharePoint site will be able to use your app without having to leave SharePoint.

SharePoint provides just one of the key collaboration areas within Office 365; the other key area is Microsoft Teams.

上一章目录下一章