Юрий Матюхин — фронтендер, обыкновенный — разработка

Claude AI убрал проверку телефона при регистрации

Thu, 26 Feb 2026 00:00:00 +0000

Пару месяцев назад я хотел потестить Claude AI, но не смог. Дело в том, что при регистрации нужен был номер телефона не с территории РФ.

Код. Плейсхолдер для [contenteditable]

Fri, 24 Nov 2017 00:00:00 +0000

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

Как называть переменные

Mon, 07 Aug 2017 00:00:00 +0000

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

Плавный, нативный скрол

Sat, 05 Aug 2017 00:00:00 +0000

О нативной плавной прокрутке внутри страницы без дополнительных JavaScript-библиотек. Показываю современный подход на CSS и браузерном API, который легче поддерживать.

Адекватное подчеркивание ссылок

Sat, 15 Jul 2017 00:00:00 +0000

Стандартное подчеркивание — ад перфекциониста. Оно нагло перекрывает висячие символы в тексте, его становится сложнее читать, и это режет глаза.

Связывание текстового редактора с Git

Wed, 19 Apr 2017 00:00:00 +0000

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

Миграция на Visual Studio Code

Wed, 15 Mar 2017 00:00:00 +0000

Уже 2 недели я использую Visual Studio Code для работы. Он пришел на замену, моему любимому, атому.

Челлендж JavaScript30

Sat, 10 Dec 2016 00:00:00 +0000

Вы закончили пару курсов и прочитали пару книг о JavaScript, но еще не чувствуете себя уверенно? Wes Bos советует делать проекты и не останавливаться.

Определяем язык страницы в CSS

Thu, 08 Dec 2016 00:00:00 +0000

Для многоязычных сайтов, часто нужно переопределить стили блоков для определенной локали. Раньше я добавлял класс с названием языка тегу body или определял язык через [lang=en]. Сегодня наткнулся на способ получше — псевдокласс:lang.

Код. Удаляем дубликаты из массива

Wed, 30 Nov 2016 00:00:00 +0000

Короткая заметка по теме «Код. Удаляем дубликаты из массива» с основными выводами.

jQuery.width без округления

Tue, 29 Nov 2016 00:00:00 +0000

Я обнаружил что jQuery.width округляет значения. Из-за этого у меня была проблема в 1px при некоторых разрешениях.

Accelerated Mobile Pages

Thu, 03 Nov 2016 00:00:00 +0000

Последнюю неделю я переделывал блог с использованием Google Accelerated Mobile Pages Project (далее АМП). И теперь готов рассказать вам об этом проекте и ответить на вопросы.

Логирование в JavaScript

Sat, 04 Jun 2016 00:00:00 +0000

Логирование — незаменимый инструмент в отладке JS кода. Асставьте логи в критические места и при возникновении ошибки вы сможете посмотреть что произошло в консоли.

Лайфхак. Номер телефона на сайте

Sat, 26 Mar 2016 00:00:00 +0000

Простой способ показывать номер телефона на сайте только в рабочие часы. Решение помогает сократить ночные звонки клиентам без сложной интеграции и дополнительных сервисов.

За и против. Оформление незагруженных изображений.

Tue, 22 Mar 2016 00:00:00 +0000

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

Обновляемся до Jekyll v3.x

Mon, 21 Mar 2016 00:00:00 +0000

Релиз третьей версии генератора статических сайтов Jekyll прошел 27 октября 2015 года. А 1 февраля 2016 года GitHub Pages официально поддерживают Jekyll 3.

На чем тестировать JavaScript фреймворки

Mon, 08 Feb 2016 00:00:00 +0000

Вы увидели новый фреймворк, который конечно в миллион раз лучше текущего. Заманчиво, но использовать его в боевом проекте еще рано. А что тогда делать?

Проверка на блокировку рекламы, или «Пожалуйста, отключите AdBlock»

Mon, 01 Feb 2016 00:00:00 +0000

Cравнить блокировщики можно на сайте с рекламой. На рекламе зарабатывают популярные интернет ресурсы, такие как Хабрахабр, Лайфхакер и множество других.

Что почитать фронтендеру на выходных — 3

Sat, 30 Jan 2016 00:00:00 +0000

