JavaScript *

你好! Меня зовут Дмитрий, я фронтенд-разработчик в компании fuse8. Сегодня мы рассмотрим, как можно проводить валидацию кастомных компонентов в формах из UI-библиотеки ElementPlus.

Если вы работали с формами в ElementPlus, то наверняка знаете, что библиотека предоставляет простой интерфейс для валидации. Но что делать, если в форме используется кастомный компонент и необходимо применить правило валидации, которое передали в форму? С этим и разберёмся.

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

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

TLDR. Я примерно год создавал курс из 141 урока. Курс получился хороший, все кто проходят рады и пишут положительные отзывы. Я пытался его продавать, в лучшем случае у меня получалось отбивать рекламу в ноль. Короче, я хороший разработчик, я хорошо доношу материал, но я плохой маркетолог. Все эти таргреты, ретаргеты, воронки, шморонки — тоска унылая. Мне гораздо веселее и понятнее заработать на создании и запуске IT-продуктов, чему я и учу в этом учебнике. Так что пишу эту статью, чтобы сообщить вам о существовании моего курса и предложить всем желающим абсолютно бесплатно получить от него пользу 🙂

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

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

Как можно видеть с самого видео, человек, нажимая на кнопку в Майнкрафте, включает у себя лампу в реальной жизни. Круто! Но как это работает?

React-Query - Общий обзор и мотивация к применению. Первая проба технологии для фронтенд команды компании Chibbis. Общий обзор технологии и практика внедрения.

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

Мы не станем вредить, а вирус напишем в компьютерной игре BitBurner. Писать вирусы - плохо, но изучать - интересно.

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

На майской конференции React Conf 2024 команда React не только презентовала версию библиотеки React 19, но и рекомендовала использовать для старта новых JavaScript-проектов один из четырех фреймворков: Next.js, Remix, RedwoodJs или Expo. Позже аналогичная рекомендация появилась в официальной документации по React. Из этих фреймворков Next.js может похвастаться самым большим комьюнити, документацией и удобством. Если вы до сих пор его не освоили, то мы идем к вам!

Привет, Хабр! В этой статье расскажем, что такое Next.js, и покажем вам на примере небольшого pet-проекта его базовые возможности.

Всем привет! На связи руководители Frontend‑практики ГК Юзтех. В этой статье мы подводим итоги 2024 года и делимся нашими прогнозами на 2025 год. Приводим мнение трех экспертов по ключевым трендам фронтенд‑разработки и фреймворков, которые будут актуальными в следующем году.

⌚️Пишем Realtime для Multiple-page application в микросервисной архитектуре

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

В статье описывается, как отправить пропущенные во время переподключения события WebSocket повторно в порядке очередности поступления

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

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

Решение: Автоматизация назначения менеджеров, чтобы пользователь связывался с конкретным сотрудником, минуя промежуточные этапы.

Привет, Хабр! Сегодня разберёмся с тем, что такое OffscreenCanvas, зачем он нужен и как правильно его использовать.

OffscreenCanvas — это API, которое позволяет рендерить графику в отдельном потоке Worker, не блокируя основной поток, где обрабатывается интерфейс.

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

Что делать? Логичное решение — максимально упростить бота и написать его на стороне фронтенда с отправкой результата на бэкенд и получением ответа одним запросом. Думаю, многие баловались или могут представить, что это несложно, но нужно писать множество конструкций и условий.

Я же предлагаю в статье посмотреть, как написать бота с помощью простого советского JavaScript‑генератора.

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

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

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

React v19 теперь доступен на npm!

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

Добрый день! Меня зовут Тимур и я программист.

В прошлой статье я сделал анонс сборки Хромиума — Ultimatum, и несмотря на то что обсуждения на хабре слегка потеряли градус (по сравнению с обсуждениями 5-10 летней давности) — пара неплохих идей все таки всплыла. Собственно этой статьей я рассчитываю поднять интерес к теме и попытаться понять на какие фичи у людей есть реальный запрос.

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

Автообновление завтрашнего дня в Тильде. Как добавить +1 день внутри текста в Tilda. Пошаговая инструкция.

Если вы сделали сайт на Tilda и вам требуется добавить дату завтрашнего дня, то эта статья для вас. Данный метод позволяет добавить дату куда угодно в любое место на сайте и с наступлением нового дня будет автоматически добавлять завтрашний день. Код сделан на чистом JavaScript что делает его универсальным и не требует добавления сторонних библиотек.

HTTP-запросы: структура, методы, строка статуса и коды состояния

Цель: написать небольшую статью, максимально понятным языком,
которая дает представление о протоколе http и объясняет структуру http запросов и ответов сервера.

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

Заголовок: HTTP-запроса: Структура, методы, статусная строка и коды состояния.

Добрый день! Меня зовут Тимур и я программист.

Сегодня я хочу сделать настоящий анонс своей сборки chromium — Ultimatum. Он умеет уже достаточно много что бы гордо носить свое собственное имя.

В прошлой своей статье я рассказал о том как пробросил в js прямой доступ до http кеша и объяснил для чего я это делаю. Статья завершилась со словами что я еще вернусь со своим антидетект браузером. Я вернулся и это немного больше чем антидетект браузер.

Если коротко — Ultimatum уже помножил на ноль такие техники трекинга как hsts-pinning, favicons cache и вообще использование многих других кешей в трекинге. А также! Теперь можно поставить расширение с любого сайта, не только со сторов гугля, оперы или микрософта (с них кстати тоже можно — со всех!). А еще! Можно перехватывать сетевые запросы и подменять их полностью! Ну и так далее и тому подобное.

А теперь более подробно и более спокойно.

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

Важно при этом отметить, что я считаю себя достаточно адекватным собеседующим. Я практически не задаю лично-специфичных вопросов (моя часть – техническое собеседование, и мы с него начинаем); отвечаю всем кандидатам, чтобы сразу было понятно, рассматриваем мы их или нет; стараюсь построить собеседование так, чтобы на него не уходило больше полутора часов; не спрашиваю про красно-черные деревья и знание алгоритмов; и вообще имею достаточно четкие критерии для оценки собеседуемых, которые и попытаюсь для вас обосновать.

Около трёх месяцев назад я задумался о том, что в ближайшем будущем взаимодействие человека с техносферой (программно-аппаратно-сетевой инфраструктурой) будет происходить скорее через мессенджеры, такие как Telegram, чем через привычный браузер. Частое использование чатов на смартфоне быстро подтолкнуло меня к попытке снова попробовать голосовой ввод вместо привычных тапов по виртуальной клавиатуре или набора слов жестами. К моему приятному удивлению, распознавание голоса сейчас достигло очень высокого уровня как на Android, так и на iPhone. Причём настолько высокого, что STT (speech-to-text) стал для меня основным способом ввода текста в чатах, включая браузер.

Поскольку искусственный интеллект в целом, и технологии OpenAI в частности, уже практически стали повседневной нормой (по крайней мере, для меня), я, естественно, начал использовать голосовое общение и в GPT-чатах. А узнав о действиях (actions) в настраиваемых GPT-чатах, я сразу загорелся идеей соединить GPT-чат с каким-нибудь внешним приложением. Однако на этом этапе встал вопрос: как аутентифицировать пользователей чата во внешнем приложении? Несмотря на то что OpenAI предлагает использовать OAuth 2.0 для интеграции, в этой статье я рассмотрю альтернативный вариант — парольную аутентификацию, которая, на мой взгляд, лучше подходит для голосового взаимодействия.