Hola, Amigos!
На связи Александр Чаплыгин, Flutter Dev. В разработке я 3 года, сейчас работаю в компании по заказной мобильной разработке, за последний год делал проекты для частного медицинского центра, системы маркировок и нескольких стартапов. По свежим следам хочу рассказать о том, как попасть в мобильные разработчики, поделюсь личным опытом взлетов и факапов, приложу чек-лист по устранению ошибок новичка. Если вы начинающий специалист — эта статья для вас. Также полезно почитать заказчикам мобильных приложений, чтобы погрузиться во внутреннюю кухню проектов и команды.
Flutter – почему он?
Начну с того, что такое Flutter и почему я остановил выбор именно на этом стеке. А если вы читаете эту статью, то для вас эта тема близка.
Итак, Flutter — это фреймворк, с бесплатным и открытым набором данных. А главное преимущество — с помощью Flutter можно разрабатывать мобильные приложения на разных платформах. Основные компоненты Flutter включают язык программирования Dart, движок Flutter и библиотеку Foundation.
Выбрал я Flutter из-за его основного плюса — кроссплатформенности. Один код на все устройства, прелесть же. И теперь с последними обновлениями Flutter — это не только про mobile, но и про MacOS, Web, Linux и Windows. В общем, я попал в яблочко.
Как я уже писал, Flutter написан на Dart — это язык программирования Google. Он оптимизируемый и заточен для создания пользовательского интерфейса. Синтаксис Dart мощный и чистый. Он создает такие условия, в которых можно создавать кастомный дизайн приложения, при этом сохранять четкую архитектуру. Если вы уже знаете Java, C# и им подобные, вы легко изучите Dart, значит сможете быстро вникнуть и работать на Flutter.
Почему Flutter может покорить сердце Mobile-разработчика:
Функция Hot Reload — позволяет мгновенно обновлять UI после внесения изменений в верстку.
Hot Restart — быстрый перезапуск приложения. Полезно, когда произошли глобальные изменения в коде.
Поддержка различных библиотек от pub.dev.
Собственный графический движок.
Flutter не обращается к нативу. Вместо этого Dart запускает собственный контейнер на устройстве, который отображает весь контент Flutter. За счет этого Flutter быстрее других кроссплатформенных фреймворков.
Но конечно, есть и свои сложности, вот некоторые из них:
Большое количество платформ, на которых выпускается Flutter. Следовательно, нужно иметь представление об устройстве этих платформ, понимать языки, на которых они написаны.
Строгая типизированность Dart не позволит не объявлять тип переменной, как в JavaScript. Оно и к лучшему.
Flutter может показаться простым, но, чтобы правильно и чисто писать код, нужно знать всю его «внутрянку».
С чего начинать Flutter-разработчику?
Итак, ты выбрал Flutter. И что дальше? Где искать работу? Как расти? Начну издалека и расскажу про свой опыт. Мой путь в Mobile начался 2 года назад. Искал работу в IT, так как хотел разрабатывать и писать продукт. Искал я работу на HH.ru, за несколько месяцев без опыта меня взяли на проект.
Изучал все доступные курсы и спрашивал всё подряд. Иногда даже стыдно было, но тимлид спокойно мне все объясняла и помогала. И спустя 2 недели макет первого экрана был осилен, с полным пониманием того, что происходит в IDE.
Так что советую с умом подходить к поиску вакансий и рассматривать абсолютно все варианты на рынке. Кто знает, где может прятаться именно тот тимлид, который поставит на ноги юного и неумелого джуна. Ведь только у понимающего и отзывчивого тимлида можно многому научиться за небольшой промежуток времени.
Новичку во Flutter я рекомендую смотреть YouTube, искать доступные курсы и браться реализовывать первые приложения. Очень помогли курсы от Angela Yu. Все подробно объясняет, но нужно базовое понимание английского языка. Также есть русскоязычный канал на YouTube LazyLoad Dart & Flutter, в котором автор рассказывает о Dart и Flutter с самого нуля. И конечно же не стоит забывать о канале Google Developers и их рубрике «“Flutter Widget of the Week», где за 2-3 минуты очень подробно и «без шелухи» рассказывают о применении того или иного виджета, который пригодится. Из литературы могу посоветовать Роберта Мартина и его книги «Чистая архитектура», «Чистый код», «Идеальный программист».
К тому же нужны базовые навыки: умение самостоятельно писать код, использовать Clean Architecture и BLoC/Cubit, познакомиться с нативными каналами — Kotlin и Swift. Как только сможете делать более-менее серьезные приложения, идите на фриланс-биржу или к работодателю, смотря какие потребности. Постепенно вы усовершенствуете скиллы, будете получать удовольствие от разработки на Flutter и в качестве приятного бонуса увеличите доход.
Путь от простых экранов до сложных проектов: как работать в команде Flutter-разработчиков и не только
Существует классная методика обучения — Peer-to-peer. Ты учишься за счет того, что задаешь много вопросов и узнаешь новое у своего соседа. А потом ты сам можешь стать тем самым «соседом», у которого будут спрашивать. Таким образом, весь коллектив повышает свой скилл.
Одна из главных составляющих на проекте — задавать вопросы. Как только приходит ступор, не знаешь, что делать, — смело обращайся к старшему товарищу. Он поможет, и вы решите проблему. Ты поймешь ошибку, в следующий раз просить о помощи не придется.
Но при этом старайся не дергать товарища по каждой мелочи, это раздражает. Помни про существование глобальной сети. Только когда она не в силах помочь или много времени уходит на поиск информацию, имеет смысл обратиться за помощью к коллеге.
На своем примере расскажу о систематических ошибках, с которыми помог справиться наставник. Путем проб и ошибок я понял, что в UI нельзя хранить логику — надо признать, дошло не сразу. В верстке надо следовать определенным правилам: размещение виджетов, минимизация Stateful виджетов (только там, где нужен интерактив), декомпозиция кода, следование принципам чистой архитектуры.
С помощью Peer-to-peer ты повышаешь свои софт- и хард-скиллы. Проверено.
Факапы
На моем пути их было много. Не успевал в дедлайн, высылал нерабочую сборку в самый ответственный момент, кривые фиксы Merge-конфликтов. Самое главное — уметь признавать ошибки и не халявить в самый ответственный момент. Тогда и работодатель, и заказчик будут лояльны и довольны тобой.
Мой чек-лист по борьбе с факапами:
Старайтесь комментить только важные части кода, за что отвечает функция или блок кода. В идеале, чтобы твой код не нуждался в комментариях вообще.
Никогда не бойся ошибиться, страхи только увеличивают шанс облажаться. Нужно бороться с синдромом самозванца, он присутствует у многих людей.
Если накосячил, нужно это признавать. И анализировать ошибку. После анализа ты будешь понимать, как не допустить ее в следующий раз.
Побороть лень (личный способ): попробуй взять в работу маленькую задачу, которая уж точно легко и быстро решается. Как только ее решишь, у тебя может появиться азарт и желание решать другие, более сложные задачи, тем самым ты поборешь лень.
Советы в работе:
Не делайте виджеты функциями, делайте классами.
Используйте стейт-менеджмент.
Используйте константные значения везде, где это возможно. Ведь константы известны до компиляции программы, а следовательно, небольшое, но все-таки увеличение производительности будет.
Тщательно выбирайте библиотеки, которые собираетесь использовать. Лучше не подключать неподдерживаемые библиотеки, особенно те, которые не перешли на Null-safety.
Если переменная может быть Null, не используйте «!» — лучше написать «??» и подставлять дефолтное значение, тогда экран вашего телефона точно не станет красным ????
Итог
Чтобы уверенно чувствовать себя во Flutter, нужно минимум полгода и классный наставник. Без этих пунктов вряд ли что-то получится. Если у вас есть другой опыт — делитесь в комментариях, буду рад почитать.
Метод Peer-to-peer — спасение для джунов и не только. Надеюсь, эта статья показала вам, что ошибаться — это нормально, без этого никак. Дерзайте!
P.S.
А еще мы с коллегами ведем телеграм-канал Flutter.Много. Там мы пишем о новостях Flutter-разработки и личном опыте. Заходите!
Комментарии (50)
shasoftX
26.10.2022 12:25Flutter не обращается к нативу. Вместо этого Dart запускает собственный контейнер на устройстве, который отображает весь контент Flutter. За счет этого Flutter быстрее других кроссплатформенных фреймворков.
Если он не обращается к нативу, то за счет чего быстрее? Как, в принципе, можно быть быстрее натива?
kcliffor Автор
26.10.2022 12:32+1Привет! Ответ кроется в вопросе, Flutter не быстрее натива, но быстрее других кроссплатформенных фреймворков, которые пытаются обращаться к нативу и из-за этого проигрывают в скорости.
shasoftX
26.10.2022 12:35+1Так "быстрее" в данном случае имелось ввиду "быстрее идет разработка"?
p.s. Для ленивых ссылка на канал LazyLoad Dart & Flutter
kcliffor Автор
26.10.2022 12:43и да, ты абсолютно прав. Разработка на Flutter идет быстрее чем разработка параллельно на Kotlin и Swift.
crackedmind
26.10.2022 19:44тем что натив как правило реализуется засчет софвер части, например Qt (но не QML) или Win32. Флаттер (и QML) в данном случаем может ускорять именно рендеринг засчет opengl/vulkan бэкендов
Sazonov
26.10.2022 12:27Все описанные вами якобы преимущества есть у Qt. Чем Flutter лучше Qt? Единственный минус, Qt в некоторых случаях платная. Но Flutter - инструмент одной компании, которая любит хоронить проекты и двигать разработку туда, куда сама хочет.
kcliffor Автор
26.10.2022 12:42+1Qt и C++, Kotlin Multiplatform — как езда на машине с ручной коробкой передач по бездорожью. Есть доступ к самому низкому уровню, где почти нет ничего готового. Либо нужно писать все самостоятельно, вплоть до отрисовки внешнего вида кнопок, либо реализовывать отдельно для каждой платформы связь со стандартными компонентами. Получить выгоду в таком подходе получается только для специфических задач, обычно все наоборот.
Sazonov
26.10.2022 15:36Кхм. Основная фича Qt это как раз native look всех компонент. Как бонус, можно тот же material design использовать, если нужен одинаковый вид на всех платформах. Так что тут как раз всё гибко. За те 8 лет что я на Qt мне ни разу не приходилось программно рисовать компоненты. Подскажите, какой у вас опыт работы с Qt?
crackedmind
26.10.2022 19:45в том и дело что оно выглядит только так, но оно там реализуется отдельно. Если произошли изменения в винде по отрисовке виджетов, придется ждать когда ее внесут в Qt
me21
26.10.2022 21:02Да. В четвёртой версии они использовали нативные виджеты, но в пятой почему-то от этого ушли.
Sazonov
27.10.2022 04:39Не использовали они. Вы путаете с WxWidegts. Qt под капотом не создаёт контролы, но для отрисовки по умолчанию используется платформенный апи. Поэтому, к примеру, даже при изменениях в стилях винды всё будет работать без перекомпиляции.
me21
27.10.2022 08:17https://doc.qt.io/qt-5/qwidget.html#native-widgets-vs-alien-widgets
Introduced in Qt 4.4, alien widgets are widgets unknown to the windowing system. They do not have a native window handle associated with them. This feature significantly speeds up widget painting, resizing, and removes flicker.
До 4.4 родные контролы всё-таки были. Правда, тут объясняется, почему они от этого ушли.
thevlad
27.10.2022 13:02Нет их там и никогда не было, нативные окошки по ссылке это совсем под другое. По сути Qt это просто "рисовалка", ей нужен лишь достаточный механизм, чтобы нарисовать собственный растр в окошке и обработать ввод.
RPG18
27.10.2022 13:26Они там были https://github.com/qt/qtmacextras/tree/5.15.2/src/macextras И под OSX иногда приходилось поприседать с Objective-C, что бы соответствовать гайдам Apple
thevlad
27.10.2022 13:45Может быть я, что-то не понимаю, но по ссылке из виджетов, есть только нативный тулбар.
Sazonov
27.10.2022 21:19Ну так это частный случай. В Qt даже есть апи, чтобы создать наитивное окно и получить его хэндл. Используется если вам надо что-то внешнее встроить. Например, вы редактор игр делаете и нужно встроить рендер игрового движка.
Все стандартные контролы рисуются средствами ОС. Но только рисуются. Поведение обрабатывается уже внутри Qt.
vaedermakar
27.10.2022 20:37Вы явно плохо понимаете что такое "низкий уровень" и Kotlin Multiplatform. Ваши слова справедливы лишь относительно C++/Qt, отчасти.
RPG18
26.10.2022 12:53У C++ большой порог вхождения по сравнению с Dart. И у Google больше денег чем у The Qt Company.
Sazonov
26.10.2022 15:38-2По мне так куда проще использовать один язык вместо двух. Вы же не будете логику приложения писать целиком на Dart?
RPG18
26.10.2022 16:03Ни разу не проще если это C++. Куча времени и сил было потрачено, что бы отлавливать крешы C++ https://habr.com/ru/post/333448/
Тот же 2gis в своё время портанул Qt4 на Android/iOS. А потом стал переписывать на нативные.
Pastoral
26.10.2022 13:04+1Инструментарием лучше.
И Qt платная не в некоторых, а практически во всех случаях. За то время пока с лицензиями Qt разберёшься - можно приложение на Flutter целиком написать.
Qt - подлая и к несчастью удавшаяся попытка коммерциализировать Open Source. Достаточно взглянуть на цены, чтобы понять - Qt что Delphi, тоже очень теперь кроссплатформенная, замечательный инструмент решения специфических проблем незаменимый в тех случаях, когда мудрость и предусмотрительность не предотвратили возникновения таковых.
RPG18
26.10.2022 13:13Qt изначально был коммерческий проект.
Pastoral
26.10.2022 15:18Обновил воспоминания. Действительно, у Qt с самого начала была двойная лицензия, стало быть подлянка by design. Заодно обновил представления о LGPL - как же красиво прекраснодушных дурачков натянули! И теперь либо нарушение LGPL, либо никаких приложений для iOS и Android.
Поэтому рядом с тем, что free as in beer, всякого Qt прошу не упоминать.
Sazonov
26.10.2022 15:42В чём-то вы правы. Впрочем, учитывая превосходную документацию, качество кода самого Qt и в целом стабильность и зрелость, я выберу платный Qt.
Но, конечно, если речь не о коммерческой разработке, а о pet проектах или попытках сэкономить то да, Qt не лучший выбор.
RPG18
26.10.2022 15:55Под android проблем с LGPL нет. Насколько помню Apple против GPL/LGPL. Напоминаю, что xamarin то же был не бесплатный https://www.g2.com/products/xamarin/pricing
Это единственный способ монетизировать UI Framework, если за ним не стоит FAANG.
Pastoral
26.10.2022 23:32Точно не единственный - Unreal и Unity монетизируют же. И ещё есть платная поддержка. И ещё есть обучение. И спонсоры, коим интересно влиять на направление разработки.
То, что делает Qt, не только омерзительно, но и, скорее всего, не оптимально. Сравним с Эппл - мастерами высасывать деньги. Хочешь xCode - купи Мак, $800+. Не хочешь Мак - купи iPad, $320, и пользуйся Playgrounds. Будут не все возможности и удобства, но до магазина можно дойти. И так со всеми IDE, начиная с VS.
А с LGPL на Андроид, насколько я её понимаю, проблема - LGPL требует поместить код в динамическую библиотеку и обеспечить каждому возможность замены поставляемой библиотеки на свою, а какая на Андроид замена?
codecity
26.10.2022 14:29+3Как минимум - более удобный и простой в освоении язык разработки. Dart практически идентичен C# и Java. Более подходит для высокоуровневой разработки. Для движков игр и пр. - C++, конечно, лучше.
antonblockchain
26.10.2022 18:40+1Мало того что платная.
не в некоторых случаях.
А в случае коммерческого использования!
читай если вы на работе, то она платная.
так еще в РФ нельзя вообще купить теперь.
запрет на покупки.
только для некоммерческого использования.
Qt это тоже инструмент одной компании.
и к РФ Qt относится гораздо хуже чем гугл.
что ставит крест на ее коммерческом использовании в РФ.thevlad
26.10.2022 19:37Qt идет с исходным кодом, можно делать коммерческую разработку под LGPL. Qt это огромный фреймворк-комбайн сопоставимый по функционалу с .NET
s60
26.10.2022 15:23-2Выбрал я Flutter из-за его основного плюса — кроссплатформенности.
почему не тот же Golang?
mortadella372
26.10.2022 15:57А что go может предложить для мобильной разработки, или даже вообще в UI?
s60
26.10.2022 16:29-1а причем тут «мобильной разработки, или даже вообще в UI»? когда ТС черным по-русски написал — кроссплатформенность… сюда бэкмшенд на сервере прекрасно влазит…
P.S. для mortadella372 а не ковыряться с UI так это вообще отдельное счастье
kcliffor Автор
26.10.2022 17:12-2Golang больше относят к многопоточности, нежели к кроссплатформе. Вычислить, посчитать, написать бота. Но никак не создание мобильного приложения :)
glycol
26.10.2022 15:59+1Сколько уже было этих кроссплатформенных решений, обещавших похоронить нативную разработку… Сколько уже было статей, как начинали писать продукт как кроссплатформу, а в итоге все равно приходили к написанию нативных приложений.
kcliffor Автор
26.10.2022 17:19+1Пока что прослеживается тенденция, что во Flutter активно переходят и разработчики и бизнес. Приложений на Flutter становится все больше, в то время как Flutter активно поддерживается и совершенствуется гуглом. Отсюда вывод, что Flutter популярен и имеет место быть. Говорить про "похороны" натива - глупость. Т.к. нативное приложение всегда будет ближе к самому смартфону, а значит где-то да больше будет и производительность, которая многим нужна. Но опять же Flutter стремится к совершенству и уж точно занял неплохную позицию в мире IT :)
crackedmind
26.10.2022 19:49да уже инсталлер убунты на флаттере, выдыхайте
https://github.com/canonical/ubuntu-desktop-installer
Pastoral
26.10.2022 23:56Было не просто много, а достаточно для того, чтобы понять что работает и что нет. Похоронить - точно не работает. Общая бизнес-логика точно работает. Общий интерфейс точно работает если он оригинальный, значит либо игры, либо что-то типа SimpleMind, кстати рекомендую, хотя он может уже и санкционный. Если интерфейс нормальный - может работает а может и нет.
И Flutter так и написан, только 3D игр не хватает. Хотя, на первый взгляд, кто приспособился поиметь Skia - у того interop с С норм, значит берём какой-нибудь Godot и вперёд на Dart.
Neikist
27.10.2022 01:42+3фреймворк, с бесплатным и открытым набором данных
Что за формулировка такая вообще?Основные компоненты Flutter включают язык программирования Dart, движок Flutter и библиотеку Foundation.
Не очень шарю во флаттере, но что такое «движок Flutter»? Для рендеринга используется движок skia, который к флаттеру мало отношения имеет. Рантайм? Так рантайм дарта. Флаттер это фреймворк, но никак не движок.Выбрал я Flutter из-за его основного плюса — кроссплатформенности.
Этот «плюс» куча фреймворков имеет, от вебных корнями до 1с и делфи. Совершенно непонятно по каким критериям выбор был.Синтаксис Dart мощный и чистый.
Мощным и чистым он может и станет когда то, но пока сильно уступает kotlin/swift тем же.Он создает такие условия, в которых можно создавать кастомный дизайн приложения, при этом сохранять четкую архитектуру.
Сам по себе совершенно не создает. Архитектуры нужно придерживаться самому, язык ее никак не пушит.Если вы уже знаете Java, C# и им подобные, вы легко изучите Dart, значит сможете быстро вникнуть и работать на Flutter.
Странное утверждение. Зная один ООП язык изучить любой другой достаточно просто в основе. Из чего не следует что получится легко и быстро изучить принятые подходы, стайлгайды, библиотеки, системы сборки, особенности рантайма, баги разных версий и прочее.
Уже на этих строках устал разбирать статью. Много слов, часто некорректных или с некорректной логикой, и все ради рекламы телеграм канала в конце.
Screamd8
27.10.2022 10:42Всё так интересно пишите, спасибо вам. Я когда-то в универе познакомился с Андроид разработкой. И учил Котлин + Android Studio. Пытался попасть на стажировку в одну компанию, но не взяли. И теперь вообще запутался. Учить снова Котлин или учить Dart + Flutter
POMXARK
27.10.2022 10:42Ты бы лучше рассказал как реализована поддержка баз данных и можно ли написать монолит по типу с# wpf, avalonia+ entity framework, и будет ли это удобно или костыли. Я хотел попробываит написать чт то на модном tauri, а там все через костыли и это исключительно интерфейс
Adilet-novichok
28.10.2022 07:47Можете про tauri конкретнее написать что там нет так? Просто хочу узнать какие у него грабли
artem_spark
крутая статья!