Complete Vuejs Course: Vue.js + Nuxt.js + PHP + Express.js

Getting Started
1 Road Map of the Current Stage
2 Getting to know what Vue.js is and how to install it
3 Create our first Vue.js program and display text using it
4 Controlling attribute value using Vue.js

PROJECT create our first Vue.js APP
5 Road Map of the Current Stage
6 Creating the news reading block used by BBC

Generating contents automatically using the V-FOR directive
7 Road Map of the Current Stage
8 The drawback of our BBC news reading program and the solution V-FOR directive
9 V-FOR in a slightly more complicated application scenario
10 Apply V-FOR to the BBC news reading program we created before

Getting to know PROXY
11 Road Map of the Current Stage
12 Have you found a problem
13 Introduction to the concept of PROXY
14 PROXY also works on methods, meaning you can proxy a method
15 How to communicatedbetween VM.data and VM.methods

The V-ON directive — Vue’s answer to handling events
16 Road Map of the Current Stage
17 Introduction to the V ON directive

Conditional rendering using V-IF, V-ELSE, and V-SHOW
18 Conditional rendering

V-MODEL collecting user-submitted data
19 Introduction to V-MODEL
20 Using V-MODEL in projects
21 Lazy modifier and number modifier
22 Using v-model in other tags textarea, radio button, checked box, etc.

Combining v-for and v-model and creating a list DYNAMICALLY
23 Creating a list dynamically

Computed and Filter
24 The difference between COMPUTED and FILTER
25 Introduction to FILTER
26 Introduction to COMPUTED
27 Project reversing letter order using COMPUTED
28 Two-way data exchange between DATA and COMPUTED

Controlling CSS using V-BIND
29 Controlling CSS Part 1
30 Controlling CSS Part 2

Porject remaining character calculator
31 Project analysis
32 Creating the APP

Vue Components
33 Introduction to Components
34 Registering and installing our first component and component naming rules
35 Register a local component

Sending data into a componnet
36 Introduction to props
37 Demonstration of sending data into component using props
38 Review of how to use props

Sending data out of a component
39 An analysis of how to send data out of a component
40 Sending data out of component using $emit() and self-defined event
41 Sending multiple values simultanesouly
42 Clean a dead corner using original event on component tags

The truth of V-MODEL
43 The truth of the V-MODEL directive

Project creating a price calculator
44 Project analysis
45 Creating the price calculator

Slots
46 Introduction to slots
47 Using slots in news page
48 Named slots

Data exchange between sibling components Central Event Bus
49 Data exchange between sibling components Part 1
50 Data exchange between sibling components Part 2

Creating a news reading and editing APP
51 Program analysis
52 Generate formatted data and time
53 Working on the project Part 1
54 Working on the project Part 2

VUE.JS New contents added by Vue 2.3 .sync modifier and model option
55 The .sync modifier
56 Custom v-model

Scoped slots
57 Introduction to scoped slots
58 Demonstration of using scoped slots
59 Using scoped slots on lists

Component misellaneous
60 is, keep-alive, and v-once
61 Retrieving the object representing the component using ref

Vue API and reactivity in depth
62 Preface
63 API Part 8
64 API Part 9
65 API Part 10
66 API Part 11
67 API Part 12
68 API Part 13
69 APT Part 1
70 API Part 2
71 API Part 3
72 API Part 4
73 API Part 5
74 Try something interesting
75 API Part 6
76 API Part 7

Transition Effects
77 Introduction to transition effects
78 Creating transitioning effects using native JS
79 JS transition hooks
80 Creating a pop-in and out effect using JS hooks
81 Creating a transitioning component
82 Make sure you know EXACTLY how to use the transition attribute
83 Using transition in Vue programs
84 Create your first transition effect
85 Adding transition effect to our previous news reading and editing app
86 Adding transition effects to dynamic components
87 Transition-group adding transitioning effects to lists
88 Introduction to animate.css
89 Adding transitioning effects created by animate.css

Render function
90 Introduction to render function
91 Setting attributes using the RENDER function
92 Creating a list using the render function
93 Exchanging data using the render function

Custom directives
94 Introduction to custom directives
95 The binding property used in the directive property
96 A short-cut in custom directives

Vue MIXIN
97 Introduction to mixin
98 Try our first local mixin
99 Conflicts with Mixin
100 Try global Mixin

The Ajax crash course you may or may not need
101 Introduction to Ajax
102 Improving Ajax program efficiency
103 Introduction to jQuery’s Ajax solution
104 Creating an Ajax program using jQuery
105 jQuery Ajax helper and short-cut methods
106 The basic structure of an Ajax program
107 Sending Ajax requests
108 Receiving Ajax responses
109 Sending requests using GET
110 Complete Ajax Program Part 1 auto refresh using setinterval()
111 Complete Ajax Program Part 2 connecting Ajax to database
112 Complete Ajax Program Part 3 displaying retrieved data in DOM
113 Complete Ajax Program Part 4 fixing loopholes

Understanding JSON
114 Understanding JSON

Connecting Vue to PHP and MySQL
115 How to connect Vue to PHP and MySQL
116 Updating a row Part 1
117 Updating a row setting UI
118 Updating a row Part 3 sending data to modal
119 Updating a row Part 4 Installing input boxes on modal
120 Updating a row Part 5 Installing a data filtering system
121 Updating a row Part 6 sending data to PHP
122 Updating a row Part 7 saving data to database
123 Some thoughts about the news reading and editing app
124 Exchanging data between Vue and PHP
125 Connecting Vue to MySQL and display retrieved data
126 Connecting Vue with PHP and MySQL using jQuery
127 Deleting a row from database table Part 1
128 Deleting a row from database table Part 2
129 Creating a row in database Part 1 preparing the HTML part
130 Creating a row in database Part 2 installing a security filter
131 Creating a row in database Part 3 setting PHP and MySQL

