Delete Files and Subfolders from SharePoint Library using PowerShell

Make life easy with PowerShell, following script will help you to delete all files and subfolders in One Go.

#Set-ExecutionPolicy -ExecutionPolicy RemoteSigned -Scope CurrentUser #Install-Module SharePointPnPPowerShellOnline #Config Variables $SiteURL = "https://mydomain.sharepoint.com/site" $ListName ="my_DocLib" $FolderServerRelativeURL = "/site/my_DocLib" Try { #Connect to PnP Online Connect-PnPOnline -Url $SiteURL -UseWebLogin #Get All Items from Folder in Batch $ListItems = Get-PnPListItem -List $ListName -FolderServerRelativeUrl $FolderServerRelativeURL -PageSize 2000 | Sort-Object ID -Descending #Powershell to delete all files from folder ForEach ($Item in $ListItems) { Remove-PnPListItem -List $ListName -Identity $Item.Id -Recycle -Force Write-host "Removed File:"$Item.FieldValues.FileRef } } Catch { write-host "Error: $($_.Exception.Message)" -foregroundcolor Red }

number to word in Microsoft Word using formula

 

Press Ctrl + F9 to write mathematical equations and you get { }.

write the formula as: { =123456\*cardtext } and press Alt + F9

Output:

one hundred twenty-three thousand four hundred fifty-six

Use of Equations in Microsoft word.

Many of us don't know that we can do calculations and put equations in Microsoft Word. Below is the way you can put equations in any version of Microsoft Word.

Note:   If an "error" message comes, right-click it and select the toggle field code and make the correction.

Javascript Tips and Best Practices

1. Check property exists in an object

const emp = { empno : 1, name : 'rakesh', salary : 50000 }; const keySalaryExist = 'salary' in emp; console.log (keySalaryExist); // true const keyGenderExist = 'gender' in emp; console.log (keyGenderExist); // false

The in operator returns the boolean value true/false.
The in operator returns true if a property exists in the object or its prototype chain.

2. String to a number using the plus (+) operator

const num = '101'; console.log(+num); // 101 as string console.log(typeof +code) // 101 as number

The unary plus operator (+) is the fastest and preferred way of converting something into a number.

3. Mask numbers using slice and padStart

const adharNumber = '1234567890123456'; const last4Number = adharNumber.slice(-4); const maskadharNumber = last4Number.padStart(adharNumber.length,'*'); console.log(maskadharNumber); // output : ************3456

The slice() method returns selected elements in an array, as a new array. Negative numbers select from the end of the array.
The padStart() method pads the current string with another string until the resulting string reaches the given length. The padding is applied from the start of the current string.

4. Swap two variables

let num1 = 10; let num2 = 20; [num1,num2] = [num2, num1]; console.log(num1); // 20; console.log(num2); // 10;

Use destructuring assignment approach because it is short and expressive. Swapping is performed in just one line statement. It works with any data type like numbers, strings, booleans, or objects.

5. Check every element of the array using Array.every

const employees = [ {empno:1, name:'Suresh',designation:'Mgr',salary:8000}, {empno:2, name:'Suresh',designation:'Sales',salary:6000}, {empno:3, name:'Suresh',designation:'Mgr',salary:7000} ] const isAllMgr = employees.every((m) => m.designation === 'Mgr'); const salGt5K = employees.every((m) => m.salary > 5000); console.log(isAllMgr); // false; console.log(salGt5K); // true;

The Array every() method checks whether all the array elements pass the test implemented by the provided function.
It returns true if the function returns true for all elements.
It returns false if the function returns false for one element. When every() finds a false result, it will stop the loop and continue no more which improves the performance. The every() method does not change the original array.

6. Use of nullish coalescing operator with numbers

I have use lot of time || operator for the logical disjunction, but it ends when value is 0 in the variable. So found better way to handle this. let num1 = 0; let num2; const defaultNum1 = num1 || 1; const defaultNum2 = num2 || 2; console.log(defaultNum1); // 1; // as value is 0, it return 1 console.log(defaultNum2); // 2; // insted of using || let use ?? const defaultNum1 = num1 ?? 1; const defaultNum2 = num2 ?? 2; console.log(defaultNum1); // 0; console.log(defaultNum2); // 2;

