Как стать автором
Обновить
139.11

TypeScript *

Cтрого типизированная надстройка для JavaScript

Сначала показывать
Порог рейтинга
Уровень сложности

Четыре пункта, как улучшить код Backend стажера

Уровень сложностиПростой
Время на прочтение6 мин
Количество просмотров6.8K

📦 Четыре пункта, как улучшить код Backend стажера

В статье разобраны распространенные проблемы в коде начинающих разработчиков с конкретными решениями: грамотная инъекция зависимостей, использование Scoped-сервисов, паттерн Generic Repository и создание Stateless-классов. Материал будет полезен Junior и Middle разработчикам, которые стремятся улучшить архитектуру своих проектов и избежать ошибок структурирования кода в backend NodeJS разработке

Читать далее

Nuxt I18n Micro: Как я решил написать свой i18n для NuxtJS

Уровень сложностиПростой
Время на прочтение3 мин
Количество просмотров1.1K

Всем привет!

Я занимаюсь разработкой на Nuxt с самого его появления, и у меня возникла очень большая проблема с реализацией i18n.

Читать далее

Получение серверного времени через WebSockets и отображение его в Angular-приложении

Время на прочтение7 мин
Количество просмотров604

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

Читать далее

Рецепты TypeScript: перевод ключей объекта в camelCase

Уровень сложностиСредний
Время на прочтение4 мин
Количество просмотров5.1K

Всем привет! С вами снова Костя Логиновских — ведущий разработчик из Cloud.ru. Я уже делился TypeScript-рецептами в предыдущих статьях — вот первая и вторая — и теперь хочу рассказать про еще один. Наши рецепты — это готовый код, который можно применить в конкретных ситуациях, а в некоторых случаях и подогнать ситуацию под код.

Сегодня в меню — функция на обычном TypeScript, которая преобразует тип объекта так, чтобы все ключи внутри него из snake_case стали camelCase. Жду всех под катом!

Смотреть рецепт

Истории

Обзор на Model Context Protocol (MCP) от Anthropic

Уровень сложностиСредний
Время на прочтение6 мин
Количество просмотров1.1K

На заре появления LLM пользователям приходилось просто копировать свой код в текстовое окно, чтобы ИИ могла его обработать. Естественно, такой подход быстро всех утомил, и разработчики начали искать свои способы загрузки данных в модель. У этого подхода была серьезная проблема — каждому приходилось изобретать велосипед заново.

Именно поэтому появился протокол MCP (Model Context Protocol) — универсальный способ дать искусственному интеллекту доступ к нужным данным, неважно где они хранятся — на компьютере пользователя или же в интернете.

Читать далее

Как я создал Vanilla Calendar Pro — легкий и гибкий календарь на JavaScript с использованием TypeScript

Уровень сложностиПростой
Время на прочтение3 мин
Количество просмотров16K

Привет, Habr!

Честно говоря, долго сомневался, стоит ли писать эту статью. Я понимаю, что среди комментариев наверняка будут такие, кто скажет: «Очередной никому не нужный датапикер». Но сегодня, когда Vanilla Calendar Pro собрал больше 480 звезд на GitHub и получает 17 тысяч скачиваний в месяц, я решил поделиться своей историей.

Хочу сразу отметить: я не претендую на лавры лучшего разработчика календарей и датапикеров. Эта статья о моем первом опыте в open source, о том, как я создавал проект с нуля и как он стал полезен другим разработчикам.

Читать далее

Типизация свойства объекта в виде строки

Уровень сложностиПростой
Время на прочтение3 мин
Количество просмотров1.7K

Все так или иначе сталкивались с функцией или методом, который принимает объект и свойства в виде строки с которым нужно что-то сделать. Пример:

updateDate(user, "date");

И когда изменяется свойства объекта (user.dateuser.birthday), компилятор его нормально скомпилирует и мы лишаемся возможности отловить баг на стадий разработки.

Решить проблему

Магия Injection Context

Уровень сложностиСложный
Время на прочтение8 мин
Количество просмотров5.3K

В последних версиях Angular появилась функция inject(), предназначенная для внедрения зависимостей. Эта функция может быть вызвана только в рамках Injection Context.

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

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

Читать далее

Книга: «Рецепты TypeScript»

Время на прочтение6 мин
Количество просмотров4.5K
image Привет, Хаброжители!