Command Line Crash Course
132 Command Line Crash Course Mac
133 Command Line Crash Course Windows

NPM
134 Introduction to NPM
135 NPM init and package.json
136 Things you must know about packages and dependencies
137 Managing packages using NPM
138 Installing packages using NPM

Babel
139 Installing Babel
140 Understanding how Babel works
141 Using Babel

Webpack
142 Introduction to Webpack
143 Source map and watch mode
144 Webpack-dev-server and Hot Module Replacement(HMR)
145 Webpack development config file and production file
146 module.exports and ES6 ImportExport
147 Tree shaking and deduplication
148 On-demand Lazy loading
149 Bundling JS files into one using Webpack
150 Style-loader and CSS-loader
151 Configuring Webpack using the webpack.config.js file
152 Using file-loader
153 Dealing with packages using expose-loader
154 Introduction to Webpack Plugin
155 Using HTML-Webpack-Plugin
156 Clean-Webpack-Plugin and UglifyJS-Webpack-Plugin

VUE-CLI and single-file components
157 Introduction to Vue-Cli
158 Introduction to .vue files and single file components
159 Project creating a Dutch flag using single components

Vue Router
160 Introduction to Vue router and its basic use
161 Named router
162 Dynamic router
163 Redirect
164 Lazy loading
165 Nested router
166 Named router view

VueX
167 Introduction to VueX
168 mapMutations and …mapActions
169 VueX Modules
170 The common or similar parts between VueX and Vue Router
171 Introduction to the five VueX core concepts
172 State and Getters
173 mapState and …mapGetters
174 Using other names in …mapState and …mapGetters
175 Installing Vue Dev Tool
176 Mutations
177 Actions

Axios
178 Introduction to Axios
179 Axios Interceptor intercepting errors
180 Creating a PHP-based backend, setting up a Vue project, and installing Axios
181 Sending data using axios.get()
182 Sending data using axios.post()
183 PathRewrite
184 Deal with concurrency (two or more requests sent simultaneously)
185 Handling Axios errors
186 Axios Interceptors Request Interceptor
187 Axios Interceptors Response Interceptor

Axios Upload
188 Introduction to how to upload using Axios
189 Uploading files using Axios uploading one file at a time
190 Uploading files using Axios uploading multiple files simultaneously
191 Showing upload progress
192 Creating a progress bar
193 Custom Axios instance
194 Introduction to how to upload using PHP
195 Upload demonstration
196 Upload security
197 Controlling file size
198 Controlling file type
199 Renaming uploaded files
200 Creating new directories for uploaded files automatically
201 Final adjustments

Project Vue.JS + Axios + PHP
202 Improve our previous program
203 Add a new functionality and fix a small problem

Vue UI Library iView
204 Why you need to learn a UI library
205 Porgress
206 Upload
207 Installing iView
208 Try your first component and load iView components on-demand
209 Internationalization and the Button component
210 iView Theme Customization
211 Switch and Slider
212 Message
213 Table
214 Carousel

Project Vue.JS + Axios + PHP + iView
215 Part 1
216 Part 2
217 Part 3
218 Part 4

Advanced JavaScript
219 Assignment-by-value VS. assignment-by-reference
220 Scope, hoisting and undeclared variables
221 Scope chain and JS garbage collection
222 Closure
223 Instantly Invoked Function Expression and its application in creating closure
224 Understanding THIS
225 bind, apply and call
226 Wrapper Object

Express.js
227 NodeJS introduction
228 Handling static files
229 Express introduction and basic skills
230 Receiving value sent in URL via req.query and req.params
231 Handling posted data
232 Using middleware
233 Error-handling middleware
234 Next(), next(‘route’) and next(‘router’)
235 Router-level middleware and next(‘router’)
236 Express Generator

Cookie and Session
237 Handling Cookies in Express
238 Signed Cookie
239 Session

Connecting Express to MySQL database
240 Introduction to the MySQL package
241 Retrieving data from database
242 Updating data from database
243 Creating new row in database
244 Delete data from database

Connecting Vue to Express
245 Connecting Vue to Express
246 Exchanging data between Vue and Express
247 Display retrieved data using Vue and UI library
248 How to delete Part 1
249 How to delete Part 2
250 How to create new rows
251 How to update rows
252 Get source code

Vue CLI 3
253 Vue CLI 3
254 Automatic plugin configuration
255 Vue UI
256 Customize output

Vue CLI 3 Project
257 Set up the project
258 Project root directory analysis
259 App design
260 Create the app Part 1
261 Create the app Part 2
262 Project wrap-up

Nuxt
263 What is Nuxt
264 Retrieving data using asyncData
265 VueX
266 The fetch method
267 nuxtServerInit
268 Get source code
269 Setting up Nuxt and what are in its root directory
270 Nuxt Components and Pages
271 Working with Nuxt plugins
272 Nuxt route, validate and nested route
273 Nuxt middleware
274 Controlling view layout using Layouts and app.html
275 Handling static files in the assets directory and static directory
276 The backend program

Final big project Nuxt app
277 Set up the project and install and configure plugins
278 Create the app homepage
279 Using dynamic data
280 Bring components into the picture componentizing header and footer
281 MUST WATCH Bring Layouts into the picture
282 Bring VueX into the picture
283 Create the detail page
284 Nested routes one parent comp. and three child components
285 Universal CSS
286 Transition effects
287 Controlling page title and META tags using head()
288 Validating user-submitted data
289 MUST WATCHCustom error page and validating user-submitted data using middleware
290 Get source code