Дайджест интересных материалов из мира веб-разработки и IT за последнюю неделю №208 (18 — 24 апреля 2016)

---

Сайт-источник PVSM.RU: https://www.pvsm.ru

Путь до страницы источника: https://www.pvsm.ru/news/118983

Ссылки в тексте:

[1] Веб-разработка: #webdev

[2] CSS: #css

[3] Javascript: #js

[4] Браузеры: #browser

[5] Дизайн: #design

[6] Новости: #news

[7] Занимательное: #intresting

[8] То, что действительно важно: ориентация на критичные задачи: http://frontender.info/what-really-matters-focusing-on-top-tasks/

[9] What Really Matters: Focusing on Top Tasks: http://alistapart.com/article/what-really-matters-focusing-on-top-tasks

[10] Начинаем работу с Browserify: http://prgssr.ru/development/nachinaem-rabotu-s-browserify.html

[11] Getting Started with Browserify: https://scotch.io/tutorials/getting-started-with-browserify

[12] Chrome DevTools: Use Accessibility Inspection to better understand how accessible your markup is: https://umaar.com/dev-tips/101-accessibility-inspection/

[13] Список всего, что может быть в секции head: https://github.com/joshbuchea/HEAD

[14] Доступ к USB устройствам в вебе: https://developers.google.com/web/updates/2016/03/access-usb-devices-on-the-web

[15] Идеальная производительность HTTP: https://www.mnot.net/blog/2016/04/22/ideal-http

[16] Оптимизация скорости сайта: дополнительные советы по ускорению: http://www.catswhocode.com/blog/website-speed-optimization

[17] Шпаргалка по Bootstrap 4: http://hackerthemes.com/bootstrap-cheatsheet

[18] Уменьшаем размер PNG файла: https://medium.com/@duhroach/reducing-png-file-size-8473480d0476

[19] Как создать статический сайт с Metalsmith: http://www.sitepoint.com/create-static-site-metalsmith/

[20] Документы и руководства для Front-end разработчиков (№ 8): http://www.sitepoint.com/20-docs-guides-front-end-developers-8/

[21] Сборник онлайн-инструментов: конструкторы сайтов, логотипов, прототипов, логотипов, страниц и т.п.: http://saijogeorge.com/website-builders/

[22] SVG: немного о моем опыте: http://codepen.io/eltonmesquita/post/svg-a-little-about-my-experience

[23] Стилизация текста с помощью SVG фильтров: https://www.codeschool.com/blog/2016/04/21/styling-text-with-svg-filters/

[24] Радиальные элементы управления с помощью HTML5, CSS, JS и SVG: http://thenewcode.com/1072/Radial-UI-Controls-with-HTML5-CSS-JS-and-SVG-Part-1

[25] Преобразование SVG анимаци в GIF: https://www.youtube.com/watch?v=e68Gsal9acc

[26] Адаптивная композиция логотипа с помощью SVG: http://blog.cloudfour.com/responsive-logo-composition-with-svg/

[27] Boxy SVG: быстрый, простой, бесплатный редактор SVG: http://www.sitepoint.com/boxy-svg-a-fast-simple-insanely-useful-svg-editor/

[28] Еженедельная подборка красивых эффектов на CSS/SVG/JS #34: http://css-live.ru/cssjssvg-s-podvypodvertom/ezhenedelnaya-podborka-krasivyx-effektov-na-csssvgjs-34.html

[29] Низкий FPS при прокрутке страницы. Решение проблемы background-attachment: fixed: https://habrahabr.ru/post/282079/

[30] Houdini: один из самых впечатляющих проектов в CSS, о котором вы никогда не слышали: https://habrahabr.ru/company/mailru/blog/282027/

[31] Наконец-то, CSS в JavaScript! Встречайте CSSX: https://www.smashingmagazine.com/2016/04/finally-css-javascript-meet-cssx/

[32] Возможно, вы не нуждаетесь в CSS фреймворке: https://hacks.mozilla.org/2016/04/you-might-not-need-a-css-framework/

[33] Улучшаем буквицу с помощью “initial-letter”: http://webdesign.tutsplus.com/tutorials/better-css-drop-caps-with-initial-letter--cms-26350

[34] Alphasights: как мы используем BEM для создания модульного CSS: https://m.alphasights.com/how-we-use-bem-to-modularise-our-css-82a0c39463b0

[35] Анализируйте ваш CSS с помощью stylelint: https://css-tricks.com/stylelint/

