Как стать автором
Поиск
Написать публикацию
Обновить
53.31

TypeScript *

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

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

Рецепты TypeScript: простое тестирование типов

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

Привет, это снова Костя из Cloud.ru! В своих последних статьях я делился рецептами довольно сложных типов. Например, рассказывал, как преобразовывать ключи объектов из snake_case в camelCase. Давайте представим, что вы воспользовались одним из таких рецептов. Как его поддерживать? И что скажет ревьюер, увидев такой код?

Сегодня в меню не блюдо, а ложка — покажу, как можно надежно тестировать типы и не бояться их менять, если это нужно.

Взять ложку

Хост директивы: ключ к декомпозиции

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

В Angular 15 появилась новая фича, которой не уделяют должного внимания, — Directive Composition API. Она добавляет hostDirectives: [...] в декоратор @Component/@Directive. В этом массиве можно перечислить standalone-директивы, которые хотим автоматически навесить на компонент или директиву. Это позволяет очень удобно декомпозировать логику и открывает много дверей для новых подходов к разработке.

Читать далее

FSD 2.1 или как «pages first» подход может ухудшить структуру ваших Frontend приложений

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

Всем привет! 13 ноября, в официальном Telegram канале Feature Sliced Design состоялся релиз новой версии архитектурной методологии. Он принёс в себе несколько важных, фундаментальных изменений, о которых мы сегодня и поговорим.

Читать далее

Как мы мигрируем с JQuery на React

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

Вокруг все говорят о серверных компонентах реакта, о серверном рендеринге, и разных новшествах в мире фронтенде. Как будто JQuery в один миг взял и исчез. Несмотря ни на что он всё ещё остаётся самой популярной библиотекой 😅.

Сегодня я вам расскажу, как мы постепенно мигрируем с JQuery на React.

Читать далее

TS Extend: полезная утилитарная функция для расширения type

Время на прочтение3 мин
Количество просмотров1.9K

В текущей версии TS (5.7) нет нативного расширения типов.

Расширение в TS реализуют интерфейсы через ключевое слово extend, причем интерфейсы могут быть расширены только от одного объекта.

Хотя для типов (type/interface) предусмотрена операция интерсекции (&), которая объединяет свойства двух или более типов - она обладает важным ограничивающим свойством - при наличии одинаковых свойств, операция интерсекции присваивает их результирующему типу значение never.

Если же мы хотим, чтобы свойство перезаписывалось последним значением пересечения, мы можем написать утилитарную функцию Extend, которая примет в себя массив типов, объединит их, а при наличии свойств с одинаковым именем, запишет в конечное значение последнее из них.

Читать далее

Интеграция и сохранение выбранного языка пользователя в базу данных в фулстек-приложении на «Angular» и «NestJS»

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

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

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

Читать далее

Бесплатное обучение фулстек-разработке веб-сервиса с нуля по видео-урокам с исходным кодом и поддержкой

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

TLDR. Я примерно год создавал курс из 141 урока. Курс получился хороший, все кто проходят рады и пишут положительные отзывы. Я пытался его продавать, в лучшем случае у меня получалось отбивать рекламу в ноль. Короче, я хороший разработчик, я хорошо доношу материал, но я плохой маркетолог. Все эти таргреты, ретаргеты, воронки, шморонки — тоска унылая. Мне гораздо веселее и понятнее заработать на создании и запуске IT-продуктов, чему я и учу в этом учебнике. Так что пишу эту статью, чтобы сообщить вам о существовании моего курса и предложить всем желающим абсолютно бесплатно получить от него пользу 🙂

Цель обучения — создать проект с нуля, изучив и применив технологии и архитектуру, которые обеспечивают качество и масштабируемость вашего кода, скорость разработки, а также удовольствие и радость от процесса.

Читать далее

# React-Query — Общий обзор и мотивация к применению

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

React-Query - Общий обзор и мотивация к применению. Первая проба технологии для фронтенд команды компании Chibbis. Общий обзор технологии и практика внедрения.

Читать далее

Поддержка временных зон в фулстек-приложении на основе NestJS и Angular: работа с REST и WebSockets

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

В этой статье я хотел бы поделиться своим опытом по внедрению поддержки временных зон в фулстек-приложение, построенное на NestJS и Angular. Мы узнаем, как сохранить настройки таймзоны пользователя в базе данных и правильно использовать их при взаимодействии с сервером через REST и веб-сокеты.

Читать далее

Пишем Realtime для Multiple-page application в микросервисной архитектуре

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

⌚️Пишем Realtime для Multiple-page application в микросервисной архитектуре

Частое явление в вебе — полная перезагрузка приложения при переходе между страницами. При этом соединение WebSocket разрывается, а новая подписка устанавливается только после начала выполнения загруженного JavaScript, что занимает как минимум секунду. Во время перезагрузки страницы сообщения, отправленные через WebSocket, не будут получены клиентской частью приложения.

В статье описывается, как отправить пропущенные во время переподключения события WebSocket повторно в порядке очередности поступления

Читать далее

Бот за 15 минут на генераторах

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

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

Что делать? Логичное решение — максимально упростить бота и написать его на стороне фронтенда с отправкой результата на бэкенд и получением ответа одним запросом. Думаю, многие баловались или могут представить, что это несложно, но нужно писать множество конструкций и условий.

Я же предлагаю в статье посмотреть, как написать бота с помощью простого советского JavaScript‑генератора.

Читать далее

ЕВРАЗ доверил ревизию кода ИИ

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

Недавно прошёл Хакатон ЕВРАЗа 3.0, на котором участникам поставили задачу упростить и ускорить важный процесс разработки — code review. Эта сложная и трудоемкая часть работы программистов, которая требует предельной концентрации и широкого опыта специалистов. 

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

Читать далее

Добавление поддержки нескольких языков в NestJS и Angular приложениях

Время на прочтение15 мин
Количество просмотров1.3K

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

Читать далее

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

Валидация REST-запросов в NestJS-приложении и отображение ошибок в формах Angular-приложения

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

В этом посте я добавлю в NestJS-приложении валидацию REST-запросов и их отображение в формах Angular-приложения.

Читать далее

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

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

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

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

Читать далее

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

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

Всем привет!

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

Читать далее

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

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

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

Читать далее

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

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

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

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

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

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

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

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

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

Читать далее

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

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

Привет, Habr!

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

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

Читать далее