- PVSM.RU - https://www.pvsm.ru -

Дайджест свежих материалов из мира фронтенда за последнюю неделю №215 (6 — 12 июня 2016)

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

Дайджест свежих материалов из мира фронтенда за последнюю неделю №215 (6 — 12 июня 2016) - 1

Веб-разработка [1]
CSS [2]
Javascript [3]
Браузеры [4]
Новости [5]

Дайджест свежих материалов из мира фронтенда за последнюю неделю №215 (6 — 12 июня 2016) - 2 Веб-разработка

Дайджест свежих материалов из мира фронтенда за последнюю неделю №215 (6 — 12 июня 2016) - 22 CSS

Дайджест свежих материалов из мира фронтенда за последнюю неделю №215 (6 — 12 июня 2016) - 36 JavaScript

Браузеры

Дайджест свежих материалов из мира фронтенда за последнюю неделю №215 (6 — 12 июня 2016) - 73 Новости и Занимательное

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

Дайджест за прошлую неделю [115].
Материал подготовили dersmoll [116] и alekskorovin [117].

Автор: Zfort Group

Источник [118]


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

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

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

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

[2] CSS: #css

[3] Javascript: #js

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

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

[6] Веб-стандарты, Выпуск №19 : https://soundcloud.com/web-standards/episode-19

[7] Что должен знать html-верстальщик?: http://krekotun.ru/ui-developer-skills

[8] С какими сервисами сталкивается frontend-разработчик на фрилансе?: https://startpack.ru/business-case/what-apps-faces-frontend-developer-freelancing

[9] Прогрессивные веб-приложения — давайте не будем повторять ошибок, которые были в начале становления отзывчивого дизайна : https://justmarkup.com/log/2016/06/progressive-web-apps-lets-not-repeat-the-errors-from-the-beginning-of-responsive-web-design/

[10] PWA Discovery: вы еще ничего не видели: https://infrequently.org/2016/06/pwa-discovery-you-aint-seen-nothin-yet/

[11] Проблемы и задачи разработчиков при работе с PWA: https://arc.applause.com/2016/06/07/progressive-web-app-issues-and-concerns/

[12] Не стоит безответственно использовать мета-теги iOS для ваших веб-приложений: https://medium.com/@firt/dont-use-ios-web-app-meta-tag-irresponsibly-in-your-progressive-web-apps-85d70f4438cb

[13] Дополнение в Chrome для валидации ваших AMP страниц: https://amphtml.wordpress.com/2016/06/08/a-chrome-extension-to-help-validate-your-amp-pages/

[14] Отладка JavaScript с помощью Chrome DevTools Breakpoints: https://scotch.io/tutorials/debugging-javascript-with-chrome-devtools-breakpoints

[15] Отладка потребления памяти с помощью веб-инспектора в Safari: https://webkit.org/blog/6425/memory-debugging-with-web-inspector/

[16] DevTools Digest: DevTools в 2016-м и после него: https://developers.google.com/web/updates/2016/06/devtools-digest

[17] Как Mozilla помогает разработчикам разбираться с JavaScript ошибками: https://hacks.mozilla.org/2016/06/helping-web-developers-with-javascript-errors/

[18] Что нового в Shadow DOM v1 (в примерах) : http://hayato.io/2016/shadowdomv1/

[19] Bootstrap 4: визуальное руководство и обзор нововведений: https://medium.com/wdstack/bootstrap-4-whats-new-visual-guide-c84dd81d8387

[20] Автоматизируйте вашу разработку с помощью Gulp JS: https://medium.com/@usama.muneer/automate-your-workflow-with-gulp-js-b6670d1fb4b2

[21] CloudFlare представляет cf-ui — открытый UI фреймворк: https://blog.cloudflare.com/cf-ui/

[22] Почему онлайн-хостинг SVG так сложен и как его делать: https://www.sitepoint.com/why-hosting-your-svgs-is-hard-and-how-to-beat-it/

[23] О свойствах и атрибутах в контексте задания маски с помощью SVG: http://vanseodesign.com/web-design/svg-masking-properties-attributes/

[24] MIND Patterns: https://www.gitbook.com/book/ebay/mindpatterns/details

[25] Важность Code Review: https://www.sitepoint.com/the-importance-of-code-reviews/

