Internal Demos

WebMAP: WinForms to Web is a tool designed to convert .NET Framework apps based on C# and Windows Forms to a modern web architecture. WebMAP WinForms Internal Demos documentation.

This section will explain how to execute some of the demos commonly used for testing on the WebMAP Winforms to Web Converter.

Any of the Demos shown on this guide will require the user to run the tool using the source code, that can be found on each of their sections, and generate a newly converted web solution.

Pre-Requsites

• Latest Version of WebMAP Winforms Converter

• Install SQLLite Driver from here.

• Install Microsoft Access Database Engine Driver from here.

Warning: The drivers version(32/64 bits) depends on which one of the two the application will be compiled on.

Minimum Requirements

In order to compile and run demo projects this are the minimum requirements to a better usage experience:

• Nodejs version to have install is 16.20.2, latest versions may cause compilation bugs.

• Visual Studio version installed needs to be Enterprise 2022 version 17.8.6 or latest, this to enable the .Net 8 features added.

General Steps

• Install the Angular, if you haven't already. Please open Command Line or PowerShell as an administrator and type the following command.

  npm install -g @angular/cli@16.2.14

• Update the npm configuration's registry key. This is required to resolve Mobilize's packages and should be done only once. Please follow the next setup guide:

Setup NPM package registry in the workspace

• Move to the Output Folder and look for the angular project.

• Open the command prompt on that folder

• Run the following command to install all the packages and their dependencies to run the UI. This step should only be done once.

  npm install

• The last command will build the UI and should be run after any change done to a component inside the angular folder.

  npm run build

• Open the solution on Visual Studio and Build, then Run.

• Wait for the site to show you the splash and now you are free to interact with the old demo on Web.

Salmon King Seafood:

Salmon King Seafood (SKS) is a reference App create to show some of the capabilities of the tool on an application that was initially written in VB6 code then converted to Winforms using the Visual Basic Upgrade Companion VBUC from Mobilize.Net and now using WebMAP to run it on Web.

• Currently Source code for SKS can be found at: https://github.com/MobilizeNet/SKSWinForms

• Once the General steps have been followed you should expect the site to look like this.

Execute SKS on Linux environment

1. As a previous requirement, is necessary install dotnet and nodejs as is mention in the Portability section.

2. Install SQLITE driver odbc, you can find all instructions to install it from here. You need install odbc and sqlite dependencies before installing it.

3. Modify connection string on your source code. Change DRIVER=SQLite3 ODBC Driver; Database=Orders.db; to DRIVER=SQLITE3;Database=Orders.db;. Please ensure that no blank space is contained in your connection string.

4. Compile your angular application, if it isneeded.

5. Compile and run your SKS C# project.

Execute SKS on Mac eviroment

1. As a previous requirement, is necessary install dotnet and nodejs as is mention in the Portability section.

2. We need to install Visual Studio Code, due to Visual Studio is not longer available For Mac's PCs, to download it go to: https://code.visualstudio.com/ and install it.

3. After install Visual Code Go to Extensions and search 'C#' extension and install it

1. Install SQLITE driver odbc, in order to install the driver execute the nexts steps:

   1. in case you don't have installed homebrew run: /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"

   2. brew install unixodbc sqlite3 sqliteodbc

2. Next, set the configuration for file odbcinst.ini, This file should be similar as the following example:

   [SQLite3 ODBC Driver]
   Description=SQLite ODBC Driver
   Driver=/usr/local/lib/libsqlite3odbc.dylib

   Execute this command odbcinst -j to find where is odbcinst.ini.

3. Also, set the configuration for the file odbc.ini, this file should be similar as the following example:

[SQLiteDSN]
Driver=SQLite3 ODBC Driver
Database=/PathWhereSKSIsLocated/Orders.db

1. Modify the connection string on your source code. Change the ConnectionString at App.config file for something like this:

<connectionStrings>
     <add name="SQLiteConnection"
         connectionString="DSN=SQLiteDSN;"
         providerName="System.Data.Odbc" />
</connectionStrings>

1. Check all dirver references at the multiple files. Ensure all those references are changed into: System.Configuration.ConfigurationManager.ConnectionStrings["SQLiteConnection"].ConnectionString;

1. Remove ItemGroup that contains all COM References at line 49 from SKS.csproj file
2. Compile your angular application, if it is needed.

3. Compile and run your SKS C# project.

Tailwind:

TailwindPOS is a reference App used for internal testing to show some features available in Winforms now supported on Web as well via the conversion using WebMAP.

• TailwindPOS only requires to follow the General Steps and Pre-requisites.