Как стать автором
Обновить
2
Карма
0
Рейтинг
Oleg Novikov @oinovikov

Пользователь

  • Подписчики
  • Подписки 6
  • Публикации
  • Комментарии

Вводим текст красиво

Блог компании TINKOFFРазработка под Android
Tutorial
Сырые, но важные данные вроде номеров телефонов или кредиток — это именно то, что пользователи чаще всего вводят в наших приложениях. И с этим есть огромная проблема. Перепроверять 16 цифр своего Мастеркарда или 11 цифр номера телефона — это сущий ад для любого юзера. Решать эту проблему, естественно, приходится разработчикам, от лица которых я и пишу этот пост.

Поскольку современный Андроид не предоставляет инструментов для автоматического форматирования произвольного текста, эту задачу каждый решает своими костылями силами. Сначала в наших проектах эта задача решалась по месту: возникла необходимость — напиши свой TextWatcher и форматируй как надо. Но мы быстро поняли, что так делать не стоит — количество локальных костылей и специфических багов росло экспоненциально. Кроме того, задача весьма общая, так что и решать её надо системно.

Для начала хотелось следующего:

  1. Указал маску вроде +7 (___) ___-__-__
  2. Повесил её на EditText
  3. ...
  4. PROFIT

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

Начав работать над этим направлением, мы осознали, что создание полноценного языка описания формата — это сродни написанию своего RegEx-движка, что, честно говоря, в наши планы не входило. В итоге мы пришли к варианту, когда такой язык при необходимости можно добавить в любой момент (даже в клиентском коде) или пользоваться простеньким DSL, доступным из коробки (что в нашей практике решило 90% задач).

Посмотрев на то, что получилось, мы решили, что это круто, и надо бы поделиться с сообществом. Так у нас и родилась библиотека для Android-разработки Decoro. И сейчас я покажу пару фокусов из её арсенала.
Читать дальше →
Всего голосов 45: ↑44 и ↓1+43
Просмотры39K
Комментарии 27

Полное руководство по созданию классических приложений на JavaScript

Блог компании OTUSJavaScriptПрограммирование
Перевод

Еще недавно разработка классических приложений считалась сложной задачей — для этого приходилось учить специальный язык программирования, например Java или C++. К счастью, сейчас веб-разработчики могут создавать прекрасные классические приложения, конвертируя код JavaScript в полноценные программы. Давайте разберемся, что для этого нужно.

Читать далее
Всего голосов 12: ↑4 и ↓8-4
Просмотры5.9K
Комментарии 3

Беспроводные устройства Xiaomi в умном доме ioBroker

Блог компании ioBrokerJavaScriptУмный домИнтернет вещейDIY или Сделай сам
Из песочницы
Приветствую всех любителей домашней автоматизации. Решил поделиться опытом использования беспроводных Xiaomi устройств с интерфейсом ZigBee. Я, честно говоря, против применения любых беспроводных устройств в любой автоматизации, от серьезных АСУТП больших объектов до малой автоматики типа охранно-пожарной сигнализации или умного дома, но… Решения Xiaomi подкупили дешевизной, доступностью, отличным дизайном и множеством положительных отзывов от пользователей, решил попробовать.

Этот пост следует воспринимать, как пошаговую инструкцию для интеграции ZigBee устройств в инфраструктуру умного дома. Описанное здесь ни в коем случае не является аксиомой и можно найти много других способов подключения ZigBee устройств. Если всё же пропускать детальное описание, то можно составить впечатление о сложности или легкости объединения устройств от разных производителей в одну локальную платформу на примере ZigBee и ioBroker (о нём чуть позже). Я расскажу в этой статье, как подключить устройства к умному дому, отобразить информацию с них на планшете или просто в браузере и отправить сообщения через телеграм о смене состояния устройств. Если я вас заинтересовал, то прошу под кат.
Читать дальше →
Всего голосов 35: ↑35 и ↓0+35
Просмотры37K
Комментарии 31

