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

TypeScript *

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

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

Deco.cx — «убийца» WordPress (пока только в мечтах основателей)

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

Самая популярная в мире CMS (система управления контентом) это WordPress. Почти половина (43%) веб-сайтов в мире управляется с помощью нее, и доля растет ().
Бразильский стартап Deco.cx хочет бросить вызов такому грозному сопернику. В начале года они привлекли раунд в 2,2 млн.$

Деньги планировали потратить на добавление ИИ в свой сервис, и судя по всему уже добавили.

Уверяют, что их продукт увеличивает скорость разработки в 10 раз. Проверить и поверить сложно, возможно какую-то часть SDLC действительно делают делают быстрее, но ведь часто долгий выпуск продукта не связан непосредственно с разработкой.

Читать далее

RSLike@3. Well-known Symbol, улучшенное использование Typescript, и весим больше

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

Еще совсем недавно я выпустил библиотеку которая должна была искоренить ошибки связанные с null и undefined . Честно признаюсь, что решил подсмотреть у Rust Option и Result апи, поскольку увидел в этом потенциал и удобство использования!

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

Читать далее

Почему вам необходим React Query

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

Не секрет, что я ❤️ React Query за то, как он упрощает взаимодействие с асинхронным состоянием в приложениях React. И я знаю, что многие коллеги-разработчики согласятся с этим.

Однако иногда я встречаю сообщения, в которых утверждается, что он вам не нужен для чего-то столь «простого», как получение данных с сервера.

Читать далее

То, что вы пишете, это точно composables?

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

В этой статье c помощью простого чек листа за пару шагов выясним, являются ли функции, которые вы пишете в своем vue коде, настоящими composables

Читать далее

Typescript Generics

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

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

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

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

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

Читать далее

Использование возможностей Angular. Часть 2

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

Как работают utility types, для чего они нужны и как использовать в работе. Для чего нужен infer, in, extends

Читать далее

Как проверить локаторы с помощью Playwright

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

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

Проверки локаторов

Это могут быть как интерактивные элементы (кнопки, поля ввода, чек-боксы, ...), так и статика (картинки, текст, иконки и т.д.).

Каждый элемент на странице может давать пользователю обратную связь: поле ввода подсвечивается красным, если вы ввели невалидные данные, иконка "Сохранить" неактивна, потому что вы еще не внесли изменения в документ, цвет всплывающего уведомления должен быть красным, потому что случилась ошибка. Чаще всего, нам нужно получить какое-то свойство элемента только для того, чтобы сразу же проверить его значение. Мы хотим проверить, что отображается правильный текст или элементу присвоен нужный CSS-класс.

С другой стороны, иногда нам нужно, все же, уметь получать свойства элементов для промежуточных действий. Например, мы хотим посмотреть, сколько сейчас строк в таблице, удалить одну и проверить, что строк стало меньше на одну. Для того, чтобы организовать такую проверку, нам нужно вычислить, сколько всего строк было до того, как мы удалили последнюю строчку. Если в таблице было X строк, то, после нажатия, должно быть X-1. Найдите икс, получается? И вот тут нам нужна "ручка", которую мы дернем и получим число, без всяких assert'ов.

Читать далее

Воплощённые типы

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

Всем привет!

Хочу представить вам подход к определению типов, позволяющий сделать ваш код чище и понятнее. Я называю это "Воплощённые типы"("Embodied types").

Воплощённый тип - тип, для которого определена переменная с одинаковым именем и в которой содержится объект с утилитами для этого типа.

Читать далее

Путь развития Frontend разработчика (Вторая часть)

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

Это вторая часть roadmap frontend разработчика, Если вы не читали первую часть, то настоятельно рекомендую ознакомится, Первая часть. В этой статье я продолжу вам рассказывать про мое представление современной карты развития frontend разработчика.

Читать далее

Использование кастомных шаблонов и конфигов для swagger-typescript-api

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

swagger-typescript-api - это мощный инструмент для генерации кода на основе OpenApi-контактов, о процессе работы с которым я рассказывал в предыдущей статье. Там же я упомянул, что его можно кастомизировать под нужды конкретного проекта с помощью своих шаблонов.

Именно кастомные шаблоны и бонусом, кастомная конфигурация, будут раскрыты в текущей статье. Поехали!

Читать далее

Декодируем protobuf загружая чанки loadable-components в NodeJS

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

