Ответ
React, TypeScript, Next.js и современными CSS-инструментами (CSS Modules, Tailwind). Этот стек позволяет создавать производительные, масштабируемые приложения с хорошей типизацией и SSR/SSG поддержкой.
Пример компонента:
interface ButtonProps {
children: React.ReactNode;
variant?: 'primary' | 'secondary';
}
const Button = ({ children, variant = 'primary' }: ButtonProps) => (
<button className={`btn ${variant === 'primary' ? 'bg-blue-500' : 'bg-gray-500'}`}>
{children}
</button>
);Также интересен опыт с Zustand/Jotai для state-менеджмента и testing-library для тестов.
Ответ 18+ 🔞
Слушай, ну вот сидишь ты такой, пишешь на React, а потом раз — и понимаешь, что твой state раскидан по компонентам, как говно по тайге. И тут, ёпта, приходит осознание: нужен нормальный state-менеджмент, а не передача пропсов через десять хуёв и бабок.
Вот смотри, есть у нас этот стек: React, TypeScript, Next.js. Это как, блядь, три богатыря — в одиночку каждый силён, а вместе вообще пиздец какая мощь. TypeScript не даёт накосячить с типами, Next.js из коробки даёт SSR, SSG, роутинг — красота, ебать мои старые костыли!
А CSS? Ну, можно через модули, можно Tailwind — это уже на вкус и цвет. Кто-то орёт, что Tailwind — это пиздец, говнокод, а кто-то без него жить не может. Я вот считаю: если проект не с петровых времён, то Tailwind — огонь. Пишешь классы прямо в JSX и не ебешь мозги с неймингом.
Вот, к примеру, кнопка. Смотри, как просто и с типами:
interface ButtonProps {
children: React.ReactNode;
variant?: 'primary' | 'secondary';
}
const Button = ({ children, variant = 'primary' }: ButtonProps) => (
<button className={`btn ${variant === 'primary' ? 'bg-blue-500' : 'bg-gray-500'}`}>
{children}
</button>
);Никакой хуйни, всё прозрачно. А если state-менеджмент? Redux — это, простите, ёперный театр, особенно для средних проектов. Там настроек — овердохуища. Поэтому сейчас все умные дяди юзают Zustand или Jotai. Zustand — это как будто взяли Redux, выкинули оттуда всю дичь с конфигами, оставили только самую соль. Получается библиотека, в которой на раз-два создаёшь store, и всё, блядь, работает.
А тесты? Без них сейчас никуда, хоть волком вой. Testing-library — это стандарт де-факто. Пишешь тесты, которые имитируют поведение пользователя, а не лазают по внутренностям компонента. Это ж здравый смысл, ёпта! Не надо тестировать реализацию, надо тестировать, что видит юзер. А то бывает напишешь тест, потом рефакторишь компонент, и все тесты, сука, падают, хотя по логике всё должно работать. Пиздец раздражает.
В общем, этот стек — это как собрать себе кастомный байк из крутых запчастей. Всё быстро, типобезопасно, и масштабируется без боли. Главное — не наворотить лишней хуйни в архитектуре, а то потом сам же и будешь плакать, когда надо что-то поменять.