[26] Погружение в Git: ветки в Git-е: https://www.sitepoint.com/git-branching/

[27] Уникальные градиенты, построенные по данным для визуализаций с d3.js: http://www.visualcinnamon.com/2016/05/data-based-svg-gradient-d3.html

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

[29] Новый черновик CSS-модуля псевдоэлементов 4 уровня: http://css-live.ru/vecssti-s-polej/novyj-chernovik-css-modulya-psevdoelementov-4-urovnya.html

[30] Магия CSS. Глава 3. Таблицы: https://medium.com/@ABatickaya/%D0%BC%D0%B0%D0%B3%D0%B8%D1%8F-css-%D0%B3%D0%BB%D0%B0%D0%B2%D0%B0-3-%D1%82%D0%B0%D0%B1%D0%BB%D0%B8%D1%86%D1%8B-f0f6e0828a22

[31] The magic of CSS: http://adamschwartz.co/magic-of-css/chapters/2-layout/

[32] Семантический CSS: http://css-live.ru/articles/semanticheskij-css.html

[33] Semantic CSS: http://snook.ca/archives/html_and_css/semantic-css

[34] CSS Grid Layout и позиционированные элементы: http://css-live.ru/articles/css-grid-layout-i-pozicionirovannye-elementy.html

[35] CSS Grid Layout and positioned items: https://blogs.igalia.com/mrego/2016/05/27/css-grid-layout-and-positioned-items/

[36] Битва с БЭМ: 10 самых распространенных проблем и способы их решения (часть 1): http://e-planet.ru/company/blog/bitva-s-bem-10-samyh-rasprostranennyh-problem-i-sposoby-ih-reshenija-chast-1.html

[37] Избегайте переопределения базовых стилей: http://snook.ca/archives/html_and_css/avoid-overstyling-base-styles

[38] Резиновый список на Flexbox со страницы AMP Roadmap: https://paulbakaus.com/tutorials/css/flexbox-freebie-auto-growing-list-for-amp-roadmap/

[39] AOS: библиотека для реализация CSS-анимаций при скролле страницы: https://css-tricks.com/aos-css-driven-scroll-animation-library/

[40] Интерактивная визуализация данных: анимация viewBox: https://css-tricks.com/interactive-data-visualization-animating-viewbox/

[41] 4 свойства, которые меняют наш способ использования CSS: http://www.creativebloq.com/web-design/features-transforming-how-we-use-css-31619494

[42] Рационализация функционального CSS: https://marcelosomers.com/writing/rationalizing-functional-css/

[43] Как создать разметку для сайта новостей с Flexbox: http://webdesign.tutsplus.com/tutorials/how-to-build-a-news-website-layout-with-flexbox--cms-26611

[44] Быстрый совет: как z-index и Auto Margin работают во Flexbox: https://www.sitepoint.com/quick-tip-how-z-index-and-auto-margins-work-in-flexbox/

[45] CSS специфичность: http://cssspecificity.com/

[46] EQCSS: http://elementqueries.com/

[47] Изучи Sass (курс в codeacademy): https://www.codecademy.com/learn/learn-sass

[48] Sass Deprecate — Sass-миксин, который сигнализирует об устаревшем коде: https://salesforce-ux.github.io/sass-deprecate/

[49] Китайский текст отображается с разными размерами и шрифтами: шрифтовые проблемы в Китае: http://www.thepixellary.com/chinese-text-displays-in-different-sizes-and-fonts-troubleshooting-chinese-font-problems/

[50] Асинхронность в JavaScript: Пособие для тех, кто хочет разобраться: https://habrahabr.ru/company/wrike/blog/302896/

[51] jQuery 3.0 Final Released: https://habrahabr.ru/post/303034/

[52] Введение в функциональный JavaScript: Часть 1: http://webtackles.ru/javascript/introduction-to-func-js/

[53] Day 1 : https://www.youtube.com/playlist?list=PLCC436JpVnK09bZeayg-KeLuHfHgc-tDa

[54] Day 2: https://www.youtube.com/playlist?list=PLCC436JpVnK0LTDKW3O_BGTZnrZ8dBAof

[55] 7 удивительных «свойств» JavaScript: http://blog.scottlogic.com/2015/07/02/surprising-things-about-js.html

