Одна из неприятных причин путаницы в Next.js состоит в том, что dev и build легко принять за два одинаковых режима, отличающихся только скоростью. На практике это не так.
Next.js, fieldErrors vs formError
Одна из типовых проблем формы в Next.js возникает не в submit и не в схеме валидации, а в формате ошибки. Пока все сообщения сваливаются в одну переменную, интерфейс перестаёт различать две разные вещи, ошибка конкретного поля и ошибка самой операции.
Next.js, revalidate, почему данные не обновились
В Next.js есть момент, который хорошо знаком после первых экспериментов с App Router. Страница уже пересчиталась, reload прошёл, а данные на экране выглядят старыми. Часто причина в том, что включён revalidate, а значит у ответа есть окно свежести.
Next.js, форма это не только submit
Одна из частых ошибок в проекте на Next.js выглядит просто. Форму собирают как input, кнопку и submit, а всё остальное добавляют потом по мере необходимости. Сначала это кажется быстрым решением, но дальше почти всегда начинается расползание логики. Где-то ошибка поля, где-то общая строка сверху, где-то можно нажать submit несколько раз подряд, где…
Next.js, no-store vs force-cache
В Next.js часто сбивает не само кэширование, а расхождение между рендером страницы и свежестью данных. Страница уже пересчиталась, а ответ от API всё ещё старый. Или наоборот, разработчик отключает кэш везде подряд и теряет сам смысл встроенного механизма.
Next.js, фильтры без client state
Когда фильтры в каталоге живут в client state, почти сразу появляется знакомый набор задач: синхронизировать их с URL, не потерять при reload, поддержать back/forward, не запутаться в useEffect и не разнести логику по нескольким уровням интерфейса.
Повторяющийся q в URL
Один из полезных тестов для App Router это не только searchParams сами по себе, но и их грязные варианты. Например: /goods?q=phone&q=tv.
Next.js, type is not assignable и ремонт контракта
В Next.js с TypeScript ошибка type is not assignable нередко указывает на более полезную вещь, чем кажется по формулировке. Проблема часто не в несовпадении типов как таковом, а в том, что проект пытается передать в доменную функцию ещё не нормализованное значение.
Next.js, back/forward
О back и forward обычно вспоминают слишком поздно. Пока всё тестируется в лоб, интерфейс выглядит нормальным. Но как только пользователь проходит цепочку список -> поиск -> другой фильтр -> карточка -> назад, становится видно, насколько страница вообще держится как система.
Next.js, possibly undefined и guard-логика
Одна из самых практичных ошибок TypeScript в Next.js это possibly undefined. На неё легко смотреть как на помеху, но в рабочем проекте она обычно указывает на более полезную вещь. Где-то в коде есть значение, которое ещё не прошло нормальную границу проверки, а логика уже пытается обращаться с ним как с надёжным.
Next.js, общий тип Id и union-состояния
Одна из типовых проблем в Next.js с TypeScript - данные вроде типизированы, но архитектура от этого надёжнее не становится. Причина в том, что типы ставятся локально, а не на границах системы.
searchParams в App Router
searchParams в Next.js App Router удобны не сами по себе. Их сила в другом, они позволяют сделать URL источником правды для страницы. Это особенно хорошо видно на поиске и фильтрах. В React SPA здесь часто появляются useState, useEffect, ручная синхронизация с URL и странное поведение Back/Forward. В App Router можно идти проще: читать searchParams…