SharePoint Framework – Part 5 (Development toolchain comparison)

Please read previous posts if you want to know about Development tools and libraries.

If you’re familiar with Visual Studio development with SharePoint, development toolchain carry a lot of similarities with the tools you may already be familiar with.

• .NET Framework:

The traditional Microsoft way of doing development is to build on the Microsoft .net framework. This is a runtime that knows how to run the program.

• Node.js:

Node js addressed those needs. A lot of the tools, modern web development world are built on top of the Node js.

• NuGet:

When building .NET applications, we use a tool called NuGet. To acquire pre build packages for use with our application.

• NPM:

We use a tool called NPM. It does the exact same thing. We will use this to get packages our customers need and our customization need like Angular, jQuery and other useful libraries.

• Visual Studio:

Visual Studio is Microsoft’s integrated development environment.

We want to create a new project – we use visual studios Project Templates to create files and folders scaffolding for the project.

Now for SharePoint Framework you can use any editor you want. But to get the folders and files scaffolding created for the project we use a tool called Yeoman.

• Yeoman:

You can install different project generators for Yeoman. Microsoft provides one for SharePoint Client-side Web Parts. That we will use the starting point of our project.

The next comparisons more about languages

• C#:

Most SharePoint developers building components assets. There web assets involved like HTML and JavaScript libraries. But most of the time people working with C#.

• TypeScript:

SharePoint Framework is exclusively a client-side thing and thus it must be JavaScript.

However, Microsoft has elected to strongly encourage the use of Type Scripts as the language of choice that will be converts files to JavaScript.

You know when you build a project in Visual Studio some process kicks of the compilation of project, may be it starts up another process with your app in it or attaches the debugger.

• MS Build:

That tools is called MS Build. That gets installed with Visual Studio.

Someone create task from his build, using a XML syntax to do such as compile the projects, compile the files, copy the files and fire up the process followed by attaching the debugger.

• Gulp:

The tool Gulp does the exactly same thing for us.

It allows you to write task using JavaScript and tell the Gulp to run those tasks for you.

In a traditional SharePoint project, You compile the project files and doing executable or Dlls.

In the Java Script world, we have a similar process where we want to merge multiple files into a single file for better performance and manageability.

• WebPack:

And the tool Microsoft selected for the SharePoint Framework is called Webpack.

You don’t need to be become an expert in all of this things. You may need them. Some you can install and ignore.

For example,

When you are building a traditional SharePoint project, you need to use MS Build but you really know that you are using it. Because Visual Studio is calling for you.

In my opinion you should be an expert in how to use NPM and Type Script.

Because type script is the language where you are going to write your code and ask for NPM – you need to get familiar with that is the tool which we are going to update your tool chain as well as find and install or update external libraries you are going to use in your projects.

But you can forget few things like: Node, Yeoman, Gulp and Webpack.

You can learn lot about them and customize them for use within SharePoint Framework. But you can be fine by just installing them and letting the tools Microsoft provides to run and configure them all for you.

In next post i will explain how this toolchain works.