Подтвердить что ты не робот

Выбор технологического стека для приложения Desktop + Mobile

В настоящее время я просматриваю веб-страницы с целью создания веб-и мобильной версии классической настольной игры.

Идея состоит в том, чтобы иметь полнофункциональные функции и игру на настольной версии, а также урезанное собственное мобильное приложение, которое позволит им играть в игру и изменять некоторые настройки.

Теперь я привык к созданию веб-приложения для рабочего стола, но я никогда не касался ничего, как Cordova/Ionic.

Я также хотел бы добавить, что у меня есть намерение поставить приложение в производство когда-нибудь.

У меня есть несколько вопросов:

  • Что бы вы использовали, серверная технология? (Я смотрю на Node.js, в совете или против него?
  • Как Cordova/Ionic/React родной и/или другие будут относиться к моему настольному приложению? Разделяются ли проекты? Любой способ повторно использовать куски кода? (CSS, JS)?
  • Какую из этих платформ вы бы использовали лично и почему?

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

Большое спасибо за ваше время и помощь

4b9b3361

Ответ 1

React Native

учиться один раз, писать где угодно.

Это действительно родные приложения, поэтому они, как правило, имеют лучшую производительность, чем не-родные приложения. Чтобы создавать приложения React Native, вам все равно нужно знать целевую платформу (Android/iOS) и по-прежнему нужно писать одно приложение на платформу, но на обеих платформах вы можете использовать ту же архитектуру приложения (React/Flux).

Как написано в JS (например, React), вы все равно можете использовать код между платформами, но некоторый код всегда должен быть другим, потому что ReactElement, который вы используете в своей функции render, на самом деле зависит от платформы. Таким образом, в основном вы можете использовать всю свою логику управления состоянием, но вам придется предоставить настраиваемую функцию рендеринга для каждой целевой платформы.

Это хороший вариант, если вам нужны хорошие/родные представления, у вас есть время для изучения платформ iOS и Android и одновременного обслуживания двух разных приложений.

В настоящее время React Native для Android не выпущен, но, вероятно, будет в августе 2015 года. Это хорошая альтернатива обычным родным приложениям и предлагает некоторые преимущества, такие как горячая перезагрузка, но она по-прежнему не очень зрелая технология и немного рискованно, но очень перспективен в долгосрочной перспективе и проверен на бой Facebook и сообществом.

Вы также можете взглянуть на ComponentKit, также из Facebook, что как-то реагирует на ObjectiveC, но я думаю, что большинство новых проектов Facebook будет использовать React Native для ComponentKit.

Приложения Cordova/WebView

пишите один раз, запустите где-нибудь

Приложения Cordova/Phonegap не являются родными приложениями. Они являются родными оболочками приложений WebView. Веб-просмотр - это браузер, который запускается внутри собственного приложения. Эти приложения упакованы в родную оболочку, чтобы быть доступными для магазинов приложений Google/Apple, таких как другие родные приложения.

Преимущество заключается в том, что это просто HTML, JS и CSS. Это означает, что если у вас уже есть мобильный сайт (или отзывчивый рабочий стол на рабочем столе, который обрабатывает как настольные, так и мобильные экраны), вы можете легко упаковать его в качестве приложения Кордовы и сделать его доступным через магазины приложений.

Итак, вы пишете один раз на мобильном сайте, и вы получаете бесплатно приложение для iOS и Android!

Это хороший вариант, если вам просто нужны все еще очень приемлемые показатели, вы хотите, чтобы ваше приложение было доступно на большинстве платформ как можно скорее, и у вас нет времени/ресурсов для разработки нескольких приложений параллельно.

Это также помогает, если вы уже знаете веб-разработку:) И вы все еще можете легко использовать собственные функции приложения (например, камеру) с плагинами Cordova.

AngularJS (Ionic, Famo.us) против ReactJS (Reapp, TouchstoneJS)

Ionic и Famo.us являются мобильными каркасами, которые в основном используются поверх AngularJS

Reapp и TouchstoneJS являются мобильными фреймворками поверх ReactJS

Они не предназначены для родных (или React Native) приложений, но для мобильных веб-сайтов или приложений веб-просмотра. Выберите тот, который вы хотите, я особо не знаю. Использование фреймворка не является обязательным требованием для мобильных/веб-приложений, но вам, вероятно, понадобятся некоторые утилиты для обработки событий касания, потому что событие onclick часто недостаточно для хорошего использования мобильных устройств.

Я не буду спорить об AngularJs vs ReactJs, но испытал оба и предпочитаю много ReactJS (и я не одинок). ReactJS, когда используется правильный путь, является более функциональным, элегантным и легким в использовании. Я не думаю, что AngularJs разрешает изящную горячую перезагрузку и время, путешествующую по але Брет Виктор, потому что для этого требуется различные архитектуры, которые поддерживает ReactJS.

Однако AngularJS по-прежнему позволяет создавать вещи, и Famo.us/Ionic, вероятно, более зрелые, чем существующие мобильные платформы ReactJS.

Backend

Я бы посоветовал вам использовать NodeJS, потому что он позволяет вам создавать приложения Isomorphic/Universal, что означает, что вы можете совместно использовать код на клиенте/сервере, включая компоненты React, чтобы вы могли отображать как на клиенте, так и на сервер. Это означает, что вместо пустой html-страницы вы можете напрямую обслуживать контент, чтобы он был доступен быстрее, его легче индексировать для поисковых систем, а также работает для отключенных браузерами js.

