SAP Mobile Development Kit Editor

Professional visual editor and development tools for building enterprise mobile applications with SAP Mobile Development Kit (MDK).

Overview

The SAP Mobile Development Kit (MDK) Editor is a comprehensive development environment for Visual Studio Code and SAP Business Application Studio that enables developers to create, modify, and deploy enterprise-grade, cross-platform applications. Build once and deploy to iOS and Android platforms with a unified, metadata-driven approach.

Key Features

Visual Editing Experience

• Custom Editors: Specialized visual editors for pages, fragments, actions, rules, services, and more
• Page Map: Visual navigation flow diagram for your application structure
• Drag & Drop Interface: Intuitive control placement and configuration
• Split View: Side-by-side graphical and text editor with synchronized editing

Intelligent Development Tools

• IntelliSense & Auto-Completion: Context-aware code completion for MDK metadata and business rules
• Validation: Real-time validation of application structure, services, and metadata
• Syntax Highlighting: Full syntax support for MDK JSON metadata and JavaScript rules
• Code Snippets: Pre-built templates for common patterns and controls

OData Integration

• Service Synchronization: On-demand metadata refresh from OData services, with configurable expiry notifications
• CSDL Viewer: View service metadata XML via the MDK Project Explorer (requires fetched metadata)
• Service Validation: Verify OData service connectivity and structure
• Annotation Support: Full support for OData annotations and CIM components

Project Management

• MDK Project Explorer: Dedicated project view with MDK-specific operations
• Build & Deploy: Integrated build system with deployment to SAP Mobile Services
• Migration Tools: Schema version migration with conflict resolution
• Template Wizards: Quick-start templates for common application patterns

Cross-Platform Development

• iOS & Android: Native mobile app development with offline capabilities
• Offline Support: Built-in offline OData capabilities

Advanced Features

• Extensibility Framework: Extend base applications with custom controls and logic
• Extension Points: Override and enhance existing application components
• i18n Editor: Internationalization support with multi-language management
• Style Editor: Custom styling and theming capabilities
• QR Code Generation: Quick onboarding with QR code deployment

Supported File Types

The extension provides specialized default editors for the following MDK metadata file types:

Additional Editors

These editors are available as optional alternatives (right-click a file and choose Open With...):

Commands

Command Palette

Access these commands through the Command Palette (Ctrl+Shift+P on Windows/Linux, Cmd+Shift+P on Mac):

SAP Business Application Studio Commands

The following commands are available in both VS Code and BAS, but depend on SAP Business Application Studio services to function:

VS Code-Only Commands

The following commands are available only in Visual Studio Code (not in SAP Business Application Studio):

Context Menu Commands

These commands are available by right-clicking on specific files or folders in the Explorer or MDK Project view:

On Application.app (Explorer context menu):

• MDK: Build / MDK: Deploy / MDK: Migrate / MDK: Validate Application
• MDK: New Annotation Component / MDK: New CIM

On MDK project node (MDK Project Explorer):

Inline toolbar buttons:

• Validate project / Deploy project / Extension points overview

Context menu (right-click):

• Check Base
• Build (also available via keyboard shortcut)
• Download / Upload
• New Folder
• Delete / Rename
• Reveal In File Explorer

On .service files (inside Services folder):

• MDK: Sync Service - Refresh OData service metadata
• MDK: Validate Service - Validate OData service connectivity
• MDK: CSDL Check Service - Check the CSDL definition

On MDK artifact folders (right-click the folder):

Editor Title Bar Commands

• Open Text Editor - Switch from graphical MDK editor to text editor
• Open Graphical Editor - Switch from text editor to graphical MDK editor

Keyboard Shortcuts

Views

The extension contributes an MDK activity bar icon with the following views:

• Project - MDK Project Explorer with dedicated tree view for MDK artifacts, context menus for creating/managing files, and quick actions for build, deploy, and validation
• Migration - Displays pending schema migration changes with options to compare, confirm, or refresh. Hover over a project node to access the Migrate and Confirm All actions

Debugging

The extension includes a built-in debugger for MDK JavaScript rules running on iOS and Android devices/simulators (VS Code only, not available in SAP Business Application Studio).

Launch Configurations

Add one of the following configurations to your launch.json:

MDK: Launch on iOS - Launch and debug on an iOS simulator

{
    "name": "MDK Launch on iOS",
    "type": "MDK",
    "request": "launch",
    "platform": "ios",
    "sourceMaps": true,
    "watch": true
}

MDK: Attach on iOS - Attach to an already running iOS app

{
    "name": "MDK Attach on iOS",
    "type": "MDK",
    "request": "attach",
    "platform": "ios",
    "sourceMaps": true,
    "watch": false
}

MDK: Launch on Android - Launch and debug on an Android emulator

{
    "name": "MDK Launch on Android",
    "type": "MDK",
    "request": "launch",
    "platform": "android",
    "sourceMaps": true,
    "watch": true
}

MDK: Attach on Android - Attach to an already running Android app

{
    "name": "MDK Attach on Android",
    "type": "MDK",
    "request": "attach",
    "platform": "android",
    "sourceMaps": true,
    "watch": false
}

Debugger Configuration Properties

Getting Started

1. Install the Extension: Search for "SAP Mobile Development Kit Editor" in VS Code Extensions, or use it in SAP Business Application Studio where it comes pre-installed
2. Open or Create an MDK Project: Open a folder containing an MDK project or create a new one
3. Configure Settings: Set your preferred platform target and editor options
4. Start Developing: Use the MDK Project Explorer to create pages, actions, and rules

Configuration

Configure the extension through VS Code Settings (File > Preferences > Settings) or in SAP Business Application Studio via the settings editor. Search for mdk to find all available settings.

General

Build

Deployment

Validation

Service

Debug (VS Code only)

Editor UI

Project Explorer

Requirements

• Visual Studio Code: Version 1.105.0 or higher, or SAP Business Application Studio
• Node.js: Required for building and deploying applications
• SAP Mobile Services: For deployment and mobile app management (optional for local development)

Documentation

• MDK Documentation
• SAP Mobile Services
• MDK Tutorials
• Sample Applications

Tutorials & Learning Resources

Getting Started

• Quick Start with Mobile Development Kit - Create your first mobile application
• Create Your First MDK Application - Step-by-step mission for beginners

Advanced Topics

• MDK Samples Repository - Self-contained examples demonstrating MDK capabilities
• Create OData Service with MBT - Backend service creation

Extension Development

This extension provides:

• Custom Language: MDK metadata language with JSON-based syntax
• Custom Editors: WebView-based visual editors for MDK artifacts
• Task Provider: MDK build task integration
• Debugger: JavaScript rule debugging support (VS Code only)
• Tree Views: Specialized project explorer and migration views

Support & Feedback

• Issues: Report bugs and feature requests through your organization's issue tracking system
• Documentation: Find comprehensive help on the SAP Help Portal
• Community: Connect with other MDK developers through SAP Community

Release Notes

See the marketplace page for release history and updates.

License

This extension is licensed under the SAP Developer License Agreement. See the LICENSE.txt file included with the extension for full license information.

SAP Mobile Development Kit - Build enterprise mobile applications with a unified, metadata-driven approach.