Обновить
256K+

JavaScript *

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

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

Как подготовиться к собеседованию с помощью Telegram-бота на Node.js

Уровень сложностиПростой
Время на прочтение14 мин
Охват и читатели13K

В этой статье мы разработаем бота для подготовки к собеседованиям. Он будет задавать вопросы по HTML, CSS, JS и React. При этом часть из них будет с вариантами ответа, а часть — без. Базу вопросов вы сможете пополнять самостоятельно.

Во время разработки вы научитесь работать с Telegram Bot API с помощью grammY и Node.js, а также самостоятельно деплоить ботов на сервер.
Читать дальше →

Open-source блокнот Wolfram Language или как воссоздать минимальное ядро Mathematica на Javascript и не только

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

На Хабре уже проскакивали упоминания о совместимых или систем-копиях Wolfram Mathematica, но реализованных на других языках, скажем, Mathics. В качестве расширения этой ниши я представляю молодую систему, которая не только воспроизводит многие ключевые функции блокнота Mathematica с нуля, но и расширяет функционал гораздо дальше, чем там, где очертил его границы Стивен Вольфрам, создав эту потрясающую систему более 30-ти лет назад.

Читать далее

Современный junior frontend developer на двух работах уровня middle с общей ЗП 400к. Реальность ли в 2023 году?

Уровень сложностиПростой
Время на прочтение9 мин
Охват и читатели79K

Привет. Большая и длинная история, которая только в самом конце превращается в историю успеха. Рекомендуется всем, кто хочет войти в ИТ или уже там.

Читать далее

Как мы создаём Squadus. Реализуем «прыжок к сообщению» в мобильной версии

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

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

Сегодня расскажем о том, как в мобильной версии Squadus реализовали востребованную функцию — «прыжок к сообщению» в чате (jump to message).

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

О технических аспектах реализации «прыжка к сообщению» читайте под катом.

Читать далее

Видеоредактор, работа с видео и зачем там Canvas

Уровень сложностиПростой
Время на прочтение5 мин
Охват и читатели5.3K

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

Одной из задач, где мы в Ozon используем Canvas, является обработка видео. Для это у нас реализован минималистичный видеоредактор. Зачем нужно было делать свой редактор для веба и почему не использовать готовый? Все ответы под катом.

Читать далее

Как я разбирал нестандартный формат 3D-моделей, чтобы показывать Лего у себя на сайте

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

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

Я перепробовал несколько редакторов 3D-моделей Лего (моим главным условием была работа на Linux, либо в вебе), и остановился на онлайн-редакторе Mecabricks. Но, уже перенеся туда несколько из моих творений, понял, что с задачей «показывать всем друзьям» всё будет сложнее: у Mecabricks довольно скудные возможности экспорта, а его собственный формат с расширением .zmbx понимает только он и его плагин для Blender.

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

В этой статье я расскажу, как постепенно разбирал этот непонятный .zmbx, про устройство и преимущества glTF как формата передачи 3D-ассетов между разными инструментами, и про то, какие проблемы я решал, конвертируя одно в другое.
Читать дальше →

Простые правила при работе с растровыми изображениями на каждый день

Уровень сложностиПростой
Время на прочтение6 мин
Охват и читатели13K

Привет, меня зовут Денис, я руковожу направлением разработки в Домклик. Дополнительно несу ношу лидера frontend-направления в нашей компании. Не так давно я отрефакторил систему собеседований для frontend-разработчиков, попутно тестируя технические вопросы на внешних и внутренних респондентах. И пришёл к выводу, что множество мной опрошенных разработчиков, вне зависимости от уровня, не знают или просто не обращают внимание на базовые правила при работе с картинками. В результате на просторах интернета зачастую можно найти изображения размером 200 на 200 пикселей и весом в несколько мегабайтов со смещением макета, столь раздражающим пользователей. Если вам интересно, как практически без вложений улучшить пользовательский опыт, то прошу под кат.

Читать далее

Принцип работы async/await в JavaScript

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


Если вам доводилось работать с JavaScript, то вы наверняка встречались с синтаксисом async/await. Эта функциональность позволяет прописывать асинхронную логику синхронным образом, упрощая тем самым её понимание. Некоторым ветеранам JS известно, что async/await – это просто синтаксический сахар для существующего Promises API. Это означает, что в JS должен быть способ реализации функциональности async/await без использования ключевых слов async и await, хоть и более громоздкий. Именно об этом и пойдёт речь в данной статье.

Видео от автора на ту же тему.
Читать дальше →

Релиз Bun 1.0 (новый runtime для JavaScript )

Уровень сложностиПростой
Время на прочтение12 мин
Охват и читатели42K

Представляем Bun версии 1.0.

Bun — это быстрый и универсальный набор инструментов для запуска, сборки, тестирования и отладки JavaScript и TypeScript кода (от одного файла до fullstack-приложения). Сегодня Bun стабилен и готов к продакшену.

Читать далее

Бот-сказочник, или как генерировать истории с помощью ChatGPT и Telegram

Уровень сложностиПростой
Время на прочтение5 мин
Охват и читатели12K

Представьте, что вам нужно написать художественный роман. У вас есть ключевые идеи, продуманы основные повороты событий, но нет возможности объединить все в одну историю.

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

Такая же проблема может встретиться, например, если нужно написать пост или оформить описание рабочего проекта. Если вам это знакомо, то просто автоматизируйте процесс. Можно написать специального бота, который будет из тезисов генерировать цельную историю с помощью ChatGPT, а после — записывать в Notion. Реализовать такой проект и задеплоить его на сервер несложно — посмотрим, как это сделать.
Читать дальше →

Рефлексия в JavaScript и TypeScript: обзор основных техник. Как сгенерировать CLI-интерфейс для класса

