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

TypeScript *

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

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

Angular 20: Большое обновление для современного веба

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

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

Читать далее

Scenax: как превратить API-тесты в читаемые сценарии с Vitest и Allure (Часть 2)

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

В первой части статьи мы заложили фундамент.

В этой части статьи мы переходим от сценариев к архитектуре целых тестовых библиотек: подключаем lifecycle-хуки, вводим @Context и @Inject, создаём Step Library и автоматизируем запуск целых слоёв.

Читать далее

Эволюция Angular с колокольни UI-Kit-разработчика

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

На этой неделе команда Angular отметила значимый юбилей в истории развития своего фреймворка — 20-ю мажорную версию! Лучше повода не найти, чтобы удариться в ностальгические воспоминания про путь развития Angular за последние 5 лет — за десять последних мажорных версий.

Предлагаю нестандартный подход к изучению темы. Возьмем непопулярную точку зрения: мой многолетний опыт разработки огромной коллекции библиотек с компонентами под Angular — продукт под названием Taiga UI. В статье мы опустим многие заезженные фичи каждой мажорной версии Angular и сфокусируемся на кажущихся мелочах, которые стали значимыми шагами в истории развития нашего семейства библиотек. Я постараюсь на время статьи дать примерить шкуру разработчика Angular UI Kit!

Читать далее

Как я с помощью ChatGPT и Midjourney браузерную игру для изучения регулярных выражений создавал

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

Еще в бытность джунни, я наткнулся на милейшую интерактивную обучалку по селекторам CSS: CSS Diner. Кто не знает — обязательно посмотрите, эстетический кайф гарантирован. Прошел ее минут за 15 на одном дыхании и подумал: а почему бы не сделать что‑то подобное с аналогичной механикой «допиши правильное слово в пропуск в бойлерплейте», только по другой теме? Сходу на ум ничего не пришло, но идею я запомнил.

Три года спустя я решил изучить React, написав на нем какой‑нибудь пет‑проект (имхо, лучший способ изучить новую технологию/язык). Тут‑то я и вспомнил про CSS Diner. Осталось только найти подходящую тему, где эта механика бы зашла.

Читать далее

Тестовые идентификаторы: как и где расставлять правильно

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

По фактам: почему CSS и XPath — путь в ад, а test-id — спасение. В статье — реальные советы, как договориться с командой, внедрить test-id и писать автотесты, которые не разваливаются каждую пятницу.

Читать далее

Эволюция программирования: как парадигмы украли нашу свободу

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

Представьте: вы — инженер-программист из 60-х. Ваш код — это дикие прерии, где goto прыгает через функции как ковбой через барную стойку, а память — ваше личное ранчо. Вас внезапно переносят в 2023 год. Вас окружают фразы вроде «SOLID», «иммутабельность», «реактивные потоки». Вы пытаетесь написать пару строк на Python, но слышите: «Стоп. Мутировать переменные? В 2023-то? Это же грех!».

Что случилось с нашей свободой?

За последние 70 лет программирование из искусства постепенно превращалось в ремесло со своими жёсткими требованиями и правилами. Мы больше не взламываем реальность — мы строим мосты по ГОСТу.

Читать далее

Почему я исправляю баги бесплатно и как это изменило мою карьеру

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

8 лет назад я исправил опечатку в чужом репозитории, а сейчас регулярно делаю коммиты в проекты, которые использую, и даже вошел в core team библиотеки с 27000 звёзд на GitHub

В этой статье покажу, что участие в Open Source проще, чем кажется. Расскажу, как регулярная работа с чужим кодом помогает быстрее разбираться в незнакомых кодовых базах, писать тесты и лучше документировать решения. А также объясню, почему публичная активность на GitHub выгодно отличает вас от других разработчиков, особенно в эпоху повсеместного использования ИИ.

Читать далее

Погружение в grammY: разработка Telegram-бота с TypeScript и Docker

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

Привет, Хабр! В предыдущей статье о библиотеке grammY мы подробно разобрали основы создания Telegram-ботов на JavaScript. Кажется, настало время погрузиться в тему глубже и научиться добавлять более сложные фичи.

Мы подготовил пару инструкций по этой теме. В этой части разберем, как подключить базу данных и настроить регистрацию пользователей. А еще заложим фундамент, чтобы в будущем сделать интерактивное меню и подключить платежный модуль. По итогу у нас получится бот с простым, но рабочим онлайн-магазином, оплатой и взаимодействием с MongoDB. Подробности под катом!
Читать дальше →

История одного компонента

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

Введение в любой фреймвок начинается с написания одного простого компонента. Чаще всего этим компонентом будет "счетчик нажатий". Это своеобразный "hello world" в мире фронтенд разработки. Именно поэтому я и возьму его за основу данного материала.

Читать далее

Observable – не только удобный state-manager

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

