Монорепозиторий с pnpm и typescript для фронтенда на React и бэкенда на Node.js

Устанавливаем pnpm, создаем воркспейсы для фронта и бека, импортируем что угодно из одного в другое, типизируем запросы и избавляемся от бойлерплейта.

Среда для запуска JavaScript-приложений

Устанавливаем pnpm, создаем воркспейсы для фронта и бека, импортируем что угодно из одного в другое, типизируем запросы и избавляемся от бойлерплейта.

Недавно я задался вопросом «Какой JS фреймворк самый быстрый». Я обратился с этим запросом в гугл и нашел очевидный ответ «это fastify!». Но почему именно он?.
Я практически сразу наткнулся на статью, результаты которой меня немного расстроили, так как в качестве дополнительной нагрузки на endpoint автор использовал вычисление ряда Фибоначчи, что, по моему мнению, не раскрывает всей сути сравнения. Тогда я решил провести собственное исследование.

JavaScript — самый популярный скриптовый язык в мире. Так почему же так сложно запускать shell-скрипты на JavaScript?
Этим вопросом задались создатели Bun (альтернатива Node.js - очень быстрый runtime для запуска JS-кода, а также менеджер зависимостей, тест раннер, бандлер для фронтенда, транспилятор TypeScript и не только).
20 январе 2024 в рамках Bun v1.0.24 был представлен Bun Shell - встроенный интерпретатор shell-подобных скриптов. Под катом узнаем зачем это нужно и какой функционал уже доступен.

Получение данных с помощью HTTP-запроса — это фундаментальное действие веб-приложений. Возможно, вы делали такие вызовы в браузере, но Fetch API поддерживается в Node.js, Deno и Bun.
Привет, Хабр! В этой статье я хотел бы рассказать о методе работы с WebSocket, который я часто применяю в своих разработках. Если кратко, WebSocket — это, пожалуй, самое частое, что я использую в своих проектах. Мне очень важно, чтобы сервер мог общаться с клиентом в двустороннем режиме, но использование обычного WebSocket не всегда комфортно. Для решения этой задачи я часто пишу какой-либо обработчик, и, суммируя суть того, что именно делает этот обработчик, я решил написать небольшую и очень простую библиотеку.

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