[56] Шокирующий секрет о статических типах: https://medium.com/javascript-scene/the-shocking-secret-about-static-types-514d39bf30a3

[57] TypeScript, WTF?!: https://davidwalsh.name/typescript

[58] Я ошибался относительно TypeScript, и вот почему: https://www.triplet.fi/blog/i-was-wrong-about-typescript-here-is-why/

[59] Делаем ваш JavaScript чистым: http://alistapart.com/article/making-your-javascript-pure

[60] Создание объектов в JavaScript: паттерны и лучшие практики: https://www.sitepoint.com/javascript-object-creation-patterns-best-practises/

[61] Web Storage: меньшее зло для токенов сессии: http://blog.portswigger.net/2016/05/web-storage-lesser-evil-for-session.html

[62] Создание собственной системы тэгов с нуля: http://www.kequc.com/2016/06/03/make-your-own-tagging-system-from-scratch

[63] Зачем нужен key в default props (ReactJS): https://www.reddit.com/r/reactjs/comments/4mjdcf/why_cant_i_put_key_in_default_props_or_define_the/d3xwa6m

[64] lernajs: https://lernajs.io/

[65] Модули ES и Node.js: тяжелый выбор: https://medium.com/@nodesource/es-modules-and-node-js-hard-choices-2b6995e4d491

[66] Почему существуют классы ES6 : http://appendto.com/2016/06/why-do-es6-classes-exist-and-why-now/

[67] 10 функций Lodash, которые могут быть заменены с помощью ES6: https://www.sitepoint.com/lodash-features-replace-es6/

[68] Промисы: все неверные способы: https://blog.getify.com/promises-wrong-ways/

[69] Когда не стоит использовать стрелочные функции: http://rainsoft.io/when-not-to-use-arrow-functions-in-javascript/

[70] 6 советов для более чистых js промисов: http://blog.scottlogic.com/2016/06/10/six-tips-for-cleaner-promises.html

[71] Как добавить ReactJS в существующее веб-приложение: http://prgssr.ru/development/kak-dobavit-reactjs-v-sushestvuyushee-veb-prilozhenie.html

[72] Директивы Angular и их аналоги на React: https://daveceddia.com/angular-directives-mapped-to-react/

[73] Использование React Native: год спустя: https://discord.engineering/using-react-native-one-year-later-91fd5e949933

[74] Масштабирование React.js приложений: https://vimeo.com/168648012

[75] trixly — универсальный стартовый пакет для Angular 2 и React, с тестами на Mocha & Chai, TSLint-валидацией и компиляцией в ES5 c Babel: https://github.com/trixler/trixly

[76] Проверочный лист для код ревью Angular-приложений: https://angularcodereview.com/

[77] Всестороннее погружение в хуки Angular 1.5 lifecycle : https://toddmotto.com/angular-1-5-lifecycle-hooks

[78] «Герой Node» — урок по юнит-тестированию Node.js : https://blog.risingstack.com/node-hero-node-js-unit-testing-tutorial/

[79] Создание Real-time приложений с Websockets и событиями отправляемыми сервером: https://www.sitepoint.com/real-time-apps-websockets-server-sent-events/

[80] Создание приложения видео чата на базе WebRTC с PeerJS: https://www.sitepoint.com/webrtc-video-chat-application-peerjs/

[81] Как сделать существующий API real-time с FeathersJS: https://blog.feathersjs.com/using-feathersjs-to-make-your-existing-api-real-time-813f7c3fd892

[82] chillout.js: https://github.com/polygonplanet/chillout

[83] lodash-bound: https://github.com/elado/lodash-bound

[84] is.js: https://github.com/pwnn/is.js/

[85] seen.js — рендер 3D сцен в SVG или HTML5 Canvas.: http://seenjs.io/index.html

[86] Ресайз картинок в браузере. Все может стать еще хуже: https://habrahabr.ru/post/302744/

[87] Релиз Firefox 47: http://www.opennet.ru/opennews/art.shtml?num=44558

[88] Технические подробности о релизе для веб-разработчиков: http://tanalin.com/blog/2016/06/firefox-47/

[89] Тестирование Firefox 48-beta и Firefox Developer Edition 49: http://www.opennet.ru/opennews/art.shtml?num=44591

