Other Related Post

SharePoint Online is being used by many organizations not only for collaboration and document management but it is used for several business activities which involve similar types of custom sites.

Let’s take an example project site. User creates a separate site to manage each of the project where the architecture, configuration, and design of the site are the same. SharePoint provides the ability to create a Site Template using an existing site using PnP PowerShell Script.

I am describing here the steps to create a SharePoint site automatically using the existing site template. In this article, we will be using SharePoint List, Power Automate, Azure Automation, and Azure Runbook.

First create a template file using the existing SharePoint Site using below PowerShell Script

The above script creates a XML file called TemplateFile.xml. Upload this file to a SharePoint Library somewhere so that we can use it each time by PowerShell to create a new site.

Now login to Azure Portal and create an Automation Account.

Once automation account is created, then go to automation account.

First you need to install the module you require to run the PowerShell.

Click the “Modules” under “Shared Resource” from the left panel and click the “Browse Gallery”

Then search the pnp.powershell. This will show the module and select.

When you installed the required modules, go to the Runbook.

You will see a Runbook under Process Automation in the left panel.

Click the runbook and create a new runbook. Provide the name of runbook, select PowerShell as runbook type, runtime version, and description.

Once runbook is created, go to runbook. You will find “Edit” link on top with other links.

Click the edit link. You will find an editor to put your PowerShell Script. Now enter the below PowerShell Script. We will be passing SiteURL as parameter.

After putting the script, click Save and Publish the runbook.

Now Create a SharePoint List that will contain a list of projects.

Then create a new flow using Power Automate connected to the above list triggered “When an item is created” so that flow trigger as soon as a new item is created in the list. Add next steps in the flow as “Send an HTTP request to SharePoint” and put the details as below:

Microsoft Power Automate has connector available to connect with a runbook under an automation account. Add an action and select “Azure Automation” connector, then select “Create a job” from the list of actions.

This will require your azure details like subscriptions, resource group, automation account, and runbook. When you select your runbook, it will prompt for parameter defined in the runbook. Pass the parameter and save. This will call the script and pass the parameter to script.

You can add more actions in the flow like updating a list or sending a notification mail etc.

Your flow will look like below.

Now automation is ready.

Please create a new item to the list. It will trigger the flow and create a new site with custom template.

Now automation is ready.

Please create a new item to the list. It will trigger the flow and create a new site with custom template.

In this article, we will see the steps to create a SPFx web part which calls a third-party anonymous REST API to get data from the API. Some properties like URL and item id will be passed from web part properties to change the data in the web part.

Step 1: Open your React SPFx web part and update the interface IThirdpartyApiCallProps.ts inside your components folder. Update the interface with following 3 properties and import WebPartContext to create property for web part context inside react component.

Step 2: Open web part file ThirdpartyApiCallWebPart.ts and add below 2 properties in interface IThirdpartyApiCallWebPartProps. These properties will be passed to component from the web part.

Step 3: Update render() method to set the properties of react component. Context property of react component is set from web part context. Other 2 properties are set from web part properties.

Step 4: Define 2 new text box properties for property pane of web part in getPropertyPaneConfiguration() method. These 2 properties will be passed to react component properties from web part.

Step 5: Define default value for the 2 new properties in web manifest json file. ThirdpartyApiCallWebPart.manifest.json

Step 6: Create a new .ts file in components folder with name IThirdpartyApiCallState. This interface will have all the values which we fetch from single API record https://jsonplaceholder.typicode.com/users/1. All the properties of API record are stored in react component state which is defined in this interface. We will define all those properties which we want to fetch from API.

Step 6: Now open react component .tsx file ThirdpartyApiCall.tsx and do following:

1. Access state interface IThirdpartyApiCallState in tsx file as state management. Import the interface and add as state in React.Component class constructor.

2. Add construct for react component class ThirdpartyApiCall in tsx file. This constructor will be communicating with properties and state through interfaces. Here were initialing all our state properties to null.