Web Components, Angular and SPFx

An exciting announcement from the Angular team during the Angular Mix event last month has brought lot of attention around the SharePoint community.

Lets try to understand what this is all about.

What are Web Components ?

These are simple widgets that allow us to bundle markup and styles into custom HTML elements. They are not tied to any framework- purely built with HTML, CSS, and JAVASCRIPT.

To understand it easily, imagine them as web parts that we could add into any SharePoint page. These components can be plugged into any piece of existing HTML adding few lines of code.

If you are interested to know more about web components, like custom elements and Shadow DOM , this is a neat blog from css-tricks, where it is explained in detail.

BTW, most of the major browsers have pretty much good support for the web components or at least one can use webcomponents.js as polyfill.

So, in a nutshell, if you convert your widget / web part as a Web Component, then you will be able to run it pretty much everywhere, which is pretty awesome.

web_component

 

Integrating Web Components into JS Frameworks

Did you know that these web components could be integrated into the framework of your choice?

The new Angular and Vue frameworks score full points in utilizing all the web component capabilities, although React is not quite there yet.

This enables you to create your widget and utilize them in your Angular or Vue projects. This also allows you to pass attributes to your widget, have custom properties utilized and even trigger events.

web_component angular

How do you create Web Components?

To be super quick in creating Web Components, Polymer library created by Google, has done much of the heavy lifting. They have also created a bunch of  ready to use custom elements that are maintained in their Github.

You can even create Web Components using Vue.

But wait… what if you can create them using Angular too?

If you are that person who loves Angular and had problems with Angular integrating into the SPFx model, the new feature named Angular Elements that came out as part of the Angular Labs would definitely help.

This was taken a step forward when Rob Wormald from Google, during the European SharePoint Conference 2017, explained how Angular Elements could be used in a SharePoint SPFx web part.

Keep it coming…

All these announcements should help us plan better for future SharePoint developments.

I think this is the best part of SPFx, where it allows you to embrace the awesomeness that happens in the outside world.

Advertisements
SharePoint 2013

SharePoint Framework Developer Preview released

Microsoft released the developer preview for SharePoint Framework.

It’s all in Github now – https://github.com/SharePoint/sp-dev-docs/wiki

If you are new to this, watch the official Microsoft statement to get some heads up  – https://blogs.office.com/2016/05/04/the-sharepoint-framework-an-open-and-connected-platform/

Also note that SharePoint Framework web parts are not supported for production use yet.

So just be ready guys !!!

Microsoft joins IFTTT like automation

Microsoft has introduced an exciting automation procedure called Microsoft Flow – https://flow.microsoft.com/en-us/

You can relate this to IFTTT where you can connect all of your best apps to achieve amazing things. Who wouldn’t like to light up their house during sunset 🙂

Microsoft Flow allows you to connect your Office 365 accounts with services like Dropbox, Trello, Slack or Google Drive.

There are plenty of free templates which can get you started or you can create automation from blank.

Create your own recipes and enjoy 🙂

AppFabric 1.1 error while installing SharePoint Server 2013 prerequisites

SharePoint 2013

While installing the SharePoint Server 2013 prerequisites, you see the following error in the event log and the setup log:

Product: AppFabric 1.1 for Windows Server — Error 1722. There is a problem with this Windows Installer package. A program run as part of the setup did not finish as expected. Contact your support personnel or package vendor.  Action Env_PSModulePath_powershell_i, location: c:\Program Files\AppFabric 1.1 for Windows Server\Microsoft.ApplicationServer.InstallHelper.exe, command: powershell.exe “-command \”$str = [System.Environment]::GetEnvironmentVariable( \\\”PSModulePath\\\ “, [System.EnvironmentVariableTarget]::Machine); $str = $str+\\\”;c:\Program Files\AppFabric 1.1 for Windows Server\PowershellModules\\\”; c:\Windows\system32\setx.exe /M PSModulePath \\\”$str\\\”\ “” “C:\Users\Administrator\AppData\Local\Temp\AppServerSetup1_1_CustomActions(2014-5-15 11-08-45).log”

CAUSE
The PSModulePath environment variable is corrupted. There is a quotation mark at the end.

C:\Windows\system32\WindowsPowerShell\v1.0\Modules\;C:\Program Files (x86)\Microsoft SQL Server\110\Tools\PowerShell\Modules;c:\Program Files\AppFabric 1.1 for Windows Server\PowershellModules”

FIX
Delete the ending quotation mark and re-run the setup.

Original Official post here.

No more bimonthly CUs – July 2014 CU for SharePoint 2013 is out

SharePoint 2013

Microsoft has changed the plans for bi-monthly CUs. The CUs will be released on a monthly basis from now on. This means for all products that is being supported. Cool, eh!!

That means faster patches and updates to your products.

And so, the July 2014 CU for SharePoint 2013 has been released.

Visit the official blog for details.