Создаём королевскую форму для приёма банковских карт

Веб-дизайнРазработка веб-сайтовПлатежные системыJavaScriptДизайн мобильных приложений
Tutorial


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


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


Для создания формы мы будем использовать следующие инструменты:


  1. Нативный JS
  2. BinKing — вспомогательный сервис для создания платёжных форм: https://github.com/sdandteam/binking
  3. IMask — инструмент для создания масок полей ввода: https://imask.js.org/
  4. Tippy — инструмент для создания тултипов: https://atomiks.github.io/tippyjs/

Читать дальше →
Всего голосов 16: ↑6 и ↓10-4
Просмотры4.9K
Комментарии 22

CORS для чайников: история возникновения, как устроен и оптимальные методы работы

Блог компании МаклаудИнформационная безопасностьРазработка веб-сайтовБраузеры
Перевод


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

Если вы давно хотели разобраться в CORS и вас достали постоянные ошибки, добро пожаловать под кат.

Ошибка в консоли вашего браузера


No ‘Access-Control-Allow-Origin’ header is present on the requested resource.

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://example.com/

Access to fetch at ‘https://example.com’ from origin ‘http://localhost:3000’ has been blocked by CORS policy.


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

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

Но давайте-ка пойдем к истокам…
Читать дальше →
Всего голосов 59: ↑58 и ↓1+57
Просмотры34K
Комментарии 13

Ответ HR-девицам

Читальный зал
Re: IT-холостяк и три HR-девицы to HRMuse

HR, позволь тебе ответить
С высот айтишника седин:
Ты знаешь, прогеры — не дети,
Мы не последний хрен едим.


Читать дальше →
Всего голосов 298: ↑253 и ↓45+208
Просмотры77K
Комментарии 44

Еще не используешь SVG фавиконки?

Разработка веб-сайтовCSSПрограммированиеСовершенный кодHTML
Перевод

Тебе нужно использовать SVG фавиконки. Они поддерживаются во всех современных браузерах.

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

Читать!
Всего голосов 26: ↑23 и ↓3+20
Просмотры7.7K
Комментарии 17

Уважаемые рекрутеры, а вы не офигели?

Карьера в IT-индустрии
Из песочницы

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

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

99% моего времени отнимает прочтение рекрутерского спама, ответы на по определению неподходящие вакансии и прохождение технических интервью, в которых я не пройду, потому что у меня ИЗНАЧАЛЬНО нерелевантный опыт. Это мы вместе с техническим интервьюером понимаем уже в процессе разговора.

Читать далее
Всего голосов 398: ↑333 и ↓65+268
Просмотры188K
Комментарии 409

Китайский «Кикстартер» от Xiaomi: лечим бессонницу электричеством и умными подушками

Блог компании MadrobotsГаджеты

Xiaomi, как я рассказывал раньше, ловко перенесла идею западного краудфандинга на китайскую почву. Идея себя оправдала: проекты на платформе Youpin множатся. Я просмотрел три последних месяца и собрал еще топ-10 успешных проектов. Активнее всего пользователи вкладывались в гаджеты для борьбы с бессонницей, многофункциональные инструменты и умную технику для дома. Интересно узнать, насколько выбор китайских пользователей совпадает с интересами русскоязычной аудитории.

Чем нас сегодня порадует Xiaomi?
Всего голосов 10: ↑10 и ↓0+10
Просмотры3.7K
Комментарии 3

Создание видеочата с помощью Node.js + Socket.io + WebRTC

Блог компании SkillFactoryРазработка веб-сайтовJavaScriptПрограммированиеNode.JS
Перевод

Сегодня, специально к старту нового потока по веб-разработке, поделимся с вами туториалом, из которого вы узнаете, как создать видеочат с помощью JavaScript и NodeJS. Также вы научитесь использовать PeerJS, WebRTC и Socket.io.

Читать далее
Всего голосов 8: ↑5 и ↓3+2
Просмотры7.3K
Комментарии 10