«Рецепты TypeScript» Стефана Баумгартнера – книга из серии «книг рецептов» O’Reilly. Такое название серии объясняется структурой этих книг: вместо бесконечных теоретических выкладок, сквозь которые продираться не то что нелегко, а попросту скучно, авторы предлагают погружаться в материал через «рецепты» – примеры реальных задач, которые сопровождаются лаконичными и понятными решениями и их подробным обсуждением – того, как автор к ним пришёл и почему они являются действенными. В этот ряд «поваренных книг» вписывается и та, о которой мы поговорим сегодня.
Читать дальше →

Хороший рефакторинг vs плохой рефакторинг

Уровень сложностиПростой
Время на прочтение10 мин
Количество просмотров7.4K

За последние годы я нанял многих разработчиков. И не раз случалось, что новички сразу заявляли, что наш код требует серьёзного рефакторинга. Но вот в чём дело: во многих случаях случаях их «улучшенный» код оказывался сложнее для понимания и сопровождения. Более того, он обычно становился медленнее и содержал больше багов.

Не поймите меня неправильно. Рефакторинг — это не что-то плохое само по себе. Это важная часть поддержания кода в хорошем состоянии. Проблема в том, что плохой рефакторинг это действительно плохо. И, к сожалению, попасть в ловушку «хотели как лучше, а получилось как всегда» проще, чем кажется.

Давайте разберёмся, что отличает хороший рефакторинг от плохого и как не стать тем разработчиком, которого коллеги боятся подпускать к коду.

Читать далее

Вышел TypeScript 5.7

Уровень сложностиПростой
Время на прочтение12 мин
Количество просмотров2.7K

Сегодня мы рады сообщить о выходе TypeScript 5.7!

Если вы не знакомы с TypeScript, то это язык, который развивает JavaScript, добавляя синтаксис для деклараций типов и аннотаций. Этот синтаксис может быть использован компилятором TypeScript для проверки типов нашего кода, а также может быть удален для создания чистого, идиоматического JavaScript-кода. Проверка типов полезна тем, что позволяет заранее выявить ошибки в нашем коде, но добавление типов в код также делает его более читаемым и позволяет таким инструментам, как редакторы кода, предоставлять нам такие мощные возможности, как автозавершение, рефакторинг, поиск всех ссылок и многое другое. TypeScript является надмножеством JavaScript, поэтому любой правильный код JavaScript также является правильным кодом TypeScript, и если вы пишете JavaScript в редакторе, таком как Visual Studio или VS Code, TypeScript также является основой вашего опыта работы с редактором JavaScript! Вы можете узнать больше о TypeScript на нашем сайте typescriptlang.org.

Читать далее

Кэширование информации в Redis на NestJS

Время на прочтение14 мин
Количество просмотров769

На каждом фронтенд запросе к бэкенду запрашивается информация по профилю пользователя из базы данных, это создает дополнительную нагрузку на базу данных и увеличивает время ответа бэкенда, для ускорения подобных запросов можно кэшировать ответ базы данных.
В этом посте я подключу Redis к проекту и настрою кэширование данных через @nestjs-mod/cache-manager.
Проект можно запускать в Docker Compose и Kubernetes.

Читать далее

Генерация кода валидации из спецификации OpenAPI: как мы синхронизировали валидаторы данных между бэкендом и фронтендом

Уровень сложностиСредний
Время на прочтение8 мин
Количество просмотров1.7K

Представьте ситуацию: ваша команда закончила интеграцию с API, все протестировала и подготовила релиз. А тут внезапно серверная команда меняет формат ответа. Фронтенд падает, QA злится, пользователи недовольны. Приходится вручную переписывать валидации, искать баги и терять дни, чтобы всё починить. 

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

В первую очередь статья будет полезна фронтенд-разработчикам и командам, работающим над сложными веб-приложениями, особенно тем, кто активно взаимодействует с API, описанными через OpenAPI. 

Читать далее

Ближайшие события

Продвинутая регистрация multi-сервисов в Angular

Уровень сложностиСредний
Время на прочтение8 мин
Количество просмотров2.6K

Внедрение нескольких сервисов с помощью одного токена — достаточно удобная механика в фреймворке Angular. Однако, можно столкнуться с неприятностью, что во всех местах, где нужно получить данный сервис, придётся как-то выбирать нужный инстанс из массива. Кто-то делает это напрямую, через метод массива find, кто-то регистрирует сервис-менеджер, который умеет возвращать нужный инстанс, однако оба варианта рождают неприятный бойлерплейт. В этой статье разберём подход по удобной и продвинутой регистрации multi-сервисов.

