Рука об руку, чтобы вести вас к ionic3 (1): введение в ionic

ionic

Мобильная разработка стала трендом, и если веб-разработчики хотят оседлать эту волну, рекомендуюionicЭто кроссплатформенный фреймворк для разработки мобильных приложений. его лозунгBuild amazing apps in one codebase, for any platform, with the web, сможет сделатьwrite once, run anywhere.

ionic1на основеangularjsЭто стало историей. Недавно выпущенныйionic4сделал много изменений, самый важный момент - использоватьStencilЭто может преобразовать пользовательские компоненты вweb Componentsкомпилятор, учитывая, что эта версия все ещеbetaверсия, не рекомендуется.

Все статьи этой серии основаны наionic3, базовый Angular использует версию 5.x, которая будет называтьсяionic,ionic3На основе предыдущихAngular 4.xверсии, теперь полностью перешел наAngular5.xДа, всем стоит обратить внимание на скрининг в процессе разработки, потому что между 5.x и 4.x еще много изменений.

ionicуспех незаменимAngularа такжеCordovaкредит.

AngularдаGoogleЗапущен фреймворк для фронтенд-разработки с использованиемTypeSciptРазвитие языка, подходящее для крупномасштабных проектов с участием нескольких человек.

CordovaРодился изAdobeизPhoneGap, а позже его основной исходный код был передан в дарApache, переименовать вCordova, представляет собой кроссплатформенную среду разработки мобильных приложений с использованием веб-технологий.

ionicдаAngularНекоторые из основных разработчиков,Angularа такжеCordovaОбъединенный и преобразованный в соответствии с характеристиками мобильных приложений, он обеспечивает кроссплатформенную среду разработки мобильных приложений с богатыми компонентами пользовательского интерфейса. в то же время,ionicТакже предоставляются инструменты командной строки.ionic-cli, мощный, простой и легкий в использовании.

2

Это видно из рисунка вышеAngular,Cordovaа такжеionicпредыдущие отношения.

по моему мнениюionicможно просто объяснить какAngular+CordovaОснованный на структуре пользовательского интерфейса, он используетAngularразработан, предоставляет красивые компоненты пользовательского интерфейса, черезCordova pluginВзаимодействуйте с родной функциональностью и, наконец, используйтеCordovaКоманды упакованы в приложения, которые могут работать на разных платформах, и, конечно, вы можете просто использоватьwwwСодержимое папки считается доступным через браузерwebApp.

Упакованное Android-приложение на самом деле являетсяWebView, загрузите локальныйwwwВеб-страницы в папке. можно позвонить с веб-страницыNativeфункция черезCordovaэтот мост. То же самое верно и для iOS.

ionicне простоAngularа такжеCordovaВ совокупности также были внесены некоторые изменения, чтобы сделать его более подходящим для мобильной разработки. первый,ionicзаброшенныйAngularСтруктура маршрутизации вpushа такжеpopспособ достижения перехода на страницу и возврата, который больше соответствует привычкам мобильной разработки. Второй,ionicтакже дляcordova native pluginБыл написан поддерживающий пакет зависимостей JS, чтобы веб-разработчики могли быстро начать работу с использованием собственных подключаемых модулей. наконец,ionicПредоставляет множество элементов управления пользовательского интерфейса, подходящих для разработки мобильных приложений, таких как:DateTime,Toobarи другие часто используемые компоненты.

ionicНедостатки также очевидны. В первую очередь, производительность или производительность, андоида низкая машина, очевидно, застряла, а пользовательский опыт очень плохой. Во-вторых, хотяionic提供了大部分常见的与原生进行交互的插件,但是假如你的需求很冷门,只能自己写一个,比如说支付。 Ну наконец то,AngularЭтот фреймворк имеет крутую кривую обучения.

На следующем рисунке показан процесс открытия приложения и процесс вызова нативной функции на примере открытия камеры.

ionic 1

постскриптум

Пишу учебное пособие по вводному ионномуionic3-handbook, и ионный проект на базе реального проектаHW-basic, можете посмотреть, если интересно.