A Nullish value is a value that is either null or undefined.
The Nullish Coalescing Operator (??) is a logical operator that accepts two values and returns the second value if the first one is null or undefined and otherwise returns the first value.

7. Filter Array with only values

Many times we have an issue with array to have empty values and need to handle we write extra code. To avoid it just you have to use filter(). let arr1 = [7,null,10,false,11] let arrval1 = arr1.filter(Boolean) console.log(arrval1) let arr2 = ['rakesh',null,,0,100,'patel'] let arrval2 = arr2.filter(Boolean) console.log(arrval2)

Pass the Boolean to Array.filter as the first argument.

HTML Tags, which does not require CSS or JS

(1) The <details> tag is used to create an interactive widget that the user can open and close. By default, the widget is closed. When open, it expands and displays the content within. The <summary> tag is used in conjunction with <details> to specify the details of a visible heading. 

 Here is an example:- <details> <summary>Loram Ipsum</summary> <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum. </p> </details>

Output

Loram Ipsumis simply dummied

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.

---

(2) Tag <picture>
The <picture> tag gives you flexibility in specifying image resources. This tag is used in responsive designs. As it allows you to use multiple images of different sizes to nicely fill the browser viewport, so you don’t need to use one image that is scaled up or down based on the viewport width.
The <picture> element contains two tags: one or more <source> tags and one <img> tag.

Here is an example

<p>Resize the browser window to load different images.</p> <picture> <source media="(min-width:650px)" srcset="https://images.freeimages.com/images/large-previews/106/photographer-1464286.jpg"> <source media="(min-width:465px)" srcset="https://images.freeimages.com/images/large-previews/fd2/photographer-1436459.jpg"> <img src="https://images.freeimages.com/images/large-previews/579/my-camera-1-1435207.jpg" alt="Flowers" style="width:auto;"> </picture>

Output:

Resize the browser window to load different images.

---

(3) Tag <template>
The <template> tag is a container to hold some HTML content hidden from the user. This hidden content can be displayed by Javascript.

Here is an example

<h1>The template Element</h1> <p>Click the button below to display the hidden content from the template element.</p> <button onclick="showContent()">Show hidden content</button> <template> <h2>Image</h2> <img src="https://images.freeimages.com/images/large-previews/106/photographer-1464286.jpg" width="214" height="204"> </template> <script> function showContent() { var temp = document.getElementsByTagName("template")[0]; var clon = temp.content.cloneNode(true); document.body.appendChild(clon); } </script>

The template Element

Click the button below to display the hidden content from the template element.

Resets CSS for all browser default values

 

The CSS code snippet below resets all browser default values and makes your CSS codes work in the same way in all browsers and neutralizes browser incompatibility.

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; } body { line-height: 1; } ol, ul { list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ‘’; content: none; } /** * remember to define focus styles! */ :focus { outline: 0; } /** * remember to highlight inserts somehow! */ ins { text-decoration: none; } del { text-decoration: line-through; } /** * tables still need ‘cellspacing=”0"’ in the markup */ table { border-collapse: collapse; border-spacing: 0; }

Input type = number, remove the arrow at the end

Input type = number, remove the arrow at the end

Example:

Without class

With class

<style> .no-arrow::-webkit-outer-spin-button, .no-arrow::-webkit-inner-spin-button { -webkit-appearance: none; } </style> <input type="number" /> <input type="number" class="no-arrow" />

Online status when working from home !! with Python Script

Run this program and your cursor will move regularly enough to keep your online status when working from home!

//install PIP, you need to type into the terminal

curl https://bootstrap.pypa.io/get-pip.py -o get-pip.py
python get-pip.py

pip --version

// Is used to control the mouse and keyboard.

pip install pyautogui

//Code to move mouse every 2 second of sleep.. moveRel(x,y) -- move by pixel

import pyautogui;

import time;

while True:

    pyautogui.moveRel(0, 10)

    time.sleep(2)

Sharepoint Online: Read user profile details.

Read current login user profile details in Sharepoint Online.

