Capacitor

Capacitor is a tool from the Ionic team. It puts a web project inside a native project and opens it in a WebView. It is treated as a successor to Cordova, but it works with a modern native project. It is not React Native: the screen is not turned into native components. It stays web.

It is for shipping a finished web app to a store and reaching the camera through a plugin.

• Putting an existing site into an app shell
• Creating an Android and iOS project
• Camera and files through a plugin
• Keeping the web code separate

With Capacitor one web codebase produces two store projects. If you need a native button or a complex gesture, this path gets narrow. Then native code or another framework may be the right one.

For someone who knows the web, the start is easy. The difficulty is the native project, the signature, the plugin version, and the store rules. npx cap copy is what you must not forget when moving a web build to the native side.

Advantage: one web team ships two platforms, and the plugin boundary is clear. Limit: a heavy animation and a fully native feel can stay weak in a WebView. Offline mode and permissions must be checked separately.

The web dir is where the web build lives. The native project is the android and ios folders. A plugin is a bridge from JavaScript to native code.

• npx cap init creates the config
• npx cap add android adds the native project
• npx cap sync copies the web build and plugins
• A WebView opens the page inside the app

These commands install the package, name the project, and add the Android side. The web build should be ready first.

npm install @capacitor/core @capacitor/cli
npx cap init
npx cap add android

• Is Capacitor a language? No. It is the tool that puts a web app in a native shell.
• Is it the same as React Native? No. Capacitor keeps the screen as web.
• Does the camera open without a plugin? No. A device capability needs a plugin and a permission.