Udostępnianie kodu angularJS w hybrydowej aplikacji Ionic i zwykłej witrynie mobilnej

11

Ok, więc w naszym „laboratorium innowacji” istnieje obecnie nacisk na użycie Ionic, hybrydowego frameworka aplikacji zbudowanego na Cordovie w celu uzyskania dostępu natywnego i angularJS do „kodu sieciowego”.

Istnieje również kilka projektów, które są czystą mobilną stroną internetową, na przykład Angular + bootstrap do responsywnego projektowania.

Chodzi o to, że niektóre projekty będą musiały mieć zarówno mobilną stronę internetową, jak i natywne aplikacje (hybrydowe). Większość funkcji i ekranów będzie taka sama, dzieląc zaplecze i większość interfejsu użytkownika, ale nadal będzie pewna różnica.

Więc moje pytanie brzmi; Jak skonstruować projekt, aby mógł być zarówno projektem jonowym, jak i normalną, kanciastą witryną z 2 różnymi metodami wdrażania. Większość kodu jest ponownie wykorzystywana, ale niektóre widoki witryny mobilnej i niektóre widoki aplikacji hybrydowej (przy użyciu większej liczby komponentów natywnych i konwencji), być może także pewne różnice w routingu.

Czy to w ogóle dobry pomysł?

A czy we wspólnym kodzie jest prosty sposób, aby wiedzieć, w którym przypadku jesteś? niektóre JEŻELI, niektóre dyrektywy nieaktywne poza ich kontekstem itp.

Wydaje się, że brakuje jakiegoś linku, o którym być może nie wiem.

Z góry dziękuję.

MikaelW
źródło

Odpowiedzi:

2

Możesz zbudować wspólne jądro, które zawiera niektóre Komponenty atomowe ( https://docs.angularjs.org/guide/component ) / Usługi.

Aplikacja internetowa, aplikacja na Androida, aplikacja na system iOS, aplikacja do nadzoru ... wszystkie będą korzystać z funkcjonalności dostarczonych przez jądro, w sposób adaptacyjny.

Wyobraź sobie, że chcesz wdrożyć aplikację na Androida. Korzystanie z https://material.io ma sens wraz z niektórymi funkcjami Androida. Aplikacja na iOS będzie miała inny wygląd ( https://developer.apple.com/ios/human-interface-guidelines/overview/themes/ ) itp ...

Zbuduj solidną implementację, użyj komponentów atomowych i dostosuj je!

Kenny
źródło
0

W przypadku aplikacji mobilnych korzystających z Ionic oraz aplikacji internetowych korzystających z AngularJS lub Angular, bardzo często niektóre z tych aplikacji będą miały wspólną funkcjonalność, a także łączenie się z serwerem i uzyskiwanie niektórych danych, ale to nie znaczy, że nie będziesz mieć kopii tego kodu w twoich nowych projektach.

Chodzi mi o to, że jeśli wiesz, że byłyby tylko różnice w warstwie interfejsu użytkownika, a projekt wymaga aplikacji sieci web i aplikacji mobilnej, możesz mieć 3 poziomy, w których interfejs użytkownika aplikacji sieci web może być kątowy, a aplikacja mobilna może być jonowa. Korzyści z korzystania z natywnych funkcji, takich jak cordova phonegap lub jonowa, mogą być o wiele więcej niż utrzymanie tego samego typu.

Chcę tylko wyjaśnić, że przełączanie między tymi interfejsami użytkownika nie jest trudne na wypadek, gdyby Twój klient chciał przekonwertować aplikację internetową na natywną aplikację mobilną.

Zacznę od następujących pytań

  1. Czy ten projekt wymaga osobnego interfejsu użytkownika na urządzenia mobilne?
  2. Czy ten projekt wymaga natywnych funkcji mobilnych?
  3. Czy ten projekt wymaga osobnego interfejsu użytkownika i funkcji kopii zapasowej dla urządzeń mobilnych?

Jeśli Twoja odpowiedź brzmi „tak” dla wszystkich 3, utwórz dwa projekty. Jeśli Twoja odpowiedź brzmi „tak” dla 1 i 2, utwórz kątowy backend i aplikację internetową wraz z aplikacją jonową lub telefoniczną. Jeśli twoja odpowiedź brzmi „tak” tylko na 1, zaleciłbym użycie kąta dla obu.

Jeśli w którymś momencie chcesz użyć widoków kątowych w jońskim (poszukaj rzeczy w jonic-ng), będziesz mieć ten sam kod dla interfejsu, aplikacji mobilnej i aplikacji internetowej. Na koniec będziesz mógł samodzielnie zarządzać następującymi elementami:

  1. Migracje baz danych
  2. Funkcjonalność zaplecza po stronie serwera z API łączącym się z 1 dla danych
  3. Aplikacja internetowa typu front-end wykorzystująca widoki kątowe pochłaniająca 2
  4. Jeśli potrzebna jest aplikacja mobilna, używa Ionic / phonegap do rozwiązywania zależności urządzeń, ale używa Angulara do tworzenia widoków i konsumpcji 2.

Mam nadzieję, że to pomoże i otworzy trochę dyskusji.

Farrukh Subhani
źródło