function getUserProfile(){ var urlString = _spPageContextInfo.webAbsoluteUrl + "/_api/sp.userprofiles.peoplemanager/GetMyProperties"; var call = $.ajax({ url: urlString, type: "GET", dataType: "json", headers: { Accept: "application/json;odata=verbose" } }); call.done(function (data,textStatus, jqXHR){ var Name = data.d.DisplayName; var email = data.d.Email; var oneUrl = data.d.PersonalUrl; var imgUrl = data.d.PictureUrl; var jobTitle = data.d.Title; var profUrl = data.d.UserUrl; }); call.fail(function (jqXHR,textStatus,errorThrown){ alert("Error retrieving Tasks: " + jqXHR.responseText); }); }//getUserProfile

Application lifecycle management (ALM) of SPFx Client Side Web Part

 

Dropdown list with multi-select checkbox

 

JavaScript

let checkList = document.getElementById('ddList1'); checkList.getElementsByClassName('anchor')[0].onclick = function(evt) { if (checkList.classList.contains('visible')) checkList.classList.remove('visible'); else checkList.classList.add('visible'); }

CSS Style

.dropdown-check-list { display: inline-block; } .dropdown-check-list .anchor { position: relative; cursor: pointer; display: inline-block; padding: 5px 50px 5px 10px; border: 1px solid #ccc; } .dropdown-check-list .anchor:after { position: absolute; content: ""; border-left: 2px solid black; border-top: 2px solid black; padding: 5px; right: 10px; top: 20%; -moz-transform: rotate(-135deg); -ms-transform: rotate(-135deg); -o-transform: rotate(-135deg); -webkit-transform: rotate(-135deg); transform: rotate(-135deg); } .dropdown-check-list .anchor:active:after { right: 8px; top: 21%; } .dropdown-check-list ul.items { padding: 2px; display: none; margin: 0; border: 1px solid #ccc; border-top: none; } .dropdown-check-list ul.items li { list-style: none; } .dropdown-check-list.visible .anchor { color: #0094ff; } .dropdown-check-list.visible .items { display: block; }

HTML

<div id="ddList1" class="dropdown-check-list" tabindex="100"> <span class="anchor">Select Items</span> <ul class="items"> <li><input type="checkbox" />Item 1</li> <li><input type="checkbox" />Item 2</li> <li><input type="checkbox" />Item 3</li> <li><input type="checkbox" />Item 4</li> <li><input type="checkbox" />Item 5</li> <li><input type="checkbox" />Item 6</li> <li><input type="checkbox" />Item 7</li> </ul> </div>

Style hr tag with CSS

The HTML <hr> tag represents a Horizontal-rule and its miles used for web page smash thru line. It creates a horizontal line, which makes a person recognize that there's a quit of the web page or a sentence smash.
We also can layout the hr (horizontal-rule) tag to create an appealing user interface.

Following are the 2 CSS style for reference

Style 1:

---

hr.style-1 { border: 0; height: 1px; background: #333; background-image: -webkit-linear-gradient(left, #ccc, #333, #ccc); background-image: -moz-linear-gradient(left, #ccc, #333, #ccc); background-image: -ms-linear-gradient(left, #ccc, #333, #ccc); background-image: -o-linear-gradient(left, #ccc, #333, #ccc); }

Style 2:

---

hr.style-2 { border: 0; height: 0; border-top: 1px solid rgba(0, 0, 0, 0.1); border-bottom: 1px solid rgba(255, 255, 255, 0.3); }

Style 3:

---

hr.style-3 { height: 30px; border-style: solid; border-color: black; border-width: 1px 0 0 0; border-radius: 20px; } hr.style-3:before { display: block; content: ""; height: 30px; margin-top: -31px; border-style: solid; border-color: black; border-width: 0 0 1px 0; border-radius: 20px; }

SharePoint REST API with fetch().then() and Ajax()

Using ajax

$.ajax({ url: "https://mysite.sharepoint.com/_api/web/lists/getbytitle('list')/items(" + id + ")", method: "GET", headers: { "Accept": "application/json; odata=verbose" }, success: function (data) { console.log(data.d.results); } });

Using fetch() and then()

payload = { method: 'GET', headers: { "Accept": "application/json; odata=verbose" }, credentials: 'same-origin' // or credentials: 'include' } fetch("https://mysite.sharepoint.com/_api/Web/Lists/GetByTitle('list')/items?$select=ID,Title", payload) .then(response => response.json()) .then((data)=>{ console.log(data.d.results) })

Top 8 Best Open Source Development Tools

Photo by Lewis Kang'ethe Ngugi on Unsplash

There are a number of popular open source development tools available for use within the software development process. Many of these tools have similar features and offer a variety of different approaches to software development. It can be difficult to know where to begin looking when it comes to choosing the right open source development tool for you.

What makes for a good development tool?

There are a few key features that top developer tools should have:

• Should have good documentation
• Integrates well with another tooling
• Saves you time
• Regular releases and updates
• Good community

8 best open source development tools

We’ll go over the top open-source development tools you should be using in 2022. Without these tools, the work we do, the deadlines we hit, the bugs we find and squash before release would be impossible.

1. VS Code

Visual Studio Code

Visual Studio Code is a lightweight, yet powerful source code editor that runs on your desktop and is available for Windows, macOS, and Linux. It has a large ecosystem of extensions for other languages (such as C++, C#, Java, Python, and PHP, to name a few). It has built-in support for JavaScript, TypeScript, and Node.js, as well as a rich ecosystem of extensions for other languages.

Why VS Code?

VS Code is the best from a feature-point-of-view, UX-wise, and extensions-wise. VS Code is also constantly improving. Every month, it releases new functionality and improvements.

• Time-saving: 8/10
• Documentation: 9/10
• Integrations: 10/10
• Community: 8/10
• Release/Updates: 10/10

2. Budibase

Budibase

A low-code platform, Budibase brings everything together to create internal tools and custom business apps, including dashboards, administration panels, approval apps, customer portals, and everything in between. You can quickly convert data and processes into powerful internal tools.

Why Budibase?

Budibase allows users to self-host their apps on their own infrastructure. Using automated tasks, users can automate email notifications, trigger webhooks, and send a report. Budibase exports real single-page applications that provide end-users with a better, more performant experience.

• Time-saving: 10/10
• Documentation: 6/10
• Integrations: 8/10
• Community: 7/10
• Release/Updates: 10/10

3. Snyk

Snyk

Snyk is a developer-first platform for building cloud-native applications securely. It also helps and encourages developers to mitigate open source vulnerabilities during development by providing assistance.

Why Snyk?

Software composition analysis is a terrible ordeal. I don’t know anyone who enjoys doing it. Snyk, on the other hand, makes it easy. It supports all the major IDEs, auto-remediation of security vulnerabilities, and visualization of dependencies.

• Time-saving: 7/10
• Documentation: 9/10
• Integrations: 9/10
• Community: 8/10
• Release/Updates: 7/10

4. PostHog

PostHog

PostHog is a product analytics platform developed for big businesses. It is open source, and it has a broader vision of the tools required to make a product succeed.

Why PostHog?

PostHog can be integrated into your infrastructure and provide a variety of monitoring tools to enhance your product, such as session recording, heatmaps, and feature flags. The Posthog community and team are fast and helpful.

• Time-saving: 6/10
• Documentation: 7/10
• Integrations: 6/10
• Community: 8/10
• Release/Updates: 7/10

5. Prisma

Prisma

Prisma is an open-source next-generation ORM. It consists of the following parts:

Prisma Studio: An interface to view and edit data in your database

Prisma Client: Auto-generated and safe query builder for Node.js & TypeScript

Prisma Migrate: Migration system

Why Prisma?

Prisma’s type-safe API is straightforward to use across the frontend and backend, as well as being easier to understand and maintain.

• Time-saving: 6/10
• Documentation: 8/10
• Integrations: 8/10
• Community: 9/10
• Release/Updates: 8/10

6. Gitlab

Gitlab

In addition to the DevOps lifecycle, GitLab spans the entire software development process. There are likely a multitude of applications in your DevOps process if you aren’t using GitLab. These layers take time to integrate, manage, configure and maintain, slowing down your team and deployments. A single application will speed up your workflow and help you create better software faster.

Why Gitlab?

Gitlab has additional features that GitHub does not, including code analytics, service desk, design management, and time tracking. Gitlab is excellent at package management because it enables teams to manage containers, package dependencies, and create artifacts with minimal effort. The private, container and package registry are built-in and preconfigured out-of-the-box to work seamlessly with GitLab source code management and CI/CD pipelines.

Time-saving: 9/10
Documentation: 10/10
Integrations: 9/10
Community: 9/10
Release/Updates: 8/10

7. Storybook

Storybook

A storybook is a tool for UI development. It makes development faster and easier by isolating components, allowing you to work on one component at a time, and eliminating the need to start up a complex dev environment or store specific data in your database. As a result, you can develop entire UIs without starting up a complicated dev stack, forcing certain data into your database, or navigating your app.

Why Storybook?

All popular frontend frameworks, including React, Vue, and Svelte, are supported by Storybook. It has a large community and an extensive add-on library. However, the most important thing is that it allows us to present our components in an isolated environment. Developers are also more aware of the components at their disposal, resulting in less duplication and overuse.

Time-saving: 4/10
Documentation: 8/10
Integrations: 9/10
Community: 9/10
Release/Updates: 7/10

8. Supabase

Supabase

Supabase is an open-source Firebase alternative. It is a suite of open-source tools stitched together to build a seamless developer experience.

Why Supabase?

Supabase comes with a host of functions, including authentication, storage, and more. Another advantage is that Supabase’s open source competitor Firebase charges for API calls, which makes paying at the end of the month a bit uncomfortable.

Time-saving: 5/10
Documentation: 6/10
Integrations: 6/10
Community: 10/10
Release/Updates: 9/10

Credit goes to Resource : Top 8 Best Open Source Development Tools | Medium

JavaScript - Inheritance of Methods and Properties

Selecting Elements

Selection of the elements using document

• document.documentElement
• document.head
• document.body

Query selection

• document.querySelector(‘.header’) // only select 1 element
• document.querySelectorAll(‘.section’) // all element with class section
• document.getElementById(‘section1’) // you can find element by ID
• document.getElementsByTagName(‘button’) // all element by tag – this is live collection
• document.getElementsByClassName(‘btn’) // all element have class btn

Creating and Inserting elements

• .insertAdjacentHTML // use to insert first in element
• document.createElement(‘div’) // create DOM in javascript, you can append or insert in your page.
• .prepend() // add element as first child
• .append() // add element as last child
• .before() // add before the element
• .after() // add after the element
• .remove() // delete the element

Important to know about Class

const logo = document.querySelector(‘.nav__logo’); // element

• logo.classList.add(‘a’, ’b’) // add class to element
• logo.classList.remove(‘a’, ‘b’) // remove class
• logo.classList.toggle(‘c’) // toggle
• logo.classList.contains(‘c’) // this will check if class is present in the element or not

2 Useful tricks in Windows for Screen Recording and Voice Typing

Recently found 2 useful tricks that help me a lot in my day-to-day work.

1) Instantly record your screen, just press (Win + Alt + R) 

2) Easy to voice type and detect your work, just press (Win + H), and a detecting bar will appear on top. now just talk to your system, and it will type for you.

Hope this will make your life easy.  😉

Retrieve more than 5000 items from SharePoint List

I actually have struggled with masses even as my list is getting large and want to retrieve the rows more than 5K. Here I located the answer is to apply the Recursive call to retrieve more than 5K items.

let url = _spPageContextInfo.webAbsoluteUrl + "/_api/web/lists/getbytitle('MyList')/items?$top=1000"; let response = response || []; // this variable is used for storing list items function GetListItems(){ return $.ajax({ url: url, method: "GET", headers: { "Accept": "application/json; odata=verbose" }, success: function(data){ response = response.concat(data.d.results); if (data.d.__next) { url = data.d.__next; GetListItems(); } }, error: function(error){ // error handler code goes here } }); }

Here we're doing the recursive call to the GetListItems() function. This will fetch information withinside the bunch of a thousand objects and concatenate it to the response variable.

Here data.d.__next includes the URL to get the next set of items. In case we don’t have more items left to fetch, it'll not call GetListItems() function.

Hope many of us will find this helpful.

Getting an Access Token for SharePoint Online

Prior to SharePoint 2019, SharePoint Administrators, SharePoint Developers, and Power Users could use SharePoint Designer for no-code workflow development. With the release of SharePoint 2019 and SharePoint Online, modern process automation is developed through Microsoft Flow. SharePoint Online leverages modern tools, like PowerApps and Flow for forms and workflow deployment.

As with the SharePoint 2013 workflow, developers can execute REST calls to accomplish workflow actions. To test REST calls that will be executed in a Flow, a tool like Postman can be leveraged.  To successfully send REST calls, an access token will need to be obtained from Microsoft Azure Access Services. The below steps detail the process of obtaining an access token.

To begin, copy the text in the below box into a notepad.  This text is generalized headers for the body of the HTTP Post request to retrieve the token. The text in bold will be replaced as the steps to obtain the token are followed.

grant_type=client_credentials
&resource=00000003-0000-0ff1-ce00-000000000000/TENANT-NAME.sharepoint.com@TENANT-ID
&client_id= GENERATED CLIENT-ID@TENANT-ID
&client_secret= GENERATED CLIENT-SECRET

Step 1 Register an App

Navigate to https://[TENANT -NAME].sharepoint.com/_layouts/15/appregnew.aspx

1. Open notepad
2. Click Generate next to Client ID
3. Copy the generated Client ID
4. In notepad, replace the bold GENERATED CLIENT ID text with the copied generated client id
5. Click Generate next to Client Secret
6. Copy the generated Client Secret
7. In notepad, replace the bold GENERATED CLIENT SECRET text with the copied generated client secret
8. Update App Domain with google.com
9. Update Redirect URL with https://localhost/
10. Click Create

Step 2 Grant APP-Only permission to the APP

1. Navigate to https://[TENANT-NAME].sharepoint.com/_layouts/15/appinv.aspx

Note: Client Id generated during APP registration appended with an @, followed by the Tenant ID

2. Paste the value of “Client Id:” from the notepad in the App Id field
3. Click Lookup
4. Update the Permission Request XML: field the below values:

<AppPermissionRequests AllowAppOnlyPolicy="true"><AppPermissionRequest
Scope="http://sharepoint/content/sitecollection/web"
Right="Read"/></AppPermissionRequests>

 5. Click Create

Step 3 Get access token

1. Navigate to Site Setting > App Permissions
   1. Locate the APP identifier that contains the Client Id generated during APP registration. The GUID on the right side of the @ is the Tenant ID. (You will need the Tenant ID in 3 places during the request build process)
      1. https://accounts.accesscontrol.windows.net/[Tenant ID]/OAuth/2
      2. Resource Header
      3. client_id Header

Update the Post Request Body in Notepad

In notepad, update the text as detailed below:

Key	Value	Notes
grant_type	client_credentials
resource	[SharePoint Online application principal ID]/[Tenant-Name].sharepoint.com@[Tenant-ID]	[SharePoint Online application principal ID] is always 00000003-0000-0ff1-ce00-000000000000   [Tenant-Name] with the tenant value as it appears in the sharepoint.com URL for the tenant [Tenant-ID] was obtained on Site Setting > App Permissions The GUID on the right side of the @ is the Tenant ID   The / and @ are literal values. Use them where specified
client_id	[Client-ID]@[Tenant-ID]	Obtain this value by doing the following Site Setting > App Permissions Locate the APP identifier that contains the Client Id generated during APP registration. Copy everything to the right of | (pipe) character.
client_secret	The client secret that was generated during APP registration

Build the Post Request URL

To obtain the access token, send a POST request to Microsoft Azure Access Control Service (ACS) account associated with Tenant. The URL is in the following format:

https://accounts.accesscontrol.windows.net/[Tenant-ID]/tokens/OAuth/2

[Tenant-ID] was obtained on Site Setting > App Permissions The GUID on the right side of the @ is the Tenant ID

1. Open Postman
2. Create a new Post Request
3. Enter the updated ACS URL in the address field

Build the Post Request Header

Key	Value
Content-Type	application/x-www-form-urlencoded

Paste the Body Text

Copy the updated Body text from the notepad into the Body of the postman request.

View the Post Response

On success, the response body will contain an access-token key.

References

https://anexinet.com/blog/getting-an-access-token-for-sharepoint-online/

https://docs.microsoft.com/en-us/sharepoint/dev/sp-add-ins/add-in-permissions-in-sharepoint

https://docs.microsoft.com/en-us/sharepoint/hybrid/configure-server-to-server-authentication