Запропонувати правкуПокращити цю статтюДопрацюйте відповідь до «Які теки є обов'язковими?». Ваші зміни проходять модерацію перед публікацією.Потрібне підтвердженняКонтентЩо ви змінюєте🇺🇸EN🇺🇦UAПереглядЗаголовок (UA)Коротка відповідь (UA)У **Next.js** немає «жорстко обов'язкової» структури - усе максимально ліниве, але є мінімум, без якого застосунок не має сенсу. **Ключове:** обов'язковими є лише `app/` або `pages/`, а всередині `app/` - хоча б один `page.tsx`.Показується над повною відповіддю для швидкого нагадування.Відповідь (UA)ЗображенняУ **Next.js** немає «жорстко обов'язкової» структури - усе максимально ліниве. Але є **мінімум, без якого застосунок не має сенсу**. ## Обов'язкові теки (по факту) ### `app/` **або** `pages/` **Хоча б одна з них** - `app/` - сучасний стандарт (App Router) - `pages/` - старий Pages Router Без однієї з них **роутингу не буде взагалі**. --- ## Що обов'язково всередині `app/` ### `page.tsx` **Мінімум одна сторінка** ```txt app/page.tsx → / ``` Без `page.tsx`: - білд збереться - але **жодної сторінки не буде** --- ## Необов'язкові (але часто потрібні) ### `layout.tsx` - **не обов'язковий** - але якщо є `page.tsx`, Next сам створить дефолтний layout > Однак у реальному проєкті layout майже завжди потрібен --- ### `loading.tsx` Skeleton / fallback Не обов'язковий --- ### `not-found.tsx` Кастомний 404 Не обов'язковий --- ### `error.tsx` Error Boundary Не обов'язковий --- ## Решта тек - повністю опціональні | Тека | Обов'язкова | Навіщо | |---|---|---| | `components/` | Ні | UI-компоненти | | `features/` | Ні | FSD | | `shared/` | Ні | утиліти, UI | | `styles/` | Ні | глобальні стилі | | `lib/` | Ні | хелпери, сервіси | | `public/` | Ні | статика | | `api/` | Ні | backend-роути | | `hooks/` | Ні | кастомні хуки | Next **нічого з цього не вимагає**. --- ## Мінімально валідний проєкт ```txt app/ └─ page.tsx ``` Так, **цього реально достатньо**. --- ## Часті хибні уявлення «`layout.tsx` обов'язковий» → ні «потрібен `components/`» → ні «потрібен `_app.tsx`» → лише в `pages/` «без `public/` проєкт не запуститься» → запуститься --- ## Практичний висновок **Next.js ≠ фреймворк із жорсткою архітектурою** Він: - дає **правила роутингу** - але **не нав'язує структуру** Ти сам вирішуєш: - FSD / MVC / flat - монорепа / single - frontend-only чи fullstackДля рев’юераПримітка для модератора (необов’язково)Бачить лише модератор. Прискорює рев’ю.