I am pretty excited on the last weeks launch of hTWOo. It is time to show you how to get started in the most simple possible way and how to add a simple themed button to your web part.
0 comment
HTWOO UI launched – Fluent Design in HTML and CSS
The best way to implement a design on the web is not to use fancy tools or marketing jargons. Every site and application is defined for 25 years by two fundamental technologies. HTML that gives our pages and application a structure. CSS that makes the look and feel and experience envisioned by design come to life. Both combined is all we see and interact on the web.
Happen so that no matter how many technological advancements we put in our code. HTML and CSS together is still the most performant web framework on the planet.
These two web technologies are the technological layer. I created a framework that implements Microsoft Fluent Design language.
How to make CSS Variables work in every web part context
In the recent blog post on how to make a web part works with different section backgrounds using CSS variables, I already covered. At the same time, this works perfectly for just regular web parts. There are specific scenarios, where this approach fails.
Develop SPFx web parts for different section designs using CSS
Over the last couple of days, I banged my head against the wall. I hate when things don’t work as expected. On the other hand, I love challenges.
The thing we are talking about the documentation on “Supporting section background“. To be clear, the documentation is correct. It works as described. The issue I and many others have with this documentation it does not apply to your project.
SharePoint Online Live Reload Application customizer released
In my last blog post on how to make live-reload possible in SharePoint Online. I mentioned the possibility to write an application customizer that one the connection to your local workbench. Now I released the first version of this tool.
SharePoint Framework and the Office UI Fabric grid system
A while a GitHub issue in the sp-dev-docs came to my attention, where someone had a problem titled as Can’t get grid system working using office fabric ui react. I took a closer look on why it is so challenging to get the grid system running right now and in SPFx projects in general. There are some catches you need to be aware.
Some of those issues are already documented in the a blog post on How to make your web parts responsive to the parent container or How to use Bootstrap in SharePoint Framework projects. Here is the rest of the story.
Office UI Fabric is somewhat like the first and foremost first third-party Framework that you may want to use in all your projects to create a seamless experience with the rest of the Office 365 platform. It is not exclusively to SharePoint or SharePoint Framework Projects.
Use `npm version` to upgrade the version of your SPFx solution
When you like to version your SPFx solutions correctly, then it is not enough to upgrade only the ‘package-solution.json’ in the config folder. You might also want to upgrade the ‘package.json’ file with a corresponding version number too.
‘gulp dist’ in SPFx? One command to create a clean solution package
Many projects that use gulp as the build system mostly implement a particular gulp task that is name ‘dist’ for distribution. This task package and bundle everything for production use.
Can we have a gulp task like this in SPFx too? Yes, we can have this too. First, let us take a look at the steps you need to do when you like to create a clean ‘sppkg’ file in the SharePoint Framework.
How to use specific NodeJS version with your SPFx project
Like I promised yesterday. You can even run a specific SPFx generator version with a specific NodeJS version through the help of NPM.
While it might not is a practical approach it can help you sometimes when you like to run for example an older version of the project to test some behaviour before you fix the issues.