Обновить
512K+

JavaScript *

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

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

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 года. В этот день я вспомнил, что телефон, на который заведен наш бот, оформлен на участливую продавщицу из Евросети и, в случае чего, в одночасье исчезнет за невозможностью его восстановить и утащит с собой в небытие наш бот.

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

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

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


Как и обещал продолжаем.


В этой части:


  • создадим блоки товаров "С этим товаром также покупают" и "Интересные товары"
  • создадим иконку корзины с количеством товаров
  • подключим модальное окно с товарами в корзине
  • перепишем всю логику store
Читать дальше →

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

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

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

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

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

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

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


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

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

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

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


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

Асинхронное программирование с async/await

Время на прочтение9 мин
Охват и читатели34K
Доброго времени суток, друзья!

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

Условия: базовая компьютерная грамотность, знание основ JS, понимание азов асинхронного кода и обещаний.
Цель: понять, как устроены обещания, и как они используются.
Читать дальше →

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

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


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


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


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

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

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

nano


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


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

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

JavaScript библиотека Webix глазами новичка. Часть 6. Взаимодействие с сервером

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


Я — начинающий front-end разработчик. Сейчас я учусь и стажируюсь в одной минской IT компании. Изучение основ web-ui проходит на примере JS библиотеки Webix. Я хочу поделиться своим скромным опытом и сохранить его в виде небольшого учебного пособия по этой интересной UI библиотеке.
Читать дальше →

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

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

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

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

Когда JavaScript-фреймворк не нужен

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

Фото — Maria Teneva, площадка Unsplash

Иногда React, Angular, Vue.js и т. д. — это лишнее

Правда ли, что JavaScript-фреймворков слишком много и выбор становится чересчур сложным? Или, может, мы просто забыли о соображениях производительности и о том, что за лишний трафик в итоге должны платить пользователи?

Вернемся в эпоху jQuery


Помните, было время, когда JQuery использовали для всего! JQuery то, jQuery сё — повсюду легкий аромат jQuery. На любом веб-сайте и в каждом веб-приложении — jQuery.

В чем причина популярности этой библиотеки?

Простой JavaScript казался слишком сложным в применении. К тому, же между браузерами было много отличий.

Но пришло спасение — библиотека jQuery избавила сообщество JavaScript от этой головной боли. Правда, большинство из нас в результате стали лениться, поскольку перестали понимать, что происходит «под капотом».

Я прозрел, когда появился этот сайт.

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

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

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


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

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

Секция Frontend на DUMP2020: вангуем, что снова будет аншлаг. Топ докладов прошлого года и темы этого

Время на прочтение5 мин
Охват и читатели1.8K
Кто согласен, что современный фронтенд — это сложно, поднимите руки! Ради чего мы мучаемся с настройкой Webpack? Почему реализация SSR требует писать столько кода, и нужен ли он нам вообще такой ценой? Кто виноват и что мы, как разработчики, можем сделать?

Мы стараемся ответить на эти и сотни других вопросов в секции Frontend. И год от года темы становятся все разнообразнее и хардкорнее. А основной лейтмотив секции — эксперименты.
Смотрите под катом, кто над чем экспериментировал в прошлом году, и что будут рассказывать и показывать в этом


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

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

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

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

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

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

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

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

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

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

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

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


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

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

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

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

Последовательный fetch и 5 способов решения

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


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

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

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

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


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


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


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


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

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

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

image


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

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