I tried to create SharePoint Framework with the extension provided by SharePoint PnP. It is very easy to create a SharePoint Framework Web Part in Visual Studio.
Developer need to first fulfill the Pr-requisites
- Set up your Office 365 tenant
- Set up your development environment
- Install the extension in Visual Studio:
After installation of these pre-requisites , You will be ready to create new Web Part with SharePoint Framework. Here is simple steps to create a small web part:
Open Visual Studio 2015 / 2017 & Create new project. Here you need to go to the SharePoint templates category and then select SPFx Web Part Project.
You must provide solution name & Project Name. This solution name will be shown in next dialog box. Now hit OK.
Now one new form will be popup. Here you have to select Framework, Put Component Name, Component Description and at last a check box .
At last you have to just hit “Generate” button. It will take a while to create new project with the Web Part with SharePoint Framework. After creating the project, it will also show you the log file.
Now how to run this project without making any changes . Juts press F5 key to run this project.
F5 command will launch the demo in command prompt with “Gulp Serve” command. You can also modify this command. If you want to change this command , Right click on your project & then go to “Properties”. In the Properties pane, go to Debug, Here you can modify command parameter for gulp.
Now lets run this project in local workbench first. Just hit F5. Gulp task will start & run the workbench.
Here is our web part. Now you just need to click on this web part to add in this page. It will look like :
It is very easy.
Url for local workbench : https://localhost:4321/temp/workbench.html
Url for SharePoint Online workbench : https://<<SiteUrl>>/_layouts/15/workbench.aspx