BeginnerCoder

Lesson 5 — Routing idea

Files become URLs

In Next.js you do not write a list of routes. The folder structure is the router: the file app/blog/page.js is shown at /blog, and app/page.js is the home page /. (Older projects use a pages/ folder the same way: pages/blog/post.js → /blog/post.) A file named index means "the folder itself".

pages/index        ->  /
pages/blog/post    ->  /blog/post

Note: the real Next.js router runs on a server and cannot run in this browser playground, so the exercise is a small plain-JS simulation of what Next.js does.

Why it matters: knowing the mapping tells you exactly which file to open for any URL.

Want it another way?
Task

Finish toRoute: remove "pages/", then remove a trailing "index" (and the "/" before it). Then add "/".

Run your code — when the output matches the task, you will see a green check. Then mark the lesson complete.

← Back
Next →
Test your knowledge

A quick 3-question quiz on this lesson — instant feedback.

Enjoying this lesson? Share it.