Обновить
256K+

JavaScript *

Прототипно-ориентированный язык программирования

242,43
Рейтинг
Сначала показывать
Порог рейтинга
Уровень сложности

Чему меня научил мой коммит в Angular

Время на прочтение7 мин
Охват и читатели15K

Сегодня я расскажу, как попал в контрибьюторы Angular. Оказалось, это совсем не сложно и весьма увлекательно! Получилась драма с четырьмя актами и одной моралью. Вот, как всё было.

Читать дальше →

Что фронтенд разработчики должны знать о бэкенде?

Время на прочтение5 мин
Охват и читатели16K

Подавляющее большинство вещей, которые должны делать фронтенд разработчики, можно сделать не зная ничего о бэкенде кроме API.


Однако если вы достаточно долго работаете с разного рода задачами, вероятней всего вы столкнетесь с чем-то, что требует некоторых знаний в области бэкенда.


Ниже представлен краткий список того, о чем должен знать разработчик интерфейсов.

Читать дальше →

Дайджест свежих материалов из мира фронтенда за последнюю неделю №405 (2 — 8 марта 2020)

Время на прочтение4 мин
Охват и читатели10K
Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.

Читать дальше →

YouTube — Ошибка. Повторите попытку позже. Идентификатор воспроизведения: <...>

Время на прочтение3 мин
Охват и читатели317K


Чуть больше месяца назад стал замечать, что почти каждая попытка посмотреть видео с YouTube на десктопном компьютере начинается с сообщения об ошибке.

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

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

Под катом — причина возникновения ошибки (для тех, кому лень читать, это AdBlock), и что с этим можно сделать. Конечно, кроме отключения самого блокировщика рекламы.
Читать дальше →

Как «взломать» RedBull

Время на прочтение4 мин
Охват и читатели12K
На самом деле правильнее назвать статью «как накрутить себе баллы в конкурсе, чтобы выиграть целый холодильник RedBull». У нас, кстати, в офисе уже стоит такой холодильник с напитками.



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

Уйти от jQuery к Svelte, как это было

Время на прочтение7 мин
Охват и читатели6.3K
Всем привет.

Это отчёт в продолжение статьи "Уйти от jQuery к Svelte, без боли".

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

Введение


Я планировал переписывать фронтэнд по кусочкам, это не то что бы совсем не получилось, получилось не совсем — переписывать пришлось большими кусками.

Во первых потому что подход jQuery — императивный, подход Svelte — декларативный.

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

Со Svelte получается настоящее ООП: мы не можем внести изменения сами, мы можем только сообщить компоненту о необходимости изменений. Как эти изменения будут сделаны, знает только код внутри компонента.

И это прекрасно :)
Читать дальше →

5 малоизвестных возможностей JSON.stringify()

Время на прочтение4 мин
Охват и читатели37K


Доброго времени суток, друзья!

В этой небольшой заметке я хочу рассказать вам о некоторых редко используемых возможностях JSON.stringify(). Возможно, они окажутся вам полезными.

JSON.stringify() часто используется при отладке для преобразования объекта или обычной строки в строку в формате JSON. Но как данный метод используется, и можем ли мы обойтись toString()? Давайте попробуем это сделать.

// создаем объект user
const user = {
    name: 'Harry Heman',
    age: 29,
    job: 'developer'
}

// преобразуем объект в строку, используя стандартный метод toString(), и выводим результат в консоль
console.log(user.toString()) // [object Object]

[object Object] — это не совсем то, что мы хотели увидеть, не правда ли?

Не спрашивайте, зачем мы вообще используем toString(). Предположим, что нам жизненно необходимо перевести объект в строку.

Теперь попробуем использовать JSON.stringify():

console.log(JSON.stringify(user)) // {"name":"Harry Heman","age":29, "job": "developer"}

Мы сделали это, Карл!

Однако возможности JSON.stringify() этим не исчерпываются.
Читать дальше →

Как потерять всех пользователей вашего телеграм-бота. Краткая инструкция

Время на прочтение2 мин
Охват и читатели13K
Эта поучительная история произошла в прекрасный день 8 декабря 2019 года. В этот день я вспомнил, что телефон, на который заведен наш бот, оформлен на участливую продавщицу из Евросети и, в случае чего, в одночасье исчезнет за невозможностью его восстановить и утащит с собой в небытие наш бот.

Нужно было в похвальном упреждающем режиме перебросить бот на другой телефон.
Прогнав удаление тестового бота в одном аккаунте и мгновенную регистрацию в другом, мы убедились, что все работает как ожидается и повторили процедуру на боевом. Вот как это выглядело:
Читать дальше →

История о том, как я разработал язык программирования

Время на прочтение10 мин
Охват и читатели15K

Привет Хабр! Меня зовут Ильдар. Мне 29 лет. Программирую с 2003 года. За свою жизнь создал 4 фреймворка и язык программирования. В этом посте я поделюсь своим опытом, инсайтами, которые я получил при разработке языка программирования BAYRELL Language. Заранее прощу прощения за возможные синтаксические и пунктуационные ошибки в тексте и отсутствие картинок.

Читать дальше →

Как Амплифер использует Logux — инструмент для связи клиента и сервера

Время на прочтение10 мин
Охват и читатели6.3K

Logux — инструмент для связи клиента и сервера


Меня зовут Виталий Ризо, я старший фронтенд-разработчик в «Амплифере». Поделюсь, как мы применяем Logux в веб-приложении: организуем обмен данными в реальном времени, уведомления об ошибках без перезагрузки страницы, общение между вкладками браузера и интеграцию с Redux.

Читать дальше →

Проекция контента в Angular или затерянная документация по ng-content

Время на прочтение5 мин
Охват и читатели51K
При изучении Angular очень часто упускают или уделяют недостаточное внимание такому понятию, как проекция контента. Это очень мощный инструмент для создания гибких и переиспользуемых компонентов. Но в документации о нем упоминается лишь пару абзацев в разделе Lifecycle hooks. Попробуем исправить данное упущение.


Читать дальше →

Создаем интернет-магазин на Nuxt.js 2 пошаговое руководство Часть 2

Время на прочтение13 мин
Охват и читатели18K


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


Продолжаем разработку нашего интернет магазина. В этой части будет:


  • нормальная загрузка картинок по статическим адресам
  • генерация хлебных крошек на клиенте
  • страница товара
  • шапка
  • рабочая кнопка купить с синхронизацией товаров между вкладками (и сессиями)
Читать дальше →

$mol: 4 года спустя

Уровень сложностиСредний
Время на прочтение30 мин
Охват и читатели41K

nano


Здравствуйте, меня зовут Дмитрий Карловский и я… люблю плевать против ветра. Утираться и снова плевать. Хобби у меня такое. И всё, что я создаю, делаю я без оглядки на тенденции, стараясь решать проблемы системно, а не как привычно. Зачастую бывает, что основная сложность даже не в том, чтобы придумать решение, а в том, чтобы объяснить другим, что проблема вообще существует.


Знаю, я всех уже заколебал, но сегодня, хотелось быть рассказать про разработанный мной 4 года назад фреймворк, какой путь он прошёл, где он сейчас, и куда прокладывает новые пути. Пройдёмся мы и по конкурентам, и по крупным игрокам, и даже по мне самому. Так что никто не уйдёт не обиженным. Статья, как обычно, длинная. Мужайтесь.

Читать дальше →

Ближайшие события

Хабр Конвертер: чтобы версталось легко

Время на прочтение3 мин
Охват и читатели14K
Наверняка многие из вас хотя бы однажды пользовались хабраконвертером, который официально рекомендован администрацией Хабра — https://shirixae.github.io/habraconverter-v2/. Несколько лет назад его создал хабравчанин meta4, а потом доработал Shirixae. Принцип простой: открываете гуглодок с постом, Ctrl-A, Ctrl-C и вставляете в окно конвертера. Нажимаете кнопку «Конвертировать» и получаете готовый код вёрстки, который можно вставлять в редактор Хабра и публиковать. Только перед этим нужно пройтись и поправить кое-какие мелочи.

И всё бы хорошо, если верстать приходится не слишком часто. Или посты небольшие, несложные. Но если вы верстаете помногу, и в постах есть и картинки, и таблицы, и куски кода, то из раза в раз приходится делать рутину: вставлять нужные пустые строки и убирать лишние, заменять теги <sоurce> на <cоde>, и т.д. и т.п. Мы решили потратить день, чтобы потом долетать за час, и допилили конвертер.

Новая версия лежит тут, а под катом — перечисление доработок.
Читать дальше →

Полное руководство по HTML-атрибутам data-*

Время на прочтение8 мин
Охват и читатели114K
Представляем вашему вниманию перевод статьи, посвящённой использованию атрибутов data-*. Это — атрибуты, которые можно применять для удобного хранения в стандартных HTML-элементах различной полезной информации. Эта информация, в частности, может применяться в JavaScript и CSS.


Читать дальше →

Что такое «чистый код» в 2020-м?

Время на прочтение10 мин
Охват и читатели45K

«Чистый код» и чистый кот

Разработчиков хлебом не корми, дай поспорить о чистоте кода: например, недавно шумиху навёл пост Дэна Абрамова «Goodbye, Clean Code».

Но при этом у самого понятия «чистый код» нет чёткого определения. Главная книга по этому вопросу — «Clean Code», где Роберт «Дядюшка Боб» Мартин сразу заявляет: «сколько программистов, столько и определений». Впрочем, из этого он делает не вывод «говорить об этом бесполезно», а вывод «стоит сравнить разные определения». Поэтому в книге он привёл мнения нескольких выдающихся программистов о том, что такое чистый код.

Нам стало интересно: в 2020-м представления человечества о чистом коде остались теми же, или с выхода книги как-то изменились? Различаются ли мнения у разных айтишников: может, бэкендеры видят всё с одного ракурса, а тестировщики с другого?

В апреле Дядюшка Боб прилетит в Петербург выступить на трёх наших конференциях, и они как раз по трём разным направлениям (про .NET-разработку, про тестирование и про JavaScript). Поэтому мы спросили нескольких спикеров этих конференций, что такое чистый код для них, чтобы сравнить мнения экспертов индустрии в 2020-м.

А поскольку тема холиварная, наверняка кто-то из вас окажется не согласен с какими-то из мнений. В таком случае айда спорить в комментариях, это тоже весело!

UPD: Когда мы писали эту статью, Роберт планировал приехать на наши конференции. К сожалению, ситуация изменилась. Также из-за запрета на проведение массовых мероприятий мы перенесли конференции на другие даты. Следите за обновлениями на сайте конференции. 13 марта мы обновили этот пост, чтобы он не содержал некорректную информацию.

Читать дальше →

Борьба с утечками памяти в веб-приложениях

Время на прочтение13 мин
Охват и читатели17K
Когда мы перешли от разработки веб-сайтов, страницы которых формируются на сервере, к созданию одностраничных веб-приложений, которые рендерятся на клиенте, мы приняли определённые правила игры. Одно из них — аккуратное обращение с ресурсами на устройстве пользователя. Это значит — не блокировать главный поток, не «раскручивать» вентилятор ноутбука, не сажать батарею телефона. Мы обменяли улучшение интерактивности веб-проектов, и то, что их поведение стало больше похоже на поведение обычных приложений, на новый класс проблем, которых не существовало в мире серверного рендеринга.


Читать дальше →

Дайджест свежих материалов из мира фронтенда за последнюю неделю №404 (24 февраля — 1 марта 2020)

Время на прочтение4 мин
Охват и читатели12K
Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.

Читать дальше →

Создаем интернет-магазин на Nuxt.js 2 пошаговое руководство Часть 1

Время на прочтение27 мин
Охват и читатели92K


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


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


В этой статье я хочу поделиться как создать примитивный интернет-магазин:


  • Который будет быстро загружаться у пользователя.
  • Который полюбит Google (или любой другой поисковик) с точки зрения SEO.
Читать дальше →

Пишем babel плагин, пошаговое руководство

Время на прочтение7 мин
Охват и читатели9.3K

image


Сегодня я поделюсь с вами пошаговым руководством как написать свой babel плагин. Вы сможете использовать эти знания для автоматизации правок, рефакторинга или кодогенерации.

Читать дальше →