Рубрика «tutorial»

Недавно я столкнулся с не очень популярным пока зверем в мире DevOps, пайплайнами Azure DevOps. Сразу же ощутил отсутствие каких то внятных инструкций или статей на тему, не знаю с чем это связанно, но Microsoft явно есть над чем поработать в плане популяризации инструмента. Сегодня мы построим пайплайн для автоматизированного тестирования внутри облака Azure.Читать полностью »

Привет! Учусь на front-end, и параллельно, в учебном проекте, разрабатываю SPA на Vue.js для back-end, который собирает данные от поискового бота. Бот нарабатывает от 0 до 500 записей, и я должен их: загрузить, отсортировать по заданным критериям, показать в таблице.

Ни back-end ни бот, сортировать данные не умеют, поэтому мне приходятся загружать все данные и обрабатывать их на стороне браузера. Сортировка происходит очень быстро, а вот скорость загрузки, зависит о коннекта, и указанные 500 записей могут загружаться от 10 до 40 секунд.

Поначалу, при загрузке, я показывал спинер, недостаток которого — пользователь не знает когда закончится загрузка. В моём случае заранее известно количество записей которые отыскал бот, поэтому можно показать сколько % записей загружено.

Чтобы скрасить пользователю ожидание, я решил показать ему процесс загрузки:

  1. цифрами — сколько % записей уже загружено
  2. графиком — время загрузки каждой записи
  3. заполнением — % загрузки. Так как график по мере загрузки заполняет прямоугольный блок, видно, какую часть блока осталось заполнить

Вот анимация результата, к которому я стремился и получил:

SVG индикатор загрузки на Vue.js - 1

… по-моему, получилось забавно.

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

Читать полностью »

Всем привет, меня зовут Денис, мы разрабатываем сервис по аналитике подписок iOS-приложений – Apphud.

На WWDC 2019 Apple представила новый способ взаимодействия с интерфейсом вашего приложения: контекстные меню. Они выглядят так:

Как реализовать контекстные меню (Context Menu) в iOS 13 - 1

В этой статье мы рассмотрим некоторые тонкости их использования и научимся их делать.Читать полностью »

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

В моей повседневной работе ни один проект без нее не обходиться.

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

В этой статье я хочу с вами поделиться тем, как можно реализовать подход со сложным шаблоном который реализован в модуле MatTableModule.
Читать полностью »

image

When I used to start a conversation about neural networks over a bottle of beer, people were casting glances at me of what seemed to be fear; they grew sad, sometimes with their eyelid twitching. In rare cases, they were even eager to take refuge under the table. Why? These networks are simple and instinctive, actually. Yes, believe me, they are! Just let me prove this is true!

Suppose there are two things I’m aware of about the girl: she looks pretty to my taste or not, and I have lots to talk about with her or I haven’t. True and false will be one and zero respectively. We’ll take similar principle for appearance. The question is: “What girl I’ll fall in love with, and why?”

We also can think it straight and uncompromisingly: “If she looks pretty and there’s plenty to talk about, then I will fall in love. If neither is true, then I quit”.

Читать полностью »

Многие разработчики под Андроид сталкивались с проблемой реализации анимаций и переходов при открытии новых фрагментов. Нам предлагается использовать либо добавление фрагментов в контейнер, наслаивая их друг на друга, либо реплэйс (замена одного фрагента на другой). У реплэйса есть четыре вида анимаций:

Вживую всё это выглядит примерно так:

    .beginTransaction()
    .setCustomAnimations(
        R.anim.enter_from_left, //Анимация открытия фрагмента 2
        R.anim.exit_to_right, //Анимация закрытия фрагмента 1
        R.anim.enter_from_right, //Анимация открытия фрагмента 1
        R.anim.exit_to_left) //Анимация  закрытия фрагмента 2
    .replace(R.id.container, myFragment)
    .commit()

image

Читать полностью »

Руководство для чайников: создание цепочек DevOps с помощью инструментов с открытым исходным кодом - 1
Создание первой цепочки DevOps за пять шагов для новичков.

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

Мое знакомство с DevOps

Когда-то я работал с облаками в Citi Group и разрабатывал веб-приложение IaaS, чтобы управлять облачной инфраструктурой Citi, но мне всегда было интересно, как можно оптимизировать цепочку разработки и улучшить культуру среди разработчиков. Грег Лавендер, наш техдиректор по облачной архитектуре и инфраструктуре, посоветовал мне книгу Проект «Феникс». Она прекрасно объясняет принципы DevOps, при этом читается, как роман.

Читать полностью »

Привет! Сегодня мы построим систему, которая будет при помощи Spark Streaming обрабатывать потоки сообщений Apache Kafka и записывать результат обработки в облачную базу данных AWS RDS.

Представим, что некая кредитная организация ставит перед нами задачу обработки входящих транзакций «на лету» по всем своим филиалам. Это может быть сделано с целью оперативного расчета открытой валютой позиции для казначейства, лимитов или финансового результата по сделкам и т.д.

Как реализовать этот кейс без применения магии и волшебных заклинаний — читаем под катом! Поехали!

Apache Kafka и потоковая обработка данных с помощью Spark Streaming - 1

(Источник картинки)
Читать полностью »

image

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

Работать мы будем со специальным сервисом по сбору поисковых запросов пользователей Яндекса Вордстатом, интерфейс которого довольно прост и понятен:

image

В начале, по традиции, поставлю цели:

  • Понять весь функционал и научиться работать с Вордстатом;
  • Как правильно собирать семантику с максимальной релевантностью и CTR >50%;
  • Так как мы на Хабре, поработаем с API Wordstat напрямую.

Читать полностью »

Приложения, размещенные в строке меню, уже давно известны пользователям macOS. У некоторых из этих приложений есть «обычная» часть, другие размещены только в строке меню.
В этом руководстве вы напишете приложение, которое показывает во всплывающем окне несколько цитат известных людей. В процессе создания этого приложения вы научитесь:

  • назначать иконку приложения в строке меню
  • делать приложение размещенным только в строке меню
  • добавлять пользовательское меню
  • показывать всплывающее по запросу пользователя окно и прятать его, когда необходимо, используя Event Monitoring

Замечание: это руководство предполагает, что вы знакомы со Swift и macOS.

Читать полностью »