Anchor links working locally but not when deployed (React)
Relative links in my project works locally but when I deployed it on render, they're not working
15 Replies
What’s your code look like? Without code we can only guess (badly).
This is my live project link
https://portfolio-q79b.onrender.com
the rendered output isnt always as useful as having the code and the ability to run it
https://github.com/vikranttanwar04/Portfolio
Here's my code
GitHub
GitHub - vikranttanwar04/Portfolio: Vikrant Tanwar Portfolio
Vikrant Tanwar Portfolio. Contribute to vikranttanwar04/Portfolio development by creating an account on GitHub.
Please do something I am stuck in this since last week
Website works for me
Might have been a cache issue 🤷
the "show work" didnt work for me, and it was the only one you didnt click
also, if you refresh, it doesnt work
seems to be a misconfiguration on where you deployed your portfolio
@Vikrant Tanwar same here, show work button doesn't work.
I think you messed up Router configuration in
Main.jsx,
you should wrap the paths with ErrorBoundary element.also, when you are using React Router use
Links or Navlinks instead of vanilla a elements.
https://reactrouter.com/api/components/NavLink
https://reactrouter.com/api/components/LinkI have used Links tag for Navbar items so they work but what about a tags in the project they are not working
So, a tag cannot be used in reactjs ever?
Yes exactly this is the only issue
you can, but
Navlink for example is perfect use case for your navigation bar.
Just read the documentation that I've attached and you should spot benefits easily.Thankyou, I'll do it by Navlink but if ever I want to do it with anchor tag how would I do it?
Navlink and Link are just extended anchor tags available only in React Router.
In plain React project you'd just use regular anchor tag.
You can see that when you use inspector in browser, even if you use Link or Navlink,
it will show it as an anchor and do additional job in the background.
Ok Thankyou Mr @Karol