Читать далее

Как я писал плагин для TypeScript. Часть 1. IDE

Уровень сложностиСложный
Время на прочтение15 мин
Количество просмотров2.4K

Привет, Хабр! Меня зовут Дима, я Head of Frontend в Dodo Engineering. Моя команда создаёт инструменты для удобной работы с фронтендами, унифицирует подходы к разработке, помогает другим командам в создании удобных пользовательских интерфейсов Dodo IS.

Недавно мне срочно понадобилось написать плагин для TypeScript. Начал я с того, что погуглил, как это сделать. По пути боролся с повышенным потреблением памяти и искал недостающие файлы в массиве, переписывал Proxy и не только, а закончил на... А впрочем, давайте вместе разбираться, зачем мне вообще понадобился плагин и как я его писал.

Читать далее

Typescript для React

Уровень сложностиПростой
Время на прочтение5 мин
Количество просмотров6.5K

Typescript - сложный язык, но большинству разработчиков не нужно знать все его тонкости, чтобы быть эффективными в своей работе.

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

Основные принципы, которые мы здесь используем:

Типизируйте входные данные, предсказывай результат

Минимизируйте шум в кодовой базе

Ошибки должны отображаться как можно ближе к коду, который их вызвал

Читать далее

Введение в Brisa: новый подход к веб-разработке

Уровень сложностиПростой
Время на прочтение6 мин
Количество просмотров6.1K

Brisa — это современный веб-фреймворк, который сочетает мощь серверного рендеринга и удобство клиентских компонентов. Он позволяет создавать быстрые, легкие и высокопроизводительные веб-приложения, минимизируя объем JavaScript, отправляемого в браузер. Поддержка веб-компонентов, гибкая интернационализация и возможность кроссплатформенной разработки с помощью Tauri делают Brisa универсальным инструментом для веб-разработчиков.

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

Читать далее

Создаём современные npm-пакеты и преодолеваем трудности совместимости ESM и CJS

Уровень сложностиПростой
Время на прочтение16 мин
Количество просмотров4.2K

Привет! Меня зовут Никита, и я тружусь в команде фронтенда платформы в Ozon. Платформа поставляет инструменты для создания и поддержки JS-проектов. В компании в настоящее время более 500 таких проектов. Мы прилагаем максимум усилий, чтобы разработчикам всех проектов было одинаково приятно работать с нашими инструментами.

Также мы предоставляем инструменты для создания JS-библиотек. И в этой статье я расскажу о том, как мы советуем создавать npm-пакеты. Отмечу, что это не касается UIKit-пакетов, — для них требуется довольно специфичный инструментарий, который заслуживает отдельной статьи.

Недавно у нас проходила актуализация инструментов, которая включала обновление версий Node, TypeScript и прочего. И мы обнаружили, что сейчас правильно упаковать библиотеку ой как нелегко, особенно с началом активной фазы по отказу от CommonJS. В идеале очень хочется иметь инструмент, который бы просто работал. В open-source есть парочка вариантов (unbuild, pkgroll, dnt), но выбрать подходящий мы пока не смогли. А написать свой — довольно трудоёмкая задача. В будущем мы обязательно обзаведёмся таким инструментом, а пока просто погрузились в тему и подготовили для наших разработчиков рекомендованные сетапы, которыми сейчас поделимся и с вами.

Читать далее

Интеграция внешнего файлового сервера https://min.io в фулстек приложение на NestJS и Angular

Время на прочтение26 мин
Количество просмотров830

В этой статье я подключу в проект внешний файловый сервер https://min.io и напишу дополнительные бэкенд и фронтенд модули для интеграции с ним.

Читать далее

Почему мы выбрали gRPC вместо tRPC?

Уровень сложностиСредний
Время на прочтение11 мин
Количество просмотров9.2K

🛠️ Почему мы выбрали gRPC вместо tRPC

При разработке крупных приложений на основе Domain Driven Design переход от монолита к микросервисам требует сохранения принципов ООП для поддержки кода. gRPC предоставляет ряд преимуществ перед tRPC: возможность использования Golang для высоконагруженных компонентов, отказ от паттерна роутера в пользу прямых вызовов микросервисов, эффективную статическую типизацию через интерфейсы, децентрализованную архитектуру с возможностью частичного перезапуска микросервисов и автоматический мап методов классов без boilerplate кода.

Читать далее