LogoLogo
WinForms to WebPowerBuilder to .NETPowerBuilder to Java
  • WebMAP Documentation | Mobilize.Net
  • WinForms
    • Introduction
    • Getting Started
    • Conversion Process
    • Post-Conversion
    • Extend or Modify the Converted Application
      • NoWebMap Forms Winforms
        • How to add a new Form
        • Adding the created form to the migrated App
        • Interacting with the application data
        • Call the custom API
        • Interaction between the no webmap added Form and the WebMap components
      • Adding a component
      • Adding a component dynamically
      • Add a new control model
      • Switching CSS theme
      • Adding new window
      • Conversion Configuration
        • WebMAP configuration file
        • Stub Filter
      • Adding Non-WebMap Angular Forms
      • Adding FrontEnd Handler to a ToolStripMenuItem
      • Changing ToolStripButton icons
      • Adding new items to existing toolbar
      • Adding FrontEnd element properties and JS listeners
      • Adding FrontEnd output handlers
      • Access FrontEnd components
      • Create custom components based on existing WebMap Component
      • Override FrontEnd methods
    • Assessment Mode
    • Errors and Troubleshooting
      • How to resolve broken reference problems with VBUC
    • Portability
    • Glossary
    • Release Notes
    • Internal Demos
    • Known Issues
    • WinForms DCP
  • WebForms
    • Introduction
    • Overview
    • Desktop Compatibility Platform (DCP)
      • Pages and Master Pages
      • GridView and DataList data synchronization
      • HTTP objects
    • Post-Conversion
    • Extend or Modify the Converted Application
      • Adding FrontEnd validator
      • Adding Page
      • Adding MasterPage
    • Designer classes on WebForms Conversion Tool
    • Errors and Troubleshooting
      • How fix Solution when have been added website from filesystem without project file
    • Release Notes
  • PowerBuilder to .Net
    • Introduction
    • Getting Started
      • Conversion Tool
    • Desktop Compatibility Platform (DCP)
      • Data Manager
    • Reports
      • Report Rendering in Modernized Code
      • ReportWatcher Service Configuration
      • Data Manager to RDL Conversion
      • Reporting Service Internals
      • Troubleshooting
  • PowerBuilder to Java
    • Introduction
    • Getting started
    • Post-Conversion
      • Setup PBJava Environment
      • Architecture
      • App Start
    • Glossary
    • Errors
    • Glossary
    • FAQ
      • How to create a new Control
      • How to create a new Screen
      • What is the Mobilize.WebMAP.CoreServices.All?
      • What is the DesignerAttribute?
      • What is the InterceptedAttribute?
      • What is the InterceptedAttribute?
      • What is the ObservableAttribute?
      • What is the Mobilize.Weaving.WebMAPExtensions.All?
  • General
    • FrontEnd
      • Documentation
        • Webforms Angular Components
          • Web Components
            • Base Components
              • BaseValidator Component
            • KendoUI Components
              • CompareValidator
              • CustomValidator
              • RegularExpressionValidator
              • RequiredFieldValidator
              • ValidationSummary
          • Directives
          • AJAX Web Components
            • AjaxCalendar
            • AjaxModalPopupExtender
          • Ajax Interaction Services
        • Client Core
          • WebMap's Client Core
        • Angular Client
          • Introduction
          • WebMap Service
          • WebMap Interceptor Service
        • Base Components
          • Introduction
          • Components
            • Container
            • Control
            • ControlContainer
            • FormsContainer
            • Loading
            • Stub
        • Winforms Angular Components
          • Web Components
            • Base Components
              • Control Component
              • Form Container
              • Grid Component
              • Style
            • KendoUI Components
              • AdoDataControl
              • Button
              • C1TrueDBGrid
              • CheckBox
              • CheckedListBox
              • ComboBox
              • ContextMenuStrip
              • DataGridView
              • DataGridViewFlex
              • DateTimePicker
              • FileDialog
              • GroupBox
              • Label
              • ListBox
              • ListView
              • MaskedTextBox
              • MessageBox
              • NumericUpDown
              • Panel
              • PictureBox
              • PrintDialog
              • ProgressBar
              • RadioButton
              • RichTextBox
              • StatusStrip
              • Stup
              • TabControl
              • TabPage
              • TextBox
              • Timer
              • ToolStrip
              • TreeView
              • WebBrowser
              • Window
            • JQuery Web Components
          • WebMap FrontEnd Architecture
          • Migrated Structure
          • Setup
            • Front-End setup and compilation
            • Components Manual
            • Browser Support
            • Unit Test Manual
            • Development Process
            • Setup AOT/JIT Compilation
          • Decorators
            • Server Event
          • Conventions
            • Application Structure and NgModules
            • Coding
            • Components
            • Data Service
            • Directives
            • Lifecycle hooks
            • Names
            • Services
        • PowerBuilder Kendo Components
          • Base Components
            • base-component
            • column-control
            • controlcontainer
          • Data Manager Componets
            • base-data-manager
            • data-manager-control
            • data-manager-control-base
            • dw-checkbox
            • dw-column
            • dw-complexNumericMaskComponent
            • dw-compute
            • dw-date-time-edit-mask
            • dw-dropdowndatawindow
            • dw-edit
            • dw-edit-mask
            • dw-radio-button
            • dw-simple-numeric-edit-mask
            • dw-string-edit-mask
            • dw-time-edit-mask
          • Window Components
            • basemask
            • graphics
            • w-checkbox
            • w-command-button
            • w-complex-numeric-mask
            • w-date-time-edit-mask
            • w-dropdownlistbox
            • w-group-box
            • w-line
            • w-listbox
            • w-maskedtextbox
            • w-mdiclient
            • w-menu
            • w-multiline
            • w-picture
            • w-picture
            • w-radiobutton
            • w-rectangle
            • w-simple-numeric-edit-mask
            • w-single-line-edit
            • w-statictext
            • w-string-edit-mask
            • w-time-edit-mask
            • w-toolbar
            • w-toolbaritem
            • w-user-object
            • w-window
          • Services
            • DmInteractionService
          • DataManagerEvents
          • FocusManager guide
      • Api Documentation
        • WebMap Silverlight
        • WfNetC1Components
        • WebFormsComponents
      • Guides
        • Setup NPM package registry in the workspace
        • How to Setup WebMap Applications To Run Over SubDomains or WebApplications In IIS
        • Deploy several WebMap Apps in the same Server
        • Update to Angular 16
        • Appearance
          • How to change the CSS
          • How to override the style for a component
        • Component maintenance
          • How link WebMap package to the migrated Application
          • How to resolve broken reference problems with VBUC
          • How to test a local WebMap Components package
          • How to add a new component in a migrated application
          • How to update a component
          • Dynamic Control Support
          • How to add new set of component with a different provider
          • How to test your component in the playground
          • Tools
        • WMLogger
          • How to use the WMLogger's instance
          • How to change log's level
          • How to add log tags
        • Integration test
        • Setup WebMap Applications to Run Front-End And Back-End In Separates Sites
          • Setup WebMap Applications To Run Front-End And Back-End In Separates Sites in Production (IIS)
        • Setup Migrated WebMap Applications To Run Front-end & Back-end In Separates Sites (Only development)
        • Initial Set Up
          • Software to Install
          • Necessary Repositories
      • Errors
      • Version Notes
        • Client Core
        • Angular Client
        • Web Base Components
        • Winforms Angular Components
        • PowerBuilder Kendo Components
      • Licenses
        • Client Core
        • Angular Client
        • Base Components
        • PB Kendo Components
        • WFNet Kendo Components
        • WebForms Components
        • WFNet Access Components
        • WFNet Janus Components
        • WFNet C1 Components
        • Silverlight wms-framework
        • Silverlight i-components
    • BackEnd
      • WebMAP From Scratch
      • Setup
      • DCP: Desktop Compatibly Platform
        • Overview
        • Library Bundles
          • Bundle Library
            • Create an Observable Object
          • Bundle DTO
            • DTO: Data Transfer Objects
              • Creating a DTO
            • Mappers
              • Create Mappers
            • Observable Wrappers
              • Create an Observable Wrapper
            • API/Controllers
      • Architecture
      • Weaving on WebMAP
      • Glossary
      • FAQ
        • How to create a new Control
        • How to create a new Screen
        • What is the Mobilize.WebMAP.CoreServices.All?
        • What is the DesignerAttribute?
        • What is the InterceptedAttribute?
        • What is the Mobilize.Extensions.Logging.RollingFile?
        • What is the ObservableAttribute?
        • What is the Mobilize.Weaving.WebMAPExtensions.All?
      • Licenses
        • PBNet DCP
        • WebFormsDCP
        • WFNet DCP
        • CoreServices
        • CoreServicesCommon
    • Request and Response
  • SCALABILITY
    • Introduction
    • Microservices
    • Containerizing a WebMap .Net Application with Docker
    • Vertical scalability