[90] Выпуск браузера Opera 38: http://www.opennet.ru/opennews/art.shtml?num=44568

[91] Что нового в Chromium 51 и Opera 38: https://dev.opera.com/blog/opera-38/

[92] В Chrome 51 наблюдаются проблемы с невозможностью использования HTTP/2: http://www.opennet.ru/opennews/art.shtml?num=44561

[93] В стабильной версии Opera 38 появился режим энергосбережения, снижающий температуру ноутбука на 3 градуса: http://itc.ua/blogs/rezhim-energosberezheniya-poyavilsya-v-stabilnoy-versii-opera-38/

[94] В Firefox запланировано включение по умолчанию многопроцессного режима: http://www.opennet.ru/opennews/art.shtml?num=44564

[95] Началось открытие исходных текстов WebGL-движка браузера Microsoft Edge: http://www.opennet.ru/opennews/art.shtml?num=44572

[96] Браузер «Яндекса» обзавёлся персональной лентой рекомендаций «Дзен»: http://www.3dnews.ru/934333/

[97] Яндекс внес изменения в обработку файла robots.txt: http://www.searchengines.ru/yandeks-vnes-izmeneniya.html

[98] Google: у рекламы на AMP-страницах более высокие показатели видимости и CTR: http://www.searchengines.ru/google-y-reklamu-na-amp.html

[99] Google обвиняют в манипуляциях в пользу Хиллари Клинтон: http://www.searchengines.ru/google-autocomplete-clinton.html

[100] Развиваем дизайнерское чутье: https://medium.com/russian/%D1%80%D0%B0%D0%B7%D0%B2%D0%B8%D0%B2%D0%B0%D0%B5%D0%BC-%D0%B4%D0%B8%D0%B7%D0%B0%D0%B9%D0%BD%D0%B5%D1%80%D1%81%D0%BA%D0%BE%D0%B5-%D1%87%D1%83%D1%82%D1%8C%D0%B5-b7cac4a84b56#.g48r4b213

[101] В Индии запретили делать Street View по соображениям национальной безопасности: http://itc.ua/blogs/v-indii-zapretili-delat-street-view-po-soobrazheniyam-natsionalnoy-bezopasnosti/

[102] «ВКонтакте» начала принудительный перевод пользователей на новый дизайн: http://www.cossa.ru/news/244/132301/

[103] Какие стартапы любят европейские инвесторы: топ-20 лучших проектов на TNW Europe 2016: http://ain.ua/2016/06/12/654012

[104] Хакер, сливший данные MySpace, LinkedIn и Tumblr, продает 379 млн аккаунтов Twitter: https://xakep.ru/2016/06/09/twitter-leak/

[105] «Десятка» любой ценой: почему не пошла Windows 10?: http://www.computerra.ru/150299/gwx/

[106] Google Play Music научился подбирать «правильную» музыку, соответствующую текущему моменту: http://itc.ua/news/google-play-music-nauchilsya-podbirat-pravilnuyu-muzyiku-sootvetstvuyushhuyu-tekushhemu-momentu/

[107] Весь мир — карта проблем энергетики: http://batenka.ru/2016/06/08/oil-3/

[108] Как фанат «Звездных войн» придумал языки народов «Игры престолов»: https://esquire.ru/david-peterson

[109] Почему я отказался от $500 000, разозлил инвесторов и закрыл стартап: http://ain.ua/2016/06/11/653897

[110] Мы вас внимательно слушаем.: https://meduza.io/feature/2016/06/07/my-vas-vnimatelno-slushaem

[111] Вибромотор смартфона можно использовать как микрофон для прослушки пользователей: https://xakep.ru/2016/06/08/vibraphone/

[112] Бессмертные спамеры: Почему «нигерийские письма» всё ещё работают: http://secretmag.ru/longread/2016/06/06/bessmertnye-spamery-pochemu-nigerijskie-pisma-vsyo-eshyo-rabotayut/

[113] Влюбиться в робота: как технологии меняют отношения: http://apparat.cc/human/in-love-with-robot/

[114] Линейка для квазара: https://nplus1.ru/material/2016/06/08/wrongqsoredshift

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

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

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

[118] Источник: https://habrahabr.ru/post/303136/?utm_source=habrahabr&utm_medium=rss&utm_campaign=best