Vercelin tiimi on valinnut yksinkertaisen lähestymistavan reititykseen. He ovat päättäneet käyttää kansioita reitteinä. Tämä tarkoittaa, että mitä enemmän kansioita lisäät app-kansioon, sitä enemmän reittejä saat. Lisäksi, jos luot uuden kansion toisen kansion (reitin) sisälle, saat sisäkkäisiä reittejä. Näiden käsitteiden ymmärtämiseksi suosittelemme tutustumaan alla olevaan kuvaan.

Kansiot on nyt järjestetty, joten tarkastellaan seuraavaksi kansioiden sisällä olevia tiedostoja. Next.js tukee kahta erilaista tiedostotyyppiä: page.tsx ja layout.tsx. Näiden ero perustuu niiden rooleihin:

• layout.tsx toimii tiedostona, joka vastaa useilla sivuilla jaettavista erityisistä käyttöliittymäelementeistä;
• Vastaavasti page.tsx vastaa nykyiseen reittiin liittyvästä käyttöliittymästä, mukautuen dynaamisesti URL-osoitteen muutoksiin. Se edustaa visuaalista esitystä, joka liittyy kyseisen reitin ainutlaatuiseen sisältöön ja ominaisuuksiin.

Takaisin projektiin

Luodaan sovelluksellemme sisäkkäinen reitti nimeltä /dashboard. Noudata alla olevia vaiheita tämän toteuttamiseksi:

1. Luo uusi dashboard-kansio app-kansion sisälle;
2. Luo uuden dashboard-kansion sisälle uusi tiedosto nimeltä page.tsx;
3. Kopioi ja liitä seuraava sisältö page.tsx-tiedostoon.

Kun olet suorittanut kaikki tarvittavat vaiheet, avaa seuraava URL-osoite http://localhost:3000/dashboard. Sinun tulisi nähdä luotu sivu (Dashboard Page -teksti).

Seuraavassa luvussa jatkamme työskentelyä sivujen parissa. Älä huoli, jatkamme edelleen.