Несколько месяцев назад я написал статью — «Observable — удобный state‑manager», что было скорее заметкой, и за что мне здорово досталось в комментариях! Уважаемым комментаторам — спасибо, я постарался учесть все замечания.

Сегодня представляю вам kr‑observable 2.0 — библиотеку для реактивного программирования на JavaScript. И удобный state-manager тоже.

Читать далее

TypeScript: стоит ли усложнять типы?

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

Что такое TypeScript? Официальная документация отвечает так: “TypeScript — это JavaScript с синтаксисом типов”. Однако некоторые считают TypeScript своеобразным слиянием двух языков: языка для манипулирования значениями JavaScript и языка для манипулирования типами.

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

Можно ли использовать это знание на практике? Как избежать крайностей от примитивного аннотирования типов до избыточного усложнения?

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

Читать далее

Пятый шаг в мир RxJS: Обработка ошибок

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

Вы уже встречались с этими "веселыми" историями, когда разработчик заканчивает работу над задачей, она проходит тестирование, отправляется в прод, а там встречается неожиданным отказом какого-нибудь мелкого метода api и укладывает всё приложение так, что пользователи наблюдают только белый экран?

Я в своё время познакомился с ними чересчур близко... И, честно сказать, потоки RxJs прекрасные учителя - тебе не захочется снова повторять их уроки. Чему же они нас учат? В первую очередь тому, что не стоит доверять внешним источникам; вы не контролируете ни соединение с сервером, ни api-сервис, а значит не имеете никаких оснований слепо доверять им и ожидать безотказной работы.

Читать далее

Гайд на полиморфизм. Основные идеи

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

Полиморфизм — сколько в этом слове красивого и даже таинственного. Происходит от греческого πολύμορφος что означает — многообразный.  В программировании это понятие встречается часто и  обыденно для понимания большинством программистов. Но так ли это на самом деле? 

Читать далее

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

Как с помощью Typescript я получал свойства React-компонентов

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

В статье — о том, как мы решили отказаться от PropTypes в пользу TypeScript для автоматического извлечения типов пропсов React-компонентов. 

Наши разработчики давно просили эту возможность, справедливо возмущаясь: «Зачем описывать типы дважды — в TypeScript и PropTypes?». Тем более, что аналогичный механизм уже работал в Storybook.

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

Читать далее

Зачем я написал vite-plugin-module-alias

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

На одном из проектов мне нужно было реализовать Telegram-бота с использованием Web App. Я выбрал стек: Vite + React + Zustand + TypeScript. До этого я в основном работал с Webpack, и столкнулся с вопросом — как удобно организовать алиасы. В Vite есть resolve.alias, и это удобно. Но дополнительно нужно прописывать пути в tsconfig.json, чтобы IDE понимала, что происходит. А ещё это не работает с HTML-импортами.

💡 Здесь важно: HTML теперь может импортировать модули напрямую, и если бы алиасы работали и там — можно было бы писать одни и те же пути и в скриптах, и в коде, и в конфиге.

Читать далее

Композиция DTO в TypeScript

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

Как собирать чистые и переиспользуемые DTO в TypeScript и NestJS с помощью миксинов? Модульность, валидация и никакого дублирования — всё в одном месте.

Читать далее

Почему мы выбрали TypeScript — и ни о чём не жалеем

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

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

Читать далее

Как мы приручали mini‑app telegram: 15 боевых задач и что помогло их решить

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

Когда мы решили вывести на прод Telegram‑мини‑приложение для «капельных» (drip) TON‑платежей, довольно быстро стало ясно: обычный CRUD‑фронт тут не выживет. Сразу накрыла волна специфичных задач — от гранулярного онбординга в Web‑App до борьбы с ограничениями API‑ключей и тонкостей работы с TON SDK во встроенном браузере Telegram. Каждый шаг требовал не только кода, но и аккуратного выбора архитектурных приёмов, иначе продукту грозили дубли запросов, «белые экраны» и несогласованность состояний.

В этой статье я разобрал пятнадцать самых характерных «боевых» сложностей, показал, каким паттерном мы их укрощали, и какой антипаттерн поджидал за поворотом. Это не академический список, а выжимка из коммитов и ночных дебаг‑сессий, которая поможет тем, кто строит похожие интеграции между Telegram, TON и React.

Читать далее

Как ESLint помогает управлять архитектурой проекта

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

Привет, Хабр! Я Борис Ермаченко, фронтенд-разработчик сервисов для физических лиц ПСБ. В этой статье рассмотрим, как с помощью ESLint построить архитектуру в проекте, и поговорим про несколько подходов.

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

Читать далее

Продвинутые методы использования TypeScript в реальных проектах

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



Ранее на Piccalilli Сэм Роуз поделился реальными примерами использования вспомогательных типов (utility types) TypeScript. Сегодня я хочу продолжить эту тему и поделиться несколькими продвинутыми возможностями TypeScript для работы с типами, которые, на мой взгляд, особенно полезны и применимы в реальных проектах.


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

Читать дальше →