chia sẻ mã angularJS trên ứng dụng lai Ionic và trang web di động thông thường


11

Ok, vì vậy, trong 'phòng thí nghiệm đổi mới' của chúng tôi, hiện tại có một sự thúc đẩy sử dụng Ionic, một khung ứng dụng lai được xây dựng trên đỉnh Cordova để truy cập tự nhiên và angularJS cho 'mã web'.

Ngoài ra còn có một số dự án là web di động thuần túy, sử dụng Angular + bootstrap cho thiết kế đáp ứng chẳng hạn.

Vấn đề là một số dự án sắp tới sẽ cần phải có cả một trang web di động và các ứng dụng gốc (ionic hybrid). Hầu hết các tính năng và màn hình sẽ giống nhau, chia sẻ back end và hầu hết UI nhưng vẫn sẽ có một số khác biệt.

Vì vậy, câu hỏi của tôi là; Làm thế nào để kiến ​​trúc một dự án sao cho nó có thể vừa là một dự án ion vừa là một trang web góc cạnh bình thường với 2 cách tiếp cận triển khai khác nhau. Hầu hết các mã được sử dụng lại nhưng một số lượt xem cho trang web di động và một số lượt xem cho ứng dụng lai (sử dụng nhiều thành phần và quy ước riêng hơn), có thể một số khác biệt về định tuyến.

Đó có phải là một ý tưởng tốt?

Và trong mã được chia sẻ, có một cách đơn giản để biết bạn đang ở trường hợp nào? một số IF, một số chỉ thị không hoạt động bên ngoài bối cảnh của họ, v.v.

Tôi cảm thấy như có một số liên kết bị thiếu mà tôi có thể không biết.

Cảm ơn trước.

Câu trả lời:


2

Bạn có thể xây dựng một kernel chia sẻ, trong đó có một số Atomics Components ( https://docs.angularjs.org/guide/component ) / Dịch vụ.

Ứng dụng web, ứng dụng android, ứng dụng ios, ứng dụng giám sát ... tất cả sẽ sử dụng các chức năng được cung cấp bởi kernel, theo cách thích ứng.

Hãy tưởng tượng nếu bạn muốn triển khai một ứng dụng Android. Sử dụng https: // m vật liệu.io có ý nghĩa, cùng với một số khả năng của Android. Ứng dụng iOS, sẽ có thiết kế khác nhau ( https://developer.apple.com/ios/human-interface-guferences/overview/theme/ ), v.v ...

Xây dựng triển khai vững chắc, và sử dụng các thành phần nguyên tử và điều chỉnh chúng!


0

Đối với các ứng dụng di động sử dụng Ionic và các ứng dụng web sử dụng AngularJS hoặc Angular, một điều rất phổ biến là một số ứng dụng này sẽ có chức năng chia sẻ cũng như kết nối với máy chủ và lấy một số dữ liệu nhưng điều đó không có nghĩa là bạn sẽ không có bản sao của mã đó trong các dự án mới của bạn.

Quan điểm của tôi là nếu bạn biết rằng sẽ chỉ có sự khác biệt về lớp UI và dự án yêu cầu ứng dụng web và ứng dụng di động và bạn có thể có 3 tầng trong đó UI cho ứng dụng web có thể ở dạng góc và ứng dụng di động có thể ở dạng ion. Những lợi ích bạn nhận được từ việc sử dụng các chức năng gốc như cordova phonegap hoặc ion có thể nhiều hơn nhiều so với việc giữ tất cả trong một loại.

Tôi chỉ muốn làm rõ rằng không khó để chuyển đổi giữa các UI này trong trường hợp khách hàng của bạn muốn có một ứng dụng web được chuyển đổi thành ứng dụng di động gốc.

Tôi sẽ bắt đầu với những câu hỏi sau

  1. Dự án này có cần UI riêng cho thiết bị di động không?
  2. Dự án này có cần các chức năng di động riêng không?
  3. Dự án này có cần các giao diện người dùng và chức năng được hỗ trợ riêng cho thiết bị di động không?

Nếu câu trả lời của bạn là có cho cả 3 thì hãy tạo hai dự án. Nếu câu trả lời của bạn là có cho 1 và 2 thì hãy tạo ứng dụng phụ trợ và ứng dụng web góc cạnh cùng với ứng dụng ion hoặc phonegap. Nếu câu trả lời của bạn là có chỉ 1 thì tôi sẽ sử dụng góc cho cả hai.

Nếu tại một nơi nào đó bạn muốn o sử dụng các chế độ xem góc trong ion (tìm kiếm công cụ ionic-ng), bạn sẽ có cùng mã cho cả giao diện người dùng, ứng dụng di động và ứng dụng web. Cuối cùng, bạn sẽ có thể quản lý độc lập sau:

  1. Di chuyển cơ sở dữ liệu
  2. Chức năng phụ trợ phía máy chủ với API kết nối với 1 cho dữ liệu
  3. Ứng dụng web giao diện người dùng sử dụng Angular Views tiêu thụ 2
  4. Nếu cần ứng dụng di động, nó sử dụng Ionic / phonegap để giải quyết các phụ thuộc thiết bị nhưng sử dụng Angular để tạo chế độ xem và tiêu thụ 2.

Hy vọng điều này sẽ giúp và mở một chút thảo luận.

Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.