JavaScript *

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

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

На днях я стряхнул пыль с небольшого пет-проекта. Это простой блог, наверняка каждый из вас хотя бы думал о таком для себя.
В 2015 году я бы просто закинул файлы по FTP на хостинг за 100 рублей. Время деплоя: 30 секунд.
В 2026 году я потратил 4 часа. Я настраивал Edge Middleware, дебажил рассинхрон HTML между клиентом и сервером (hydration mismatch) и разбирался, почему облако не хочет дружить с моей базой данных из-за долгого пробуждения функций (холодного старта).

Где мы свернули не туда?
Это колесо Сансары, которое дало новый оборот.

Синхронизация атрибутов элемента с DOM-свойствами

Очевидно, что нашему компоненту потребуются атрибуты, через которые пользователь сможет контролировать его поведение. Наш компонент должен вести себя как стандартный элемент ввода типа «input», поэтому обязательно должен поддерживать такие атрибуты как disabled и required – и это самый минимум. Поэтому важно разобраться (ну или вспомнить) что такое «content vs IDL attributes», и как с этим работать.

Документация по веб-компонентам мало говорит об атрибутах, разве что рекомендует использовать attributeChangedCallback() для наблюдения за ними, но этого недостаточно. Хотя это полезное API, нам оно не подходит, потому что оно уведомляет нас о уже совершенном действии (изменении атрибута), а нам нужно контролировать этот процесс, то есть – синхронизировать атрибуты и свойства с нормализацией значений.

Так как наш компонент наследует базовый класс HTMLElement, а в нем уже реализовано большое количество разных методов, то мы можем переопределить некоторые из них чтобы получить нужный нам результат. Для начала определим наши свойства в виде пар get/set и значения в приватном поле:

Netflix, Shopify, Vercel — что общего у этих компаний, кроме успеха? Они по-особому строят мост между фронтендом и сервером. Не просто «отдай JSON», а целые архитектурные подходы: BFF под каждое устройство, частичный prerendering, Server Components. В новой статье мы разберем, как современный фронтенд общается с бэкендом и почему старый добрый REST уже не всегда спасает. Спойлер: даже если вы бэкендер, после прочтения начнёте иначе проектировать API.

У меня есть платформа для работы с метафорическими ассоциативными картами. Это инструмент психологов, коучей: колода картинок, вопросы, разговор. Звучит нишево, но суть задачи универсальна – авторский визуальный контент в вебе, который надо защитить от массового скачивания и пиратства. При этом контент загружают сами пользователи.

Если вы делаете галерею, маркетплейс иллюстраций, образовательную платформу с визуалами или любой сервис, где картинки – это ценность, а не декорация, эта статья для вас. Я расскажу, как выстроил многослойную защиту изображений, не превращая при этом продукт в крепость, из которой неудобно пользоваться.

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

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

Это упрощенная статья, которая расширит ваш кругозор, а у некоторых вызовет интерес и любопытство погрузиться в тему.

За последние пару лет я провёл сотни технических собеседований — от junior до senior специалистов. И я обнаружил что есть одна тема, с пониманием которой есть проблемы почти у всех кандидатов с кем мне доводилось общаться. Это Virtual DOM.

Почти каждый кандидат объясняет его примерно так:

“Virtual DOM нужен, чтобы обновлять не всю страницу, а только её часть. Поэтому всё работает быстрее.”

Я столкнулся с простой (как мне изначально показалось – даже очень) задачкой. Мне в последнее время потребовалось часто проводить поиск в 4-х словарях. Государство мне их дало в виде 5 PDF файлов, выложенных онлайн. Это нормативные словари русского языка, слова из которых можно использовать в публичном пространстве.

Например, cash - можно использовать на русском как кэш, а не переводить как тайник или склад, поскольку в Словарь иностранных слов это слово уже включено. И это слово нам еще пригодится далее по тексту)

Состоялся релиз OpenIDE 2025.3 на базе IntelliJ IDEA Platform 2025.3. В релизе — поддержка Java 25, автодополнение действий IDE через двойную точку (Command Completion), Spring MCP для LLM-агентов, обновления для Go и фронтенд-стека, улучшения HTTP-клиента Connekt и доработки Docker-плагина. 

Привет, друзья!

В этой небольшой статье я расскажу вам о новом свойстве события toggle - source, а также о новом атрибуте HTML-элемента dialog - closedby.

Свойство source позволяет определять источник переключения видимости поповера (popover), а атрибут closedby позволяет декларативно управлять логикой закрытия dialog, но обо всем по порядку.

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

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

Мы (человечество) очень хотим создать разум. Инопланетян мы пока не нашли, поэтому пытаемся собрать его сами из кремния и электричества. Но то, куда свернула индустрия сегодня, вызывает вопросы. Мы греем планету мегаваттами энергии, перемножая гигантские матрицы в дата-центрах, чтобы обучить LLM. Backpropagation и современный инференс - это непозволительно дорого и энергозатратно.

А что если вернуться к истокам? Что если интеллект — это не градиентный спуск, а кристаллизация связей под давлением информации?

В этой статье я расскажу о концепте Термодинамического Мозга. Это самоорганизующийся граф, который обучается в один проход O(1), непрерывно адаптируется к новым данным, спит по ночам, чтобы не сойти с ума, и настолько нетребователен к ресурсам, что его можно запустить хоть во вкладке браузера, хоть на Arduino.