Частые ошибки в настройках Nginx, из-за которых веб-сервер становится уязвимым

Блог компании Cloud4YИнформационная безопасностьСистемное администрированиеIT-инфраструктураNginx
Перевод

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

Nginx — один из наиболее часто используемых веб-серверов в Интернете, поскольку он модульный, отзывчивый под нагрузкой и может масштабироваться на минимальном железе. Компания Detectify регулярно сканирует Nginx на предмет неправильных настроек и уязвимостей, из-за которых могут пострадать пользователи. Найденные уязвимости потом внедряются в качестве теста безопасности в сканер веб-приложений.

Мы проанализировали почти 50 000 уникальных файлов конфигурации Nginx, загруженных с GitHub с помощью Google BigQuery. С помощью собранных данных нам удалось выяснить,  какие ошибки в конфигурациях встречаются чаще всего.

Читать далее
Всего голосов 68: ↑67 и ↓1+66
Просмотры37K
Комментарии 23

Сделаем худший Vue.js в мире

Блог компании TimewebJavaScriptПрограммированиеVueJS
Перевод
Некоторое время назад я опубликовал похожую статью про React, где с помощью пары строк кода мы создали крошечный клон React.js с нуля. Но React — далеко не единственный инструмент в современном фронтенд-мире, Vue.js стремительно набирает популярность. Давайте разберемся, как работает этот фреймворк, и создадим примитивный клон, похожий на Vue.js, в образовательных целях.

Реактивность


Как и React.js, Vue является реактивным, то есть все изменения в состоянии приложения автоматически отражаются в DOM. Но в отличие от React, Vue отслеживает зависимости во время рендеринга и обновляет только связанные части без каких-либо «сравнений».

Ключ к реактивности Vue.js — это метод Object.defineProperty. Он позволяет указывать настраиваемый метод getter / setter для поля объекта и перехватывать каждый доступ к нему:
Читать дальше →
Всего голосов 32: ↑31 и ↓1+30
Просмотры12K
Комментарии 4

Принципы для разработки: KISS, DRY, YAGNI, BDUF, SOLID, APO и бритва Оккама

Блог компании НПП ИТЭЛМАПрограммированиеСовершенный кодПроектирование и рефакторингУправление разработкой
Перевод
image

Хорошему программисту необходимо уметь совмещать свои навыки со здравым смыслом. Все дело в прагматизме и навыке выбора лучшего решения для вашей проблемы. Когда вы сталкиваетесь с проблемой при разработке ПО, вы можете воспользоваться базовыми принципами, которые помогут в выборе самого правильного подхода.

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

Последовательное применение этих принципов упростит ваш переход от миддла к сеньору. Вы можете обнаружить, что некоторые (вероятно) вы применяете интуитивно.

Принципов много. Мы остановимся на семи самых важных. Их использование поможет вам в развитии и позволит стать лучшим программистом.

1. YAGNI

You Aren’t Gonna Need It / Вам это не понадобится

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

Этот принцип применим при рефакторинге. Если вы занимаетесь рефакторингом метода, класса или файла, не бойтесь удалять лишние методы. Даже если раньше они были полезны – теперь они не нужны.

Может наступить день, когда они снова понадобятся – тогда вы сможете воспользоваться git-репозиторием, чтобы воскресить их из мертвых.
Читать дальше →
Всего голосов 22: ↑19 и ↓3+16
Просмотры22K
Комментарии 9

Как я узнал о тайных услугах Мегафона

Спам и антиспамЛайфхаки для гиковСотовая связь
Добрый день всем!

Началось всё с того, что поздно вечером мне позвонила девушка из Мегафона и пролепетала что-то про скидочные купоны-талоны, которые появятся в моём личном кабинете. Мол, это просто партнерская программа и она не хочет, чтобы я пропустил такую прекрасную возможность.
Читать дальше →
Всего голосов 192: ↑179 и ↓13+166
Просмотры98K
Комментарии 293

