Vue JS 3 Tutorial for Beginners #8 - The Vue Router

In this Vue 3 tutorial we'll take a look at the Vue Router in order to make a "multi-page" Vue website. We'll see how to set uo the Vue Router, how to use Router Links, pass route parameters & more.

---- Timestamps ----
0:00 - Why use the Vue Router?
2:36 - Vue Router setup (for new projects)
12:30 - Router links
19:06 - Folder structure
24:54 - Route parameters
31:08 - Dynamic links
36:35 - Redirects & 404's
41:49 - Programmatic navigation

🐱‍💻 🐱‍💻 BUY THE FULL 20-hr COURSE ON UDEMY:

🐱‍💻 🐱‍💻 Course Files:

🐱‍👤🐱‍👤 JOIN THE GANG -

🐱‍💻 🐱‍💻 My Udemy Courses:

🐱‍💻 🐱‍💻 Helpful Links:

🐱‍💻 🐱‍💻 Social Links:

[kierrboy]

CSS style

35:43 job css

.job h2 {
background: #f4f4f4;
padding: 20px;
border-radius: 10px;
margin: 10px auto;
max-width: 600px;
cursor: pointer;
color: #444;
}
.job h2:hover {
background: #ddd;
}
.job a {
text-decoration: none;
}

44:11 button css

button {
margin: 0 10px;
padding: 10px;
border: none;
border-radius: 4px;
}

[elliotanimations]

I can't express how much you've helped me with your videos. I never understood the Vue environment or how anything links together, and using the CLI always brought back errors. But from the start up until now (haven't got any further just yet!) it's been a total breeze. Thank you so much

[nageshnagansur]

God Level Simplicity with explanation .

[vxllriq]

I'm not an english native speaker but I found this series of videos and I understood everything. These tutorials are just perfect. Thank you!

[sureshramanan]

the music that plays when projects get created is hilariously merry and nostalgic!

[yasharsoleimani]

I've been searching the Internet for hours to find a video or sth to teach me vue-router simple and fast and you did it the best way. Thanks, man!

[hosseinjavan]

there is no doubt about you being an awesome teacher. But I just realized part of why I like your tutorials is because of your damn beautiful voice. Wish you the best :)

[clone]

hey man, quick message to thank you for how well everything is explained. it's a blast to watch and i appreiciate you outputting so many videos. thank you

[danishiqbal]

Seriously, been trying for two days to find a truly beginner tutorial. All those videos claiming to be beginner friendly have a curse of knowledge where they don't even know what its like to be a beginner. What you did starting this video and upto 2:30 is empathy. Thank you.

[ladywebber]

my favorite online tutor EVER, many blessings

[nematjonabdulloev]

descriptive and easy to follow. Great job 👍👌.

[nitinkaushik]

Thank you Shaun for making awesome tutorials. You have made web so much easy and fun. It seems like Mario and Luigi are part of my life now :D

[oldclient]

It's just a very good explanation of the Vue CLI routing architecture without any fluff words. Not a complex, nor a simple context. Keep do this.

[Roccsguy]

Wow! Thanks for this amazing tutorial. I never watch any tutorial more than 5 minutes but your's was definitely worth it. I've been trying to understand how Vue router works in comparison to react router, and this video made it clear to me that Vue is definitely going to be my next best framework. Thanks again 👋

[ranjitkumarpk]

Really Helpful and a good explanation. Thank you so much. I have cleared so many concept from this.

[jetzemeilink]

Thanks Shaun for bringing us this quality content and your ability to break things down and explain them clearly. I bought your vue 3 course and it was one of the best courses I've taken so far. You're an incredible help as I'm trying to land my first dev job in Holland.

[LilStrangeSquirrel]

English isn't my native language but everything sounds so much clear when you explain it. Thank you so much

[AlinaKay]

Many thanks for such a great and easy to follow video!

[neeqquu]

this is the best vue tutorial ever! please never delete this :)

[omarmomen]

u are amazing sir, i never find some one who can explain like u do, thank u ❤💕