[36] Flexbox: практические примеры: http://cssmine.com/flexbox-examples

[37] Одна ошибка, которая есть любом CSS фреймворке. Даже в вашем: https://medium.com/@martin_adamko/one-thing-every-css-framework-got-wrong-8ee19f547ca5

[38] Начинаем работать с PostCSS: быстрое руководство для пользователей Sass: https://medium.com/@svilen/getting-started-with-postcss-a-quick-guide-for-sass-users-90c8b675d5f4

[39] Initial, Inherit, Unset, and Revert: http://bitsofco.de/initial-inherit-unset-and-revert/

[40] MaintainableCSS: http://maintainablecss.com/

[41] Inline CSS в Khan Academy: Aphrodite: http://engineering.khanacademy.org/posts/aphrodite-inline-css.htm

[42] Повышаем ваш уровень CSS анимации с помощью кривых Беьзе: http://callmenick.com/post/level-up-your-css-animations-with-cubic-bezier

[43] Flexbox Patterns — примеры использования Fexbox: http://www.flexboxpatterns.com/home

[44] Как создать «прилипающую» навигацию с CSS: https://webdesignviews.com/sticky-navigation-with-css/

[45] Типы данных в Sass: http://www.sitepoint.com/data-types-in-sass/

[46] Что за CSS Modules? Визуальное введение: http://andrewhfarmer.com/what-are-css-modules/

[47] JS Загрузчик + шаблонизатор или история очередного велика: https://habrahabr.ru/post/282041/

[48] Правильная обработка ошибок в JavaScript : https://habrahabr.ru/company/mailru/blog/282149/

[49] NaN это не «не число»: http://frontender.info/nan-is-not-a-not-a-number/

[50] JavaScript модули: руководство для начинающих: http://webtackles.ru/javascript/js-modules-beginners-guide/

[51] Переосмысление современного Javascript. Маленькие библиотеки, делающие хорошо одну вещь — это благослование или проклятье? : https://medium.com/@arsovik/rethinking-modern-javascript-development-6aee92b860aa

[52] Вежливое введение в Javascript TDD: http://jrsinclair.com/articles/2016/gentle-introduction-to-javascript-tdd-intro/

[53] Битва за JavaScript: 4 лидирующих фреймворка: http://blog.debugme.eu/javascript-frameworks-for-2016/

[54] Будущее JavaScript: 2016-й и после него: http://code.tutsplus.com/tutorials/the-future-of-javascript-2016-and-beyond--cms-26305

[55] Почему должны использовать не jQuery, а простой JS: http://lennydevelops.com/javascript/shouldnt-use-jquery-plain-javascript

[56] Быстрый совет: функции выражения против функций деклараций: http://www.sitepoint.com/function-expressions-vs-declarations/

[57] Комплексный взгляд на события в jQuery: http://www.sitepoint.com/comprehensive-events-jquery/

[58] Ты не знаешь Node: быстрое введение в функциональность ядра: http://webapplog.com/you-dont-know-node/

[59] Парсинг CSV файла с помощью JavaScript: http://code.tutsplus.com/tutorials/parsing-a-csv-file-with-javascript--cms-25626

[60] Разработка небольших JS компонентов БЕЗ фреймворков. Вы тоже можете писать на ванильном JS!: https://jack.ofspades.com/developing-small-javascript-components-without-frameworks/

[61] LazyDOM — эксперимент по привнесению виртуального DOM в браузер нативно: https://medium.com/@jayphelps/lazydom-an-experiment-to-bring-virtual-dom-to-the-browser-natively-6a2f47096aca

[62] ES6: ещё о ловушках прокси изнутри: http://css-live.ru/articles/es6-eshhyo-o-lovushkax-proksi-iznutri.html

[63] More ES6 Proxy Traps in Depth: https://ponyfoo.com/articles/more-es6-proxy-traps-in-depth

[64] css-live.ru: http://css-live.ru/

[65] Создание модулей в JavaScript с ES7 и Babel: https://blog.jscrambler.com/creating-modules-javascript-es7-babel/

[66] Pt. II: A Deep Dive into Classes: https://scotch.io/tutorials/better-javascript-with-es6-pt-ii-a-deep-dive-into-classes

[67] Pt. III: Cool Collections & Slicker Strings: https://scotch.io/tutorials/better-javascript-with-es6-pt-iii-cool-collections-slicker-strings

[68] React Amsterdam 2016: https://medium.com/@sapegin/react-amsterdam-2016-20e1052b09f1