Powered by GitBook
On this page
  • Compile and Run the Converted Application
  • System Requirements
  • Step 1: How to Build the UI Code
  • Step 2: How to Build the Business Logic Code
  • Step 3: How to Run the Application
  • Output folders contents

Was this helpful?

  1. WebForms

Post-Conversion

WebMAP: WebForms to Web is a tool designed to convert ASP.NET web applications based on C# and Web Forms to a modern web architecture. Post-Conversion documentation for WebMAP WebForms.

PreviousHTTP objectsNextExtend or Modify the Converted Application

Last updated 10 months ago

Was this helpful?

With a brand new WebMAP: WebForms to Web converted application, let's dive into the necessary steps to have your application up and running.

Compile and Run the Converted Application

This section explains in detail the following topics:

System Requirements

After converting your application, you will need the following applications before you run it for the first time:

  • (latest) or (if you have issues with latest version)

  • Visual Studio 2022,. Your installation of Visual Studio, must include the following settings:

    • Go to Workloads tab and turn on ASP.Net and web development, see the following example:

Step 1: How to Build the UI Code

Install Angular, if you haven't already. Please open a 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:

Go to the converted application's folder, then go to the folder of the main project and then to the folder with angular in the name. Open the CommandLine pointing to this location. It should look as in the case of HelloWorldDemo.

