condivisione del codice angularJS attraverso app Ionic ibrida e normale sito Web mobile

Ok, quindi nel nostro "laboratorio dell'innovazione", attualmente c'è una spinta per usare Ionic, un framework di app ibrido costruito su Cordova per l'accesso nativo e angularJS per il "codice web".

Ci sono anche alcuni progetti che sono Web mobile puro, ad esempio utilizzando Angular + bootstrap per un design reattivo.

Il fatto è che alcuni progetti in arrivo dovranno avere sia un sito Web mobile che app native (ibrido ionico). La maggior parte delle funzionalità e degli schermi saranno gli stessi, condividendo il back-end e la maggior parte dell'interfaccia utente, ma ci saranno comunque delle differenze.

Quindi la mia domanda è; Come architettare un progetto in modo che possa essere sia un progetto ionico che un normale sito Web angolare con 2 diversi approcci di implementazione. La maggior parte del codice viene riutilizzato, ma alcune visualizzazioni per il sito Web mobile e alcune visualizzazioni per l'app ibrida (utilizzando più componenti e convenzioni native), forse anche alcune differenze di routing.

È anche una buona idea?

E nel codice condiviso, c'è un modo semplice per sapere in quale caso sei? alcuni IF, alcune direttive inattive al di fuori del loro contesto, ecc.

Sembra che ci sia una sorta di collegamento mancante di cui potrei non essere a conoscenza.

Grazie in anticipo.

È possibile creare un kernel condiviso che contiene alcuni componenti atomici ( https://docs.angularjs.org/guide/component ) / Services.

App Web, app Android, app iOS, app di supervisione ... tutti useranno le funzionalità fornite dal kernel, in modo adattivo.

Immagina se vuoi distribuire un'app Android. L'uso di https://material.io ha senso, insieme ad alcune funzionalità di Android. L'app per iOS avrà un design diverso ( https://developer.apple.com/ios/human-interface-guidelines/overview/themes/ ) ecc ...

Costruisci una solida implementazione e usa i componenti atomici e adattali!

Per le app mobili che utilizzano Ionic e le app Web che utilizzano AngularJS o Angular, è molto comune che alcune di queste app dispongano di funzionalità condivise, come la connessione al server e l'ottenimento di alcuni dati, ma ciò non significa che non si avrà una copia di quel codice nei tuoi nuovi progetti.

Il mio punto è che se sai che ci sarebbero solo differenze di livello dell'interfaccia utente e il progetto richiede un'app Web e un'app mobile e puoi avere 3 livelli in cui l'interfaccia utente per l'app Web può essere angolare e l'app mobile può essere ionica. I vantaggi che si ottengono dall'uso di funzioni native come cordova phonegap o ionic possono essere molto più che mantenere tutto in un solo tipo.

Voglio solo chiarire che non è difficile passare da queste interfacce utente nel caso in cui il tuo cliente desideri che un'app Web venga convertita in app mobile nativa.

Vorrei iniziare con le seguenti domande

1. Questo progetto richiede un'interfaccia utente separata per i dispositivi mobili?
2. Questo progetto ha bisogno di funzioni mobili native?
3. Questo progetto richiede un'interfaccia utente separata e funzioni backedn per dispositivi mobili?

Se la tua risposta è sì per tutti e 3, crea due progetti. Se la tua risposta è sì per 1 e 2, crea un backend angolare e un'app Web insieme all'app ionica o phonegap. Se la tua risposta è sì solo a 1, allora consiglierei di usare angolare per entrambi.

Se a un certo punto desideri o utilizzare le viste angolari in ionico (cerca elementi ionici) avrai lo stesso codice sia per il front-end che per l'app mobile e l'app web. Alla fine sarai in grado di gestire autonomamente quanto segue:

1. Migrazioni di database
2. Funzionalità back-end lato server con API che si collega a 1 per i dati
3. App Web front-end che utilizza viste angolari che consumano 2
4. Se è necessaria un'app mobile, utilizza Ionic / phonegap per risolvere le dipendenze del dispositivo, ma utilizza Angular per creare viste e consumare 2.

Spero che questo aiuti e apra un po 'di discussione.