SharePoint Framework: Prepare Yourself!

The shift from Microsoft’s proprietary framework to the open source SharePoint Framework will require learning and adopting of new technologies on the part of developers. Luckily, what knowledge the developer has gained will still be useful since the new API will not replace any of the existing models. In my previous installment SharePoint Framework: The Nuts and Bolts, an overview of what SharePoint Framework consists of and how it works was explained. In this installment, the focus is on how to prepare for the release of SharePoint Framework.

Understanding how SharePoint Framework is built is the key to determining which new technologies to learn. For each Microsoft tool, there is an equivalent web stack. The following table outlines the comparable of each web stack for each Microsoft tool:

Each webstack, just like each Microsoft tool, has a specific role in SharePoint Framework. We can break the web stack down into frameworks and user and application interfaces. Each tool can be found in the open source community, and in the community, many developers have contributed their own customized tools that are made available for others to use. The open source community is very collaborative, supportive and innovative.

Frameworks for Developing Web Apps:

Node.js is a runtime environment used for cross-platform development of applications and it uses the Google Chrome V8 JavaScript engine to interpret JavaScript. It uses an event driven, non-blocking I/O model rendering it lightweight and efficient for data-intensive, real-time applications that run across multiple devices.

npm is a node package manager developed for Node.js and is used to install node programs. It also simplifies the process of specifying and linking dependencies. npm is the largest ecosystem of open source libraries in the world. Developers can either build their own packages or use ones that are already available in the community.

Yeoman is the SharePoint Framework template engine which runs on top of Node.js. The templates used by the framework are downloaded from GitHub. The project structure with all the files and folders are created in Yeoman.

TypeScript is an open source language which was created by Microsoft and it is maintained by Microsoft. TypeScript is a typed superset of JavaScript. In Node.js, it compiles to plain JavaScript on any browser, host, operating system and in any JavaScript engine that supports ECMAScript 3 or newer. TypeScript is suitable for either client side or server side applications. For developers coming from C#, concepts like classes and objects are available in TypeScript, which makes it the easiest way to start developing with script languages. Other JavaScript libraries like jQuery will also work with the SharePoint framework, but importing them into the project is required.

Gulp is a task runner to automate processes built on Node.js. It keeps complex tasks manageable and simple and can be used to compile TypeScript or Less files, build web parts or uploading to the CDN.

User and Application Interfaces

React is a JavaScript library. It is used for creating user interfaces and expresses how your app, at any given point in time, should look. It automatically manages all UI updates when underlying data changes. As data changes, React conceptually hits the "refresh" button and updates the changed parts. React is about building reusable components and these components make code re-use, testing and separation of concerns simpler and streamlined.

ReST API (Representational State Transfer) is an interface that is provided by SharePoint. ReST API allows the performance of basic operations including creating, deleting, reading and updating through the exposure of all of the SharePoint entities and operations that are available in other SharePoint client APIs.

Office UI Fabric is the front-end toolkit that blends add-ins or apps seamlessly into Office including all web components, icons, fonts and styles used by Microsoft SharePoint and other Office applications. It is important to note that Office UI Fabric is not directly related to the SharePoint framework and it is not mandatory to use this to build the web parts. The advantage of implementing Office UI Fabric is the provision of familiarity to the end user – the Microsoft style of layout and application components.

As SharePoint continues to move in the direction of mobile, cloud based collaborative communication, the move to open source JavaScript in SharePoint Framework enables developers to extend SharePoint capabilities with creative, innovative and customizable solutions on the client side that is mobile ready and readily available across various devices and operating systems. In this position, SharePoint has created the opportunities for developers to share, create, innovate and sculpt the look and feel of SharePoint Framework.