# Next.js Practical Introduction: Navigation and Routing

**URL:** <https://community.auth0.com/t/next-js-practical-introduction-navigation-and-routing/28758>\
**Category:** Blog Discussions\
**Tags:** reactjs, react, javascript, nextjs\
**Created:** [July 30, 2019, 2:24pm UTC](https://community.auth0.com/t/next-js-practical-introduction-navigation-and-routing/28758 "2019-07-30T14:24:24Z")\
**Posts on this page:** 16\
**Page:** 1

<div class="post-metadata">

**Author:** ![ramiro](https://sea1.discourse-cdn.com/auth0/user_avatar/community.auth0.com/ramiro/32/8077_2.png) [@ramiro](https://community.auth0.com/u/ramiro)\
**Post date:** [July 30, 2019, 2:24pm UTC](https://community.auth0.com/t/next-js-practical-introduction-navigation-and-routing/28758/1 "2019-07-30T14:24:24Z")

</div>

Next.js Practical Introduction: Navigation and Routing.  
Learn how to use Next.js to add navigation and routing to server-side rendered React applications.

[Read on 🎊](https://auth0.com/blog/next-js-practical-introduction-for-react-developers-part-3/)

Brought to you by @dan-auth0 👨🏻‍💻

 ![](https://global.discourse-cdn.com/auth0/original/2X/a/ae35edce19e64c53e5d455b22e8a2c82d093d4c9.png)

---

<div class="post-metadata">

**Author:** ![dan-auth0](https://upload.wikimedia.org/wikipedia/commons/thumb/7/7c/User_font_awesome.svg/768px-User_font_awesome.svg.png) [@dan-auth0](https://community.auth0.com/u/dan-auth0)\
**Post date:** [July 30, 2019, 5:56pm UTC](https://community.auth0.com/t/next-js-practical-introduction-navigation-and-routing/28758/2 "2019-07-30T17:56:24Z")

</div>

Happy to hear your feedback or questions on this topic.

---

<div class="post-metadata">

**Author:** ![deliotclarke](https://sea1.discourse-cdn.com/auth0/user_avatar/community.auth0.com/deliotclarke/32/16312_2.png) [@deliotclarke](https://community.auth0.com/u/deliotclarke)\
**Post date:** [September 24, 2019, 6:40pm UTC](https://community.auth0.com/t/next-js-practical-introduction-navigation-and-routing/28758/3 "2019-09-24T18:40:32Z")

</div>

I really loved this tutorial! It’s been the best and easiest to follow React/Next.js tutorial I’ve found. Thanks for making this @dan-auth0!

---

<div class="post-metadata">

**Author:** ![dan-auth0](https://upload.wikimedia.org/wikipedia/commons/thumb/7/7c/User_font_awesome.svg/768px-User_font_awesome.svg.png) [@dan-auth0](https://community.auth0.com/u/dan-auth0)\
**Post date:** [September 24, 2019, 7:31pm UTC](https://community.auth0.com/t/next-js-practical-introduction-navigation-and-routing/28758/4 "2019-09-24T19:31:56Z")

</div>

Welcome to our community, @deliotclarke 🙂

I appreciate your feedback! 🙌 I am glad that you liked it.

What else would you like to see? I am thinking on doing a TypeScript version 🤔as well as adding chapters on authentication/authorization and deploying to Now or AWS 🔥

---

<div class="post-metadata">

**Author:** ![vigneshBlockDev](https://sea1.discourse-cdn.com/auth0/user_avatar/community.auth0.com/vigneshblockdev/32/16393_2.png) [@vigneshBlockDev](https://community.auth0.com/u/vigneshBlockDev)\
**Post date:** [September 29, 2019, 5:16am UTC](https://community.auth0.com/t/next-js-practical-introduction-navigation-and-routing/28758/5 "2019-09-29T05:16:55Z")

</div>

Usefull Tutorial… it would be helpfull if add course on Deploying in AWS

---

<div class="post-metadata">

**Author:** ![konrad.sopala](https://sea1.discourse-cdn.com/auth0/user_avatar/community.auth0.com/konrad.sopala/32/13516_2.png) [@konrad.sopala](https://community.auth0.com/u/konrad.sopala)\
**Post date:** [September 30, 2019, 7:18am UTC](https://community.auth0.com/t/next-js-practical-introduction-navigation-and-routing/28758/6 "2019-09-30T07:18:38Z")

</div>

Tagging article author @dan-auth0 to capture that feedback! Thank you @vigneshBlockDev!

---

<div class="post-metadata">

**Author:** ![dan-auth0](https://upload.wikimedia.org/wikipedia/commons/thumb/7/7c/User_font_awesome.svg/768px-User_font_awesome.svg.png) [@dan-auth0](https://community.auth0.com/u/dan-auth0)\
**Post date:** [September 30, 2019, 4:46pm UTC](https://community.auth0.com/t/next-js-practical-introduction-navigation-and-routing/28758/7 "2019-09-30T16:46:05Z")

</div>

This is an excellent idea! What do you think of using Docker + ECS to deploy a Next.js app?

---

<div class="post-metadata">

**Author:** ![italol](https://sea1.discourse-cdn.com/auth0/user_avatar/community.auth0.com/italol/32/16435_2.png) [@italol](https://community.auth0.com/u/italol)\
**Post date:** [October 1, 2019, 3:43pm UTC](https://community.auth0.com/t/next-js-practical-introduction-navigation-and-routing/28758/8 "2019-10-01T15:43:57Z")

</div>

Great tutorial! Very focused and well explained!! =)

I have one question, a beginner question, every time the route changes after clicking in any nav link, the nav container has to re-render, actually, the whole page has to re-render. Is this a normal cycle? Does each component have its own power to figure if it has to rerender or not?

Thanks!

---

<div class="post-metadata">

**Author:** ![yasulmatthew](https://sea1.discourse-cdn.com/auth0/user_avatar/community.auth0.com/yasulmatthew/32/17084_2.png) [@yasulmatthew](https://community.auth0.com/u/yasulmatthew)\
**Post date:** [October 31, 2019, 4:43pm UTC](https://community.auth0.com/t/next-js-practical-introduction-navigation-and-routing/28758/9 "2019-10-31T16:43:53Z")

</div>

Can’t wait for the authentication part!!!

---

<div class="post-metadata">

**Author:** ![konrad.sopala](https://sea1.discourse-cdn.com/auth0/user_avatar/community.auth0.com/konrad.sopala/32/13516_2.png) [@konrad.sopala](https://community.auth0.com/u/konrad.sopala)\
**Post date:** [November 4, 2019, 9:34am UTC](https://community.auth0.com/t/next-js-practical-introduction-navigation-and-routing/28758/10 "2019-11-04T09:34:49Z")

</div>

We’ll keep you posted!

---

<div class="post-metadata">

**Author:** ![dan-auth0](https://upload.wikimedia.org/wikipedia/commons/thumb/7/7c/User_font_awesome.svg/768px-User_font_awesome.svg.png) [@dan-auth0](https://community.auth0.com/u/dan-auth0)\
**Post date:** [November 4, 2019, 3:50pm UTC](https://community.auth0.com/t/next-js-practical-introduction-navigation-and-routing/28758/11 "2019-11-04T15:50:35Z")

</div>

😃 Would you also be interested in a part where the app is deployed? I think for both the Authentication and Authorization, I may write standalone posts as they can be used as reference easier. What do you think?

---

<div class="post-metadata">

**Author:** ![jpz](https://sea1.discourse-cdn.com/auth0/user_avatar/community.auth0.com/jpz/32/22784_2.png) [@jpz](https://community.auth0.com/u/jpz)\
**Post date:** [July 27, 2020, 4:04am UTC](https://community.auth0.com/t/next-js-practical-introduction-navigation-and-routing/28758/12 "2020-07-27T04:04:44Z")

</div>

Both of these next.js tutorials are super useful. I found them even clearer than the next.js one in fact. Thanks!

---

<div class="post-metadata">

**Author:** ![konrad.sopala](https://sea1.discourse-cdn.com/auth0/user_avatar/community.auth0.com/konrad.sopala/32/13516_2.png) [@konrad.sopala](https://community.auth0.com/u/konrad.sopala)\
**Post date:** [July 27, 2020, 7:22am UTC](https://community.auth0.com/t/next-js-practical-introduction-navigation-and-routing/28758/13 "2020-07-27T07:22:10Z")

</div>

Glad you really enjoyed them!

---

<div class="post-metadata">

**Author:** ![dan-auth0](https://upload.wikimedia.org/wikipedia/commons/thumb/7/7c/User_font_awesome.svg/768px-User_font_awesome.svg.png) [@dan-auth0](https://community.auth0.com/u/dan-auth0)\
**Post date:** [July 29, 2020, 11:11am UTC](https://community.auth0.com/t/next-js-practical-introduction-navigation-and-routing/28758/14 "2020-07-29T11:11:04Z")

</div>

Howdy, jpz! Thank you for your feedback 🙂 I am glad that you enjoyed them.

---

<div class="post-metadata">

**Author:** ![konrad.sopala](https://sea1.discourse-cdn.com/auth0/user_avatar/community.auth0.com/konrad.sopala/32/13516_2.png) [@konrad.sopala](https://community.auth0.com/u/konrad.sopala)\
**Post date:** [December 10, 2021, 9:15am UTC](https://community.auth0.com/t/next-js-practical-introduction-navigation-and-routing/28758/15 "2021-12-10T09:15:49Z")

</div>



---

<div class="post-metadata">

**Author:** ![konrad.sopala](https://sea1.discourse-cdn.com/auth0/user_avatar/community.auth0.com/konrad.sopala/32/13516_2.png) [@konrad.sopala](https://community.auth0.com/u/konrad.sopala)\
**Post date:** [March 7, 2022, 2:03pm UTC](https://community.auth0.com/t/next-js-practical-introduction-navigation-and-routing/28758/16 "2022-03-07T14:03:08Z")

</div>