Это странно, потому что мне даже не нравится Javascript (мне нравятся такие языки, как Scala, Haskell или Clojure). Если это ваш случай, вы можете изучить другие варианты изоморфных приложений, например:

  • Имея большую часть вашего бэкэнда в языке X (или микросервисах?), и всего лишь небольшую услугу NodeJS для рендеринга на стороне сервера.
  • Используя что-то вроде Nashorn для запуска JS внутри JVM
  • Использование бэкэнд-языка, который компилируется в Javascript (например, ScalaJS) и может работать как на клиенте, так и на сервере.

Однако последние 2 варианта все еще немного незрелые.

Мой опыт

Мы маленький стартап (3 разработчика), у которого нет никакого опыта работы с iOS/Android, и быстро добивался результата.

Сначала у нас был сложный веб-сайт ReactJS на рабочем столе (SPA). Мы сделали его отзывчивым с помощью CSS-запросов. Мы добавили пользовательские обработчики событий касания для лучшего мобильного опыта. Итак, в конце у нас был веб-сайт, который хорошо поддерживает мобильные/планшеты/рабочий стол.

Мы взяли это то же самое приложение и упаковали его в Кордове, так что теперь он также доступен в магазинах приложений. Он отлично работает, и выступления очень приемлемы. Вы можете ожидать те же самые действия с вашим мобильным веб-сайтом/кордовым приложением (для Android проверьте проект Crosswalk)

В итоге мы оказываем единый отзывчивый SPA/JS/CSS ReactJS для поддержания (все еще напряженной работы этих SPA!).

Я окончательно сделаю тот же выбор снова, даже если в будущем мы можем использовать React Native, если наша команда будет расти.


Изменить 2016: пока я должен выбрать, что использовать, я буду использовать Redux и использовать ReactJS для настольных и мобильных веб-сайтов и ReactNative для мобильных. Redux очень приятный, и даже если не все коды могут быть разделены между мобильными приложениями, Facebook сообщает, что большинство из них может быть легко. Обратите внимание, что очень важно иметь четкое разделение между презентационными и контейнерными компонентами, чтобы вы могли повторно использовать компоненты вашего контейнера во всех своих приложениях и просто предоставлять пользовательские презентационные компоненты.

Также обратите внимание, что можно добавлять веб-просмотры внутри встроенного приложения для реагирования, поэтому можно постепенно перемещать мобильный веб-приложение в родное приложение (например, сначала можно попытаться перенести навигационные меню и общий макет). Редактировать: также интересно, проект Ace направлен на добавление некоторого родного макета внутри приложения Cordova.

edit 2017: для всех разработчиков мобильных приложений окончательно рекомендуется попробовать Expo (React Native). Вы получаете скорость разработчика от Кордовы, не зная ничего о родных приложениях. Если вы уже знаете немного Реактива, вы можете начать работу через 1 мин.

Также рекомендуется использовать GraphQL с Apollo, для обучения потребуется больше времени, но это очень хороший выбор для долгосрочного обслуживания проекта.

Ответ 2

В 2019 году есть пара подходов!

1) Подход гибридного приложения
Выходы: приложение iOS/Android, PWA (мобильный, настольный сайт), настольное приложение с использованием электроники
Framework: Ionic 4 Framework (используется с Angular/React/Vue и конденсатором (преемником Cordova) трафарет (инструментарий пользовательского интерфейса))
Кодовая база: 98% код-шаров, поэтому проще в обслуживании. Занимает меньше времени в разработке.
Технология: HTML, CSS, JS.. (может быть расширен, чтобы реагировать, angular, vue)
Минусы: неудовлетворительный пользовательский интерфейс для мобильных приложений благодаря подходу обертки веб-просмотра. Большой размер приложения.


2) Кроссплатформенные собственные приложения (Универсальные приложения)
Были предприняты некоторые усилия по созданию библиотек, которые могли бы использовать одну кодовую базу для родного приложения для Android/IOS, а также для веб-приложения!
Вывод: родное приложение для Android, собственное приложение для iOS, PWA (мобильный, настольный сайт)
Каркасы:
1) Reaction-native-web (самый популярный)
2) ReactXP от Microsoft
3) Nativescript+Angular, официальные учебные пособия здесь и здесь
Кодовая база: 80% кодовой доли. Немного сложно поддерживать, так как некоторая часть кода будет отличаться для разных платформ. Плюсы: код компилируется в собственные двоичные файлы, что повышает производительность приложений. Меньший размер приложения. Минусы: Занимает больше времени в разработке. много проверок и условий, необходимых для приложений и PWA.


3) Отдельная кодовая база для приложений и PWA
Создавайте приложения для iOS и Android, используя
1) Реагирует на родной с помощью fb
2) Флаттер от Google

Создавайте PWA (мобильные, настольные сайты), используя
Реагировать/Vue/Угловое.

База кода: отдельная база кода, но код на стороне сервера может быть таким же, если используется через REST API.
Плюсы: эти мобильные приложения имеют лучшую производительность, чем ионные гибридные мобильные приложения.
Минусы: отдельная кодовая база, которую сложнее поддерживать.