Колись я витрачав годину, щоб зробити звичайний toggle…
Серйозно.
Просто звичайний перемикач — трохи HTML, трохи CSS, трохи анімації, трохи псування собі нервів.
Щоб усе виглядало нормально, працювало, було доступним і не розвалювалось при ховері. Одна година мінімум.
Зараз? Я просто беру готовий компонент з Material UI або ShadCN, вставляю, додаю пару атрибутів — і маю те саме за дві хвилини.
Сучасний фронтенд у 2025 — це вже не про верстку. Ми не пишемо div + button + aria-* руками.
Ми обираємо компонентну бібліотеку — MUI, PrimeVue, Radix, ShadCN —
і збираємо інтерфейс, як з LEGO.
Сьогодні UI — це про абстракції, а не про пікселі.
І чесно кажучи — так, я звертаю увагу на реактивність фреймворку,
на зручність роботи з даними, on-demand ререндери, store-механіку.
Але однієї реактивності вже замало.
Якщо в фреймворку немає зрілої UI-екосистеми — це гальмо.
React — мій частий вибір, бо в нього є:
- MUI (зріла, гнучка, надійна);
- Radix (семантика + доступність);
- ShadCN (взагалі любов останніх років).
Svelte? Неймовірно крутий у реактивності. Але… Компонентів мало, а з переходом на Svelte 5 їх стало ще менше. І коли ти починаєш «пиляти з нуля» — це вже не вигідно.
І навіть на сервері все змінилося.
Раніше, коли ми хотіли серверний рендеринг — все ламалось:
MUI або PrimeVue вимагали клієнтського компонента, стилі не підтягувались.
Зараз: ShadCN + Server Components (Next.js 14), HTMX + Tailwind — дають можливість створювати сучасний UI на сервері, використовуючи круті компоненти, без потреби писати raw HTML та CSS.
І мені це подобається. Так, я реально за цей підхід.
Бо це:
- скорочує час на розробку;
- зменшує потребу в зайвому CSS/JS;
- дозволяє фокусуватись на логіці, а не на маргінсах.
У 80% випадків ми просто тягнемо з бібліотеки готові компоненти: меню, діалоги, таби, таблиці, тости, перемикачі, форми…
І тільки в окремих випадках, десь у тих умовних 20%, ми пишемо щось кастомне. І то не завжди.
Цей матеріал – не редакційний, це – особиста думка його автора. Редакція може не поділяти цю думку.
Сообщить об опечатке
Текст, который будет отправлен нашим редакторам: