TypeScript *

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

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

Привет! Меня зовут Врублевский Артур, и я занимаюсь frontend-разработкой на Angular в Страховом Доме ВСК. Так сложилось, что ранее, до работы в ВСК, я уже сталкивался с инструментом Sentry – занимался его настройкой на отлов ошибок. Наверно именно поэтому я был привлечен к неожиданным для меня работам, которые так же касались Sentry, его использования в необычной плоскости. Об этом и пойдет далее рассказ в 6 актах.

Стадия 1 — «Отрицание»

Думаю, многим Sentry известен как инструмент, позволяющий аккумулировать ошибки, отслеживать метрики производительности, делать тревожные оповещения о состоянии ваших приложений. И когда мне принесли задачу, звучащую как «Нам нужны продвинутые бизнес-метрики, можем ли мы это сделать в Sentry?», я сразу начал отрицать возможность такой затеи. Это казалось противоестественным действием, хотелось отправить постановщика в Яндекс Метрику, которая изначально была создана для подобных целей. Но со слов постановщика, решение Яндекса все же не давало необходимых показателей в нужном виде, нужно было больше гибкости.

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

«Нам нужны продвинутые бизнес-метрики, можем ли мы это сделать в Sentry?»

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

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

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

Чем такой инструмент не является обычной посадкой строгой статической типизации на динамически типизированный язык, как она есть в C#, Java, Kotlin и так далее...? Что такое типы утилиты? И какие решения всерьез могут облегчить жизнь разработчикам?

Мой путь от концепции к реальности: реализация, которая даёт нечто большее, чем однократное решение.

JavaScript — самый популярный скриптовый язык в мире. Так почему же так сложно запускать shell-скрипты на JavaScript?

Этим вопросом задались создатели Bun (альтернатива Node.js - очень быстрый runtime для запуска JS-кода, а также менеджер зависимостей, тест раннер, бандлер для фронтенда, транспилятор TypeScript и не только).

20 январе 2024 в рамках Bun v1.0.24 был представлен Bun Shell - встроенный интерпретатор shell-подобных скриптов. Под катом узнаем зачем это нужно и какой функционал уже доступен.

Всем привет! Сегодня расскажу о том, как удобно организовать Page Object для большого проекта с использованием Playwright и библиотеки Dorama. Большинство современных веб-проектов имеют сложный интерфейс с переиспользуемыми компонентами. Причем компоненты могут переиспользоваться как на разных страницах, так и в рамках одной страницы. Поэтому важно грамотно оформить POM с самого начала, чтобы можно было добраться до любого локатора любого компонента на странице. Это упростит написание тестов и улучшит читаемость кода. При формировании страниц и компонентов мы будем использовать как наследование, так и композицию. Перейдем к делу.

Привет, Хабр!

Сегодня я хочу поделиться с вами своими размышлениями о том, какой стейт менеджер лучше использовать для разработки приложений на React в 2024 году. Как вы знаете, React — это одна из самых популярных и мощных библиотек для создания пользовательских интерфейсов, которая предоставляет множество возможностей и преимуществ для разработчиков. Однако, по мере роста и усложнения приложений на React, возникает необходимость в управлении состоянием и данными, которые используются в разных компонентах. Для этого существуют различные решения, называемые стейт менеджерами. Стейт менеджер — это инструмент, который позволяет централизованно хранить, обновлять и передавать данные между компонентами, а также реагировать на изменения состояния.

В этой статье я рассмотрю два из самых популярных и зрелых стейт менеджеров для React: Redux и Mobx, а так же разберём и сравним Redux Toolkit и mobx-state-tree. Я сравню их основные принципы, преимущества и недостатки, а также покажу примеры их использования в коде. Также я попытаюсь ответить на вопрос, какой из них лучше подходит для разработки современных приложений на React в 2024 году.

Привет, странник?

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

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

Всем привет.

Я столкнулся с тем, что на собеседования в некоторые ИТ-компании на Frontend JavaScript требуется решать задачи, и я решил сделать серию статей на тему, как я решил их тем или иным образом. Перед вами — первый текст из серии.

Для решения будем использовать язык программирования TypeScript.

В этой статье познакомимся с SolidJS − JavaScript-библиотекой для создания пользовательских интерфейсов без виртуального DOM. Мы создадим легкий список задач с использованием TypeScript и разберем некоторые особенности библиотеки.

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

В этой статье я хотел бы рассказать о способе сбора статистики из node.js приложений, которые запущены в PM2, и экспорт этих данных в Prometheus.

Привет, я некоторое время работаю над своим пет проектом, где в основном занимаюсь фронтом, а для данных использую headless CMS под названием strapi.io. В какой-то момент у меня появилась потребность вынести медиа хранилище из локальной папки в облако. А так-как основной проект уже находился долгое время на серверах Selectel, я решил воспользоваться их объектным хранилищем и подключится к нему с помощью плагина “@strapi/provider-upload-aws-s3“. И в этой статье я вам опишу краткий гайд как это сделать.

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

В рамках этой статьи мы попытаемся решить эти проблемы, взяв за основу один из популярных паттернов и создав демонстрационное Flutter приложение на базе Server-Driven UI фреймворка Duit.

as never, очень редко требуется в TypeScript. Давайте рассмотрим пример, где это необходимо.

Представим, что мы хотим отформатировать некоторый ввод на основе его typeof. Сначала мы создадим объект formatters, который сопоставит typeof с функцией форматирования:

Привет, я Лиза – веб разработчик в одной зарубежной компании. Хочу поделиться тем, как я автоматизировала регрессионное тестирование в рабочем проекте на React с использованием довольно нового фреймворка Playwright. Разберемся, почему именно этот фреймворк, какие подводные камни, как обойти авторизацию и кто этим пользуется. 

Одним из новых инструментов в арсенале Vue 3 является Vite - быстрый и легковесный бандлер, который значительно упрощает процесс разработки и ускоряет сборку проекта. В этой статье мы рассмотрим, как перейти от стандартного подхода с использованием Vue-CLI и Webpack к более продвинутому и эффективному методу работы с помощью Vite.

Добрый день. Меня зовут Юрик и я angular-разработчик. Остальные в комнате у психиатра:

- Здравствуй Юрик, мы рады тебя видеть.

В этой статье разберем как собрать комфортную девелопмент среду для разработки Telegram Mini App. Под комфортом я понимаю ситуацию когда тебе не нужно выгружать свое приложение в облако, чтобы увидеть результат работы в телеге, или запускать туннель типа ngrock, который после каждого перезапуска меняет ссылку. И я не уверен, что HMR можно получить через туннель. Поэтому я сделал свое решение, и хочу оставить его тут себе и потомкам.

TLRD: zod не подходил в проекте и решили сделать свой builder с помощью ajv в zod-like API. Поскольку гугление не показало никаких вменяемых результатов - было решено сделать свои костыли решения.

Если стало интересно - прошу под кат!