Как стать фронтенд-разработчиком? Пошаговый гид в мир фронтенда

Блог компании ДомКликCSSJavaScriptHTML


Приветствую всех! Меня зовут Пучнина Анастасия, я ведущий разработчик в компании ДомКлик, занимаюсь фронтендом Витрины объявлений. Сегодня я хотела бы поделиться с вами своим мнением на тему того, что важно знать фронтенд-разработчику. Эта статья будет полезна тем, кто только начинает свой путь в разработке, или имеет опыт программирования в другой области и решил перейти на сторону фронтенда.

Содержание:

  1. Кто такой фронтендер и чем он занимается?
  2. С чего начать и что читать? Чек-лист обучения
  3. Какие трудности могут быть? Ошибки в начале пути
  4. Подготовка к собеседованию на Junior-разработчика

Читать дальше →
Всего голосов 34: ↑33 и ↓1+32
Просмотры50K
Комментарии 22

Делаем станцию мониторинга загрязнённости воздуха в домашних условиях

DIY или Сделай самЭкологияЭлектроника для начинающих

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

Читать далее
Всего голосов 37: ↑34 и ↓3+31
Просмотры18K
Комментарии 66

10 современных раскладок в одну строку CSS-кода

Разработка веб-сайтовCSSHTML
Перевод

В данной статье рассматривается несколько эффективных строк CSS-кода, которые выполняют серьезную работу и помогают создавать надёжную современную разметку.

Читать далее
Всего голосов 41: ↑40 и ↓1+39
Просмотры23K
Комментарии 12

Вы не знаете как должны работать модальные окна

JavaScriptHTMLUsabilityAccessibility

Уверен, многие хоть раз создавали всплывающее модальное окно. Но задумывались ли вы об определении этого компонента? Как он должен работать?


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


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


Этот список сформирован на основе спецификаций WAI-ARIA, HTML Living Standard и моего личного опыта. И хотя я буду говорить про веб, большинство правил и рекомендаций применимы для модальных окон где угодно.

Читать дальше →
Всего голосов 26: ↑26 и ↓0+26
Просмотры15K
Комментарии 19

Методы защиты от CSRF-атаки

Информационная безопасностьАнализ и проектирование систем
Из песочницы

Что такое CSRF атака?


Ознакомиться с самой идеей атаки CSRF можно на классических ресурсах:



Выдержка из ответа на SO:

Причина CSRF кроется в том, что браузеры не понимают, как различить, было ли действие явно совершено пользователем (как, скажем, нажатие кнопки на форме или переход по ссылке) или пользователь неумышленно выполнил это действие (например, при посещении bad.com, ресурсом был отправлен запрос на good.com/some_action, в то время как пользователь уже был залогинен на good.com).


Как от нее защититься?


Эффективным и общепринятым на сегодня способом защиты от CSRF-Атаки является токен. Под токеном имеется в виду случайный набор байт, который сервер передает клиенту, а клиент возвращает серверу.


Защита сводится к проверке токена, который сгенерировал сервер, и токена, который прислал пользователь.

Читать дальше →
Всего голосов 22: ↑22 и ↓0+22
Просмотры116K
Комментарии 51

Секреты JavaScript-функций

Блог компании RUVDS.comРазработка веб-сайтовJavaScript
Перевод
Каждый программист знаком с функциями. В JavaScript функции отличаются множеством возможностей, что позволяет называть их «функциями высшего порядка». Но, даже если вы постоянно пользуетесь JavaScript-функциями, возможно, им есть чем вас удивить.



В этом материале я расскажу о некоторых продвинутых возможностях JavaScript-функций. Надеюсь, вам пригодится то, что вы сегодня узнаете.
Читать дальше →
Всего голосов 52: ↑30 и ↓22+8
Просмотры20K
Комментарии 21

Информация

В рейтинге
Не участвует
Зарегистрирован
Активность