Динамика приложений с искусственным интеллектом продолжает сеять вопросы по выбору “удачного” фреймворка, который мы могли бы использовать при создании. Поскольку именно от нашего выбора в принципе и зависит продолжительность жизни нашего детища.
В этой статье я бы хотела обратиться к одному старенькому фрейморку, рассмотреть его особенности и фичи, которые способные выделить его на фоне другого софта. Так ли он хорош? А если хорош, то почему?
Не буду затягивать с буквами во вступлении и предлагаю перейти сразу к делу!
Приятного прочтения(:

В этом руководстве мы рассмотрим разработку веб-приложения по созданию GIF-файлов из видеороликов.
Функциональные возможности приложения:
- Создание GIF из видео на YouTube с определённым временным диапазоном.
- Предварительный просмотр результата перед выполнением фактической конвертации.
Компоненты системы:
- Клиентская часть на React (Next.js)
- Бэкенд-сервер на Node
- Node как Service Worker
- В качестве брокера сообщений — RabbitMQ
- Для хранения данных — MongoDB
- Для хранения медиафайлов — Google Cloud Storage
Полный код проекта можно найти на github, а по этой ссылке посмотреть демо-версию приложения.

В промышленности, торговле и других секторах критически важно точно соотносить номера компонентов с их изображениями для эффективного управления запасами, обеспечения качества продукции и удовлетворения запросов клиентов. Благодаря новейшим технологиям в программировании, этот процесс теперь можно автоматизировать, существенно упрощая работу.
В данной статье представлен практический метод сопоставления номеров запчастей с их изображениями. Используя поисковую систему Google, мы соберем изображения, основываясь на марке и номере запасной части, а затем применим методы сравнения изображений с помощью Node.js, чтобы выявить наиболее подходящие изображения для каждой запчасти.

Всем привет! На связи Геворг, фронтенд техлид Work Solutions. Сегодня расскажу про интеграцию поисковых сервисов Meilisearch и Elasticsearch в Strapi.
Strapi — это популярный open-source фреймворк для разработки серверов, а также создания гибких API. Однако, встроенные средства поиска могут быть ограничены. Разработчики могут искать способы интеграции с внешними поисковыми системами. Две такие системы — Meilisearch и Elasticsearch. Они предоставляют возможность реализации полноценного поиска в проектах.
В статье рассмотрим, как интегрировать эти системы, сравним их особенности, определим, для каких задач подходят. Примеры рассматриваются для strapi v3. Однако информация также актуальна для v4 с некоторыми незначительными различиями в интерфейсах взаимодействия.
На сайте компании можно посмотреть как работает поиск Meilisearch в Strapi в продакшне. Там же делимся особенностями реализации поиска в нашем блоге. Подробно сравниваем Meilisearch и Elasticsearch, способы их реализации, демонстрируем ограниченность встроенного поиска.

Привет, я Лиза – веб разработчик в одной зарубежной компании. Хочу поделиться тем, как я автоматизировала регрессионное тестирование в рабочем проекте на React с использованием довольно нового фреймворка Playwright. Разберемся, почему именно этот фреймворк, какие подводные камни, как обойти авторизацию и кто этим пользуется.
Всем привет! Это моя первая публикация на хабре, поэтому буду благодарен за любую обратную связь, которая поможет мне писать ещё лучше.
В статье вас ждёт "сборка" очень простой связки из распознавания и синтеза речи, а также запросов в модель YandexGPT на Node.js. Наш телеграм бот будет получать голосовое сообщение, а затем распознавать его, скармливать в модель GPT и синтезировать полученный ответ в голосовое сообщение.
Хочется начать с небольшого предисловия. В ходе написания этого простейшего решения я потратил кучу времени на попытку интегрироваться с популярным OpenAI ChatGPT, но мои нервы вышли из чата (обход блокировки, HTTPS прокси и т.п.), поэтому я перешёл к Яндексу. Он встречает нас дружелюбной консолью, понятной документацией и грантом на тестирование. В целом, если гранта по каким-либо причинам нет, то мне на все тесты хватило 20 рублей.

Всем привет! Меня зовут Марсель Абдрахманов, я фронтлид в Банки.ру. В статье хочу поделиться нашей историей ухода от монолита к микрофронтендам. У нас в Банки.ру большой отдел веб-разработки, за последнее время мы сильно выросли, ежедневно катим десятки релизов на прод. Расскажу, как мы относительно быстро внедрили микрофронтенды и перешли на архитектуру, которая позволила сократить время доставки обновлений на прод с двух дней до нескольких часов.

Что случилось? Авария, ужас-ужас
Статью я захотел написать после работы над одним конкретным багом, который со всех точек зрения напоминал классическую утечку памяти, но на практике оказался чем то совершенно другим. Я нигде не встречал описание такого поведения и поэтому решил этой информацией поделиться.
В один прекрасный день боевое сопровождение приходит с ужасной проблемой — память в контейнерах Node.js течёт, сервисы падают с OOM каждый день, все пропало!
Да, картинка действительно удручающая. Всё время, когда есть нагрузка, память в контейнере прирастает и почти не очищается при снятии нагрузки. Все остальные метрики, которые мы собирали были в норме: event loop lag, использование CPU, active request, open handles. Прирастала только используемая память и незначительно увеличивалось время отклика сервиса.
Что-ж, выглядит как классическая утечка, надо искать источник.

В предыдущей статье показал вам как работают docker desktop watch, skaffold dev и tilt up, которые помогают синхронизировать локальные изменения в контейнер, что очень важно во время разработки.
На этот раз хочу показать DevSpace и Garden, эти инструменты очень похожи на Tilt, у них есть dashboard, как у Tilt, есть мгновенная синхронизация изменений и под катом вы увидите, как легко можно запустить проект в kubernetes и начать разрабатывать.

TLRD: zod не подходил в проекте и решили сделать свой builder с помощью ajv в zod-like API. Поскольку гугление не показало никаких вменяемых результатов - было решено сделать свои костыли решения.
Если стало интересно - прошу под кат!

Коллекция утилит NestJS-mod предназначена для унификации приложений и модулей NestJS, а также представляет новые логические возможности разделения обязанностей между модулями (System, Core, Feature, Integration, Infrastructure).

В наше время многочисленные сайты создают страницы, которыми пользователи хотели бы делиться в разных социальных сетях или мессенджерах. Благодаря тегам Open Graph ссылки могут иметь красочное превью изображение, которое привлекает еще больше внимания. В этой статья я хотел бы рассказать как с помощью Puppeteer и node.js мы упростили поддержку и сократили время разработки при создании таких изображений.

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

Разработчики любят подшучивать над раздуванием зависимостей Javascript (и вполне имеют на это право, учитывая историю пакетов наподобие left-pad); при этом часто упоминаются пакеты is-even и is-odd. Поэтому я заинтересовался, кто же на самом деле их использует?