Мы живем в прекрасное время, когда мы можем использовать бесплатные фреймворки и инструменты, даже дополнительные сервисы с мощными инструментами, для создания и реализации наших собственных приложений без каких-либо реальных затрат, кроме оборудования и времени!

В этом посте я покажу вам 10 инструментов и сервисов, о которых вы, возможно, еще не знаете, которые могут помочь вам разрабатывать, создавать и продвигать ваши приложения Ionic — индивидуально или как компания.

Я знаю, что этот список ни в коем случае не является полным, поэтому, если вы скажете, что «xyz должен быть в этом списке», просто оставьте комментарий ниже!

Давайте посмотрим, знаете ли вы их все и используете ли вы…

1. Код Visual Studio

Я поставил этот вопрос первым, потому что это самый часто задаваемый вопрос во всех моих видео: мой редактор кода — Visual Studio Code (VSC), и я могу сказать, что это редактор, который сейчас использует большинство людей в области Angular/Typescript.

Вы используете другую IDE?

Это совершенно нормально. У каждого есть свои любимые инструменты, будь то Sublime, Atom, Webstorm... или даже VIM, если вы находитесь в полном режиме ботаника и можете работать с ним на большой скорости! Важно, чтобы вы чувствовали себя комфортно и могли быстро работать с имеющимися у вас инструментами.

Но есть один инструмент, которого должен с нетерпением ждать каждый разработчик Ionic, и это недавно анонсированная Ionic Studio. С первого взгляда это может стать первым выбором для нас!

На момент написания этого списка он еще не был выпущен как бесплатная версия для сообщества, но я надеюсь, что команда Ionic не забудет о своей огромной базе разработчиков.

2. Инструменты браузера и Ionic DevApp

Хотя каждый должен знать, как отлаживать приложения, я думаю, стоит упомянуть об этом, основываясь на вопросах, которые я вижу в некоторых видео и статьях.

Инструменты разработчика браузера — лучший друг разработчиков Ionic!

Независимо от того, используете ли вы Chrome, Safari или что-то еще, есть меню для открытия инструментов разработчика и отладки работающего экземпляра Ionic (даже удаленного на вашем устройстве!). В этом представлении вы можете просматривать журналы, устанавливать точки останова в своем коде и проверять все элементы представления с их атрибутами.

Тонкая настройка CSS?

Поскольку он живет здесь, просто вставьте код в файлы позже!

Все это помогает найти ваши ошибки, но иногда даже лучше увидеть свое приложение на реальном устройстве.

И хотя развертывание вашего приложения на вашем телефоне не займет много времени, вы все же можете сэкономить на этом шаге, используя Ionic DevApp. Вы можете получить это приложение как для iOS, так и для Android.

Теперь вы можете открыть приложение и напрямую подключиться к локальному работающему экземпляру Ionic. Это магия!

PS: Приложение Ionic, которое вы видите на изображениях выше, — это Ionic Jobs, доска объявлений, которую я создал для всех вакансий и проектов, связанных с Ionic!

3. Гит

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

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

Даже если вы работаете только на себя, это хорошая идея, и вы можете (на данный момент) даже создавать бесплатные частные репозитории на Github! На самом деле нет причин не использовать git.

Хотите попробовать новый код?

Внесите свои изменения, испортите весь код и сделайте один git checkout ., и ваш старый код вернется, не задумываясь о том, какие изменения вы внесли. Это лишь одна из сотен причин использования системы контроля версий.

Если вы боитесь всех операций командной строки, просто возьмите инструмент с визуальным представлением всего — в настоящее время я использую Sourcetree, но есть еще много подобных.

4. Ионный поток приложений

Сейчас мы входим в один из платных инструментов — это одна из причин, почему Ionic все еще в игре как компания с бесплатным фреймворком. И это одна из причин, по которой люди любят Ionic и то, что они делают.

С Ionic Appflow (ранее называвшимся Ionic Pro) вы получаете набор инструментов, ориентированных на DevOps и все задачи по цепочке для создания и развертывания ваших приложений Ionic. Это похоже на отсутствующий инструмент непрерывной интеграции для приложений Ionic!

