For Web — фронтенд, дизайн, программирование
14.6K subscribers
5.47K photos
7 videos
5 files
1.74K links
Новости и полезности для фронтендеров.
Поддержать, чтобы в канале не было рекламы:
https://patreon.com/forweb
https://boosty.to/forweb
Download Telegram
Практическое применение конечных автоматов для рефакторинга плагина, реализующего sticky-поведение, опыт Сергея Виноградова — https://medium.com/p/70ca0bf4ee97
Laws of UX, коллекция ключевых принципов UX от Джона Яблонски с красивыми плакатами и пояснениями — https://lawsofux.com
Как делать доступные проекты, даже если вы работаете на потоке в креативном агентстве или веб-студии, опыт компании Viget — https://goo.gl/16zQUA (часть 1) и https://goo.gl/3b4VgN (часть 2)
Вышел долгожданный Bootstrap 4: проект почти полностью переписан, всё на флексах, отказались от IE9-, добавили поддержку CSS-переменных, подробности и полный список изменений — https://blog.getbootstrap.com/2018/01/18/bootstrap-4/
Чем отличается механизм вывода типов в Typescript, Flow и Reason, исследование Хавьера Чаварри — https://medium.com/p/edef2f4cf2d3
Paper Programs, система для выполнения JavaScript-программ, распечатанных на листах бумаги — https://paperprograms.org/
Adele, коллекция опенсорсных дизайн-систем разных компаний и даже государств — https://adele.uxpin.com/
На собеседованиях иногда просят назвать способы отправки запроса на сервер. Помимо очевидных fetch/XMLHttpRequest и прочих джаваскриптовых штук есть более экзотические способы вроде <img src="...">.

Вчера узнал о ещё более экзотическом и извращённом способе отправки запроса на сервер с помощью CSS:


body::after {
content: url('...');
}


Этот способ может использоваться для аналитики и трекинга пользователей, у которых отключен JS. Можно отследить клики по ссылкам, ввод текста в инпуты, клики по чекбоксам, длительность ховера на каком-либо элементе; также можно приблизительно определить браузер и операционную систему пользователя. Подробности — https://github.com/jbtronics/CrookedStyleSheets

Защититься от этого можно только отключив CSS. Параноикам пора переходить на текстовые браузеры :–)
Frontend Weekend №36, в гостях Людмила Мжачих из Mail.ru: про MoscowCSS, Coding Girls и Лию Веру — https://soundcloud.com/frontend-weekend/fw-36
«Фронтенд-юность» №34: программисты — зажравшиеся мажоры современности, какие бывают компании, лицо и жопки фронтенда, воровство пользовательских данных через NPM-пакет, PWA Tinder — https://soundcloud.com/frontend_u/e34
«Веб-стандарты» №104: уточнение про селектор matches, гриды для бизнеса, нейровёрстка (или как машины вас не заменят), согласие по main, общие JS-модули, шортики и уважение — https://soundcloud.com/web-standards/episode-104
25 бесплатных скринкастов по CSS-гридам от Уэса Боса при поддержке Mozilla Firefox — https://cssgrid.io/
Подробный разбор и сравнение преимуществ и недостатков JavaScript-фреймворков, от самых популярных до экзотических — https://javascriptreport.com/the-ultimate-guide-to-javascript-frameworks/
Шпаргалка по выравниванию в CSS в разных режимах компоновки, от обычных блоков до гридов — https://patrickbrosset.com/lab/2018-01-10-css-alignment-cheatsheet/
Как сверстать аналог графа активности на Гитхабе с помощью CSS-гридов, руководство Ире Адеринокун — https://bitsofco.de/github-contribution-graph-css-grid/
Cафия Абдалла читает исходники Node.js и описывает интересные части кода стандартных модулей: querystring, os, EventEmitter, fs, child process, Buffer, console, path и другие — https://blog.safia.rocks/search/node-module-deep-dive
Подборка малоизвестных браузерных API и возможностей JS: операторы pipeline/void/запятая, атомики, i18n, dataset, лейблы для блоков кода — https://air.ghost.io/js-things-i-never-knew-existed/