The Vue.js 2 Learning Advice Sequence, A Must-See for Beginners

Designed by imdodd

Starting today, I plan to write a series on how to gradually grow from a Vue.js beginner to an expert. It will be collected in my “Vue.js Base Knowledge” library. If you’re interested, please feel free to follow me and the library.

Getting Started Of Learning Vue.js

1. Solid foundation in JavaScript, HTML, and CSS. This is a prerequisite.

2. Read through the basics section of the official guide. Without using any build tools, just stick to the simplest <script> tag and go through the examples in the guide, understanding their usage. It is not recommended to jump straight into using vue-cli, especially if you don’t have a background in Node/Webpack.

3. Create some examples similar to those on the official website, think of your own examples, and implement them to practice and deepen your understanding.

4. Read the advanced section of the official guide up to ‘Custom Directive.’ Focus on understanding Vue’s reactivity system and component lifecycle. If you find ‘Render Function’ challenging, you can skip it for now.

5. Read the chapters in the guide about routing and state management, and then learn vue-router and vuex as needed. Similarly, don’t worry about build tools at this stage, and focus on understanding their usage based on the documentation.

6. After completing the basic documentation, if you are not familiar with Node-based front-end engineering, you will need to catch up. The following topics are not strictly part of Vue itself, and they don’t cover all front-end engineering knowledge, but they are prerequisites for large-scale Vue projects and essential knowledge for a qualified ‘frontend engineer.’

Frontend Ecosystem / Engineering

1. Understand the specifications behind JavaScript, the history of ECMAScript, and its current specification process. Learn about new features in ES2015/16, keep an eye on…