Як використовувати Ionic Framework для розробки веб-додатків?

Question 1

Чи можна використовувати іонний фреймворк для звичайних веб-додатків, а не загортати його в Кордову?

Question 2

Це можливо, якщо ви включите компоненти www / lib / - Ця папка містить ядро ionic (іонний фреймворк + angularjs), і ви можете продовжувати звідти.

Однак важливо зазначити, що іонний був побудований поверх angularjs, особливо з урахуванням мобільних. Щоб отримати кращі результати для розробки веб-додатків, вам слід розглянути використання основних angularjs (для функціональності) та bootstrap3 (для інтерфейсу користувача).

Question 3

V2

Ionic тепер підтримує PWA (веб-програми), а підтримка для настільних ПК надходить дуже скоро

Ionic build browser

V1

Ionic можна використовувати для регулярної веб-розробки. Якщо вам потрібно лише веб-розробник, зупиніться на цьому. Але якщо ви хочете, щоб ваш додаток та Інтернет працювали з тієї самої кодової бази, читайте далі

Крок 1

Створіть копію index.html всередині merges / browser / (злиття знаходиться на кореневому рівні, тобто myApp)

<script>
    var is_browser = true
</script>

&

<body ng-app="myApp" class="platform-website">

Крок 2

Видаліть непотрібні файли js, такі як cordova.js, з index.html

Крок 3

додати в app.js

var is_app = (typeof is_browser === 'undefined' && !ionic.Platform.is('browser')
              && ionic.Platform.isWebView());

Тепер використовуйте css hide / show або angular hide / show, використовуючи їх

Question 4

Хоча я не вірю, що в Ionic є велика підтримка нічого, крім гібридних веб-додатків, ви можете перевірити мобільний кутовий інтерфейс для дуже подібної альтернативи з підтримкою мобільної мережі.

Question 5

Оране має рацію.

Коли ви "node app.js", ваш додаток запускає сервер. Нам потрібно надати цьому серверу всі потрібні файли. З Ionic Application це в основному папка www . У наступному прикладі я помістив весь вміст папки www до моєї загальної папки.

У моїй кореневій папці є файл app.js та загальна папка. Ось так виглядає app.js :

var express = require('express');
var app = express();
var server = require('http').createServer(app);

app.get('/', function (request, response) {
    response.sendFile(__dirname + "/public/index.html");
});
app.use(express.static(__dirname, 'public'));

У загальнодоступній папці у мене є всі інтерфейси css та js. Ми включили всю відкриту папку в код вище. Тепер у index.html public Ви повинні включити файли з public / , наприклад:

<script src="public/lalala.js"></script>

Усього найкращого, будь-хто, не соромтеся запитувати що-небудь про Node.js + Ionic Framework

Question 6

Залежно від складності програми, абсолютно можливо використовувати Ionic Framework для звичайних веб-додатків!

Коли ви створюєте програму, є /wwwпапка, яка містить усі ваші HTML, JS та CSS. Це інтерфейс для вашої веб-програми.

Більшість веб-програм - це прості інтерфейси, які отримують доступ до даних лише з невеликою кількістю логіки. У більшості випадків ви можете застосувати цю логіку у своєму JS і дозволити клієнтам обробляти навантаження.

Дані можуть оброблятися рішенням Baakend-as-a-a-service (BaaS), таким як Firebase або Parse . Мені подобається Firebase оскільки він чудово поєднується з Angular та Ionic.

Якщо вам потрібно підключитися до сервісів, які вимагають секретності, таких як оплата кредитними картками, ви можете підключитись до такої послуги, як Zapier .

Для хостингу існує ряд статичних хостерів додатків, які з’явилися спеціально для безсерверних додатків. Я віддаю перевагу divshot, хоча вони, здається, вже активно не витісняють нові функції.

Рішення, які я описав тут, допоможуть вам зберегти узгодженість між платформами, що робить Ionic чудовим!

Question 7

Наш вибір для гібридних мобільних додатків - це іонний фреймворк, однак для веб-програм інтерфейсна частина не знаходиться в іонному фреймворці.

Наприклад, ми робимо частину веб-додатків у чистому інтерфейсі Angular або Kendo для інтерфейсу Angular AngularJS .

Ефективніше, коли одна і та ж команда може бути продуктивною на обох платформах (мобільній та веб).

Сподіваюся, це допоможе.