Уровень сложностиСредний
Время на прочтение22 мин
Охват и читатели20K
Как и в любом достаточно динамическом языке, в JavaScript из коробки есть способы разобрать в рантайме структуру его значений — определить типы, ключи объектов, получить конструкторы и прототипы.

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

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

JavaScript повсюду или почему веб-технологии захватили мир

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

Я давно слежу за развитием веб-технологий и каждый раз, натыкаясь на очередной холивар в интернете про злой и страшный JavaScript, залезающий на чужую территорию, инстинктивно хочу побыть его адвокатом. Обычно все мои доводы сводятся к банальному “не мы такие, жизнь такая” или “ничего личного, просто бизнес”, но в этот раз захотелось развернуто обосновать причины популярности веб-технологий.

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

Читать далее

DOM, DI и View: деревья в Angular

Уровень сложностиСложный
Время на прочтение8 мин
Охват и читатели16K

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

Читать далее

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

Одно PWA, чтоб править всеми

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

Термин PWA появился еще в 2015 году, но из-за браузерных разногласий долгое время был лишь красивой идеей. В 2023 году возникла надежда, что на iOS появятся альтернативные браузерные движки, а это может привести к тому, что для создания почти полноценных аналогов нативных приложений будет достаточно знаний фронтенда.

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

Делимся расшифровкой доклада и видеозаписью. Повествование будет от лица Никиты.

Читать далее

Деплой приложения с nginx как по нодам

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

Привет, Хабр! В этом материале мы разберем деплой приложения на React, арендуем облачный сервер и настроим nginx. Здесь будет необходимый минимум для фронтенд-разработчика:

  • Заливка проекта на GitHub.
  • Аренда и настройка облачного сервера по SSH.
  • Настройка nginx для раздачи статических файлов.
  • Сжатие бандла.
  • Подключение домена.
  • Настройка HTTPS.
  • Настройка Docker.

Для этого материала также доступна видеоверсия.
Читать дальше →

Как обходится ограничение скорости скачивания с YouTube

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

Вы когда-нибудь пробовали скачивать видео с YouTube? Я имею в виду ручками, а не через такие софтины, как youtube-dl, yt-dlp или один из «этих» сайтов. Оказывается, это гораздо сложнее, чем можно было бы подумать.

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

Читать далее

Создание игры в стиле GameBoy в 13 КБ

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

В прошлом году я решил поучаствовать в гейм-джеме js13kgames. Это длящееся один месяц ежегодное соревнование по созданию с нуля игры на JavaScript, которая должна уместиться в 13 КБ (в zip). Места как будто не очень много, но с достаточным количеством креативности при таких ограничениях можно достичь многого. Просто взгляните на потрясающие примеры прошлых лет:


Хотя в прошлом году моя игра заняла не такое высокое место, я всё равно хотел бы поделиться своими открытиями, сделанными в процессе её разработки.

Мне захотелось сделать игру, напоминающую о ретроэпохе игр на портативных консолях с их уникальным квадратным экраном, низким разрешением и видом сверху вниз. Я решил реализовать быстрый геймплей в стиле action-RPG с простым, но увлекательным геймплеем, мотивирующим игрока продолжать игру. С музыкой всё было очевидно — звуковые эффекты должны быть похожими на звуки аркадных автоматов.

Поиграть в мою игру можно на странице Gravepassing сайта JS13KGames. Полный код выложен на GitHub.
Читать дальше →

Как тестировать не-REST-бэкенд. Часть третья, gRPC

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

Итак, мы с вами добрались до третьей, самой «хардовой» части цикла. Сегодня поговорим про gRPC.

Что такое gRPC? 

Сам RPC — удалённый вызов процедур (иногда вызов удалённых процедур; RPC от англ. remote procedure call) — класс технологий, позволяющих программам вызывать функции или процедуры других программ, делая это так, как если бы они находились в одном адресном пространстве. Буква g в названии — это гугловая реализация этих технологий.

Разберем это все на примере.

Допустим, что вы — программист и сидите в монолитной репе. У вас одно приложение. Сам проект открыт в IDE и вы в нем работаете. В репе реализован определенный класс (например, на Kotlin), у которого есть метод, возвращающий вам данные по пользователю.

Читать далее

Внутреннее представление и оптимизации строк в JavaScript-движке V8: «отмываем» строки, «обгоняем» C++

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

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

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

IntelliJ IDEA 2023.2. Language Server Protocol, AI Assistant, IntelliJ Profiler в редакторе, GitLab merge requests, ftw

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

Только что вышла IntelliJ IDEA 2023.2. В этом релизе в IDE появилась куча интересных фичей и важных улучшений.

Вы можете скачать последнюю сборку с официального сайта, или из бесплатного приложения Toolbox, или из snap-пакетов для Ubuntu.

Этот релиз IntelliJ IDEA 2023.2 представляет вам AI-ассистента, вооруженного набором инструментов машинного обучения. IntelliJ Profiler показывает подсказки в редакторе, делая профилирование более интуитивным и иформативным. Еще, в этом релизе появилась интеграция с GitLab.

В том посте мы пробежимся по всем основным фичам IntelliJ IDEA 2023.2. В отличие от официального анонса, вся европейская политкорректность выкинута на свалку, автор перевода не видит никакой ценности в соблюдении повесточки.

Кроме того, в этот четверг в Питере будет встреча Javawatch, посвященная Java 21. Я прочитаю мини-доклад минут на 30 о новых фичах, и потом мы сможем все вместе собраться и за кружкой пива это обсудить. Анонс события в телеге, обсуждение в чате. Я бывший PMM в JetBrains Big Data и тимлид в Remote Development/Projector, а сейчас работаю над российским дистрибутивом Java - Axiom JDK.

Волшебно. Читать далее.