you can follow these steps:

1. Install necessary dependencies:

   • Install the @microsoft/sp-http package by running the following command in your project's root directory:

     bashCopy code
     npm install @microsoft/sp-http
     

2. Import the required modules and interfaces in your web part's TypeScript file:

   typescriptCopy code
   import { SPHttpClient, SPHttpClientResponse } from '@microsoft/sp-http';
   import { MSGraphClient } from '@microsoft/sp-http';
   

3. Retrieve the photo URL from Microsoft Graph and display it in your web part:

   typescriptCopy code
   // Get the photo URL using Microsoft Graph
   this.context.msGraphClientFactory
     .getClient()
     .then((client: MSGraphClient): void => {
       client
         .api('/me/photo/$value')
         .responseType('blob')
         .get((error, photoResponse: any, rawResponse?: any) => {
           if (photoResponse) {
             // Convert the photo response to a blob URL
             const blobUrl = URL.createObjectURL(photoResponse);
   
             // Display the photo in your web part
             const photoElement = document.createElement('img');
             photoElement.src = blobUrl;
             this.domElement.appendChild(photoElement);
           } else {
             // Handle error
             console.error(error);
           }
         });
     });
   

Remember to replace this.context with your web part's context object, which provides access to the SharePoint HTTP client and the Microsoft Graph client.

Make sure you have the necessary permissions and consent to access the user's photo.

 In this article, How to show user profile image from azure environment in SharePoint Online.

REST API call provides profile picture of Office 365 users. But I want to pull profile image for SharePoint Online user from Azure Active Directory.

we have option to retrieve using Graph API by Microsoft

below code have used Microsoft Graph API to fetch user's profile image from delve then please share some snippets.

In Graph API, you can use the below endpoint to fetch photo from Azure AD:

https://graph.microsoft.com/v1.0/users/{id | userPrincipalName}/photo/$value

 user's email address as peter@CIE45879.onmicrosoft.com, then your url will be:

https://graph.microsoft.com/v1.0/users/peter@CIE45879.onmicrosoft.com/photo/$value

we have to allow permission to retrive the tenant , we need to set the app permission as

Profile photo of any user in the tenant including the signed-in user - User.ReadBasic.All; User.Read.All; User.ReadWrite.All

 Services:

• It offers two options for scaling and scoping data: organizations and projects.
• available in Cloud offering 
• can connect over the public network
• Permission level must be assigned to each user.

Server:

• It offers three options for scaling and scoping data: deployment, project collections, and projects.
• it is available in On premise offering
• can connect to the intranet server
• Permission level must be set based on the license.

•  TTM= Time to market >Reduced

• Quality> Improved

• Culture>less burnout & Blame

Devops is a Practice that creates values

Collaborative code development

• Boards
• Repos
• Pipelines
• testplans
• artifacts

 In this article , how to create the new devops dashboard for you organization .

Go the site URL 

https://azure.microsoft.com