SharePoint Framework (SPFx) - Setting up development environment

To set up the SharePoint Framework (SPFx) development environment step by step, follow these instructions:

Ensure you have Node.js installed on your machine. You can download the latest version from the official Node.js website (https://nodejs.org).

Download the appropriate version of Node.

Follow the instructions on the installation wizard

Click Finish once the installation is complete.

Verify the version of node on your computer. Go to command prompt and type: node -v

Install Yeoman and Gulp globally by running the following command in a command prompt or terminal:

Install Yeoman SharePoint Generator:

Create a new directory on your machine where you want to store your SPFx project.

Open a command prompt or terminal, navigate to the newly created directory, and run the following command:

You will be prompted to enter the solution name, description, SharePoint Online or on-premises version, and framework to use. Follow the prompts to set up your project. Choose the desired options based on your requirements.

To run the project locally, use the following command: gulp serve

This command will start a local development server, and you can access your SPFx project in your browser using the provided local URL.

To connect your project to a SharePoint site, run the following command: gulp trust-dev-cert

That's it! You have now set up your SPFx development environment. You can start developing and customizing SharePoint components using the SharePoint Framework.