Not so fast… As announced at the May the 4th event there are a lot of new technologies that come to SharePoint and you can pick your personal flavored framework to enhance the SharePoint.
Some things of the upcoming changes are already available in Office 365. Things like the hidden web parts or the new document library. Time to rip the components of the new document library apart and show you what was used to build it.
The new document libraries are built with the following three core components:
In addition a React-based implementation of Office UI Fabric will become available together with the new SharePoint Framework.
Microsofts favorite tool nowadays is a script library named React. For example, Microsoft Delve was built using this library. You can find more information on that on Medium by the product team how they built this delve experience.
To be able to bind data to the controls KnockoutJS used. It is a framework that follows the MVVM (Model-View-ViewModel) pattern. A pattern invented by Microsoft and first used in Windows Presentation Foundation and Silverlight.
Already familiar with WPF or Silverlight Development? Then you might find it pretty easy to get started developing KnockOutJS too.
In case of the document library KnockoutJS handles all the user interaction and data binding of the SharePoint data and updates the React base user interface components. React and KnockoutJS is a common combination in modern web development.
In case of the document library you have many files and components responsible for the proper rendering. As mentioned before the dependencies will become a true nightmare, but solvable through RequireJS and clean modules and dependencies you can define.
That is basically all the core tools used to build the new user experience of the document libraries.
New components: ODSP-next and Office React UI
Now to the fun part and actually the components Microsoft built. While browsing the files that will be loaded on a document library. Mainly two components caught my attention. In the requiredJS definition some are stored in a folder “ODSP-next” and the other main reference point to a folder named “Office-React-UI”.
Just a wild guess and speculate. ODSP-next stands for “Offie Development SharePoint next generation”. So it provides all the components to access data from SharePoint plus include some special user interface components or at least the data bindings for the document library. You will find things like uploader, taxonomy picker, people picker, video player and many things more. You also find “RecentDocumentsViewModel” there. A strong indication that it contains all the code built with KnockoutJS doing the plumbing between the data and the user interface. I might be wrong, but I think it makes sense.
The more interesting references from my point of view are the references that start with “@ms/office-ui-fabric-react/lib/components/”. The Office UI Fabric built on React maybe?
How do I come to this conclusion?
You can find several references to the @ms. If you watch carefully introduction of “Open and Connected Platform: The SharePoint Framework” that Dan Kogan did, you will find a reference to the “@MS” in the URL of his browser. Actually, it is curious to see that the folder “node_modules” is exposed in the URL too. Normally you won’t do such thing and map the folders to another URL in the web server configuration. On the other hand it is an early version of the framework and I guess it was already changed in the SharePoint Framework.
Another reference you find to this “@MS” prefix is on a Chris O’Briens blog post on “Understanding the web part manifesto, bundle.json and other key files and folders in the SharePoint Framework“. He also exposed the “@ms” reference there.
All these information I fetched from the document library align perfectly with the few official available.
In the latest episode of the cloud show Andrew Connell and Mark Anderson had a really great talked about the new SharePoint Framework. I can really recommend to take your time and listen to their conversation on this new hot topic.
I also share their concerns on the not really well chosen communication strategy at the “Future of SharePoint” event. Personally spoken I don’t like to know what’s coming until I can get my hands on.
In the mean time at least I can try to figure out how some of the new things have been built. One benefit of client side applications.
Finally, now I assume that a React based Office UI Fabric version will be provided by Microsoft.
Mark Anderson made clear that React or Knockout are a requirement for your future development. It’s a promise that Microsoft gage that you can use whatever you like in the new SharePoint Framework.
If you already choose Angular as your weapon of choice you might use “ng-Office-UI” fabric. One thing is for sure you have to broaden your skill set with some of the web development techniques.