by Anthony Gore | Publisher: Packt Publishing | Release Date: July 2017 | ISBN: 9781788394086

Learn to code Vue JS 2 by building three professional applicationAbout This VideoSetup 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.In DetailThis Course contains all Vue concepts from beginner to advanced, way to create a universal application with server-side rendering and uses popular plugins from the Vue ecosystem like vue-router and vue-resources.

1. Chapter 1 : Introduction
   • Course introduction 00:20:51
2. Chapter 2 : Project 1 - Overview and setup
   • Demo of the finished product 00:07:12
   • Register for the Imgur API 00:03:02
   • Reviewing the Vue.js Poster Store Github repo 00:01:03
   • Clone repo, install dependencies and setup environment file 00:01:48
   • Running server and viewing project 00:02:34
   • Tour of the project file 00:05:48
3. Chapter 3 : Project 1 - Up and running with Vue
   • Include Vue in project 00:05:48
   • Creat an instance of Vue 00:03:08
   • Adding a data property 00:02:40
   • Vue essentials: Directives 00:03:32
   • Adding a method 00:02:58
   • Rendering a list of items 00:05:14
   • Add classes to item 00:03:42
4. Chapter 4 : Project 1 - Adding product search
   • First, a request! 00:01:50
   • Creating the cart 00:01:27
   • Vue essentials: Reactivity 00:03:57
   • Iterate cart items in template 00:01:52
   • Enhancing cart in the template 00:04:37
   • Hide cart if empty 00:01:05
   • Adding quantity to cart items 00:04:13
   • Cart items quantity logic 00:05:13
   • Adding price to cart items 00:05:39
   • Vue essentials: Filters 00:02:59
   • Formatting price 00:02:31
   • Adding quantity buttons to template 00:04:44
   • Quantity buttons logic 00:03:48
   • Adding classes and breaking loop in add Items 00:04:54
5. Chapter 5 : Project 1 - Adding product search
   • Search button 00:02:07
   • Search input 00:06:09
   • Overview of vue-resource 00:02:50
   • Overview of API 00:03:11
   • Adding vue-resource to project 00:03:37
   • AJAX call for products 00:02:22
6. Chapter 6 : Project 1 - Building the product list
   • Replacing dummy items with the real thing 00:04:54
   • Product image 00:03:35
   • Adding search result count to product list 00:06:11
   • Loading message 00:06:19
   • Vue essentials: Lifecycle hooks 00:05:57
   • Default search on page load 00:02:42
   • Adding price to products 00:03:50
7. Chapter 7 : Project 1 - Enhancing the shopping cart
   • Vue essentials: Transitions 00:02:19
   • Fading in cart total 00:04:20
   • Vue essentials: Key 00:06:41
   • Vue essentials: List transitions 00:04:06
   • Fade in cart items 00:03:30
8. Chapter 8 : Project 1 - Scroll loading products
   • How scroll load works 00:04:02
   • Creating the results array 00:06:33
   • Including scroll monitor in the project 00:03:23
   • Scroll monitor basic setup 00:04:42
   • Implementing scroll load (part 1) 00:03:39
   • Implementing scroll load (part 2) 00:04:36
   • Fixing search results 00:06:22
   • Adding a "no more items" message 00:01:39
   • Vue essentials: Computed properties 00:02:59
   • Enhancing "no more items" logic 00:02:24
9. Chapter 9 : Project 1 - Finishing touches
   • Hiding elements before Vue compiles them 00:02:19
   • Requiring a search string 00:03:21
10. Chapter 10 : Project 2 - Overview and setup
    • Demo of the finished product 00:01:50
    • Getting data from the OMDB API 00:03:45
    • Clone repo, NPM install, setup environment 00:01:27
    • Running local server 00:05:04
    • Tour of the project files 00:02:07
    • Webpack configuration 00:06:19
    • Hello World 00:11:00
11. Chapter 11 : Project 2 - Setting up components
    • Vue essentials: Components 00:03:29
    • Configuring components 00:03:04
    • Setup the movie-list component 00:05:28
    • Setup the check-filter component 00:06:18
12. Chapter 12 : Project 2 - Filters
    • Vue essentials: Props 00:05:37
    • Add props to check-filter component 00:03:49
    • Making check-filter toggleable 00:03:45
    • Vue essentials: Custom events 00:03:17
    • Emitting a custom event from check-filter 00:02:37
    • Vue essentials: Vue.js devtools 00:04:37
    • Adding a payload to check-filter event 00:02:01
    • Processing check-filter event in root instance 00:05:37
    • Add filter arrays to movie-list 00:03:41
    • Creating logic for genre filter 00:03:10
13. Chapter 13 : Project 2 - Refactoring with single file components
    • Vue essentials: Single file components 00:05:39
    • Refactor project to use single file components 00:03:52
14. Chapter 14 : Project 2 - Getting data from API
    • Understanding the API 00:09:23
    • Getting data from the API 00:04:38
    • Replace dummy data with API data 00:03:53
    • Creating movie-item component 00:02:21
    • Fleshing out movie-item template 00:03:29
    • Enhance genre filter for multi-genre movies 00:03:15
    • Adding no results and loading messages 00:05:21
15. Chapter 15 : Project 2 - Displaying session times
    • Adding moment library to project 00:05:03
    • Displaying session times 00:07:36
    • Filtering session times 00:05:39
    • Adding time filters 00:06:44
    • Filter movies based on time filter 00:05:01
    • Filter sessions based on time filter 00:09:45
    • Enhance the no results message with filters 00:04:40
