Тестов много не бывает — это все знают. Мемы про unit и интеграционное тестирование уже не очень-то веселят. А мы по-прежнему не знаем, можно ли полагаться на результаты прохождения тестов, и какой процент покрытия позволит не пустить баги в продакшен. Если фатальные изменения в коде проскакивают тесты, не оказывая влияния на их результат, то решение напрашивается само — надо тестировать тесты!



О подходе к автоматизации этой задачи и был доклад Марка Лангового на Frontend Conf. Видео и статья короткие, а идеи очень рабочие — надо брать на заметку.

Сегодня публикуем четвёртую часть перевода руководства по JavaScript, которая посвящена функциям.

→ Часть 1: первая программа, особенности языка, стандарты
→ Часть 2: стиль кода и структура программ
→ Часть 3: переменные, типы данных, выражения, объекты
→ Часть 4: функции
→ Часть 5: массивы и циклы
→ Часть 6: исключения, точка с запятой, шаблонные литералы
→ Часть 7: строгий режим, ключевое слово this, события, модули, математические вычисления
→ Часть 8: обзор возможностей стандарта ES6
→ Часть 9: обзор возможностей стандартов ES7, ES8 и ES9

Функции в JavaScript

Поговорим о функциях в JavaScript, сделаем их общий обзор и рассмотрим подробности о них, знание которых позволит вам эффективно ими пользоваться.

20 — 21 октября в Москве проходил международный хакатон NASA Space Apps Challenge. Его организаторами в России выступили ребята из сообщества Russian.Hackers. В рамках мероприятия участникам было предложено решить 20 кейсов по различным тематикам: от съемки фильма о хакатоне до разработки приложений мониторинга и проектирования автономных летательных аппаратов. Полный список тем можно изучить по ссылке или в статье на Хабре.

Наша команда “Space Monkeys”, в которую входили Олег Бородин (Front-end developer в Singularis lab), Владислав Плотников (QA engineer в Singularis lab), Егор Швецов, Дмитрий Петров, Юрий Бедеров и Николай Денисенко, выбрала для решения проблему под броским названием “Spot that fire!”, которая сформулирована следующим образом: “Применить краудсорсинг, чтобы люди могли вносить свой вклад в обнаружение, подтверждение и отслеживание лесных пожаров. Решением может быть мобильное или веб приложение.”

В силу того, что в команде было собрано 5 разработчиков с опытом разработки под различные платформы, сразу же было решено, что прототип нашего приложения будет реализовываться под Web и Mobile платформы.

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

Я понимаю, что, возможно, Апач на данный момент не является предпочтительным выбором для запуска на нём новых проектов, то тем не менее, он существует, здравствует и проекты на нём таки работают. Выбор на него может пасть по каким-то личным предпочтениям, по требованиям совместимости, или каким-то другим соображениям… не суть. В этой статье я хочу по пунктам описать, как настроить поддержку протокола HTTP/2 на веб-сервере Apache, потому что сам им пользуюсь и в такой статье нуждаюсь нуждался, и надеюсь, что кому-нибудь она тоже пригодится на практике.

В определённый момент появилась задача — перевести, существующий и активно работающий в production, проект на работу в кластере серверов. Т.к. проект разработан на базе 1C-Bitrix, было принято решение построить кластер с использованием «1С-Битрикс»: Веб-окружение». Цель данного мероприятия — получить возможность выдерживать большие нагрузки при наплывах посетителей сайта, а также возможность в дальнейшем быстрее масштабироваться горизонтально.

Velocity — это конференция, которая посвящена распределённым системам. Её организует издательство O'Reilly, и она проходит трижды в год: один раз в Калифорнии, один раз в Нью-Йорке и один раз в Европе (причём город меняется каждый год).

В 2018 году конференция была в Лондоне с 30 октября по 2 ноября. Главный офис Badoo находится там же, так что у нас с коллегами было сразу два повода съездить на Velocity.

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

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

В Сколково отгремела двенадцатая по счету HighLoad++. Конференция собрала больше 3000 участников, профессионалов в области работы с высоконагруженными системами. Коллеги обменивались опытом построения и развития архитектуры крупных проектов, говорили о базах данных, системах хранения, системном администрировании, нагрузочном тестировании, эксплуатации крупных проектов.
Мы традиционно принимали активное участие в HighLoad++. В этом посте я хочу поделиться материалами докладчиков от Авито, впечатлениями от конференции. И рассказать, что это за странный синий бак на этом фото.

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

→ Часть 1: первая программа, особенности языка, стандарты
→ Часть 2: стиль кода и структура программ
→ Часть 3: переменные, типы данных, выражения, объекты
→ Часть 4: функции
→ Часть 5: массивы и циклы
→ Часть 6: исключения, точка с запятой, шаблонные литералы
→ Часть 7: строгий режим, ключевое слово this, события, модули, математические вычисления
→ Часть 8: обзор возможностей стандарта ES6
→ Часть 9: обзор возможностей стандартов ES7, ES8 и ES9

Введение

