Few questions for working with Cordova Plugins in a f7 v2 application

I am working on converting f7 v1 app to vue+f7 v2 app and current application has a list of cordova plugins both for android and ios, some of them are common cordova plugins and some of them are inhouse solutions

Please have a look at the list at the end and I have few questions,

  • I wonder with f7 v2 how many plugins in the list I need exactly ? I think vibration, proximity etc are a must to use cordova plugin.

  • In what particular areas do I need to use cordova ? If we omit performance , does f7 provides everything we need for mobile (since its a mobile library) without using cordova library et all ?

  • never worked with cordova before and new to area, so where can I refer to using a cordova plugin in vue + f7 vue ? Is there documents or project out there that I can refer ?
    I see some post about this but need some basic info
    [SOLVED] Cordova Plugins with Framework7 + Vue?

  • Is it same process for every plugin ? Just add plugin with cordova and call it from window.cordova.plugins

window.cordova.plugins.barcodeScanner.scan(
  • There is a plugin for using cordova in vue as below, but in another post it is mentioned that we do not have to do anything for cordova plugins to get work, which one is correct ?
    https://github.com/kartsims/vue-cordova

here is list of plugins used for android in current mobile application (angular1 + f7 v1)
VibrationAPI
ProximityAPI
CordovaPluginDevice
CordovaPluginGlobalization
CordovaPluginShake
CordovaPluginScreenshot
CordovaPluginPermission
AndroidLocalNotification
CordovaPluginNetwork
HeadsetDetectionAPI
ScreenOrientationAPIAndroid
CordovaContentSync
GSMCallAPI from
CordovaNativeLogs
AndroidAudioMode
CordovaPluginMedia
CordovaPluginBackgroundMode
AndroidBackButton
AndroidActivityEvent
MediaDeviceApiAndroid
CordovaEmail
CordovaClipboard
CordovaPluginContacts
CordovaPluginFcm
CordovaPluginBuildInfo
LaunchAppPluginAPI
CordovaCallNumberPlugin
CordovaPluginKeyboard
AndroidFilePicker

Let’s go in order:

  1. I wonder with v2, how many plugins in the list I need exactly ? I think vibration, proximity etc are a must to use cordova plugin. – Not sure exactly what you’re asking here, but if you’re asking how many plugins should you use with Cordova the answer is that only the ones you need. The things you describe, vibration, proxmity, and other native APIs are cordova plugins and you would only need them if your application requires that functionality. If you don’t use vibration in your app, then you don’t need the plugin.

  2. In what particular areas do I need to use cordova ? If we omit performance , does f7 provides everything we need for mobile (since its a mobile library) without using cordova library et all ? – You use cordova for one thing only: building NATIVE mobile applications. Framework7 makes it look great on Android/iOS and provides many rich components out of the box. If you want the app to be a “real” app on an Android or iOS device you take the generated Framework7 code and you “bundle” it using Cordova. You need Cordova if you want to put the actual app on a real device instead of just a webpage.

  3. never worked with cordova before and new to area, so where can I refer to using a cordova plugin in vue + f7 vue ? Is there documents or project out there that I can refer ? I see some post about this but need some basic info – Just see the repo in that discussion (https://github.com/bingobongotmp/f7_barcodescanner_vue) and copy its steps in the README. You can then duplicate those steps (ex. install the plugin, invoke it using window.cordova.plugins.pluginName, etc)

  4. Is it same process for every plugin ? Just add plugin with cordova and call it from window.cordova.plugins – Correct, add the plugin wait for to be “ready” and call its methods. The whole point of plugins is a consistent experience to access “native” device functionality

  5. here is list of plugins used for android in current mobile application (angular1 + f7 v1) – Not sure what you are asking here, but if they are valid cordova plugins they should work fine in Cordova. What you’re asking is more of a cordova question than framework7*

Read the following:

1 Like

@valg20172018 Realy thanks for item by item detailed answer. I see Something was not clear in my post, yes I make application for mobile of course, and yes my application requires that functionality.

The list I wrote in my post was all android plugins used in current app, which is written in angular1 + f7 v1, and I am trying to upgrade it to vue + f7 v2

Yes f7 provides many rich components out of the box but I dont think it provides device specific camera, GSM call options, headset detection etc right ? I wrote that list and I am asking, “By looking in that list, is there something I can handle without using a cordova plugin ?”

cool, thanks for clarifying

F7 is more of a UI framework designed to work with existing “cordova” plug-ins for native functionality.

Unless I’m mistaken, none of the features enabled by the plugins in your list are handled by F7.

You will need them all in your upgraded app

as I wrote before I will ask few questions more,

I see even basic functionality are provided as plugin from cordova (such as camera plugin)
so whats core cordova is for ? anything is not out of the box ? I need its plugin ?

Another question I see a nice plugin on this adress https://cordovacall.github.io/
when I look its github page, it tells -> cordova plugin add cordova-call
so this is not default plugin ? I mean that plugin uses native ios call kit inside it ?
and that means if I use this, I do not need to install it explicity callkit etc ?

as I understand this is something like npm install, like you upload your plugin to npm library, somebody upload a library to cordova and anybody can use it by adding, am I right ?

I see even basic functionality are provided as plugin from cordova (such as camera plugin)
so whats core cordova is for ? anything is not out of the box ? I need its plugin ?
– Cordova is a framework that lets you “wrap” js/css/html web applications and bundle them to run as native applications on iOS/Android/WindowsPhone/etc. Out of the box it will do an amazing thing and bundle your application together and let you run it on a mobile device.

The “native” functionality you describe requires “plugins” which so you can call native APIs from javascript (and pass data between the two-- the native and the web-application) For example, there’s no API for instance to use the barcode scanner of an iOS device from a browser so you’d need a plugin, and the native functionality would run and pass back the barcode data that the native barcode scanner picked up.

A good general rule: If you need some UI or behavior that cannot be called from your web application, you need to find and install a plugin for it.

Another question I see a nice plugin on this adress https://cordovacall.github.io/ when I look its github page, it tells -> cordova plugin add cordova-call so this is not default plugin ? I mean that plugin uses native ios call kit inside it ? and that means if I use this, I do not need to install it explicity callkit etc ? –Yes you are correct. You need to explicitly install plugins. As you install/save plugins, you should see a list in the cordova/plugins folder. This particular plugin uses UI/behavior that is only available using a native API.

as I understand this is something like npm install, like you upload your plugin to npm library, somebody upload a library to cordova and anybody can use it by adding, am I right ? – Yes, this is basically correct.

Also with npm you can also install them with a URL or a proper name if available, ex:

cordova plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-device.git

or

cordova plugin add cordova-plugin-device

Read these to better understand things:

1 Like