Category Archives: SharePoint 2016

Note: As per Microsoft site, The SharePoint Framework is currently in preview and is subject to change. SharePoint Framework client-side web parts are not currently supported for use in production environments.

The SharePoint Framework (SPFx) is the next evolution in SharePoint development

Below are some steps required to setup new SharePoint Framework & Create your first client web part from you client PC

Install Yeoman

Yeoman is the modern scaffolding tool. It helps you kick-start new projects, and prescribes best practices and tools to help you stay productive.

Type npm install -g yo to install Yeoman

It is a good idea to check that everything is installed as expected by running commonly used Yeoman commands like below::yo –version

Install Gulp

Gulp is a javascript task runner that lets you automate tasks such as Bundling and minifying libraries and stylesheets,Refreshing your browser when you save a file,Quickly running unit tests, Copying modified files to an output directory etc.

Install the gulp command npm install –global gulp-cli

Install Yeoman SharePoint Generator

The Yeoman SharePoint web part generator helps you quickly create a SharePoint client-side solution project with the right toolchain and project structure.

Enter the following command to install the Yeoman SharePoint generator:npm install -g @microsoft/generator-sharepoint

Create a new Client side webpart by running Yeoman SharePoint Generator by running below commandyo @microsoft/sharepoint

When prompted:

What is your solution name? myFirstClientWebpart

Where do you want to place your files? Use current folder

what is your webpart name?Helloworld

what is your webpart description? Helloworld description

what framweork would you like to start with? (Use arrow keys to select)

At this point, Yeoman will install the required dependencies and scaffold the solution files along with the HelloWorld web part. This might take a few minutes.
When the scaffold is complete, you should see a Congratulations message.

Run application using Gulp

To run the application typegulp serve to play with it.

Open application in code editor

Use your favorite code editor to explore the new file structure and code
my recommendation is to use Visual Studio Code which is a lightweight but powerful source code editor from Microsoft which runs on your desktop and is available for Windows, Mac and Linux. It comes with built-in support for JavaScript, TypeScript and Node.js and has a rich ecosystem of extensions for other languages (such as C++, C#, Python, PHP) and runtimes

End of Initial Setup!

You are done!

Start experimenting new SharePoint development model and build amazing solutions.