Article
20. December 2017
3 comments
by Stefan Bauer

How to use Bootstrap in SharePoint Framework projects

Many developers in the past have use Frameworks such as Bootstrap or Zurb’s Foundation, and from a pure developer perspective, it is clear why to use them. There is yet Office UI Fabric around, but with every new framework, you need to learn those frameworks specifics.

Because it is and was so famous for the use of SharePoint web parts you might like to update some of your existing web parts to the modern experience. Whatever the reason is might by you use it; there are some things to know before such framework can be embedded safely in SharePoint Framework projects.

[Read more]

Article
11. December 2017
0 comment
by Stefan Bauer

How to make your web parts responsive to the parent container

The modern experience is responsive by default, but it doesn’t mean that your web part will be. Especially with the new team sites and communication sites, the behaviour of web parts is as tricky as it ever was. Office UI Fabric doesn’t help you to achieve a significant user experience because it is out of their scope and offers only smaller components or full-page scoped methods, but nothing in between as needed as in web parts.

The surrounding design of a web part, for example, is defined by Office UI Fabric and even the grid system is provided by that toolkit.
When you write a web part, you might worry more about how the same web part behaves in different containers already defined by the overall page design in SharePoint.

Time to show you a trick how this container pages optimisation is possible in the SharePoint Framework and show the basics.

[Read more]

Article
3. December 2017
3 comments
by Stefan Bauer

How to better control CSS class naming in SPFx

CSS is currently not capable of scoping the design only to a component on a web page. It is just possible through different class names for elements on the page. To avoid the inference of same style sheet classes on the same page, SPFx post-fix every class name used in the web parts CSS files. There are also hidden gems that allow you to change this behaviour dynamically as required and sometime the class names shouldn’t be renamed at all cost. Enough about the theory lets take a closer more detailed look.

[Read more]