[69] Уроки, которые я вынес с React Amsterdam: https://medium.com/@kitze/lessons-learned-at-react-amsterdam-51f2006c4a59

[70] React Native: обзор года: https://code.facebook.com/posts/597378980427792/react-native-a-year-in-review

[71] Babel React Optimize: https://github.com/thejameskyle/babel-react-optimize

[72] Angular 2 Vs. React: http://blog.backand.com/angular-2-vs-react/

[73] Angular 2 + React Native: http://angularjs.blogspot.com/2016/04/angular-2-react-native.html

[74] Невероятная история JavaScript фреймворка Express: http://thefullstack.xyz/history-express-javascript-framework/

[75] Сборка Angular с помощью webpack: http://blog.teamtreehouse.com/26017-2

[76] Быстрый урок: универсальный React, с рендерингом на сервере: https://medium.com/@firasd/quick-start-tutorial-universal-react-with-server-side-rendering-76fe5363d6e

[77] Тестирование в React: стартуем: https://medium.com/javascript-inside/testing-in-react-getting-off-the-ground-5f569f3088a

[78] Быстрая настройка Angular 2 с компонентами и компонентом роутером: http://developer.telerik.com/content-types/tutorials/super-fast-setup-angular-2-components-component-router/

[79] Видео с EmberConf 2016: https://www.youtube.com/playlist?list=PL4eq2DPpyBblc8aQAd516-jGMdAhEeUiW#emberconf2016

[80] EmberConf 2016: бонусное видео — Как начать Ember революцию от Patrick O'Doherty: https://www.youtube.com/watch?v=Z7KIIDW9nZQ

[81] Modaal : http://humaan.com/modaal/

[82] kewler — библиотека для работы с цветами в HEX формате: https://github.com/adriantoine/kewler

[83] Promise Runner — для работы с функциями в асинхронном стиле: https://github.com/pharzan/promiseRunner

[84] Текстовые поля в стиле Excel: http://ncrafts.github.io/tabular-input/

[85] Scrollbear: https://github.com/changbenny/scrollbear

[86] beautify-text: https://github.com/bevacqua/beautify-text

[87] search-index: https://github.com/fergiemcdowall/search-index

[88] Multiple.js — эксперимент с общим фоном для различных элементов: https://nexts.github.io/Multiple.js/

[89] Opera встроила в браузер бесплатный VPN: https://geektimes.ru/post/274731/

[90] Яндекс выпустил Конструктор обновления браузеров: http://www.searchengines.ru/news/archives/yandeks_konstruktor.html

[91] Google Chrome заставил задуматься о прокрастинации в соцсетях: http://www.cossa.ru/news/244/127328/

[92] Аудитория мобильной версии браузера Chrome превысила 1 млрд пользователей: https://vc.ru/n/mobile-chrome-billion

[93] Создание расширений для Microsoft Edge: https://channel9.msdn.com/Events/WebPlatformSummit/edgesummit2016/ES1614

[94] F12 Edge Developer Tools: https://channel9.msdn.com/Events/WebPlatformSummit/edgesummit2016/ES1610

[95] Поддержка WebM, VP9 и Opus в Microsoft Edge: https://blogs.windows.com/msedgedev/2016/04/18/webm-vp9-and-opus-support-in-microsoft-edge/

[96] Дизайн логотипа для адаптивных сайтов: https://spark.ru/startup/webest/blog/14965/dizajn-logotipa-dlya-adaptivnih-sajtov?from=vc

[97] Важность белого пространства в веб-дизайне: http://blogs.adobe.com/dreamweaver/2016/04/the-importance-of-whitespace-in-web-design.html

[98] Будущее типографики: http://designobserver.com/feature/the-future-of-typography/39206/

[99] Плагин AnimateMate, создание анимации прямо в Sketch: http://sketchapp.me/plagin-animatemate-sozdanie-animacii-pryamo-v-sketch/

[100] Прототипирование iOS-приложения в Sketch и Flinto: часть 1: http://sketchapp.me/prototipirovanie-ios-prilozheniya-v-sketch-i-flinto-chast-1/

[101] OOUX: Основа интерактивного дизайна: http://alistapart.com/article/ooux-a-foundation-for-interaction-design

[102] Как выглядит простота в UX дизайне?: http://www.webdesignerdepot.com/2016/04/what-does-simplicity-in-ux-design-look-like/

[103] Космос в веб-дизайне: http://www.dejurka.ru/web-design/space-in-web-design-2/

