Visual Studio Code

Developing Dynamics Mobile applications with Visual Studio Code

Overview

Dynamics Mobile development is based on Node.js and Typescript.

Dynamics Mobile SDK is provided as NPM module.

Instructions on how to install Dynamics Mobile SDK can be found in the Gettings Started section.

The developers can use their favourite nodejs development toolchain to develop apps.

This document provides details about the development experience with Visual Studio Code

Dynamics Mobile Extension for Visual Studio Code

Dynamics Mobile Extension for Visual Studio Code is optional add-on, which can power up the development experience in Visual Studio Code.

Installing the extension

1. Open Visual Studio Code

2. Open your web browser and navigate to https://marketplace.visualstudio.com/items?itemName=MobileAffairsLTD.dynamicsmobile-vscode

3. Click the Install button and follow the instructions

Extension features

• Preview of Views: The feature renders the currently opened view as it will look on the mobile device or in the web browser. This speeds up the process of designing and building mobile and backend views. How to use: - Open html file from the Views folder of your app - Press [Ctrl+Shift+P] to open Command Pallet and run [Dynamics Mobile:Preview] command - It will open the preview window on the side of your document

• Preview of Tasks: The feature renders the currently opened task ( *.task.json ) file as a diagram.This provides more clarity to the developer while crafting new UI tasks. How to use: - Open task.json file from the Tasks folder of your app - Press [Ctrl+Shift+P] to open Command Pallet and run [Dynamics Mobile:Preview] command - It will open the preview window on the side of your document

Open app code with Visual Studio Code

Once the development machine has been configured as described in Getting Started section, the application project may be opened with Visual Studio Code.

1. Open Visual Studio Code on the development machine

2. Open the folder, where the Dynamics Mobile App is located from Visual Studio Code via menu File/Open Folder
3. Click Ctrl+~ to open new Terminal or use menu Terminal/New Terminal

4. Type npm run start in the terminal window and click ENTER to run the Dynamics Mobile SDK built-in local web server
5. Press F5 or use menu Debug/Start Debugging

6. Wait for Visual Studio Code to build the project and open up the local app emulator.
7. You can start playing with the app from the emulator and place breakpoints within Visual Studio Code to stop the code execution where needed to debug your app.