Apache Cordova: WebView, config.xml & Plugins

Cordova lets developers build mobile apps using standard HTML, CSS, and JavaScript, packaging that web content inside a native WebView shell -- producing an installable app for iOS, Android, and other platforms without native language expertise.

The WebView Architecture

A Cordova app is fundamentally a WebView (the same rendering engine as the platform's browser) hosting the app's HTML/CSS/JS, wrapped in a thin native shell that also exposes plugin-bridged native capabilities.

config.xml

<widget id="com.example.myapp" version="1.0.0">
  <name>MyApp</name>
  <content src="index.html" />
  <plugin name="cordova-plugin-camera" spec="^7.0.0" />
  <preference name="Orientation" value="portrait" />
</widget>

Accessing Native Functionality via Plugins

navigator.camera.getPicture(
  (imageData) => { /* success */ },
  (error) => { /* failure */ },
  { quality: 50, destinationType: Camera.DestinationType.DATA_URL }
)

// A WebView alone can't access the camera -- the plugin provides
// both the JS-facing API and the native glue code bridging to it

One Codebase, Multiple Platforms

cordova platform add ios
cordova platform add android
cordova plugin add cordova-plugin-camera
cordova build

# The shared web codebase is packaged separately for each
# target platform -- one .ipa for iOS, one .apk for Android