Горячие новости 🔥 — Sublime Text жив! B хорошее видео Андрея Листочкина с Харьков JS — Как не гнаться за технологиями и начать жить.

Что почитать фронтендеру на выходных — 2

Fri, 22 Jan 2016 00:00:00 +0000

JavaScript и помочь другим, записавшись в наставники. Рекомендуется запомнить размер 1024×512 и использовать его для изображений, которые будут расшаривать в соц сетях.

Масштабируемый пиксель арт

Thu, 21 Jan 2016 00:00:00 +0000

Только взгляните на этот предмет искусства выше. Восьмибитная ностальгия, красота и простота.

Фоллбэчим Emoji

Wed, 20 Jan 2016 00:00:00 +0000

Показываю, как проверять поддержку emoji и подключать fallback для разных платформ. Так смайлы отображаются предсказуемо и не ломают дизайн на старых системах.

Что почитать фронтендеру на выходных — 1

Sat, 09 Jan 2016 00:00:00 +0000

Я читал на этой неделе Оруэлла — 1984. Давно собирался и вот, к новому году, приобрел себе книженцию и прочитал.

Fira Code: шрифт с лигатурами для кода

Tue, 05 Jan 2016 00:00:00 +0000

В языках программирования много составных операторов, таких как:=, >=, <=, ===,!==. Это одна логическая единица, но она занимает 2 или 3 символа.

Управляем поведением font-face в CSS

Sun, 20 Dec 2015 00:00:00 +0000

Когда вы загружаете шрифт через font-face, браузер решает что отобразить пока шрифт загружается. Браузеры ждут некоторое время, перед тем как решить что делать дальше.

Ускоряем загрузку ресурсов для сайта: preconnect, prefetch, prerender, preloading…

Wed, 02 Dec 2015 00:00:00 +0000

Сегодня мы рассмотрим «HTML5 Link Prefetch», а именно dns-prefetch, prefetch, preconnect, subresource, prerender и еще неработающий preload.

Три плагина, которые сделают Single Page Application лучше

Fri, 13 Nov 2015 00:00:00 +0000

Три плагина для SPA, которые улучшают опыт пользователей с медленным интернетом и на мобильных устройствах. В статье разобраны Pace.js, Offline.js и FastClick.js с примерами, где каждый из них полезен.

Продвинутые favicon для сайта

Thu, 12 Nov 2015 00:00:00 +0000

Это такая штука, которой всегда нет. За свою карьеру только в 3-4 проектах была иконка.

Плагины для Atom #2

Mon, 09 Nov 2015 00:00:00 +0000

Продолжение статьи «Лучшие плагины для текстового редактора Atom». Я расскажу о новых плагинах, которые часто мне помогают.

Партизанский рефакторинг. Как улучшить проект, чтобы заказчик этого не понял.

Sun, 01 Nov 2015 00:00:00 +0000

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

Старт курса по архитектуре JavaScript приложений в SmartJS академии

Fri, 23 Oct 2015 00:00:00 +0000

Вчера, 22 октября 2015 года, начался второй курс по архитектуре современных JavaScript приложений в SmartJS академии.

CSS. Выравнивание блочного элемента по правому краю.

Thu, 22 Oct 2015 00:00:00 +0000

Разбираю способ выравнивания блочных элементов по правому краю и по центру с помощью CSS. Подход подходит для типовых макетов и избавляет от лишних оберток и хака с float.

Одиннадцатиклассница, или фиксим баги с длинным текстом

Fri, 16 Oct 2015 00:00:00 +0000

Эта статья — логическое продолжение статьи «Одиннадцатиклассница, или тестируем баги вёрстки». В ней говорится о тестировании верстки с использованием длинных слов.

Видео и презентации с конференции «FrontTalks» 2015

Mon, 05 Oct 2015 00:00:00 +0000

Конференция «FrontTalks» в 2015 году проходила в Екатеринбурге. Двое из них — англоговорящие и выступали на английском.

Переносим межбуквенный интервал из Фотошопа в CSS

Tue, 22 Sep 2015 00:00:00 +0000

Объясняю, как корректно переносить значение межбуквенного интервала из Photoshop в CSS. Разбираю формулу перевода в letter-spacing, чтобы текст в макете и браузере выглядел одинаково.

Список статичных HTTP серверов для терминала

Mon, 21 Sep 2015 00:00:00 +0000

