Wednesday, July 21, 2021

How do I complete tasks that require elevated permissions using SPFx web parts?

 Ans:

All code that requires elevated permissions should be developed in provider hosted add-ins exposed as REST services which can be called from SPFx web parts.

How to integrate SPFX webpart in teams?

 Ans:- 

Locate the ./src/webparts/**/manifest.json file for the web part you'll use as the tab for the meeting app solution. Locate the supportedHosts property to include "TeamsTab":

{ "$schema": "https://developer.microsoft.com/json-schemas/spfx/client-side-web-part-manifest.schema.json", "id": "..", "alias": "MyFirstTeamsMeetingAppWebPart", "componentType": "WebPart", "version": "*", //... "supportedHosts": ["SharePointWebPart", "TeamsTab"], //... }

Select the package in the SharePoint tenant App Catalog and select the Sync to Teams button at in the ribbon in the Files tab.


The last step is to test the meeting app in Microsoft Teams. To do this, you'll create a meeting that isn't a channel meeting and has at least one person invited to it:

  1. Open the Microsoft Teams desktop client.

  2. Create a new meeting using the Calendar app in the left-hand app bar.

  3. Invite someone to the meeting.

  4. Save the meeting.

  5. From the Calendar app, open the test meeting you created.

  6. Select the + (plus) button to the right of the existing tabs.

  1. Select your custom meeting app


What are the differences between seattle and oslo master pages in SharePoint?

 Ans:- 

Seattle:

  1.  Seattle is designed for intranet team collaboration portal with more features such as  social, content\site navigation and management,etc.
  2. There is a Left navigation is exist and we can set Top navigation for top level sites and sub sites

Oslo:

  1.  Oslo master page is designed for publishing site which focus on page layout and content rendering.
  2. moving the left navigation to the top, and removing the top navigation all together. Oslo has a wider layout for your content.

What are the difference between componentDidMount() and componentDidUpdate()

 Ans:-

componentDidMount()

componentDidMount() will be rendered immediately after a component is mounted. This method will render only once and all the initialization that requires DOM nodes should go here. Setting state in this method will trigger a re-rendering.


componentDidUpdate()

componentDidUpdate() is invoked immediately every time the updating occurs. This method is not called for the initial render.


You can understand more from this below example

import React from 'react';

class Example extends React.Component{
  constructor(props) {
    super(props);
    this.state = {
      count: 0
    };
  }
  componentDidMount() {

    //This function will call on initial rendering.
    document.title = `You clicked ${this.state.count} times`;

  }
  componentDidUpdate() {
     document.title = `You clicked ${this.state.count} times`;
   }

  render(){
    return(
      <div>
      <p>You clicked {this.state.count} times</p>
      <button onClick={() => this.setState({ count: this.state.count + 1 })}>
        Click me
      </button>
    </div>
    )
  }
}
export default Example;

How to check current version of SharePoint Framework?

 Ans:- npm ls -g --depth=0 @microsoft/generator-sharepoint