תיקיות הן נתיבים

רוב מסגרות העבודה מבקשות ממך לכתוב את הנתיבים שלך במקום כלשהו: רשימה של נתיבים, שכל אחד מהם משויך לרכיב. Next.js קוראת אותם מתוך עץ הקבצים שלך.

אפשר לסכם את כל הכלל בשורה אחת: תיקייה בתוך app/ היא חלק מכתובת ה-URL, וקובץ page.jsx שבתוכה הוא מה שהמבקרים רואים.

app/
    page.jsx                 ->  /
    about/
        page.jsx             ->  /about
    menu/
        page.jsx             ->  /menu
        drinks/
            page.jsx         ->  /menu/drinks

קרא כתובת URL על ידי מעבר לאורך העץ. /menu/drinks היא תיקיית menu, ואז תיקיית drinks, ואז הדף שבתוכה. קינון של תיקיות מקנן כתובות URL. אין שלב נפרד.

החצי השני של הכלל חשוב באותה מידה: תיקייה היא רק נתיב ברגע שיש בה page.jsx.

app/
    menu/
        drinks/
            page.jsx         ->  /menu/drinks  works
        MenuCard.jsx                           not a route
                             ->  /menu         404

כאן app/menu/ קיים, אבל אף אחד לא יכול לבקר ב־/menu: אין בו קובץ עמוד. זה רק מיכל בדרך אל /menu/drinks. זו תכונה: אפשר לקבץ קבצים קשורים בתוך app/ בלי לפרסם כתובת URL בטעות.

ושם התיקייה הוא מקטע ה-URL, תו אחר תו. תיקייה בשם About Us תיצור את כתובת ה-URL /About%20Us, ולכן שמות תיקיות הנתיבים הם באותיות קטנות ומופרדים במקפים: app/about-us/.