16. Chapter 16 : Project 2 - Component communication with an event bus
    • Vue essentials: Event bus 00:04:09
    • Using a global event bus in the project 00:03:02
17. Chapter 17 : Project 2 - Creating the Detail page
    • Vue essentials: Vue router 00:08:52
    • Abstract main page into overview component 00:04:15
    • Setting up Vue router 00:04:40
    • Adding router-view to main template 00:04:12
    • Creating detail page 00:03:29
    • Passing movie ID to detail page 00:04:59
    • Displaying movie-item in detail page 00:04:04
    • Vue essentials: Slots 00:06:35
    • Incorporating slots in movie-item 00:02:21
    • Fleshing out detail page 00:04:40
18. Chapter 18 : Project 2 - Adding the day selector
    • Creating day-select component 00:04:42
    • Addings days to day-select 00:02:29
    • Day selection logic 00:06:09
    • Application-level day property 00:02:50
    • Mobile day selector 00:04:59
19. Chapter 19 : Project 2 - Adding tooltips
    • Vue essentials: Custom directives 00:06:24
    • Adding tooltip custom directive 00:03:13
    • Creating tooltip in DOM 00:03:44
    • Adding classes and event listeners to tooltip 00:02:55
    • Vue essentials: Plugins 00:12:31
    • Making tooltip a custom plugin 00:01:25
20. Chapter 20 : Project 2 - Finishing touches
    • Adding keep-alive to router to maintain filter state 00:05:39
    • How v-cloak works alongside Webpack 00:02:26
    • Building for production 00:02:49
21. Chapter 21 : Project 3 - Overview and setup
    • Demo of the finished product 00:01:58
    • Clone repo, NPM install, setup environment 00:04:08
    • Tour of the files 00:02:49
    • Webpack configuration and extract text demo 00:04:42
22. Chapter 22 : Project 3 - Setting up the calendar
    • Setup the app component 00:10:37
    • Add moment to root, set timezone 00:02:58
    • Generate list of days in current month 00:04:16
    • Padding days to start/end of month for complete weeks 00:08:12
    • Grouping days into blocks of weeks 00:10:46
23. Chapter 23 : Project 3 - Calendar day functionality
    • Vue essentials: Shorthands 00:04:39
    • Adding calendar-day component 00:04:46
    • Adding days of week above calendar grid 00:01:32
    • Highlighting current day on calendar 00:02:58
    • UI effects for past and days outside of month 00:03:08
    • Vue essentials: Vuex 00:04:39
    • Add Vuex store to project and create basic state properties 00:01:16
24. Chapter 24 : Project 3 - Adding the month selector
    • Adding header and creating current-month component 00:04:38
    • Displaying date in current-month component 00:02:37
    • Adding buttons to current-month component 00:01:41
    • Moving Vuex into own file 00:02:34
    • Changing month and year with Vuex mutation 00:03:18
    • Enhancing current-month logic 00:03:32
    • Vue.js Dev Tools: Vuex 00:02:20
25. Chapter 25 : Project 3 - Creating the event form
    • Creating event-form component 00:01:49
    • Capture click in calendar-day 00:04:51
    • Positioning Event Form 00:04:36
    • Opening and closing Event Form 00:02:36
    • Displaying events in calendar-day 00:06:03
    • Creating events state in store 00:06:00
    • Adding input to event-form 00:01:55
    • Submit new event to store 00:02:00
    • Get event date in store 00:04:05
    • Improving form 00:03:51
    • Focus directive, Enter keyup is create 00:03:08
    • Displaying date on Event Form 00:04:22
    • Highlight Event Form active day 00:04:16
26. Chapter 26 : Project 3 - Loading stored events
    • Setup for sending events to server 00:03:41
    • Receiving event on server 00:05:22
    • Vue essentials: Vuex actions 00:02:58
    • Creating addEvent action in store 00:04:03
    • Returning a promise from addEvent action 00:05:57
27. Chapter 27 : Project 3 - Writing events to template
    • Replace Vuex state in main file 00:07:00
    • Move mock data to HTML template 00:05:08
    • Splicing mock data into HTML file 00:05:20
28. Chapter 28 : Project 3 - Server-side rendering
    • Vue essentials: Render functions 00:08:08
    • Creating root instance template with a render function 00:04:20
    • Introduction to server-side rendering 00:06:37
    • Server-side rendering webpack flow 00:09:49
    • Creating common entry file 00:05:44
    • Creating server entry file 00:06:59
    • Setting up bundle renderer 00:06:47
    • Splicing rendered bundle into HTML template 00:06:10
    • Vuex state hydration 00:04:43
29. Chapter 29 : Project 3 - Finishing touches
    • Adding image to header and reloading page on initial render 00:06:41
    • Building for production 00:05:47
30. Chapter 30 : Wrap up
    • Wrap up 00:03:57



9781788394086.The.Ultimate.Vue.JS.2.Developers.Course.part1.OR.rar

9781788394086.The.Ultimate.Vue.JS.2.Developers.Course.part2.OR.rar

9781788394086.The.Ultimate.Vue.JS.2.Developers.Course.part3.OR.rar

9781788394086.The.Ultimate.Vue.JS.2.Developers.Course.part4.OR.rar