angularJS-код для обміну кодом у гібридному додатку Ionic та звичайному мобільному веб-сайті


11

Гаразд, тому в нашій "лабораторії інновацій" зараз є поштовх до використання Ionic, гібридної програми додатків, побудованої на вершині Кордови для вбудованого доступу та angularJS для "веб-коду".

Існують також проекти, які є чистою мобільною веб-сторінкою, наприклад, використовуючи завантажувальну програму Angular + для адаптивного дизайну.

Справа в тому, що для деяких проектів, які з’являються, потрібно мати як мобільний веб-сайт, так і вбудовані програми (іонний гібрид). Більшість функцій і екранів будуть однаковими, спільний обмін і більша частина інтерфейсу користувача, але все одно буде деяка різниця.

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

Це навіть гарна ідея?

А в спільному коді є простий спосіб дізнатися, в якому випадку ви знаходитесь? деякі ІФ, деякі директиви, неактивні поза їх контексту тощо.

Складається враження, що існує якесь пропущене посилання, про яке я, можливо, не знаю.

Заздалегідь спасибі.

Відповіді:


2

Ви можете створити спільне ядро, яке містить деякі компоненти атомів ( https://docs.angularjs.org/guide/component ) / Послуги.

Веб-додаток, додаток для Android, програма ios, додаток для нагляду ... усі вони використовуватимуть функціональні можливості, що надаються ядром, адаптивно.

Уявіть, якщо ви хочете розгорнути додаток для Android. Використовувати https://material.io має сенс разом із деякими можливостями Android. Додаток для iOS матиме різний дизайн ( https://developer.apple.com/ios/human-interface-guidelines/overview/themes/ ) тощо ...

Створіть надійну реалізацію та використовуйте компоненти атома та адаптуйте їх!


0

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

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

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

Я б почав із наступних питань

  1. Чи потрібен цьому проекту окремий інтерфейс для мобільних пристроїв?
  2. Чи потрібен цей проект натурними мобільними функціями?
  3. Чи потрібен цей проект для окремих мобільних інтерфейсів та резервних функцій для мобільних пристроїв?

Якщо ваша відповідь "так" для всіх 3, тоді створіть два проекти. Якщо ваша відповідь "за" і "1", тоді створіть кутовий інтерфейс та веб-додаток разом з іонним або фонегапським додатком. Якщо ваша відповідь - «так» лише 1, я б рекомендував використовувати кутовий для обох.

Якщо в якийсь момент ви хочете скористатися кутовими переглядами в іонному (шукайте іонно-нг-речі), у вас буде однаковий код і для передньої частини, і для мобільного, і для веб-додатка. Наприкінці ви зможете керувати наступними самостійно:

  1. Міграція бази даних
  2. Функціональність резервного сервера на стороні сервера з API, що підключається до 1 для даних
  3. Веб-додаток для лицьових сторін із використанням кутових переглядів 2
  4. Якщо потрібен мобільний додаток, він використовує Ionic / phonegap для вирішення залежностей пристрою, але використовує Angular для створення представлень і споживання 2.

Сподіваюсь, це допоможе і відкриє трохи дискусій.

Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.