Before you want to develop anything on SPFx component (Webparts or Extensions) I suggest check out two following links on the PnP Open Source. Look/find for the component which meets your need “as is” or if you want to extend the component.

https://aka.ms/spfx-webparts & https://aka.ms/spfx-extensions

To research the inner working of the component you can follow few simple steps to deploy the desired component to your demo tenant.

Step # 1: Fork the PnP repository of WebPart or Extensions based on the need.

https://github.com/pnp/sp-dev-fx-webparts/ OR https://github.com/pnp/sp-dev-fx-extensions/

Step # 2: Please add the following two secret variables.

adminUsername = admin@{TENANTNAME].onmicrosoft.com
adminPassword = [your password]

Step # 3: In your new forked repository click on the Actions to create a new workflow. Copy the following content to the GitHub Actions YAML file.

https://raw.githubusercontent.com/pankajsurti/sp-dev-fx-webparts/master/.github/workflows/build-deploy-spfx-webparts.yml

Step # 4: Now look for the following line with the highlighted text and replace the sample name you want to deploy. e.g. the following setting will deploy ‘react-directory’.

SAMPLE_TO_BUILD_DEPLOY: './samples/react-directory'