Contact for queries :
banner1

What you’ll learn

  • Understand all Vue concepts from beginner to advanced
  • Build three real world applications using Vue.js utilising every Vue feature

  • Use the Vuex statement management library

  • Write basic Vue with ES5 and also modern Vue with ES6
  • Setup VueJS environment with development tools including Webpack
  • Create a universal application with server-side rendering
  • Use popular plugins from the Vue ecosystem like vue-router and vue-resource
  • Cutting-edge features like Single File Components, Render functions and Server-Side Rendering

Course Curriculum

1. Introduction & Crash Course
1. Introduction overview 00:00:00
2. What is Vue.js 00:00:00
3. What can you build with Vue.js 00:00:00
4. What do I need to know before learning Vue.js 00:00:00
5. Vue basic feature crash course 00:00:00
6. Advanced features 00:00:00
7. Ecosystem tools 00:00:00
8. Vue.js frameworks and plugins 00:00:00
9. Framework comparison 00:00:00
10. Vue.js Essentials preview 00:00:00
2. Build Your First Vue.js App - Introduction
1. Introducing the course 00:00:00
3. Build Your First Vue.js App - Setting up the project
1. Starter code installation 00:00:00
2. Running the server and viewing the project 00:00:00
3. Touring the project files 00:00:00
4. Build Your First Vue.js App - Up and running with Vue
1. Including Vue in the project 00:00:00
2. Creating an instance of Vue 00:00:00
3. Rendering data on the page 00:00:00
4. Understanding directives 00:00:00
5. Adding a method 00:00:00
6. Rendering the list of products 00:00:00
7. Adding key to iterated products 00:00:00
5. Build Your First Vue.js App - Building the shopping cart
1. Creating the cart 00:00:00
2. Understanding reactivity 00:00:00
3. Vue Devtools 00:00:00
4. Adding products to the cart 00:00:00
5. Displaying cart items 00:00:00
6. Hiding cart if empty 00:00:00
7. Adding quantity to cart items 00:00:00
8. Cart items quantity logic 00:00:00
9. Understanding filters 00:00:00
10. Formatting price 00:00:00
11. Adding quantity buttons to template 00:00:00
12. Implementing inc and dec logic 00:00:00
6. Build Your First Vue.js App - Adding product search
1. Adding search button 00:00:00
2. Adding search input 00:00:00
3. Overview of vue-resource 00:00:00
4. Overview of API 00:00:00
5. Adding vue-resource to project 00:00:00
6. AJAX call for products 00:00:00
7. Build Your First Vue.js App - Building the product list
1. Replacing dummy items 00:00:00
2. Adding product image & price 00:00:00
3. Adding search result count to product list 00:00:00
4. Adding the loading message 00:00:00
5. Understanding lifecycle hooks 00:00:00
6. Default search on page load 00:00:00
7. Understanding transitions 00:00:00
8. Fading in cart total 00:00:00
9. Fading in cart items 00:00:00
8. Build Your First Vue.js App - Scroll loading products
1. How scroll load works 00:00:00
2. Adding a sensor element 00:00:00
3. Scroll monitor setup 00:00:00
4. Triggering code with scroll monitor 00:00:00
5. Appending items 00:00:00
6. Fixing search results 00:00:00
9. Build Your First Vue.js App - Adding finishing touches
1. Loading indicator with v-cloak 00:00:00
10. Build A Vue.js Single-Page App with Vue Router - Introduction
1. Introduction 00:00:00
11. Build A Vue.js Single-Page App with Vue Router - Overview & setup
1. Demo of the finished product 00:00:00
2. Getting data from the OMDB API 00:00:00
3. Clone repo, NPM install, setup environment 00:00:00
4. Running local server 00:00:00
5. Tour of the project files 00:00:00
6. Webpack configuration 00:00:00
7. Hello World 00:00:00
12. Build A Vue.js Single-Page App with Vue Router - Setting up components
1. Vue essentials Components 00:00:00
2. Configuring components 00:00:00
3. Setup the movie-list component 00:00:00
4. Setup the check-filter component 00:00:00
13. Build A Vue.js Single-Page App with Vue Router - Filters
1. Vue essentials Props 00:00:00
2. Add props to check-filter component 00:00:00
3. Making check-filter toggleable 00:00:00
4. Vue essentials Custom events 00:00:00
5. Emitting a custom event from check-filter 00:00:00
6. Vue essentials Vue.js devtools 00:00:00
7. Adding a payload to check-filter event 00:00:00
8. Processing check-filter event in root instance 00:00:00
9. Add filter arrays to movie-list 00:00:00
10. Creating logic for genre filter 00:00:00
14. Build A Vue.js Single-Page App with-Refactoring with single file components
1. Vue essentials Single file components 00:00:00
2. Refactor project to use single file components 00:00:00
15. Build A Vue.js Single-Page App with Vue Router - Getting data from API
1. Understanding the API 00:00:00
2. Getting data from the API 00:00:00
3. Replace dummy data with API data 00:00:00
4. Creating movie-item component 00:00:00
5. Fleshing out movie-item template 00:00:00
6. Enhance genre filter for multi-genre movies 00:00:00
7. Adding no results and loading messages 00:00:00
16. Build A Vue.js Single-Page App with Vue Router - Displaying session times
1. Adding moment library to project 00:00:00
2. Displaying session times 00:00:00
3. Filtering session times 00:00:00
4. Adding time filters 00:00:00
5. Filter movies based on time filter 00:00:00
6. Filter sessions based on time filter 00:00:00
7. Enhance the no results message with filters 00:00:00
17. Build A Vue.js Single-Page App- Component communication with an event bus
1. Vue essentials Event bus 00:00:00
2. Using a global event bus in the project 00:00:00
18. Build A Vue.js Single-Page App with Vue Router - Creating the Detail page
1. Vue essentials Vue router 00:00:00
2. Abstract main page into overview component 00:00:00
3. Setting up Vue router 00:00:00
4. Adding router-view to main template 00:00:00
5. Creating detail page 00:00:00
6. Passing movie ID to detail page 00:00:00
7. Displaying movie-item in detail page 00:00:00
8. Vue essentials Slots 00:00:00
9. Incorporating slots in movie-item 00:00:00
10. Fleshing out detail page 00:00:00
19. Build A Vue.js Single-Page App with Vue Router - Adding the day selector
1. Creating day-select component 00:00:00
2. Addings days to day-select 00:00:00
3. Day selection logic 00:00:00
4. Application-level day property 00:00:00
5. Mobile day selector 00:00:00
20. Build A Vue.js Single-Page App with Vue Router - Adding tooltips
1. Vue essentials Custom directives 00:00:00
2. Adding tooltip custom directive 00:00:00
3. Creating tooltip in DOM 00:00:00
4. Adding classes and event listeners to tooltip 00:00:00
5. Vue essentials Plugins 00:00:00
6. Making tooltip a custom plugin 00:00:00
21. Build A Vue.js Single-Page App with Vue Router - Finishing touches
1. Adding keep-alive to router to maintain filter state 00:00:00
2. How v-cloak works alongside Webpack 00:00:00
3. Building for production 00:00:00
22. Build A Professional Vue App with Vuex & SSR - Introduction
1. Introduction 00:00:00
23. Build A Professional Vue App with Vuex & SSR - Overview & setup
1. Demo of the finished product 00:00:00
2. Clone repo, NPM install, setup environment 00:00:00
3. Tour of the files 00:00:00
4. Webpack configuration and extract text demo 00:00:00
24. Build A Professional Vue App with Vuex & SSR - Setting up the calendar
1. Setup the app component 00:00:00
2. Add moment to root, set timezone 00:00:00
3. Generate list of days in current month 00:00:00
4. Padding days to startend of month for complete weeks 00:00:00
5. Grouping days into blocks of weeks 00:00:00
25. Build A Professional Vue App with Vuex & SSR - Calendar day functionality
1. Vue essentials Shorthands 00:00:00
2. Adding calendar-day component 00:00:00
3. Adding days of week above calendar grid 00:00:00
4. Highlighting current day on calendar 00:00:00
5. UI effects for past and days outside of month 00:00:00
6. Vue essentials Vuex 00:00:00
7. Add Vuex store to project and create basic state properties 00:00:00
26. Build A Professional Vue App with Vuex & SSR - Adding the month selector
1. Adding header and creating current-month component 00:00:00
2. Displaying date in current-month component 00:00:00
3. Adding buttons to current-month component 00:00:00
4. Moving Vuex into own file 00:00:00
5. Changing month and year with Vuex mutation 00:00:00
6. Enhancing current-month logic 00:00:00
7. Vue.js Dev Tools Vuex 00:00:00
27. Build A Professional Vue App with Vuex & SSR - Creating the event form
1. Creating event-form component 00:00:00
2. Capture click in calendar-day 00:00:00
3. Positioning Event Form 00:00:00
4. Opening and closing Event Form 00:00:00
5. Displaying events in calendar-day 00:00:00
6. Creating events state in store 00:00:00
7. Adding input to event-form 00:00:00
8. Submit new event to store 00:00:00
9. Get event date in store 00:00:00
10. Improving form 00:00:00
11. Focus directive, Enter keyup is create 00:00:00
12. Displaying date on Event Form 00:00:00
13. Highlight Event Form active day 00:00:00
28. Build A Professional Vue App with Vuex & SSR - Loading stored events
1. Setup for sending events to server 00:00:00
2. Receiving event on server 00:00:00
3. Vue essentials Vuex actions 00:00:00
4. Creating addEvent action in store 00:00:00
5. Returning a promise from addEvent action 00:00:00
29. Build A Professional Vue App with Vuex & SSR - Writing events to template
1. Replace Vuex state in main file 00:00:00
2. Move mock data to HTML template 00:00:00
3. Splicing mock data into HTML file 00:00:00
30. Build A Professional Vue App with Vuex & SSR - Server-side rendering
1. Vue essentials Render functions 00:00:00
2. Creating root instance template with a render function 00:00:00
3. Introduction to server-side rendering 00:00:00
4. Server-side rendering webpack flow 00:00:00
5. Creating common entry file 00:00:00
6. Creating server entry file 00:00:00
7. Setting up bundle renderer 00:00:00
8. Splicing rendered bundle into HTML template 00:00:00
9. Vuex state hydration 00:00:00
31. Build A Professional Vue App with Vuex & SSR - Finishing touches
1. Adding image to header and reloading page on initial render 00:00:00
2. Building for production 00:00:00
32. BONUS CHAPTER Keep Vue in sync across tabs
1. Keep the shopping cart in sync across tabs 00:00:00
2. Creating a Pusher account 00:00:00
3. Using Vue watchers to hook into reactive changes 00:00:00
4. Sending cart data to the server 00:00:00
5. Triggering Pusher events from the server 00:00:00
6. Receiving Pusher events in the client 00:00:00
7. Replacing the cart with data received from Pusher 00:00:00
TAKE THIS COURSE
  • FREE
  • 10 Days
4 STUDENTS ENROLLED

About WPLMS

WPLMS is the most popular Education WordPress theme. With over 12000 customers and several startups successfully running their businesses on WPLMS, it is the most powerful solution for Education websites right now.

Popular Tags

Who’s Online

There are no users currently online
top
Template Design © VibeThemes. All rights reserved.