Architecture & Design Patterns
Feature-based структура, atomic design, clean architecture, принципи SOLID, dependency injection
1Що таке Atomic Design у React?
Що таке Atomic Design у React?
Відповідь
Atomic Design організовує компоненти React у 5 ієрархічних рівнях: atoms (кнопки, inputs), molecules (прості форми), organisms (header, footer), templates (макет сторінки) та pages (конкретні екземпляри). Ця методологія забезпечує узгоджену та масштабовану структуру для design system. Вона полегшує повторне використання компонентів і співпрацю між дизайнерами та розробниками завдяки спільному словнику.
2Яка головна характеристика архітектури feature-based?
Яка головна характеристика архітектури feature-based?
Відповідь
feature-based архітектура групує всі файли, пов'язані з функціональністю, в одну папку (компоненти, hooks, стилі, тести, типи). Цей підхід сприяє co-location та автономії feature. Кожна feature стає незалежним модулем з власними відповідальностями, що полегшує обслуговування та дозволяє командам працювати паралельно без конфліктів.
3Який фундаментальний принцип Clean Architecture?
Який фундаментальний принцип Clean Architecture?
Відповідь
Clean Architecture базується на Dependency Rule: залежності завжди повинні вказувати всередину, від зовнішніх шарів (UI, інфраструктура) до внутрішніх шарів (domain, business logic). Бізнес-домен ніколи не повинен залежати від UI або фреймворків. Це розділення дозволяє тестувати бізнес-логіку незалежно, змінювати фреймворки без переписування бізнес-коду та підтримувати відв'язану і масштабовану архітектуру.
Що означає принцип SOLID 'Single Responsibility' застосований до компонента React?
Що таке dependency injection у React?
+19 питань зі співбесід
Інші теми співбесід React / Next.js
Основи JavaScript
Основи React
React Hooks
Життєвий цикл компонента
React Router
Управління станом з Context
Форми та Controlled Components
Отримання даних та API
React Query (TanStack Query)
Styling & CSS-in-JS
Основи Next.js
TypeScript з React
Data Fetching у Next.js
Server Actions у Next.js
Маршрутизація та Навігація в Next.js
API Routes у Next.js
Metadata & SEO у Next.js
Middleware та Auth у Next.js
Тестування React
Zustand State Management
Оптимізація продуктивності React
Error Boundaries & обробка помилок
Advanced React Patterns
Розширені можливості Next.js
Розгортання та Продакшн Next.js
React Server Components
Інтернаціоналізація Next.js
React Безпека & Найкращі Практики
Опануй React / Next.js для наступної співбесіди
Отримай доступ до всіх питань, flashcards, технічних тестів, вправ code review та симуляторів співбесід.
Почни безкоштовно