Выделим несколько основных аспектов:

  • Горячее развертывание кода без отправки в магазин приложений
  • Нативное приложение создается в облаке
  • Рабочий процесс на основе Git для вашей команды

Это ни в коем случае не инструмент для создания приложений Ionic. Вы можете создавать отличные приложения с Ionic бесплатно, начиная прямо сейчас.

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

5. Firebase

Если у вас нет опыта создания серверной части или вы просто не заинтересованы в настройке всего, Firebase выбор для большинства разработчиков Ionic.

С Firebase вы получаете бесплатную базу данных в реальном времени, облачное хранилище, аутентификацию пользователей, обмен сообщениями и даже облачные функции (последние могут быть только платными). Вы можете начать бесплатно и, как только ваше приложение наберет обороты, обновить экземпляр. Большинство из этих функций помогут вам очень быстро создать первую версию вашего приложения, а если вам нужны дополнительные знания об Ionic + Firebase, ознакомьтесь с курсами в Ionic Academy!

Firebase была приобретена Google в 2014 году и стала одним из крупнейших игроков на рынке решений Backend as a Service, если уже не самым крупным.

Кроме того, вы можете использовать хостинг Firebase для загрузки вашего приложения Ionic, чтобы выпустить его как веб-сайт, особенно для развертывания PWA. Опять же, начать работу можно бесплатно, так что выпускайте свои приложения!

6. Дриббл

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

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

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

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

7. Бесплатные иконки

Хотя вы должны знать об этом уже при использовании Ionic, давайте просто еще раз выделим потрясающие Ionicons, которые поставляются с вашим приложением!

Эти значки дают вам отличную отправную точку и, конечно же, могут быть бесплатно использованы при отправке вашего приложения. Но если вам нужно больше иконок, что вы иногда неизбежно делаете, другой (в некоторой степени бесплатный) пакет под названием Font Awesome — ваш друг.

Этот пакет должен содержать практически все значки, которые вам когда-либо понадобятся, а также прост в использовании с Ionic 4. Для некоторых из этих значков вам может потребоваться платная лицензия. Но это все равно может быть дешевле, чем нанимать дизайнера.

8. Активы изображения

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

Я открыл для себя его совсем недавно, но уже люблю его. В UnDraw вы найдете множество значков SVG, которые вы можете использовать бесплатно, и самое лучшее в этом?

Вы видели это?

Вы можете просто изменить палитру цветов (например, на цвет, который вы выбрали из крутых дизайнов Dribbble!), и все объекты изменят свой цвет. Кроме того, большинство из них действительно выглядят так, как будто дизайнер создал их для вас.

9. Документация по коду

Мы видели несколько бесплатных инструментов, сервисов и ресурсов для вашего проекта, и чтобы поддерживать высокое качество вашего кода и приложений, у вас всегда должна быть соответствующая документация по коду. Для Angular очень рекомендую Compodoc!

Как и в случае с контролем версий, об этом должен знать каждый. Иметь время и делать это стоит на другой странице (честно говоря, мы все видели это раньше).

Если вы хотите начать, вы можете проверить мой Ionic Academy Quick Win на Ionic Code Documentation with Compodoc.

10. Ионическая академия

Все инструменты, упомянутые ранее, великолепны, но если вы только начинаете или просто не можете найти бесплатную информацию, вам может понадобиться экспертный материал премиум-класса по Ionic.

Для всех, кто серьезно относится к разработке приложений Ionic, кто хочет быстро приступить к работе или просто не может позволить себе тратить время на поиск ответов в Интернете, я создал Ионическая академия почти 2 года назад!

Эта сторона членства сочетает в себе видеокурсы Ionic (в настоящее время более 30) с письменными материалами, дорожную карту, которая поможет вам найти свой путь, и отличное сообщество с частным каналом Slack, где можно ответить на все ваши вопросы и встретиться с другими разработчиками Ionic.

Что еще?

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

Какие ваши любимые инструменты и что я пропустил?

Вы также можете найти видео версию этого списка ниже.

Первоначально опубликовано на devdactic.com 5 февраля 2019 г.