This article was originally posted on https://www.codeproject.com/Articles/5268171/Migrate-Windows-Desktop-Apps-to-the-Web-with-wisej
Wisej brings a familiar desktop development experience to the web without losing any of its benefits.
This article covers: a case study that explores the challenges with line-of-business applications, migrating enterprise-scale applications to the web with Wisej, comparing Wisej to WinForms, and component library integrations for Syncfusion, DevExpress, and Infragistics.
Moving Windows Forms, WPF, VB6 or other legacy applications to the web can be hard and expensive. The migration roadblocks can be endless when evaluating current web technologies. If you’re the new guy tasked with rewriting the entire application in Angular or another web technology... good luck!
Wisej was built with this in mind. By taking the convenience of the WinForms object model and integrating many advanced JavaScript components, Wisej brings a familiar desktop development experience to the web without losing any of its benefits. Applications that originally could only run on Windows become available on every HTML5-compliant device in existence.
Developers considering migrating from Gupta Team Developer, VB6, and WinForms will have the option to keep their existing business logic, gain a greatly modernized UI, and the same workflow. Wisej and Ice Tea Group offer automated migration solutions for Gupta Team Developer, Visual Basic 6, and WinForms applications to a fully modernized web-based platform. Semi-automated migration paths are also available for Microsoft C++, Windows Presentation Foundation (WPF), Silverlight and Visual FoxPro.
Developers considering full-stack development tools for their projects will have the opportunity to leverage the scalability, flexibility, and security that Wisej has to offer.
Case Study: Challenges with Line-of-Business Applications
Today’s world of enterprise-scale business applications usually shows a feature-rich history of evolvement and enhancements, making the transition from Windows desktop to native web a difficult, risky, and sometimes unrealistic task. What are typical challenges and how does it work?
Let’s take a brief look at an example from the public sector:
Harris Local Government (part of the Constellation Software Group) decided to modernize 150 separate Windows modules developed in Visual Basic 6 to an integrated web-based platform. Harris serves more than 5,500 small and mid-sized municipalities with a wide variety of solutions such as vehicle registration, real estate, personal property, and utility billing. The software suite includes financial modules such as accounting, fixed assets, and payroll.
Figure 1 provides a screenshot from an existing desktop user interface built with VB6:
Figure 1: Harris Local Government application before modernization (Visual Basic 6)
Developing a complex enterprise-scale application from scratch is usually not an option that works. Here are typical obstacles to take into consideration:
- Time, effort, risk and cost of a manual rewrite are in many cases beyond consideration. An application with hundreds or thousands of forms and dialogs may take dozens of man/years to rewrite and test from scratch.
- There is a huge risk when doing a manual rewrite without the ability to take over business logic and code from the legacy application. Usually, algorithms and logic have been developed over decades and can deal with an infinite number of data input and output scenarios. The effort around quality assurance and testing for 100% backwards compatibility is enormous.
- The user base has been trained and accustomed to the existing application. Workflows, screens, and manuals should get a nice brush up and a fresh design, but the general functionality cannot be changed entirely, especially for ISVs with end-customer installations.
- Another limiting factor is R&D. Most companies cannot afford to maintain an existing application and build a new replacement over many years. The development team would have to be doubled. Programmers are hard to find and the experience and knowledge of “silver coders” is extremely valuable for software vendors.
Migrating Enterprise-scale Applications to the Web with Wisej
Thanks to Wisej and the consulting team of fecher (one of Ice Tea Group’s preferred implementation partners), 150 separate modules from Harris Local Government got turned into a great looking modern web application suite based on Microsoft .NET with C# and Wisej. Figure 2 shows the same window as before, now part of a modern UI with a new Navigation Bar and Tabbed MDI interface that was built to consolidate separate applications into one unified solution.
The modernization was completed in four phases:
- Visual Basic 6 projects got converted into C# projects.
- All projects got consolidated in a Visual Studio solution and rebased to use Wisej components.
- New navigation controls such as the sidebar on the left and the tab bar on the top have been built to support 150 different modules in the new integrated application suite.
- Based on the mockups of a UI/UX designer, the Wisej Theme Builder was used to provide a brand-new look and feel to the Harris Local Government application.
Figure 2: Great new look & feel after migration & modernization based on Microsoft C#/.NET with Wisej
Wisej Web Technology Stack for Business Applications of Any Complexity
Wisej is a Single Page Application (SPA) framework based on .NET for C# and VB.NET. It emphasizes the best of both worlds, desktop and web development, by taking controls that have a familiar look and feel to the web - modernized and enhanced. Imagine rewriting 1,000 screens (with 100,000 controls), 500 reports, 800 stored procedures, from scratch with the current web technologies and the resulting maze of templates, HTML, JS, and overlapping CSS, not to mention the naïve way of interacting with the server that may work for a real-estate web site but is utterly inadequate for the type of Line of Business (LOB) applications we see daily. With Wisej, it’s possible to migrate your existing business logic without any risky changes to the code base.
The best part of using Wisej? You won’t have to touch HTML, JavaScript, or CSS (if you don’t want to). Wisej has wrapped a full .NET control set spanning from simple buttons, combo boxes, and text boxes to more complex controls like data grids, data repeaters, ribbons or navigation bars. It’s as easy as picking a control from the Visual Studio Toolbox and dropping it on the page.
Wisej vs. WinForms Comparison
The development environment of WinForms and Wisej have a similar look and feel. With Wisej, you can drag and drop controls from the toolbox, double click to add event handlers, and wire properties the same as you would in WinForms.
Figure 3: Windows Forms Designer in Visual Studio
Figure 4: Pixel-perfect WYSIWYG design of Web-based applications in Visual Studio with Wisej
Styling Applications for a Modern Look & Feel
With Wisej there’s no more worrying about integrating stylesheets in your application. The styling is done using the Wisej Theme Builder and loaded into your project automatically as a single JSON file. The Theme Builder allows you to customize the look and feel of all Wisej controls. You can use one of the 10 predesigned themes (see https://wisej.com/themes/), create your own custom theme, or just modify any base theme using smaller theme mixin files. Ice Tea Group’s professional services team is happy to help and provide suggestions for redesigning existing applications.
Once you choose your theme, you can test it in real-time using the URL of any active Wisej application. If the Theme Builder doesn’t have the styling functionality you need, every control in Wisej has a CssStyle attribute that lets you configure optional CSS for that control.
Figure 5: Modify any control’s look and feel using the Wisej Theme Builder
Figure 6: Change the application’s theme on the fly
Integrating JavaScript Widgets
While no JavaScript programming is required, it can be useful for integrating third-party widgets. Wisej includes a large set of free and premium extensions including Google Maps, FullCalendar, and speech recognition. If a new control is needed, the Wisej Widget control is able to wrap any third-party JavaScript control and turn it into a server-wired designable component.
Figure 7: Telerik widget integration in the designer
For a full list of included extensions, visit: https://wisej.com/extensions.
Wisej Mobile for iOS and Android
Starting with version 2.2, Wisej will include a Progress Web Application integration (PWA) module, and a set of premium packages for native iOS and Android applications. Developers will be able to create Wisej applications that control any aspect of the device from the server, and don’t need to know any HTML, CSS, JavaScript, Java, or Swift to use the mobile packages. It can all be done from C# or VB.NET. The packages will also include responsive templates, making responsive design a breeze.
The Wisej Mobile Integration package gives web developers the power to design complex business applications for mobile without touching the native code, and leverage all the native functionality of the device, including but not limited to biometric authentication, haptic feedback, screen brightness, native alerts, native toolbars, tabbars and more!
C# Code
`// Dims the device’s screen to half of its possible brightness
Device.Brightness = 50;
// Uses the device’s built in biometrics or passcode to authenticate user
var authenticated = Device.Authenticate("Reason for authenticating");`
Handling device events on the server is easy. This is how you can add handlers for selecting tab bar items, toolbar items, subscribe to notifications, and just about any other event that occurs on the device.
C# Code
// somewhere in your code
Device.TabBar.Selected += TabBar_Selected;
…
private void TabBar_Selected(object sender, DeviceTabBar.SelectedEventArgs e)
{
AlertBox.Show($"{e.Button.Text} was clicked!");
}
Using Wisej’s responsive profiles and the pixel-perfect WYSIWYG designer, developers can manipulate form sizes, control appearances, text to display, and more to fit every client’s screen.
Self-Hosting for Desktop and Embedded Deployments
Wisej offers self-hosting through an OWIN / Katana web server that runs as a process or service on the machine.
For developers that want to retain their application for the desktop, Wisej can run as a desktop application in either Chromium, Firefox or light 500KB IE-based app. The window’s frame is fully customizable and doesn’t require an internet connection to operate. The application can leverage some native Windows functionality like the MessageBox or the file system. The full source code is provided to allow developers to work with authentication, logging, and directory browsing.
Component Library Integrations for Syncfusion, DevExpress, and Infragistics
Wisej has integrated several third-party component libraries. These JavaScript widgets now act as familiar server-side .NET controls, eliminating the need for developers to use JavaScript, HTML, CSS, or Ajax requests to work with them. Using these widgets in Wisej is as easy as using any WinForms control. For example, changing a widget’s background color:
C# Code
`// this is updated automatically on the client.
this.ejCircularGauge1.Options.backgroundColor = "white";
// handling any event from the widget on the server.
this.ejCircularGauge1.Widget.legendItemClick += this. ejCircularGauge1_LegendItemClick;`
Syncfusion Essential JS
Figure 8: Syncfusion Essential integration with Wisej
DevExpress DevExtreme
Figure 9: DevExpress integration with Wisej
Infragistics IgniteUI
Figure 10: Infragistics IgniteUI integration with Wisej
Training
Current desktop developers will be able to adjust to the Wisej framework with relative ease, resulting in reduced training costs and increased productivity. They’ll find that they’re able to develop productive software to take to market very quickly. Additional training and support are available for developers that want to gain a deeper understanding of the Wisej framework.
Great Results
Companies all around the world have used Wisej to modernize their applications, from small to extremely large. Wisej is being used in many industries including agricultural, medical, construction, manufacturing, financial, and many more. From individual development teams to multi-billion-dollar corporations, Wisej excels in giving developers the tools they need to get the job done. Find out what others are saying about Wisej:
For consultation inquiries contact us at https://wisej.com.
Top comments (0)