В этой статье хочу рассказать о Rolling Scopes School – бесплатном курсе по JavaScript / фронтенду, который я прошла, и который мне очень понравился. Узнала я об этом курсе случайно, информации в сети о нём, на мой взгляд, немного, а курс отличный и заслуживает внимания. Думаю, эта статья будет полезна тем, кто пытается самостоятельно изучать программирование. Во всяком случае, если бы мне кто-то раньше рассказал об этом курсе, я точно была бы благодарна.

Ха, какая изящная маскировка Service Locator-а под DI. Даже может показаться, что это DI! :-)

Это первый коммент к моей предыдущей публикации "Dependency Injection, JavaScript и ES6-модули". Спасибо коллеге symbix 'у за этот коммент, т.к. именно он стало причиной погружения в тонкости отличия одного от другого. Под катом мой ответ на вопрос в заголовке.

(КДПВ особого смысла не имеет и предназначена в первую очередь для визуального опознания этой публикации в ряду других)

Это — первое, что ищут взглядом, когда переключаются между вкладками браузера. Только что мы дали одно из возможных описаний того, что называется «фавиконом». Пространство на экране, которое занимает ярлык вкладки веб-страницы — это гораздо более ценный ресурс, чем многие думают. Если хорошо поработать с ярлыком, то он, помимо того, что будет продолжать играть роль идентификатора страницы, может стать чем-то вроде «доски объявлений», которая сообщает о том, что именно происходит на странице.

Фавикон

Автор материала, перевод которого мы сегодня публикуем, говорит, что новые возможности JavaScript, которые попали в стандарт ES2019, уже официально доступны в браузерах Chrome, Firefox и Safari, а также на платформе Node.js. Если нужно поддерживать устаревшие браузеры, то воспользоваться новшествами можно, транспилируя JS-код с помощью Babel. Здесь мы рассмотрим примеры использования некоторых новых возможностей JS.

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

Привет, читатель.

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

Максимальная глубина рекурсии ограничена движком JavaScript. Точно можно рассчитывать на 10000 вложенных вызовов, некоторые интерпретаторы допускают и больше, но для большинства из них 100000 вызовов – за пределами возможностей. Существуют автоматические оптимизации, помогающие избежать переполнения стека вызовов («оптимизация хвостовой рекурсии»), но они ещё не поддерживаются везде и работают только для простых случаев.

Пример рекурсивной функции:

function sum(n) {
  return n === 0 ? 0 : n + sum(n - 1)
}

sum(5) // 1 + 2 + 3 + 4 + 5  = 15
sum(100000) // Error: Maximum call stack size exceeded.

Привет! Это пост-отчёт с Panda Meetup #22, который проходил в офисе Авито. Мы обсуждали тестирование на основе свойств, работу со «сложными» данными (объектами с большой вложенностью и хитрой структурой), плагины vue-cli и декларативный Angular (почему бы и нет?).

Заходите под кат, если вам интересны эти темы. Внутри вы найдёте материалы встречи: презентации спикеров, видеозаписи, отзывы гостей митапа и ссылки на фотоотчёт.

Мне нравится метал музыка разных направлений. Для отслеживания новинок я сделал парсер, который ищет свежие альбомы и складывает их в базу. За время существования приложения парсер я почти не трогал, хотя он и далек от идеала, а вот фронтенд был переделан несколько раз.

Под катом рассказ о том, как я переписал приложение с react-native на Svelte и опубликовал его в Google Play.

Ещё одна имплементация Dependency Injection в JavaScript — с ES6-модулями, с возможностью использовать один и тот же код в браузере, и в nodejs и не использовать транспиляторы.

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

Сегодня мы публикуем вторую часть перевода материала о новшествах JavaScript. Здесь мы поговорим о разделителях разрядов чисел, о BigInt-числах, о работе с массивами и объектами, о globalThis, о сортировке, об API интернационализации и о промисах.



→ Первая часть

И снова здравствуйте. На связи Омельницкий Сергей. Сегодня я поделюсь с Вами одной из своих головных болей, а именно — что делать, когда проект пишут много разноуровневых программистов на примере angular приложения.

Так повелось, что я долгое время работал только со своей командой, где мы уже давно согласовывали правила оформления, комментирования, отступы и т.п. Притерлись к ним и жили дружно и счастливо. На радостях я даже опубликовал статью на Хабр по нашему кодстайлу. Поэтому из чего-то магического мы использовали только tslint на пре-коммит.

И тут мы разрослись. Появился новый проект с унаследованным кодом, а к нему в придачу новые разработчики в размере 4-х добрых молодцев. И чет тут пошло не по плану.

Материал, первую часть перевода которого мы сегодня публикуем, посвящён новым стандартным возможностям JavaScript, о которых шла речь на конференции Google I/O 2019. В частности, здесь мы поговорим о регулярных выражениях, о полях классов, о работе со строками.