На основании списка web-servers Вильяма Боверса (William Bowers).

Ускоряем сборку блога на Jekyll

Thu, 17 Sep 2015 00:00:00 +0000

Jekyll — генератор статических сайтов. Чаще всего используется для блогов как альтернатива WordPress.

Контрольные точки медиа выражений Bootstrap

Thu, 27 Aug 2015 00:00:00 +0000

Twitter Bootstrap — самый популярный CSS фреймворк. У него более 85 495 звезд и 35 055 форков на GitHub.

Фронтенд дайджест #2 — БЭМ, CSS матрицы, SVG логотипы, Vivaldi, Bootstrap, Canvas

Fri, 21 Aug 2015 00:00:00 +0000

Когда я нахожу интересные ссылки, то хочу ими поделиться. Поэтому я собираю эти ссылки в Wunderlist, а когда набирается 15, публикую в дайджесте. Презентации «Пишем БЭМ правильно» показывает как надо.

Правильный сниппет медиа выражений для retina

Tue, 18 Aug 2015 00:00:00 +0000

Я видел разные способы определения мониторов retina. Разберемся, какие из media queries использовать.

Фронтенд дайджест #1 — Awesome lists, bower, regexp, RSS, Git

Tue, 11 Aug 2015 00:00:00 +0000

Когда я нахожу интересные ссылки, то хочу ими поделиться. Поэтому я собираю эти ссылки в Wunderlist, а когда набирается 15, публикую в дайджесте. Caption: "Демка с милейшим львом на svg" %}.

RESTful API для фронтенд разработчика

Fri, 07 Aug 2015 00:00:00 +0000

В двух из трех вакансиях для фронтеда требуют знания **REST / RESTful API**. Разберемся что это и в чем разница.

План развития для фронтенд разработчика

Tue, 04 Aug 2015 00:00:00 +0000

После анализа требований к front end разработчикам в топовых компаниях, расставим приоритеты, накидаем план действий, добавим полезные ссылки и советы.

Что нужно знать и уметь front end разработчику в 2015/2016

Thu, 30 Jul 2015 00:00:00 +0000

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

Время обновить clearfix

Wed, 29 Jul 2015 00:00:00 +0000

Clearfix — вспомогательный класс в css, с помощью которого мы исправляем схлопывающиеся размеры контейнера у плавающих элементов.

Вопросы и ответы на собеседовании разработчика интерфейсов #1

Thu, 23 Jul 2015 00:00:00 +0000

Это первый пост из серии ответов на вопросы, которые спрашивают у разработчиков интерфейсов на собеседованиях.

Используем системный шрифт San Francisco на Mac OS

Tue, 21 Jul 2015 00:00:00 +0000

Вместе с выпуском Apple Watch, компания представила новый шрифт San Francisco, который теперь будет использоваться во всей экосистеме Apple.

Полезная привычка #1: Проверяй код перед комитом

Mon, 20 Jul 2015 00:00:00 +0000

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

Гайд по стилю кода на JavaScript от AirBnB

Thu, 09 Jul 2015 00:00:00 +0000

Стиль вашего кода, может сказать о вас достаточно много. Это один из показателей опытного разработчика.

Анимируем высоту c auto в CSS через transition

Mon, 29 Jun 2015 00:00:00 +0000

Пытались ли вы анимировать высоту (height) через CSS? Если пытались, то скорее всего вы знаете, что через transition можно задать анимацию от одного значения, до другого.

Сглаживание шрифтов для разработчика и пользователя на Mac OS

Mon, 01 Jun 2015 00:00:00 +0000

Я давно интересовался сглаживанием шрифта для веб страниц на CSS. Но «волшебные» свойства, такие как -webkit-font-smoothing, не работали на моем Win 7.

Проблема верстки под современные браузеры или борьба с расширениями

Thu, 28 May 2015 00:00:00 +0000

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

Оптимизация верстки под retina дисплеи

Thu, 21 May 2015 00:00:00 +0000

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

Разбираемся со сборкой front end на Gulp

Sun, 17 May 2015 00:00:00 +0000

В последнее время Gulp набирает большую популярность, и понятно почему. Он быстрее, красивее и проще чем **Grunt **.

Вопросы для собеседования кандидату на должность Front-end разработчика

