Эта статья предназначена в первую очередь для веб-разработчиков. Я не являюсь экспертом в области сетей, администрирования или DevOps, поэтому представленный материал не углубляется в сетевые аспекты.

Из любопытства, я как то задался вопросом практического использования разных номеров портов: что они означают для разработчиков, почему используются определенные порты, и какие приложения чаще всего запускаются на них. Цель статьи — пролить немного света на эти “магические” циферки с точки зрения их прикладного применения веб-разработчиками.

Исторически приложения на Node.js (например, с использованием фреймворков Nest.js или Express) и Webpack по умолчанию запускаются на 3000 порту, если не вносить изменения в базовую конфигурацию. Vite, напротив, изначально использует порт 5173. Это может быть связано с отсылкой к названию "Vite" (если подключить немного воображения).

С технической точки зрения нет разницы, на каком порту запускать локальный сервер для разработки — это может быть 1050, 10900 или любой другой. Главное, чтобы порт был:

Данная статья рассчитана на тех, кто только начинает писать свои React приложения на TypeScript, а также является памяткой для меня, ведь совсем недавно я путался в типизации children props.

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

Если же чувствуете, что несмотря на то, что в проекте нет сложной логики, но дерево компонентов и количество и вариация передаваемых пропсов внушительные, я бы воспользовался prop-types. Ранее эта фича входила в состав React и использовали её так: React.PropTypes. Но начиная с версии React 15.5 она переехала в отдельную библиотеку, поэтому теперь её необходимо устанавливать как, например, npm/yarn пакет. Она используется для валидации типов props в компонентах React. Это всё из возможностей TS, но для проекта с большим количеством компонентов и пропсов - то, что нужно. Синтаксис описания типов пропсов отличается от TS.

Все мы знаем про useCallback(), useMemo(), и memo, которые используются для оптимизации производительности в React-приложениях. В этой статье я углублюсь в их работу и создам краткую шпаргалку, чтобы использовать их осмысленно и эффективно.

Начнем издалека...