Mobile vs. Desktop CSS switch for Web app with Server Side rendering

When modern web application is built using Server Side Rendering (SSR) or Static Site Generator (SSG) technology it is hard to decide which version, Mobile or Desktop, should be served.

If you are not planning to have separate domains or subdomains for mobile-first and desktop-first versions of your Web App, here is a useful trick:

  // In main App or Layout component add following:

  const isMobile = useMediaQuery({ maxWidth: 767 }); // From any library

  useEffect(() => {
    if (isMobile) {
      document.body.classList.remove('onDesktop');
      document.body.classList.add('onMobile');
    } else {
      document.body.classList.remove('onMobile');
      document.body.classList.add('onDesktop');
    }
  }, [isMobile]);

This is sample for React library, but can be easily implemented for any other frontend framework.

The idea is simple: to have .onMobile or .onDesktop CSS class modifier for the <body> tag

In that case mobile specific styles are .onMobile .abc {...} and desktop CSS is .onDesktop .abc {...}

Happy hacking 🙂

Great tool to generate WMI queries

If you are planning to work with System.Management Namespace in the .NET framework, especially with ManagementObjectSearcher, ManagementObjectCollection, and ManagementObject classes, to perform different Windows Management Instrumentation (WMI) queries, take a look on WMI Code Creator tool by Microsoft.

Without this free utility, you’ll spending lots of time to test your WMI queries via console or other debugging methodology.

Using the WMI Query Builder you can browse WMI namespaces, execute methods and receive WMI events. Also you can automatically generate a working source code to perform WMI queries, either C# or Visual Basic.

Moreover, you can modify and run these management scripts by pressing a single button! Visual Studio is not required for that 🙂

Research and Destroy!

"Research and Destroy" is a computer geek joke. It is a misrepresentation of Research and Development (aka R&D) term into something scary and funny.

There is a grain of truth in every joke! A small mistake in software development process, especially for public products, could destroys lots of things at once!

BTW, BgRnD abbreviation contains the similar meaning 🙂