This article is a collection of some learning material for those who want to become a front-end developer. Although it should be useful for all beginners, it's mainly written to meet the require of a certain project I'm in. So it will focus on something I think useful.

# pre

What's happened when we surf the Internet?

  • Read the answer written by Zhang Qiuyi from Alinode.
  • "20 Things I Learned About Browsers and the Web" [en;zh] by Google.


HTML and CSS are the foundations of web programming, you should grasp both of them deeply. Unlike any other programming language, they are very easy to learn from the beginning, but they are also profound in advanced learning.

*The most efficient way to learn things is to learn it from doing it, so I highly recommend you to have a try during reading on your computer or in jsfiddle which is an awesome web IDE. If you come across problems, you should try to look for the answer in the documentation first and then search on the Internet, if you still can't find the answer, don't be nervous to ask for help on the Internet or just turn to me.

# Javascript

# Vue.js

A tutorial was written by Evan You, who is the founder of Vue.js. Follow the first and second parts(the start and front-end environment) of this article and skip the third part for the moment.

# Tools

  • Editor recommended Visual Studio Code, read another article I have written for why.
  • Documentation browser recommended zeal in windows, and dash in macOS.
  • Chrome developer tool. A1 A2
  • Git
    • A brief view to git.
    • A tutorial was written by liaoxuefeng.
    • GitHub git cheat sheet
    • Advanced learning. Git Pro
    • offers a full-featured Linux terminal which supports git. (click the demo button and the terminal panel is in the lower part of the viewport) We may use Coding as our git service, you should sign up and take a look of it.
  • Linux
    • vbird
    • Also use the terminal offered in's IDE to practice the use of Linux commands.

# Standard

# Further Reading

# Task

Build a blog by writing HTML, CSS and JS. Feel free to use any front-end framework or open source projects as you want, but you need to tell me the reason why you should use that project. The blog should have some functions as followed:

  • contain several articles
  • support code highlight
  • support comment (can use third-party services like Disqus or duoshuo)
  • responsive, mobile supported


The most important thing I think is to be elegant, wherever in code or design. And I recommend you to use vue.js to implement some functions.

Last Updated: 8/31/2020, 5:30:27 PM