Angular предоставляет удобный декларативный способ подписки на события в шаблоне, с помощью синтаксиса (eventName)="onEventName($event)". Вместе с политикой проверки изменений ChangeDetectionStrategy.OnPush подобный подход автоматически запускает цикл проверки изменений только по интересующему нас пользовательскому вводу. Иными словами, если мы слушаем (input) событие на <input> элементе, то проверка изменений не будет запускаться, если пользователь просто кликает по полю ввода. Это значительно улучшает
производительность, по сравнению с политикой по умолчанию (ChangeDetectionStrategy.Default). В директивах мы также можем подписаться на события на хост-элементе через декоратор @HostListener('eventName').

В моей практике нередко встречаются случаи, когда обработка конкретного события требуется только при выполнении какого-либо условия. т.е. обработчик выглядит примерно так:

Автор материала, перевод которого мы сегодня публикуем, говорит, что он, возможно, слишком торопится, но то, о чём он хочет рассказать, представляет собой, по меньшей мере, весьма интересную новость. Речь идёт о настольных прогрессивных веб-приложениях, которые вполне могут значительно потеснить позиции приложений, основанных на Electron.

Привет, Хабр! Давно я сюда ничего не писал, со времён моего золотого поста про переход Opera на WebKit прошло уже пять лет. Но тут появился повод: завёл себе блог на Ютубе. Чтобы понять, зачем и что это такое — смотрите пилот. Если коротко: чтобы разбирать сайты и отвечать на вопросы. А сейчас перед вами 9-й выпуск с ответами на вопросы. Под катом подробности, ссылки, почта для связи и спойлер с остальными видео. Если меня здесь не съедят живьём — буду продолжать постить сюда раз в неделю новые.

Адаптировано из нашей будущей книги «Рефакторинг UI»

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



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

(Иллюстрация)

Senior web developer’ы Антон и Алексей продолжают рассказ о непростой борьбе с Nuxt. В предыдущем раунде битвы с этим фреймворком они показали, как запустить проект на Nuxt так, чтобы все были счастливы. В новой статье поговорим о реальном применении фреймворка.

Мы начали переписывать проект с огромным техническим долгом. Месячная аудитория составляла 6-7 млн. уникальных посетителей, но существующая платформа доставляла слишком много проблем. Поэтому было решено отправить ее на пенсию. Само собой, производительность была нашим наибольшим опасением, но также не хотелось просесть по SEO.

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

Сегодня мы публикуем перевод следующей части руководства по JavaScript. Здесь мы поговорим о стиле кода и о лексической структуре программ.

→ Часть 1: первая программа, особенности языка, стандарты
→ Часть 2: стиль кода и структура программ
→ Часть 3: переменные, типы данных, выражения, объекты
→ Часть 4: функции
→ Часть 5: массивы и циклы
→ Часть 6: исключения, точка с запятой, шаблонные литералы
→ Часть 7: строгий режим, ключевое слово this, события, модули, математические вычисления
→ Часть 8: обзор возможностей стандарта ES6
→ Часть 9: обзор возможностей стандартов ES7, ES8 и ES9

Как известно, HTTP 1.1 — это текстовой протокол передачи данных. HTTP сообщения закодированы, используя ISO-8859-1 (которую условно можно считать расширенной версией ASCII, содержащей умляуты, диакритику и другие символы, используемые в западноевропейских языках). При этом в теле сообщений можно использовать другую кодировку, которая должна быть обозначена в заголовке «Content-Type». Но что делать, если нам необходимо задать non-ASCII символы не в теле сообщения, а в самих заголовках? Наверное, самый распространенный кейс — это проставление имени файла в «Content-Disposition» заголовке. Это, казалось бы, довольно распространенная задача, но ее реализация не так очевидна.

TL;DR: Используйте кодировку, описанную в RFC 6266, для «Content-Disposition» и преобразуйте текст в латиницу (транслит) в остальных случаях.

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



Это руководство, по замыслу автора, рассчитано на тех, кто уже немного знаком JavaScript и хочет привести свои знания в порядок а также узнать о языке что-то новое. Мы решили немного расширить аудиторию этого материала, включить в неё тех, кто совершенно ничего не знает о JS, и начать его с написания нескольких вариантов «Hello, world!».

→ Часть 1: первая программа, особенности языка, стандарты
→ Часть 2: стиль кода и структура программ
→ Часть 3: переменные, типы данных, выражения, объекты
→ Часть 4: функции
→ Часть 5: массивы и циклы
→ Часть 6: исключения, точка с запятой, шаблонные литералы
→ Часть 7: строгий режим, ключевое слово this, события, модули, математические вычисления
→ Часть 8: обзор возможностей стандарта ES6
→ Часть 9: обзор возможностей стандартов ES7, ES8 и ES9

Автор материала, перевод которого мы сегодня публикуем, создал 33 расширения для VS Code. Он решил поделиться с теми, кому нравится этот редактор, методикой разработки и поддержки расширений. Кроме того, он кратко рассказал о своих проектах. Возможно, вы найдёте среди них что-нибудь такое, что вам пригодится.

Свежая подборка со ссылками на новости и материалы. В выпуске: принят PSR-18, статистика версий PHP от Packagist, анонсы митапов и карта митапов, PHP 7.3.0RC5 и другие релизы, порция полезных инструментов, о будущем PHP-дайджеста, и многое другое.
Приятного чтения!

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