Привет! Я Сергей, разработчик. Когда мне понадобилась легкая анимация лайка в стиле YouTube, я столкнулся с проблемой: готовые решения либо слишком тяжелые, либо плохо дружат с прозрачностью в браузерах.

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

Мы будем делать схематичную анимацию фейерверков и конфетти по нажатию на кнопку при помощи JS. Изученные принципы универсальны для любого ЯП. Нам понадобится немного знаний ООП, тригонометрии, физики и совсем чуть-чуть геометрии. Вот что получится в итоге:

Думаю, что в каждом из нас живёт воспоминание о первой видеоигре, для кого-то это были «Герои 3», для кого-то — гонки на приставке из 90-х, а для миллионов людей по всему миру первой любовью стали падающие кирпичики, которые нужно было складывать в ровные ряды. Тетрис не требовал перевода, не нуждался в инструкции и не спрашивал, сколько тебе лет — он просто затягивал.

Недавно я посмотрел фильм «Тетрис» (2023) и поймал себя на мысли, что история создания — не менее увлекательна, чем сама игра. А ещё она вдохновила меня на идею, взять классическую механику и добавить в неё щепотку… песка.

Почему-то в последние пару лет я упорно не замечал, что Autodesk ушел из России (шутка), но постоянно обновлял свой любимый Fusion 360 через боль и страдания. Параллельно со мной страдали некоторые мои товарищи, практически все мои обучающиеся, да и много кто ещё. Дополнительной проблемой стал перевод пары учебных аудитории на Ubuntu, а Fusion 360 существует исключительно для Windows, и костыли через wine работают криво. Даже младшие классы пострадали, т.к. разрабатывали у нас модели в Tinkercad. Единственная бюджетная (бесплатная) альтернатива, это FreeCAD, но интерфейс у него не самый дружелюбный, особенно для школьников.

Идея появилась совершенно случайно, за разговором с коллегами. А почему бы на коленке не набросать простенький 3D-редактор для моделирования под 3D-печать. С простым интерфейсом и работой прямо в браузере. Естественно, это будет не полноценный САПР, но для обучения и простенького проектирования функционала должно хватать.

Целился я в нечто среднее между Tinkercad и Fusion360. Одной из задач было обойтись без сервера, т.е. работа на стороне клиента. В качестве основы я выбрал популярную библиотеку 3D графики Three.js.

Накидал пробный интерфейс и тут началось...

Привет! Меня зовут Незар, я фронтенд-разработчик из Т-Банка. В 21 релизе Angular команда разработчиков представила экспериментальное API для построения реактивных форм с помощью сигналов. В статье подробно его разберем. 

Тому, кто знаком с классическими Reactive Forms в Angular, новый Signal Forms API покажется эволюционным шагом: те же мощные возможности, но с сигналами — а значит, с автоматической реактивностью, полной типизацией и меньшим количеством шаблонного кода. 

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

Привет!

Это пятый выпуск Frontend Status — дайджеста по фронтенд-разработке.

В этом выпуске:

Медиа: Mastra Workspaces (свой «Claude Code»), Рич Харрис про RSC, безопасность фреймворков.

AI: безопасность агентов, пост-обучение LLM (Netflix), Brave Search API.

A11y: Axe MCP в DevTools, чеклист Shopify, role="presentation".

Браузеры: Interop 2026, WebMCP и ранний доступ в Chrome.

3D: 3D-труба на R3F, procedural snake на Three.js.

CSS: эластичный текст, pie chart, параллакс, пирамиды, вихрь, Ambient, освещение.

JS/TS: sql.js, Perspective BI, TS-дженерики.

React: State of React 2025, shadcn vs MUI, HighTable, FrankenTUI, Ant Design 6.3, оптимизация.

UX/UI: фоновые задачи, интерфейсы для агентов, семантические токены.

Тестирование: JIT Tests от Meta (тесты от LLM).

Разное: Electrobun, учебник математика/CS/AI, WarCraft 3 UI, npmx, Stockfish 18.

Все мы видели эти заголовки: «ИИ оставит программистов без работы», «Копирайтеры больше не нужны», «Завод — наше всё». Паника, хайп, мемы.

Но есть факты: Число резюме к числу вакансий увеличилось в 2 раза за 2025 год в сфер ИТ.

Поэтому я сделал шуточный сервис ai‑fire.ru, который показывает, отберёт ли у вас работу ИИ.
1️⃣ вводишь свою профессию
2️⃣ жмёшь кнопку
3️⃣ узнаёшь — пора паниковать или пока можно выдохнуть

Привет, Хабр! (И тебе, питонист, который считает свой язык идеальным, и тебе, JS-ник, у которого уже вышел новый фреймворк, пока ты читал это предложение, и тебе, 1С-ник, который устал объяснять, что ты тоже программист всем во круг.)

Наткнувшись миллионный раз на статью «КАКОЙ ЯЗЫК ПРОГРАММИРОВАНИЯ ВЫБРАТЬ?» я задался вопросом, почему люди ещё не поняли ответа на этот вопрос, ведь он на поверхности.

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

Помните времена, когда статический сайт был сайтом-визиткой на голом HTML, а любой серьёзный проект требовал CMS?

Мы привыкли считать нормальным сайт на WordPress, «Битриксе» или хотя бы самописном Django. Статика же оставалась уделом гиков, документации и страниц о скором запуске.

В 2025 году статические сайты вернулись. Не в качестве альтернативы для бедных, а как зрелая архитектура, которая решает 90% задач быстрее, дешевле и безопаснее, чем тяжёлый бэкенд.