Вы когда-нибудь оказывались по уши в JavaScript‑приложении, следуя за цепочкой вызовов require() как по хлебным крошкам, чтобы понять, как всё связано? Один модуль импортирует другой, тот тянет глобальную переменную, и вот вы уже гоняетесь за ссылками по всему коду, просто чтобы протестировать один компонент. Это как готовить блюдо, где каждый ингредиент спрятан в отдельном шкафу — вы тратите половину времени на поиски, а не на готовку. Именно эту проблему и решает dependency injection (внедрен…
Всем привет! Меня зовут Дмитрий, и я руководитель фронтенд-разработки в компании Интелси.Сегодня хочу рассказать о принципе единственной ответственности (Single Responsibility Principle) — первом из пяти принципов SOLID, сформулированных Робертом Мартином в его книге "Agile Software Development: Principles, Patterns, and Practices". Суть этого принципа звучит так: «Класс должен иметь только одну причину для изменения» (A class should have only one reason to change).Если вы скажете, что …
Привет! Я — Александр Дудукало, автор базового курса по JavaScript. Если вы читаете эту статью, значит, вероятно, уже знакомы с одной из основных логических конструкций в JavaScript — if-else. Если нет, рекомендую сначала прочитать предыдущий материал, где я подробно разобрал эту тему.В этой же статье мы поговорим о других способах управления логикой в коде — тернарном операторе и конструкции switch. Да, звучит сложно и, возможно, пугающе. Но я уверяю, все очень просто. В итоге вы узнаете, когд…
Сколько лет уже кто-то говорит: «А можно, чтобы оно работало без интернета и ставилось на домашний экран?» И каждый раз после этой фразы начинается медленный спуск в персональный ад — ты лезешь в документацию по PWA, где всё разваливается на ровном месте, service worker живёт своей жизнью, кеш то работает, то ломается, App Router рушит весь твой кастомный пайплайн, а пользователи сидят на старых версиях, потому что вручную обновлять им, конечно, влом.Словом, если ты когда-то пробовал прикрутить…
Привет. Я Дима Рагозин, фронтенд-разработчик в KTS. Эту статью я хочу начать с предыстории.Полтора года назад на проекте для одного крупного клиента мы получили задачу — ускорить главную страницу. К тому моменту в кодовой базе уже жили два отдельных фронтенд-приложения под две разные платформы — CSR-версия (Client Side Rendering) и SSR‑версия (Server Side Rendering), — а MobX‑сторы все время жизни проекта разрастались вместе с функциональностью.Каждый новый экран приносил еще один класс (а то и…
Интернационализация (i18n) и локализация (l10n) часто кажутся проблемами “на потом” — пока внезапно не становятся срочными.Как разработчики, мы все делали что-то вроде:<button>Order now</button> Или в шаблоне:<p>Welcome back, {{ user.name }}!</p>Всё работает — пока команда не говорит: «Мы выходим на рынок Узбекистана, Казахстана и Ближнего Востока в следующем квартале.»И тут внезапно каждая хардкодная строка превращается в технический долг. Разработчики в панике вытаскив…
В этой серии статей мы отправимся в путешествие по миру пользовательских хуков React, открывая для себя их огромный потенциал для улучшения ваших проектов разработки. Сегодня мы сосредоточимся на хуке «useGeolocation», одном из многих тщательно разработанных хуков, доступных в коллекции пользовательских хуков React.Github: https://github.com/sergeyleschev/react-custom-hooks import { useState, useEffect } from "react" export default function useGeolocation(options) { const [loadin…
Привет, Хабр! Меня зовут Виктор, я являюсь Web разработчиком в MOEX. Программирую на TypeScript/Java и это моя первая статья, в которой я хочу поделиться историей создания fsd-forge — CLI-инструмента для упрощения работы с архитектурой Feature-Sliced Design (FSD) в проектах на React и TypeScript. В этой статье я расскажу, почему решил создать этот инструмент, как он устроен, какие проблемы решает, и какие уроки я вынес из процесса разработки.Что такое Feature-Sliced Design и зачем нужен CLI?Fea…
Недавно на проекте столкнулся с необычной задачей - сделать из готового React веб-приложения десктопную версию на Electron. Что же тут необычного? А то, что наше веб-приложение построено на микрофронтенд архитектуре и располагается в трёх отдельных репозиториях. А общение между микрофронтендами происходит в runtime через HTTP. И тут начинаются сложности, так как для создания дистрибутива, Electron'у нужен доступ к исходникам всего приложения. Хотя Electron легко подружить с Webpack, как это…