C:\ConvertedHelloWorld\helloworld\helloworld-angular>_

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

Now the user interface is ready!

Step 2: How to Build the Business Logic Code

  1. Open the solution of the app using Visual Studio 2019.

  2. Once you opened your project, go to the solution explorer (Can be opened through the "View" tab).

  3. Right Click on your solution.

  4. Click "Build Solution"

Step 3: How to Run the Application

  1. Open your project solution.

  2. Right click on the web project.

  3. Select "Set as a Startup Project".

  4. Click the Run button.

If you followed all these steps you should have your application up and running!

Output folders contents

For this example we will be using the HelloWorld project, once it is converted it will contain the following structure:

  • helloworld folder: The main project folder.

    • wwwroot: Is a Virtual Directory of IIS server.

      • src folder.

        • app folder.

          • components folder: Contains all the angular components generated from the converted UI.

          • app.component.css: It is the stylesheet used by the app.component

          • app.component.html: It is the HTML associated with the app.component

          • app.component.ts: This is the startup angular component of every migrated application

          • app.module.ts: This module includes all the sub-modules of all the application. e.g. You have two projects (csproj): project1.csproj and project2.csproj. This will yield two sub-modules: project1.module.ts and project2.module.ts

          • hello-world.module.ts: This module includes all the components of the hello-world csproj.

        • assets folder: Contains all the images of the application.

        • index.html: It is the page that launches the angular startup component: app.component <app-root></app-root>

        • package.json: This is a json file that contains the list of javascript packages required by the application.

  • HelloWorld.sln: Projects Solution.

  • Lib folder: Several nuget dlls.

  • nuget.config: Contains the package sources for the app.

Project Pages: We will have all the pages of the project here, for more information about the structure of WebForms pages you can go to our documentation.

helloworld-angular folder: Contains all the code related to the UI, for more information visit .

Logs folder: You will find the logs related to the conversion and any error that might have occurred, for more information visit .

Stubs folder: Any element that was not converted will be generated as a stub, for more information of what a stub is visit .

Setup NPM package registry in the workspace
Designer class
Workspace and project file structure
Error and Troubleshooting
Error and Troubleshooting
Node.js LTS
16.20.2
Build Tools for Visual Studio 2022
System Requirements?
How to Build the UI Code?
How to Build the Business Logic Code?
How to run the application?
Visual Studio needed Workloads
How to build your Application
Startup Project configuration