3 Hour crash course of the Vue.js framework. You will learn all the fundamentals including components, directives, lifecycle, events and much more.
Check Out Our Sponsor Daily.dev:
https://daily.dev/traversy-media
Full Project Code:
https://github.com/bradtraversy/vue-crash-2024
Blog Post:
https://www.traversymedia.com/blog/vue-crash-course
Check Out My Courses:
Timestamps:
- Intro
- Daily.dev Sponsor
- What is Vue.js?
- Prerequisites
- Role of Frontend Frameworks
- Why Vue.js?
- Vue Components
- Getting Setup
- Using The Vue CDN
- Create-Vue Setup
- Vue Official Extension
- Exploring Folders & Files
- Boilerplate Clean Up
- Component Structure
- Options API data() & Interpolation
- v-if, v-else & v-else-if Directives
- v-for Directive & Looping
- v-bind Directive
- v-on Directive, Events & Methods
- Composition API - Long Form
- ref() & Reactive Values
- Composition API Short Form
- Forms & v-model
- Delete task
- Lifecycle Methods
- onMounted & Fetching Data
- Vue Jobs Project Start
- Tailwind CSS Setup
- Theme Files & Images
- Navbar Component
- Hero Component
- Props
- HomeCards & Card Container Component
- JobListings Component & JSON Data
- JobListing Component
- JobListings Limit & showButton Props
- computed() & Truncate Description
- PrimeIcons
- Vue Router & Home View
- Jobs View
- RouterLink
- Navbar Active Link
- Not Found Page
- JSON Server REST API
- Fetch Data For JobListings
- reactive() Function
- JobListings Refactor To reactive()
- Vue Spinner
- Fetch Single Job & Display Data
-BackButton Component
- Proxying
- Add Job Page
- Save Job POST
- Toast Notifications
- Delete Job
- Edit Page
- Fetch Job To Edit
- Update Job
- Netlify Deployment
1:38:36
1:40
7:18
43:53