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

TypeScript *

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

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

Свой LLM-агент на Typescript с использованием MCP

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

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

Читать далее

Новости

Для чего нужны enum в TypeScript. Подробно и простым языком

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

Привет, меня зовут Дмитрий, и я руководитель фронтенд-разработки в компании Интелси. В данной статье я хочу подробно разобрать enum в TypeScript, чтобы было понятно, что это такое, для чего нужно и почему это работает именно так.

Читать далее

React Custom Hook: useScript

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

useScript можно использовать в различных сценариях. Например, вы можете загружать внешние библиотеки, такие как jQuery, что позволяет использовать его мощные функциональные возможности, не увеличивая объем вашего пакета. Кроме того, вы можете загрузить аналитические скрипты, виджеты социальных сетей или любые другие скрипты, необходимые для динамического поведения вашего приложения.

Читать далее

Простая и мощная валидация форм для SolidJS с Zod

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

solidjs-hook-form — библиотека для удобной и быстрой работы с формами в SolidJS. Использует Zod для мощной валидации и встроенную реактивность SolidJS для высокой производительности. Легковесная, не навязывает стили и дает полный контроль над UI. Идеальна для разработчиков, которые хотят меньше возиться с формами и больше фокусироваться на логике приложения. Попробуйте, если работаете с SolidJS — возможно, это то, что вам нужно!

Читать далее

Как порядок свойств убивает JavaScript?

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

Привет, Хабаровчане! Во второй статье, хочу поделиться наблюдениями из документации V8 и немного нудной информацией для многих :-)

Читать далее

Изучаем Go: руководство для JavaScript-разработчиков. Часть 2

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

После пяти лет работы JavaScript-разработчиком, занимаясь как фронтендом, так и бэкендом, я провел последний год, осваивая Go для серверной разработки. За это время мне пришлось переосмыслить многие вещи. Различия в синтаксисе, базовых принципах, подходах к организации кода и, конечно, в средах выполнения — все это довольно сильно влияет не только на производительность приложения, но и на эффективность разработчика.

Интерес к Go в JavaScript-сообществе тоже заметно вырос. Особенно после новости от Microsoft о том, что они переписывают официальный компилятор TypeScript на Go — и обещают ускорение до 10 раз по сравнению с текущей реализацией.

Эта статья — своего рода путеводитель для JavaScript-разработчиков, которые задумываются о переходе на Go или просто хотят с ним познакомиться. Я постарался структурировать материал вокруг ключевых особенностей языка, сравнивая их с привычными концепциями из JavaScript/TypeScript. И, конечно, расскажу о "подводных камнях", с которыми столкнулся лично — с багажом мышления JS-разработчика.

Читать далее

Angular Signals + RxJS: объединяем два реактивных мира в одном стейт-менеджере

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

Angular долгое время ассоциировался с RxJS. Даже слишком: многие разработчики ощущали, что без Observable ничего не работает. Но вот в Angular 17 появляются Signals — синхронная реактивность прямо из коробки. В 17+ — они становятся мейнстримом. Возникает вопрос: а что делать с RxJS? Выбрасывать?

Signals и RxJS — не конкуренты, а два мощных инструмента для решения разных задач. И если их правильно сочетать, можно построить удобную, масштабируемую и эффективную архитектуру.

Читать далее

Перестаньте использовать CustomEvent

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

Я часто вижу, как веб-разработчики используют CustomEvent в коде своих компонентов. Настолько часто, что у многих складывается впечатление, будто CustomEvent — единственный способ создавать custom события (с маленькой "c"), а то и вообще единственный способ генерировать собственные события.

Это понятно. Это прямо указано в названии: "Пользовательское" событие. Создается впечатление, что это идеальный инструмент для этой задачи. Это даже звучит созвучно с "пользовательским компонентом". Но я всегда говорю разработчикам, не использовать CustomEvent. Нет ни одной причины это делать. Почему?

Читать далее

Документирование фронтенд-приложений: обзор JSDoc и Storybook

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

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

В этой статье мы рассмотрим два популярных подхода к документированию фронтенд-кода: JSDoc и Storybook. Они решают схожие задачи, но совершенно разными способами и с разным фокусом.

Читать далее

Профессиональная обработка ошибок в TypeScript

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

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

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

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

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

Читать далее

Принцип единой ответственности SOLID в React

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

Всем привет! Меня зовут Дмитрий, и я руководитель фронтенд-разработки в компании Интелси.

Сегодня хочу рассказать о принципе единственной ответственности (Single Responsibility Principle) — первом из пяти принципов SOLID, сформулированных Робертом Мартином в его книге "Agile Software Development: Principles, Patterns, and Practices". Суть этого принципа звучит так: «Класс должен иметь только одну причину для изменения» (A class should have only one reason to change).

Читать далее

Dependency Injection в JavaScript: зачем он вам нужен

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

Как избавиться от проп-дриллинга, упростить тестирование и навести порядок в зависимостях React/JS‑приложения? В статье — зачем вообще нужен dependency injection в JavaScript, почему он редко используется и как это меняет @wroud/di. С кодом, примерами и без тяжёлой рефлексии.

Читать далее

Ассиметрия в ревью

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

Как-то в одной известной компании решили упразднить процесс под названием "код-ревью". Упразднили не на уровне компании, а на уровне отдела, но в итоге упразднили не процесс, а того самого менеджера (по офицальный версии причины были другие, но мы-то знаем). Процесс (код-ревью), как видно, полезный, если способен пережить одного менеджера, но видно, вопросы к нему имеются. Код-ревью представляет собой взаимодейсвие автора пулл реквеста и ревьюера, что-то типа игры с ненулевой суммой, где та самая сумма аккумулируется между участниками процесса.

