Ruutide grupeerimine NextJS-s

Mõnikord võime lugu mugavuse huvides vaja grupeerida mitu ruuti ühte kausta nii, et grupeeriv kaust ei looks eraldatud segmenti URL-is.

Selleks tuleks grupeeriva kausta nimi panna ümarsulgudesse. Vaatame seda näite varal.

Olgu URL-i /reg korral meie eesmärk teha registreerimine, ja URL-i /log korral - autoriseerimine. Ühendame nendele URL-idele vastavad kaustad ühte ühiskausta nimega (auth).

Seega saame me järgmise failistruktuuri:

• /app//(auth)//reg/page.jsx/log/page.jsx

Teeme faili registreerimise lehe jaoks:

app/(auth)/reg/page.jsxexport default function Reg() {
  return <h1>register</h1>;
}

Teeme faili autoriseerimise lehe jaoks:

app/(auth)/log/page.jsxexport default function Log() {
  return <h1>login</h1>;
}