Fri, 15 May 2015 00:00:00 +0000

*Это перевод популярного репозитория от html5bp — Front-end Job Interview Questions (en), который существует с 2009 года.

Быстрый дебаг CSS слоев с Pesticide

Tue, 12 May 2015 00:00:00 +0000

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

Вебинары от Geekbrains (ранее Школа Программирования)

Thu, 07 May 2015 00:00:00 +0000

Хочу поделиться вебинарами от Geekbrains (Школа Программирования). Я недавно нашел эти вебинары, поэтому успел посмотреть только несколько записей.

Стилизуем инструменты разработчика (dev tools) в Google Chrome

Wed, 06 May 2015 00:00:00 +0000

Совсем недавно я узнал, что Chrome поддерживает темы для dev tools. Мне сразу же захотелось попробовать это.

Создаем и настраиваем файл .gitignore в git

Sun, 03 May 2015 00:00:00 +0000

Каждый раз создавать новый файл gitignore немного непрофессионально. Особенно когда ты что-то забываешь и ненужные файлы вываливаются в общий репозиторий.

Руководства по GIT на русском языке

Fri, 01 May 2015 00:00:00 +0000

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

Исключаем папки из обычного и Fuzzy поиска в Atom

Thu, 30 Apr 2015 00:00:00 +0000

Порой, чтобы открыть нужный файл, нужно знать все его название. А все из-за того, что у нас очень много файлов в папках nodemodules и bowercomponents и они мешают открытию написанных нами файлов.

Фиксим Emmet под Atom для работы со Stylus файлами

Mon, 27 Apr 2015 00:00:00 +0000

Расширение Emmet отлично работает с html, css, sass, scss, less. Видимо из-за того, что этот препроцессор не так распространен то в Emmet официально нет его поддержки.

Лучшие плагины для текстового редактора Atom

Sun, 26 Apr 2015 00:00:00 +0000

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

Все еще сидите на Sublime? Тогда мы, вместе с Atom, идем к вам!

Sat, 25 Apr 2015 00:00:00 +0000

В пятницу я пробовал в работе разные текстовые редакторы. Тот же Brackets от Adobe — вообще не изменился, те же проблемы, в том числе со шрифтами и не очень приятный внешний вид.

Еще одна статья про REM vs EM

Wed, 22 Apr 2015 00:00:00 +0000

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

Трюки с SVG и поддержка старыми браузерами

Sun, 19 Apr 2015 00:00:00 +0000

Раньше я не использовал SVG, поскольку рабочие проекты были с поддержкой Internet Explorer 6/7. Да и не требовалось поддержки ретины.

Международный день box-sizing и лучшие практики

Sat, 18 Apr 2015 00:00:00 +0000

Недавно я использовал в проекте css свойство box-sizing: border-box. В процессе этого я узнал про «Международный день box-sizing» (International box-sizing Awareness Day). И хочу рассказать вам что это за праздник, лучшие практики и поддержку свойства box-sizing.

Очищаем кэш Вконтакте и FaceBook при шаринге

Wed, 15 Apr 2015 00:00:00 +0000

Иногда Facebook не желает расшаривать наши страницы, по крайней мере у меня так бывает часто. После нажатия на кнопку « поделиться», Facebook сообщает нам, что страница не найдена.

Минималистичный jQuery плагин, который проверяет элемент на наличие полосы прокрутки

Tue, 14 Apr 2015 00:00:00 +0000

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

Безопасное использование CDN для jQuery, Angular, Bootstrap и других библиотек

Sat, 11 Apr 2015 00:00:00 +0000

Один из главных советов для оптимизации скорости загрузки сайтов является использование публичных CDN с популярными библиотеками, такими как jQuery или AngularJS.

Punto Switcher для разработчиков

Thu, 09 Apr 2015 00:00:00 +0000

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

Типограф Лебедева. Готовим текст к публикации в интернете.

Sat, 04 Apr 2015 00:00:00 +0000

Возможность создать сайт или страничку в интернете есть практически у каждого человека. Не нужно знать различных языков ( HTML, CSS ) и особенностей хостинга, чтобы создать себе сайт.

Доклад-интрига 36. Выступление Вадима Макишвили на FrontTalks.

Sun, 01 Feb 2015 00:00:00 +0000

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