TypeScript *

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

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

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

Хочу рассказать о том, какие проблемы при разработке создают рекурсивные зависимости на фронте.

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

Рассмотрим способы разрешения циклических зависимостей и их обнаружение.

Привет! Это ставшая уже регулярной рубрика о релизах next.js (читайте релизы по v11, v12, v13, v14). Каждый релиз - набор нового, интересного и спорного. Новая версия не станет исключением. Но всё же новая версия интересна не столько новым функционалом, сколько изменением приоритетов и организации в next.js. И да, как вы уже догадались из названия, в значительной части релиз ценен проработкой ошибок и доработками.

В данной статье я не буду останавливаться на том что такое App Router или серверные компоненты - про это подробно расписано в предыдущих статьях. Только про новую версию и только про новые изменения.

Примечание: в статье отражены самые интересные изменения с призмы автора. Здесь разобраны коммиты и PR в ядро next.js, сообщения разработчиков и задачи, поэтому статья отражает больше изменений, чем представлено официально.

✏️ 🔥 Я написал новую статью об одной из интересных функций в Angular 18: RxJS Interop. В статье рассматривается, как RxJS Interop эволюционировал с Angular 16 до 18, какие новые возможности он приносит и как его можно использовать в вашем коде.

🚀 Если вы разработчик Angular и хотите улучшить свои реактивные паттерны, эта статья для вас!

✨ Основные моменты:

- 🔄 Бесшовная конвертация между Signals и Observables.

- 📉 Оптимизированная производительность для управления реактивным состоянием.

- 💡 Использование операторов RxJS напрямую с Signals для упрощения и улучшения читаемости кода.

- 🔥 Упрощение интеграции с Firestore с помощью Signals для синхронной реактивности и более простого управления состоянием.

Всем привет! Меня зовут Ильмир, я frontend-разработчик SimbirSoft. Это моя первая статья, в которой я хотел бы разобрать тему менеджера состояний в Angular.

Когда первый раз открываешь документацию Яндекс.Карт, то совершенно ничего не понятно. Ты смотришь быстрый старт, введение, руководство разработчика, общие сведения, подключение карты... ну да, окей, мы взяли такие, всё подключили, видим карту с населенными пунктами... а дальше-то что делать?

Бывает ситуация, когда нам необходимо протестировать middleware, либо асинхронное событие, которые возникает в хранилище redux.

Цель этой статьи в том, чтобы показать как тестировать action в redux store.

Есть готовое решение, redux-mock-store, но оно не позволяет оперировать реальным хранилищем, через него мы можем только проверить был вызван тот или иной action, а данные которые сохраняем мы в store, не можем проверить.

Я создал "React Selfie AI Background Remover" — компонент React, который использует TensorFlow.js для удаления фона с изображений людей прямо в браузере.

✨ Основные особенности:

• 🤖 Использует MediaPipe Selfie Segmentation для точной сегментации объектов.

• ⚙️ Легко интегрируется в любое React-приложение.

• 🖼️ Доступно live demo для тестирования.

Вы можете найти компонент здесь:

• 📦 NPM

• 💻 GitHub

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

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

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

Поговорим про введение в TypeScript и то, как с помощью него мы можем сделать наше программирование и наш код на JavaScript более надежными и прогнозируемыми. 

Меня зовут Александр Чернов, я фронтенд-разработчик в Альфе, веду подкаст ТИНОИД, обожаю плавание и влюблён в веб- и фронтенд-разработку.

Хорошая новость в том, что на нём гарантированно можно довести игру до завершения и стабильного состояния. И это важно, т.к. в процессе разработки у меня не было уверенности в удачном финале. У движка есть увесистые плюсы и минусы.

Cocos Creator 3 [1] - это китайский опенсорсный игровой движок, заточенный на разработку браузерных игр и интерактивных/игровых рекламных блоков. Он весьма популярен в Китае, и очень слабо известен в остальном мире.

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

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

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

На конференции Laracon Тэйлор Отвел, создатель популярного PHP-фреймворка Laravel, представил Inertia.js версии 2.0 — самое крупное обновление с момента запуска этого пакета. Новая версия приносит множество полезных функций, которые значительно упростят разработку приложений на Laravel и Inertia.js.

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

В заметке рассмотрены несколько настроек ts, которые влияют на систему типов.

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

Всем доброго времени суток. Давно я что-то ничего не писал, и вот созрел. Предлагаю сегодня поговорить о ui-системе. Зачем она нужна, когда она нужна, что дает, какие минусы имеет и вообще стоит ли ввязываться в это блуд.  Я часто слышу на разных конференциях, что панацея от всех болезней в бизнесе  —  это наличие дизайн-системы (ui-системы). Что, как только вы достигаете ее, то сроки сокращаются в 100500 раз. Что разработчики не хотят открутить голову дизайнерам, и, наоборот, что качество продукта возноситься до небес, и еще много всего восхитительного об этой сущности. Но так ли все это ? Или это просто розовые очки, которые застилают глаза всех причастных к созданию ui-системы в компании и побочка от постоянных нервных срывов, скандалов, поиска компромиссов и просто выгорания? В этой статье я постарался разобраться, а стоит ли игра свеч или как в анекдоте про нюансы. 

Для начала, чтобы рассуждать, что чем является, нам потребуется разобраться в понятиях и терминах предметной области.  

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

UI component являются основными блоками и элементами для дизайна пользовательского интерфейса. Они предоставляют пользователям способ взаимодействия с вашим веб-сайтом или приложением. Этими компонентами могут являться интерактивный текст и графика, которые сообщат пользователю, что делать дальше.

Angular — это мощный инструмент для создания сложных веб-приложений. Но, как и в любом другом фреймворке, возникают свои сложности. Одна из таких проблем — это частые перезапуски тяжелых функций в шаблонах, что сильно бьет по производительности. Если приложение начинает тормозить, значит пора задуматься об оптимизации. И здесь на помощь приходит Memoize Pipe, способный спасти ваш интерфейс от лишних вычислений.

Случается, ты просыпаешься и осознаешь: так больше продолжаться не может и нужно что‑то менять. Разные кодовые базы, избыточное легаси и нестабильность мешают пользователям получать удовольствие от общения в твоем приложении. И эта мысль подводит тебя к развилке: один путь ведет к сложному и долгому рефакторингу легаси за почти 10 лет, второй к не менее долгому, а, порой, более сложному процессу переписывания с 0. Но какой бы путь ты ни выбрал, в любом случае начинаешь испытывать азарт — предстоит большая Задача (именно с большой буквы).

Привет Хабр, меня зовут Федор Неживой, я ведущий программист‑разработчик в команде VK Мессенджера и сегодня расскажу вам, как мы перестраивали и обновляли один из крупнейших проектов в рунете. В статье будет боль, пот, реальный код и детали, как мы шаг за шагом пришли к масштабному обновлению, а потом внедряли то, что получилось.

В данной статье хочу рассказать про инструмент измерения покрытия gRPC сервисов tests-coverage-tool, написанный на языке Golang. Основная задача инструмента — автоматическое измерение покрытия требований на основе proto контрактов. Поговорим про использование в автотестах, концепцию, отчет и кратко про архитектуру самого инструмента tests-coverage-tool.