📦 Четыре пункта, как улучшить код Backend стажера
В статье разобраны распространенные проблемы в коде начинающих разработчиков с конкретными решениями: грамотная инъекция зависимостей, использование Scoped-сервисов, паттерн Generic Repository и создание Stateless-классов. Материал будет полезен Junior и Middle разработчикам, которые стремятся улучшить архитектуру своих проектов и избежать ошибок структурирования кода в backend NodeJS разработке
TypeScript *
Cтрого типизированная надстройка для JavaScript
Nuxt I18n Micro: Как я решил написать свой i18n для NuxtJS
Всем привет!
Я занимаюсь разработкой на Nuxt с самого его появления, и у меня возникла очень большая проблема с реализацией i18n.
Получение серверного времени через WebSockets и отображение его в Angular-приложении
В этом посте я опишу как создать веб-сокетный стрим в бэкенде на NestJS
и подписаться на него из фронтенд приложения на Angular
.
Рецепты TypeScript: перевод ключей объекта в camelCase
Всем привет! С вами снова Костя Логиновских — ведущий разработчик из Cloud.ru. Я уже делился TypeScript-рецептами в предыдущих статьях — вот первая и вторая — и теперь хочу рассказать про еще один. Наши рецепты — это готовый код, который можно применить в конкретных ситуациях, а в некоторых случаях и подогнать ситуацию под код.
Сегодня в меню — функция на обычном TypeScript, которая преобразует тип объекта так, чтобы все ключи внутри него из snake_case стали camelCase. Жду всех под катом!
Истории
Обзор на Model Context Protocol (MCP) от Anthropic
На заре появления LLM пользователям приходилось просто копировать свой код в текстовое окно, чтобы ИИ могла его обработать. Естественно, такой подход быстро всех утомил, и разработчики начали искать свои способы загрузки данных в модель. У этого подхода была серьезная проблема — каждому приходилось изобретать велосипед заново.
Именно поэтому появился протокол MCP (Model Context Protocol) — универсальный способ дать искусственному интеллекту доступ к нужным данным, неважно где они хранятся — на компьютере пользователя или же в интернете.
Как я создал Vanilla Calendar Pro — легкий и гибкий календарь на JavaScript с использованием TypeScript
Привет, Habr!
Честно говоря, долго сомневался, стоит ли писать эту статью. Я понимаю, что среди комментариев наверняка будут такие, кто скажет: «Очередной никому не нужный датапикер». Но сегодня, когда Vanilla Calendar Pro собрал больше 480 звезд на GitHub и получает 17 тысяч скачиваний в месяц, я решил поделиться своей историей.
Хочу сразу отметить: я не претендую на лавры лучшего разработчика календарей и датапикеров. Эта статья о моем первом опыте в open source, о том, как я создавал проект с нуля и как он стал полезен другим разработчикам.
Типизация свойства объекта в виде строки
Все так или иначе сталкивались с функцией или методом, который принимает объект и свойства в виде строки с которым нужно что-то сделать. Пример:
updateDate(user, "date");
И когда изменяется свойства объекта (user.date
→ user.birthday
), компилятор его нормально скомпилирует и мы лишаемся возможности отловить баг на стадий разработки.
Магия Injection Context
В последних версиях Angular появилась функция inject()
, предназначенная для внедрения зависимостей. Эта функция может быть вызвана только в рамках Injection Context.
Несмотря на то, что с момента появления этой технологии прошло уже много времени, многие разработчики все еще не полностью раскрыли ее потенциал. Возможно, это связано с тем, что они привыкли к традиционным методам внедрения зависимостей и не спешат переходить на новые подходы, или с недостатком подробной документации и практических примеров использования функции inject()
.
Я обнаружил, как inject()
может существенно упростить код и сделать его более гибким, и хочу поделиться своими находками, а может, и помочь другим разработчикам более полно раскрыть потенциал этой функции.
Книга: «Рецепты TypeScript»
«Рецепты TypeScript» Стефана Баумгартнера – книга из серии «книг рецептов» O’Reilly. Такое название серии объясняется структурой этих книг: вместо бесконечных теоретических выкладок, сквозь которые продираться не то что нелегко, а попросту скучно, авторы предлагают погружаться в материал через «рецепты» – примеры реальных задач, которые сопровождаются лаконичными и понятными решениями и их подробным обсуждением – того, как автор к ним пришёл и почему они являются действенными. В этот ряд «поваренных книг» вписывается и та, о которой мы поговорим сегодня.
Хороший рефакторинг vs плохой рефакторинг
За последние годы я нанял многих разработчиков. И не раз случалось, что новички сразу заявляли, что наш код требует серьёзного рефакторинга. Но вот в чём дело: во многих случаях случаях их «улучшенный» код оказывался сложнее для понимания и сопровождения. Более того, он обычно становился медленнее и содержал больше багов.
Не поймите меня неправильно. Рефакторинг — это не что-то плохое само по себе. Это важная часть поддержания кода в хорошем состоянии. Проблема в том, что плохой рефакторинг это действительно плохо. И, к сожалению, попасть в ловушку «хотели как лучше, а получилось как всегда» проще, чем кажется.
Давайте разберёмся, что отличает хороший рефакторинг от плохого и как не стать тем разработчиком, которого коллеги боятся подпускать к коду.
Вышел TypeScript 5.7
Сегодня мы рады сообщить о выходе TypeScript 5.7!
Если вы не знакомы с TypeScript, то это язык, который развивает JavaScript, добавляя синтаксис для деклараций типов и аннотаций. Этот синтаксис может быть использован компилятором TypeScript для проверки типов нашего кода, а также может быть удален для создания чистого, идиоматического JavaScript-кода. Проверка типов полезна тем, что позволяет заранее выявить ошибки в нашем коде, но добавление типов в код также делает его более читаемым и позволяет таким инструментам, как редакторы кода, предоставлять нам такие мощные возможности, как автозавершение, рефакторинг, поиск всех ссылок и многое другое. TypeScript является надмножеством JavaScript, поэтому любой правильный код JavaScript также является правильным кодом TypeScript, и если вы пишете JavaScript в редакторе, таком как Visual Studio или VS Code, TypeScript также является основой вашего опыта работы с редактором JavaScript! Вы можете узнать больше о TypeScript на нашем сайте typescriptlang.org.
Кэширование информации в Redis на NestJS
На каждом фронтенд запросе к бэкенду запрашивается информация по профилю пользователя из базы данных, это создает дополнительную нагрузку на базу данных и увеличивает время ответа бэкенда, для ускорения подобных запросов можно кэшировать ответ базы данных.
В этом посте я подключу Redis
к проекту и настрою кэширование данных через @nestjs-mod/cache-manager
.
Проект можно запускать в Docker Compose
и Kubernetes
.
Генерация кода валидации из спецификации OpenAPI: как мы синхронизировали валидаторы данных между бэкендом и фронтендом
Представьте ситуацию: ваша команда закончила интеграцию с API, все протестировала и подготовила релиз. А тут внезапно серверная команда меняет формат ответа. Фронтенд падает, QA злится, пользователи недовольны. Приходится вручную переписывать валидации, искать баги и терять дни, чтобы всё починить.
Как автоматически синхронизировать работу между бэкэндом и фронтендом? А между дизайном и фронтендом? Использовать генератор кода валидации! Написание своего решения поможет понять бизнес-логику проекта и создать валидаторы, которые максимально отвечают вашим требованиям. А реализация проще, чем кажется на первый взгляд – покажу это в статье на примере создания кастомного генератора на нашем проекте.
В первую очередь статья будет полезна фронтенд-разработчикам и командам, работающим над сложными веб-приложениями, особенно тем, кто активно взаимодействует с API, описанными через OpenAPI.
Ближайшие события
Продвинутая регистрация multi-сервисов в Angular
Внедрение нескольких сервисов с помощью одного токена — достаточно удобная механика в фреймворке Angular. Однако, можно столкнуться с неприятностью, что во всех местах, где нужно получить данный сервис, придётся как-то выбирать нужный инстанс из массива. Кто-то делает это напрямую, через метод массива find
, кто-то регистрирует сервис-менеджер, который умеет возвращать нужный инстанс, однако оба варианта рождают неприятный бойлерплейт. В этой статье разберём подход по удобной и продвинутой регистрации multi-сервисов.
Как я писал плагин для TypeScript. Часть 1. IDE
Привет, Хабр! Меня зовут Дима, я Head of Frontend в Dodo Engineering. Моя команда создаёт инструменты для удобной работы с фронтендами, унифицирует подходы к разработке, помогает другим командам в создании удобных пользовательских интерфейсов Dodo IS.
Недавно мне срочно понадобилось написать плагин для TypeScript. Начал я с того, что погуглил, как это сделать. По пути боролся с повышенным потреблением памяти и искал недостающие файлы в массиве, переписывал Proxy и не только, а закончил на... А впрочем, давайте вместе разбираться, зачем мне вообще понадобился плагин и как я его писал.
Typescript для React
Typescript - сложный язык, но большинству разработчиков не нужно знать все его тонкости, чтобы быть эффективными в своей работе.
Это то, что я считаю минимальным набором знаний по тайпскрипту для эффективной разработки продукта на React.
Основные принципы, которые мы здесь используем:
Типизируйте входные данные, предсказывай результат
Минимизируйте шум в кодовой базе
Ошибки должны отображаться как можно ближе к коду, который их вызвал
Введение в Brisa: новый подход к веб-разработке
Brisa — это современный веб-фреймворк, который сочетает мощь серверного рендеринга и удобство клиентских компонентов. Он позволяет создавать быстрые, легкие и высокопроизводительные веб-приложения, минимизируя объем JavaScript, отправляемого в браузер. Поддержка веб-компонентов, гибкая интернационализация и возможность кроссплатформенной разработки с помощью Tauri делают Brisa универсальным инструментом для веб-разработчиков.
В этой статье мы подробно разберём, как начать работу с Brisa, изучим основные принципы и рассмотрим примеры кода.
Создаём современные npm-пакеты и преодолеваем трудности совместимости ESM и CJS
Привет! Меня зовут Никита, и я тружусь в команде фронтенда платформы в Ozon. Платформа поставляет инструменты для создания и поддержки JS-проектов. В компании в настоящее время более 500 таких проектов. Мы прилагаем максимум усилий, чтобы разработчикам всех проектов было одинаково приятно работать с нашими инструментами.
Также мы предоставляем инструменты для создания JS-библиотек. И в этой статье я расскажу о том, как мы советуем создавать npm-пакеты. Отмечу, что это не касается UIKit-пакетов, — для них требуется довольно специфичный инструментарий, который заслуживает отдельной статьи.
Недавно у нас проходила актуализация инструментов, которая включала обновление версий Node, TypeScript и прочего. И мы обнаружили, что сейчас правильно упаковать библиотеку ой как нелегко, особенно с началом активной фазы по отказу от CommonJS. В идеале очень хочется иметь инструмент, который бы просто работал. В open-source есть парочка вариантов (unbuild, pkgroll, dnt), но выбрать подходящий мы пока не смогли. А написать свой — довольно трудоёмкая задача. В будущем мы обязательно обзаведёмся таким инструментом, а пока просто погрузились в тему и подготовили для наших разработчиков рекомендованные сетапы, которыми сейчас поделимся и с вами.
Интеграция внешнего файлового сервера https://min.io в фулстек приложение на NestJS и Angular
В этой статье я подключу в проект внешний файловый сервер https://min.io и напишу дополнительные бэкенд и фронтенд модули для интеграции с ним.
Почему мы выбрали gRPC вместо tRPC?
🛠️ Почему мы выбрали gRPC вместо tRPC
При разработке крупных приложений на основе Domain Driven Design переход от монолита к микросервисам требует сохранения принципов ООП для поддержки кода. gRPC предоставляет ряд преимуществ перед tRPC: возможность использования Golang для высоконагруженных компонентов, отказ от паттерна роутера в пользу прямых вызовов микросервисов, эффективную статическую типизацию через интерфейсы, децентрализованную архитектуру с возможностью частичного перезапуска микросервисов и автоматический мап методов классов без boilerplate кода.
Вклад авторов
Waterplea 600.0fillpackart 452.8jarvis394 375.0aio350 313.2MarsiBarsi 295.0ru_vds 278.8nin-jin 237.4nsbarsukov 224.0iliazeus 209.0it_monk 154.0