Фикс критической ошибки (не архитектурной или по дизайну системы, а именно ошибки/баги) не добавляет профита ревьюеру. При удачной фиче похвала и бонус пойдут автору. То есть действия ревьюрера приносят ноль ему и что-то автору. Хотя ревьюер может не только помочь, но и навредить - заблочить пул реквест (и иногда действительно такое случается), бизнес невилирует отрицательные последствия - вмержат только в путь, когда бабло начнет течь мимо кассы. Не беря во внимание совесть ревьюера, получить максимальный профит можно на дейликах (ведь для этого утренние созвоны и нужны, так ведь?) - аккурат перед мержем пулл реквеста упомянуть о критической неисправности.

Ревью это про чтение кода - выбор золотой середины между мыслями автора и доходчивостью ревьюера. Последний может попросить скомпоновать код попроще, что скорее всего заставит автора выгрузить из оперативной памяти смысловые блоки под запись в файл. Данную аргументацию дополняет еще и условие: пишем раз, читаем много раз. Если ревьюеру хочется сделать фичу самому - лучше сделать ее самому, а если уже поздно - лучше не бурчать, а понять и простить. Но никто же не просит устранять неэффективность (говнокод) без удовольствия, так? Предлагаю рассмотреть примеры кода на языке "тайпскрипт", хотя идеи ниже могут быть применимы к любому языку программирования.

Читать далее

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

React Custom Hook: useMediaQuery

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

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

Читать далее

FSD Forge: Как я создал небольшую CLI для Feature-Sliced Design и почему это было нужно

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

Привет, Хабр! Меня зовут Виктор, я программирую на TypeScript/Java и это моя первая статья, в которой я хочу поделиться историей создания fsd-forge — CLI-инструмента для упрощения работы с архитектурой Feature-Sliced Design (FSD) в проектах на React и TypeScript. В этой статье я расскажу, почему решил создать этот инструмент, как он устроен, какие проблемы решает, и какие уроки я вынес из процесса разработки.

Что такое Feature-Sliced Design и зачем нужен CLI?

Feature-Sliced Design — это архитектурный подход для структурирования фронтенд-приложений, который помогает организовать код в масштабируемых проектах. FSD делит приложение на слои (app, pages, features, widgets, entities, shared), делая код модульным, читаемым и легким для поддержки. Однако создание новой структуры FSD или добавление сущностей (например, страниц или виджетов) вручную занимает время и чревато ошибками, особенно в больших командах.

Идея fsd-forge родилась из личной потребности. Работая над несколькими React-проектами, параллельно переписывая с Angular на React еще один, я заметил, что:

Читать далее

React Custom Hook: useGeolocation

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

Одним из ключевых преимуществ useGeolocation является его простота. Благодаря инкапсуляции сложной логики, необходимой для доступа к геолокации и ее обработки, этот хук обеспечивает чистое и многократно используемое решение. Хук автоматически обрабатывает состояние загрузки, обновляя его при загрузке данных геолокации, и устанавливает состояние ошибки, если в процессе возникают какие-либо проблемы.

Читать далее

i18n и l10n: Почему разработчикам стоит об этом знать — и как может помочь ИИ

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

Интернационализация (i18n) и локализация (l10n) часто кажутся проблемами “на потом” — пока внезапно не становятся срочными.

Как разработчики, мы все делали что-то вроде:

<button>Order now</button>

Или в шаблоне:

<p>Welcome back, {{ user.name }}!</p>

Всё работает — пока команда не говорит:
«Мы выходим на рынок Узбекистана, Казахстана и Ближнего Востока в следующем квартале.»

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

Вот тогда и наступает момент задаться вопросом: что такое i18n и l10n — и почему это важно?

Читать далее

Почему стоит использовать Tagged Unions при разработке на TypeScript

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

Почему стоит использовать Tagged Unions при разработке на TypeScript

👋 Привет! Меня зовут Александр, я работаю фронтенд-разработчиком в компании «МегаФон». Сегодня я хочу поговорить на тему Tagged Unions (размеченных объединений) и объяснить, почему они ваш секретный инструмент для написания надежного TypeScript-кода.

Читать далее

Альтернативный способ хранения скриншотов в Playwright и способ их обновления

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

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

Одним из инструментов, предоставляющих возможность автоматизации данного вида тестирования, является Playwright.

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

Читать далее

Изучаем Go: руководство для JavaScript-разработчиков. Часть 1

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

После пяти лет работы JavaScript-разработчиком, занимаясь как фронтендом, так и бэкендом, я провел последний год, осваивая Go для серверной разработки. За это время мне пришлось переосмыслить многие вещи. Различия в синтаксисе, базовых принципах, подходах к организации кода и, конечно, в средах выполнения — все это довольно сильно влияет не только на производительность приложения, но и на эффективность разработчика.

Интерес к Go в JavaScript-сообществе тоже заметно вырос. Особенно после новости от Microsoft о том, что они переписывают официальный компилятор TypeScript на Go — и обещают ускорение до 10 раз по сравнению с текущей реализацией.

Эта статья — своего рода путеводитель для JavaScript-разработчиков, которые задумываются о переходе на Go или просто хотят с ним познакомиться. Я постарался структурировать материал вокруг ключевых особенностей языка, сравнивая их с привычными концепциями из JavaScript/TypeScript. И, конечно, расскажу о "подводных камнях", с которыми столкнулся лично — с багажом мышления JS-разработчика.

Читать далее
1
23 ...