Ретроспективные проверки в регулярных выражениях

Регулярные выражения (Regular Expression, сокращённо — RegEx или RegExp) — это мощная технология обработки строк, которая реализована во множестве языков программирования. Регулярные выражения оказываются очень кстати в тех случаях, когда нужно, например, выполнять поиск фрагментов строк по сложным шаблонам. До недавнего времени в JavaScript-реализации регулярных выражений имелось всё кроме ретроспективных проверок (lookbehind).

Для того чтобы разобраться с тем, что такое ретроспективная проверка, поговорим сначала об опережающих проверках (lookahead), которые уже поддерживаются в JavaScript.

→ Вторая часть

* скорее всего, я что-нибудь да упустил, но уверен, в комментариях мне это подскажут

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


Содержание.

1. Введение
2. Заблуждения о this
3. Как определить значение this

Дорогие товарищи инженеры и будущие инженеры, сообщество Метархия открывает набор на бесплатный курс «Основы программирования», который будет доступен на youtube и github без всяких ограничений. Часть лекций уже записана в конце 2018 и начале 2019 года, а часть будет прочитана в Киевском политехническом институте осенью 2019 года и сразу же доступна на канале курса. Начало курса 3 сенября. Опыт предыдущих 5 лет, когда я делал более сложные лекции, показал необходимость лекций и для самых начинающих. В этот раз, по многочисленным просьбам студентов, я постараюсь добавить много материалов по основам программирования и, по возможности, абстрагировать курс от JavaScript. Конечно большинство примеров останутся на JavaScript, но теоретическая часть будет гораздо шире, и не ограничится синтаксисом и API языка. Часть примеров будет на TypeScript и C++. Это не курс по голому JavaScript, но фундаментальный курс по основам программирования, включая основные концепции и шаблоны проектирования для разных парадигм, функционального, процедурного, объектно-ориентированного, обобщенного, асинхронного, реактивного, параллельного, мультипарадигменного и метапрограммирования, а так же основы структур данных, тестирования, принципы построения структуры и архитектуры проектов.

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

TL;DR

---

VKScript — это не JavaScript. Семантика этого языка кардинально отличается от семантики JavaScript. См. заключение.

Посмотреть демо версию программы здесь.

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

Автор материала, перевод которого мы публикуем сегодня, говорит, что миссия разработчиков Apollo Client заключается в том, чтобы сделать этот инструмент самым современным и удобным решением для управления состоянием React-приложений. Сообщество React развивается и осваивает новые эффективные способы разработки пользовательских интерфейсов. Создатели Apollo Client стремятся к тому, чтобы их проект поддерживал бы всё самое актуальное из мира React. Следуя этой традиции, разработчики Apollo Client представляют новую версию системы, оснащённую поддержкой хуков React.



Хуки были представлены в React 16.8. Это — новый механизм, позволяющий создавать компоненты, обладающие состоянием, и при этом не сталкиваться с проблемами, характерными для компонентов, основанных на классах. Сейчас Apollo Client включает в себя три хука, которые можно использовать в приложениях — во всех тех местах, где используются компоненты высшего порядка или механизмы render props. Речь идёт о хуках useQuery, useMutation и useSubscription. Эти хуки просты в освоении, они обладают множеством преимуществ перед ранее существовавшим API. В частности, это касается уменьшения размеров бандла приложения и сокращение объёма шаблонного кода.

Всем привет. Сегодня делимся с вами заключительной частью статьи «Тестирование инфраструктуры как код с помощью Pulumi», перевод которой подготовлен специально для студентов курса «DevOps практики и инструменты».

Тестирование развертывания

Рассмотренный стиль тестирования — это мощный подход, он позволяет нам проводить тестирование белого ящика для проверки внутренностей работы нашего инфраструктурного кода. Однако он несколько ограничивает то, что мы можем проверить. Тесты выполняются на основе in-memory плана развертывания, созданного Pulumi перед непосредственным развертыванием и поэтому само развертывание не протестировать. Для таких случаев в Pulumi есть фреймворк интеграционных тестов. И эти два подхода отлично работают вместе!

Состояние используется для организации наблюдения за данными React-приложений. Состояния меняются по мере того, как пользователи взаимодействуют с приложениями. Когда пользователь выполняет некое действие — нам нужно обновить состояние, представляющее собой набор данных, на основе которых формируется то, что пользователь видит на экране. Обновляют состояния React-приложений с помощью метода setState.



Так как состояния не должны обновляться напрямую (в React состояние должно быть иммутабельным), при усложнении структуры состояний работа с ними превращается в весьма нетривиальную задачу. А именно, программисту становится непросто ориентироваться в состоянии и пользоваться его данными в приложении.