Build app without framework, possible?

Ionic Framework
1

I know HTML, CSS and javascript/jQuery very well.

I want to build an app
I want to use Ionic Native plugins
I DONT want to use angular, react or vue

Can I still use the plugins? Can’t find any tutorials on how
Can I still use “npx cap add android” to generate APKs from AndroidStudio?

2

In theory you could.
Capacitor would be the better way to do this, not Ionic Native (the wrappers around cordova)

I would suggest though reconsidering, as it’s not a matter of “could you” but “should you”.
Could you walk 20mins to the store?
Sure you could, but you could also drive and get there quicker.

1 Like
3

To me, the 20 min walk sound easier because otherwise I first need to learn how to drive. Long-term it would be better, but not for this one trip to the store (but I’ll have to look into it for future projects).

So, with Capacitor, I can use plugins like Geolocation, even without cordova?

I’ll simply install Capacitor and Ionic in the same folder where I have my index.html?

4

@Swejo It is possible to create Ionic apps without framework, with just plain JavaScript. At the moment we are trying to add a Vanilla JS option to the App Wizard (https://github.com/ionic-team/app-wizard-issues/issues/6).

How can I create a vanilla JS app?

  1. Install the ionic core dependencies:
npm install @ionic/core
  1. include ionic core into your app
<script type="module" src="node_modules/@ionic/core/dist/ionic/ionic.esm.js"></script>
<script nomodule src="node_modules/@ionic/core/dist/ionic/ionic.js"></script>
<link rel="stylesheet" href="node_modules/@ionic/core/css/ionic.bundle.css"/>

Check if the folder node_modules/@ionic/core is correct.

Thats it!

2 Likes
5

Thank you @ArasBerke this is the perfect starting point but what we must to do after?
May be this a stupid question but really didn’t find a documentation… :frowning:
Can someone help the community to scaffolding a vanilla JS project manually ?
It would be great to know how organize the folders and the CLI command sequence to bring the app in Android Studio.
Thank you a lot

1 Like
6

@alombardini did you find any tutorial ? I’m in the same case .

7

I get that frameworks have learning curves, but please, please think really hard about whether your time would be better spent learning one or trying to effectively write your own. That’s the real choice here.

8

@alombardini It is possible, but I do not recommend it: just add this lines to your Webpage: Ionic Packages - Ionic Documentation

1 Like
9

Hi Swejo!

I’ve literally had the same question and saw your post here a year ago. Now I have an answer - yes, if you really want to.
As a proof of concept I’ve literally build an Ionic App with Capacitor plugins using vanilla JavaScript only with no Framework knowledge whatsoever.

I’ve written a small blogpost on this here:

Good that I tried getting started with Ionic and Capacitor without learning a framework. Like you said, for me it would have been like learning to drive a car.
Now I use React and see some advantages for sure, especially for large and complex projects. But don’t regret my decision getting started with Ionic and Capacitor with just vanilla JavaScript knowledge.

Thank you!

1 Like
10

Incredibly slow.

I tried vanilla Ionic using the Riot.JS libraries. Works great and fast in an Android emulator, but incredibly slow on a real device. It was Ionic, not Riot.JS that was slow.

It took 20s to load after the splash screen disappeared. It appears as a blank white screen until all the Ionic components render. Not really acceptable.