Wednesday, August 28, 2019

Vue.js Basics Ep. 12 - Intro to Vue Router | Router-View + Router-Link Tags

[ Vue Basics Ep. 12 ] [ Vue.js ]

# Intro to Vue Router | Router-View + Router-Link Tags

In this session, we will be going over Vue Router. This plugin allows use to expand and organize our applications. The Vue Router mimics the user experience of browsing a full multi-page website/app including history functionality, while behind the scene still remaining all within our index.html file.

## Helpful Links

[ Vue Router Docs ] - HATT Web News Guest ] - TIMELINE

====================================

9:04 - Session Start (late start)

9:32 - What is a Router and What are Routes?

12:18 - Initializing a New Vue Project for Vue-Router Demo

18:24 - Bringing Vue-Router into an Existing Project

22:46 - History vs. Hash Mode

23:55 - A First Look at the Router Integrated App

28:46 - Code Housekeeping and Failed Experiment

30:00 - What is a $Route Object?

32:32 - Writing out First Route

33:26 - Failed Project Interweaving Experiment

34:58 - Writing our First Router-Link

39:12 - Rewriting with a Working Example

43:11 - Creating our First Dynamic View

53:00 - Route Navigating Programatically

56:16 - Writing our First Dynamic Route

59:09 - Multiple Ways to Push Routes

1:10:45 - Session Wrap Up

1:14:00 - Session End

====================================

# Project clone the project and install dependencies for the parent repo each mini project repos that we have written. Run npm install in each repos root folder, one level up from /src

# RabbitWerks.js HTML All The Things Podcast

Check out the Podcast Check out DVLFE for all things Developer Clothing!

Save 25% on orders with coupon code Music from RabbitWerks CodeBeatz Spotify project work. Coding in JavaScript.

Please feel free to leave a comment or suggestion in the chat!

Thank you and Enjoy!

#vuejs #tutorial #livestream #basics #javascript #beginners #vue #vuex #state #getters #mutations #actions

No comments:

Post a Comment