[104] Как быть более организованным при разработке UI: https://medium.com/@tristanminor/how-to-be-more-organized-while-designing-ui-90d2d69cfb4f#.t5ztzb64b

[105] Использование Atomic дизайна в современной веб-разработке: http://www.webdesignerdepot.com/2016/04/using-atomic-design-in-modern-web-development/

[106] Эпические неудачи с UX (и какие уроки мы можем из этого извлечь): http://www.sitepoint.com/epic-ux-fails/

[107] Новый логотип и айдентика для O Street: http://www.underconsideration.com/brandnew/archives/new_logo_and_identity_by_and_for_o_street.php

[108] iOS 10: пожелания и видео концепта: https://www.macstories.net/stories/ios-10-wishes/

[109] История создания набора иллюстраций на тему «Звездные войны»: https://medium.com/shopify-ux/creative-south-2016-workshop-21a326739e78

[110] История создания игры для Apple часов «Break this Safe»: http://breakthissafe.com/

[111] Цвет в системах дизайна: https://medium.com/eightshapes-llc/color-in-design-systems-a1c80f65fa3

[112] Как мы сделали редизайн Airbnb: http://airbnb.design/live-there/

[113] Как люди открывают пароли в текстовом поле: https://medium.com/@quant_ux/how-people-unmask-passwords-102276c7d803

[114] Отборные ресурсы для маркетологов и дизайнеров: http://email-toolbox.com/

[115] Прототипирование на новом уровне с Framer: https://medium.com/sketch-app-sources/prototyping-just-went-to-the-next-level-with-framer-9e57dd1d43f

[116] Почему навигация Spotify поломана: https://medium.com/user-experience-design-1/why-spotify-s-navigation-is-broken-ce6b4783539d

[117] #SketchTip: Как делиться Artboards с вашей командой: http://www.sitepoint.com/sketch-tips-how-to-share-artboards-with-your-team/

[118] Десять плагинов к фотошопу для ускорения работы с веб-дизайном: http://www.sitepoint.com/10-photoshop-plugins-to-speed-up-your-web-designs/

[119] Первые романские шрифты: http://ilovetypography.com/2016/04/18/the-first-roman-fonts/

[120] Microsoft и Google договорились прекратить регуляторные разбирательства друг против друга: http://itc.ua/news/microsoft-google-dogovorilis-prekratit-regulyatornyie-razbiratelstva-drug-protiv-druga/

[121] Компания Apple обновила MacBook и MacBook Air: http://keddr.com/2016/04/kompaniya-apple-obnovila-macbook-i-macbook-air/

[122] Команда для обхода Windows AppLocker умещается в один твит: https://xakep.ru/2016/04/22/applocker-bypass/

[123] ФБР заплатило за взлом iPhone террориста более миллиона долларов: https://xakep.ru/2016/04/22/fbr-million-dollars-hack/

[124] Акции Alphabet подешевели на 6% после отчёта за I квартал 2016 года: http://www.searchengines.ru/news/archives/aktsii_alphabet.html

[125] Google начал формировать быстрые ответы из комментариев пользователей: http://www.searchengines.ru/news/archives/google_nachal_f.html

[126] Google разработал стратегию помощи владельцам взломанных сайтов: http://www.searchengines.ru/news/archives/google_razrabot.html

[127] Как попасть в большой киберспорт?: http://kanobu.ru/articles/kak-popast-v-bolshoj-kibersport-369412/

[128] Топ-5 лучших стартапов по итогам 2015 года: http://ain.ua/2016/04/20/644608

[129] Сверхтонкие светодиоды позволят создавать носимые на коже электронные устройства: http://itc.ua/news/sverhtonkie-svetodiodyi-pozvolyat-sozdavat-nosimyie-na-kozhe-elektronnyie-ustroystva/

[130] Биотех: законы роста: http://www.computerra.ru/145357/biotekh-zakony-rosta/

[131] «Facebook хочет стать новым интернетом»: https://vc.ru/p/the-facebook-internet

[132] Вся правда о собеседованиях в Google: за пределами NDA: http://blogerator.ru/page/google

[133] Дайджест за прошлую неделю: https://habrahabr.ru/company/zfort/blog/281789/

[134] dersmoll: http://habrahabr.ru/users/dersmoll/

[135] alekskorovin: http://habrahabr.ru/users/alekskorovin/

[136] Источник: https://habrahabr.ru/post/282325/

Нажмите здесь для печати.