We often get asked if it is possible to integrate Uno-WASM Web Applications with existing JavaScript components. Since WebAssembly code is running inside browser’s JavaScript context, the answer is “Yes” and it is actually quite simple to do it.

In this article we will explore how you can create interoperability (interop) between Uno-WASM managed code and JavaScript context of an application. The two sample apps with code we provide will help you understand how to use the integration in actual application code. For the purpose of the examples we will create an application using a well known date/time picker control called Flartpickr as well as syntax visualizer called PrismJS. In the end you will generate applications looking like this:

 

Leveraging the Uno.WASM Bootstrapper

At the heart of Uno-WASM, there’s a package called Uno.Wasm.Bootstrap (Uno Bootstrapper) project. It contains the tooling required to build, package, deploy, run and debug a .NET project in a web browser using WebAssembly.

HTML5 Is a Rich and Powerful Platform

Uno Platform fully embraces HTML5 as its display backend when targeting WebAssembly (WASM). As a result, creating hybrid HTML/Uno-WASM apps becomes easy. That also means application can reuse existing JavaScript components directly, often unchanged.

Access the power of HTML5 by reusing any package from npmjs becomes easy. For online applications, they can also be downloaded directly from a CDN like cdnjs.

Example of easily achievable integrations:

How-to Samples: Three Parts Documentation Tutorial

A three-parts hands-on documentation has been published to go further explaining how to create JavaScript/Uno-WASM hybrid applications.

If you are interested to learn more about Uno Platform consider registering for UnoConf – a free virtual conference on Aug 12, 2020 where our core team, community and Microsoft will discuss the latest from WinUI and Uno Platform world.

 

About Uno Platform

For those new to Uno Platform – it enables for creation of single-source C# and XAML apps which run natively on iOS and Android, macOS and Web via WebAssembly. Uno Platform is Open Source (Apache 2.0) and available on GitHub. To learn more about Uno Platform, see how it works, or create a small sample app.

 

Carl De Billy on Behalf or Uno Platform Team

Tune in Today at 12 PM EST for our free Uno Platform 5.0 Live Webinar
Watch Here