하이브리드 Ionic 앱 및 일반 모바일 웹 사이트에서 angularJS 코드 공유

이제 우리의 '혁신 연구소'에는 현재 네이티브 액세스를 위해 Cordova 위에 구축 된 하이브리드 앱 프레임 워크 인 Ionic과 '웹 코드'에 대해 angularJS를 사용하려고합니다.

반응 형 디자인을 위해 Angular + 부트 스트랩을 사용하는 순수한 모바일 웹 프로젝트도 있습니다.

문제는 일부 웹 프로젝트에는 모바일 웹 사이트와 기본 앱 (이온 하이브리드)이 모두 있어야한다는 것입니다. 대부분의 기능과 화면은 동일하며 백엔드와 대부분의 UI를 공유하지만 여전히 약간의 차이가 있습니다.

내 질문은; 프로젝트를 아키텍쳐로 구축하는 방법은 2 가지의 다른 전개 방식을 가진 이온 프로젝트와 일반 각도 웹 사이트가 될 수 있습니다. 대부분의 코드가 재사용되지만 모바일 웹 사이트에 대한 일부 뷰와 하이브리드 앱에 대한 일부 뷰 (보다 많은 고유 구성 요소 및 규칙 사용), 라우팅 차이도있을 수 있습니다.

좋은 생각입니까?

그리고 공유 코드에서, 당신이 어떤 경우인지 아는 간단한 방법이 있습니까? 일부 IF, 컨텍스트 외부에서 비활성 인 일부 지시문 등

내가 알지 못할 수도있는 누락 된 링크가있는 것처럼 느껴집니다.

미리 감사드립니다.

일부 원자 구성 요소 ( https://docs.angularjs.org/guide/component ) / 서비스 를 포함하는 공유 커널을 만들 수 있습니다 .

웹 앱, 안드로이드 앱, iOS 앱, 감시 앱 ... 모두 커널이 제공하는 기능을 적응 방식으로 사용합니다.

Android 앱을 배포하려는 경우를 상상해보십시오. 일부 Android 기능과 함께 https://material.io 를 사용하는 것이 좋습니다. iOS 앱은 다른 디자인 ( https://developer.apple.com/ios/human-interface-guidelines/overview/themes/ ) 등을 갖습니다 ...

견고한 구현을 구축하고 원자 구성 요소를 사용하여 조정하십시오!

Ionic을 사용하는 모바일 응용 프로그램 및 AngularJS 또는 Angular를 사용하는 웹 응용 프로그램의 경우 이러한 응용 프로그램 중 일부는 서버에 연결하고 일부 데이터를 얻는 것뿐만 아니라 기능을 공유하지만 해당 코드의 사본이 없다는 의미는 아닙니다. 새 프로젝트에서.

내 요점은 UI 계층 차이 만 있고 프로젝트에 웹 응용 프로그램 및 모바일 응용 프로그램이 필요하다는 것을 알고 웹 응용 프로그램의 UI가 각도로 표시되고 모바일 응용 프로그램이 이온으로 표시되는 3 계층을 가질 수 있다는 것입니다. cordova phonegap 또는 ionic과 같은 기본 기능을 사용하면 얻을 수있는 이점은 한 가지 유형으로 유지하는 것보다 훨씬 많은 것일 수 있습니다.

고객이 웹 앱을 기본 모바일 앱으로 변환하려는 경우 이러한 UI간에 전환하는 것이 어렵지 않다는 것을 분명히하고 싶습니다.

나는 다음과 같은 질문으로 시작합니다

1. 이 프로젝트에 별도의 모바일 UI가 필요합니까?
2. 이 프로젝트에는 기본 모바일 기능이 필요합니까?
3. 이 프로젝트에 모바일을위한 별도의 UI 및 지원 기능이 필요합니까?

세 가지 모두에 대한 대답이 예이면 두 개의 프로젝트를 만드십시오. 1과 2에 대한 대답이 예라면 이온 또는 phonegap 앱과 함께 각도 백엔드 및 웹 앱을 만듭니다. 귀하의 답변이 1 대 1 인 경우 두 가지 모두에 각도 사용을 권장합니다.

어떤 시점에서 이온에서 각도보기를 사용하려면 (ionic-ng 물건 찾기) 프런트 엔드, 모바일 앱 및 웹 앱 모두에 대해 동일한 코드를 갖게됩니다. 결국 다음을 독립적으로 관리 할 수 ​​있습니다.

1. 데이터베이스 마이그레이션
2. 데이터를 위해 API를 1에 연결하는 서버 측 백엔드 기능
3. 각도 뷰 2를 사용하는 프런트 엔드 웹 앱
4. 모바일 앱이 필요한 경우 장치 종속성을 해결하기 위해 Ionic / phonegap을 사용하지만 Angular를 사용하여 뷰를 생성하고 소비합니다.

이것이 도움이 되길 바랍니다.