У меня возникла задача спарсить данные с веб-сайта aboutyou.de. Я провел быстрый анализ страниц и обнаружил, что сайт не имеет серьезной защиты и вся необходимая информация доступна в HTML. На первый взгляд всё казалось окей. Но это, между прочим, не окей.

Читать далее

className убивает ваш UI kit

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

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

Гибкое API у UI kit компонентов является преимуществом. Однако возможность повлиять на стили ваших компонентов в конкретном месте является большим искушением. Разработчику выгодно внести изменение здесь и сейчас, а не думать на перспективу. Такое поведение постепенно разрушает вашу систему переиспользования.

Читать далее ?

Минимализм / Минималист / TMUX.config

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

Заметили, что мир становится намного красочнее, пестрее, ярче и контрастнее?

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

Сейчас же парадигма сместилась в сторону скроллинга ярких картинок, фотографии и видео, и на первый план вышло яркое представление, а не качество внутри.

В ИТ мире тоже происходит такой сдвиг, программы для разработки (IDE) походят больше на елку с гирляндой или какие-то детские квесты из 2000-х. Странность заключается в том, что центр внимания программиста смещается со знаний, на все что угодно, но только не на написание качественного кода, изучения алгоритмов или разобраться как же все таки работает Garbage Collector (.Net мем). Становятся популярны какие-то странные супер фичи будущего, выбор красивой подсветки ошибок, умные помощники и т.д. Но самое странное все начинают называть себя экспертами всех этих ценностей.

https://github.com/paulbuzakov/tmuxconfig

Читать далее

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

JS. Валидация данных. Пишем свой YUP

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

Создаем TypeScript библиотеку для валидации данных. Поэтапно добавляем основной функционал и типизацию. Делаем основую упор на простоту кода и проиводительность. Как протитип используем yup и zod.

Читать далее

Работа с REST API при помощи swagger-typescript-api

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

Прежде чем начать писать данную статью, я озадачился интересным вопросом. А кто как вообще работает с API в 2024 году? Для меня наличие Swagger-контракта или OpenAPI-контракта уже несколько лет как must have. И откровенно говоря, мне сложно представить, что люди не используют этот фреймворк для работы c REST API. Однако, если среди читателей таковые есть, и вам до сих пор скидывают «дтоошки», то вперед осваивать и продвигать OpenApi.

Для понимания работы swagger-typescript-api я сначала кратко опишу основные моменты спецификации OpenAPI. Читатели, которые уже знакомы с этим, могут сразу перейти к части про swagger-typescript-api.

Читать далее

Необычный RxJS

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

Всем привет! А вы знали, что RxJS содержит в себе более 100 операторов? Но если ваш проект использует эту библиотеку - скорее всего вы с трудом насчитаете у себя больше пары десятков. Интересная ситуация, да? Не знаю почему так получается, но сегодня я хочу поделиться реальными примерами использования “редких” операторов. Приступаем!

Читать далее

Директор директив. Расширяем функционал angular-компонентов красиво. Директива-контекст

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

Игнорируете кастомные директивы в Angular? Зря-зря, многое упускаете.

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

Читать далее

Монорепозиторий с pnpm и typescript для фронтенда на React и бэкенда на Node.js

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

Устанавливаем pnpm, создаем воркспейсы для фронта и бека, импортируем что угодно из одного в другое, типизируем запросы и избавляемся от бойлерплейта.

Читать далее

Zustand.js: современный, невесомый, производительный и очень гибкий state manager

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

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

В статье я расскажу:

о простом интерфейсе Zustand

о его внутреннем устройстве

о производительности без усилий: 3 простых способа оптимизаций

о производительности на максималках: не всегда нужно использовать длинный цикл рендера React, чтобы достичь максимальной производительности - Zustand может быстрее!

о применении на практике: советы и рекомендации по интеграции Zustand в ваши проекты для достижения масштабируемости и удобства поддержки.

Начните активно использовать Zustand в своих проектах - вы будете приятно удивлены простотой и удобством работы с ним.

Читать далее

Написание слоя API в приложении — это прошлый век! Встречайте универсальный прокси

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

Перестаньте писать, генерировать и переписывать API слой для каждого приложения - создайте универсальный прокси с TypeScript единый для множества приложений и обновляйте только типы при изменениях API на сервере!

Ваш API слой всегда будет оставаться минимальным в размерах и не увеличится ни на байт с увеличением количества вызываемых методов! Это обеспечит стройность вашим бандлам и добавит удовольствие пользователю от быстрой загрузки вашего сайта

Читать далее