Next.js Discord

Discord Forum

Problem with navigating between pages

Answered
Minskin posted this in #help-forum
Open in Discord
MinskinOP
Hi everyone! My header has two buttons that redirect to certain pages. Either "Projects" or "About" by doing:
Link href="../Pages/Projects

or
Link href="../Pages/About


The problem begins when Im trying to access either of these pages when inside one of my project specific pages. The screenshot below will show my folder architecture. So for example when im inside "Pages/Projects/EkayaAndPebbles" and try to access "Pages/About" through my header, I end up in: "Pages/Pages/About". Not sure how to fix this problem.

I tried using a single dot instead of two dots to start from the root of my project, but the results are always the same.
Answered by Clown
My advice would be to not use ".." at all. Put the entire path from the root instead:

/Pages/Projects/About for example
View full answer

10 Replies

MinskinOP
Actually, when using one dot, the path seems to recursively add another /Page to the path. For example after clicking "About" on my header 5 times, I end up with:
Pages/Pages/Pages/Pages/Pages/About
Answer
Since this is in your header, it will take whatever your current page is and infer the path from that.
@Clown My advice would be to not use ".." at all. Put the entire path from the root instead: `/Pages/Projects/About` for example
MinskinOP
Oh, that works! Didn't know it worked that way. Thank you!
@Clown Because of this
MinskinOP
Just to clarify, what do you mean by infer? The way I understand it now is that using "/" at the beginning will always start from the root of the project.
@Minskin Just to clarify, what do you mean by infer? The way I understand it now is that using "/" at the beginning will always start from the root of the project.
Yes. Starting with "/" Would mean from the start of the project route(app folder)

However using "../" means going back one level from whatever the current path is.
Hence if you are on page : "/Project/ProjectName" and click on a Link with "../About", the url will become "/Project/About".
Also since your link is in the header, which is essentially something shared across the pages, using "../" is a bad idea since it wont navigate you to a fixed route but instead a relative one based on your current url