Last week I had the great honour to talk with friend Andrew Connell about my newest project, hTWOo UI, on the Microsoft Cloud Show. I highly recommend listening to this podcast in general but in specific this episode.
We talked about the ideas and concept behind hTWOo, Fluent Design and the current problem developers facing. Especially why it is a suitable alternative for your development on the Microsoft 365 platform.
While working on a side project, I asked myself the interesting question if it would be possible to use SVG in CSS as a background image.
It is relatively simple if you use the SVG as an external file, but what if the object of the background is simple and I like to use it directly as an SVG is CSS.
In the past, I always base64 encode the source of the SVG image, which is not needed.
I firmly believe that the Yeoman generator provided by Microsoft is a great tool. It serves all the capabilities to create new web parts, extensions and customisations in the future. With the current support of ReactJS, Knockout and bare-bone HTML version, you have three great possibilities.
This PnP/SPFx generator project goes beyond these possibilities and supports enhanced functionalities. A way to add additional capabilities in the future not even for new frameworks and libraries on the market. It also helps organisations to defined their development standards.
You might have recognised that the workbench of the SharePoint Framework has a responsive design tester included. In this blog post, I take a look what possibilities we have to properly test the responsiveness and the user experience of a web part.
There are also some pitfalls included if you entirely rely on the integrated too.
The new SharePoint Framework has a smart way to avoid conflicting CSS definitions. Therefore all style sheet classes will be post-fixed with a unique random string and converted to a JSON object. In your web part code, you can use the same class name as you used in your style sheets and the variable will be automatically replaced with the random class name string. So far the good parts of the SharePoint Framework.
In practice, this has some limitations and challenges.
I believe one on the most used front end tools in the web development world is out there is Moustache or Handlebars. It is easy to use; you can write native HTML and compelling too.
In the SharePoint world, many web parts directly show data on the page, and therefore this is the right weapon of choice to get fast going.
Right after the first version of SPFx become public available, I created a ticket in GitHub on how to use this front end tool. With the RC0 drop of the framework, a new functionality has become available that allows you to embed Handlebars through a so-called webpack loader. I was pretty excited when Pat Miller tweeted me about this.