时间很宝贵。
年轻时忙着赚钱打拼、狐朋狗友;结婚了忙着油盐酱醋、娃前娃后。
好不容易能挤一点儿时间出来,大脑的系统一又要拿走大部分上网追剧、休养生息。
世界变化很快,后浪来势凶猛,压力不觉山大。
偶尔打起精神想充充电,却又没时间。
好在没时间也有没时间的打法,花 20% 的时间,可能就能达到 80% 的水平。
当然,如果想达到再高一级的 20% 的水平,你还得再花 80% 的时间。
时间宝贵,
没时间学 Vue 的第一条也是最重要的一条原则就是:
花时间掌握关键点 —— 思路总体正确即可,其余的交给搜索引擎
只要把握住两个点,就能画出一条直线;
要是一个点一个点来画,那你就是太有时间 ......
接下来,咱们就一起从 “功利的实用主义” 的角度,找到关键的那几个点。
(我们会做很多简化,因此有些东西也不完全正确,但是会比较容易理解)
首先,让我们简单说一下 Vue —— 顺带吧啦一下前端,记几个关键词和网站。
简单来说,Vue 就是让你能快速开发前端的工具。
就像 Spring Boot 之于 Java 后端开发,MFC 之于 Visual C++ 的 Win32 开发。
前端开发的本质,就是写各种各样的 HTML 元素。
就像你看到的这篇文章、以及后台编辑页面,都是这么干的 —— 即使看起来再炫酷,本质上都是这么的无趣。
不管上面的 HTML 是硬编码写死的,
还是所谓 “后端渲染生成” 的 —— 比如说 FreeMarker 、Theymeleaf、Velocity 甚至 JSP、或者 Golang 的内置 Template,
还是所谓 “前后端分离” 在浏览器里面用 JavaScript 动态生成的,
只要你能把上面的 HTML 弄出来,就能实现上面的效果。
准确说,除了上面的 HTML 弄出来,还得把显示的效果 —— 也就是 CSS —— 也做出来,才能实现上面的效果。
不然,你可能看到的是下面这种颜值比较抱歉的画面,菜单和动画效果也做不出来。
HTML 和 CSS 都有通用的标准 —— 大部分浏览器也支持其中的大部分功能,
不过用起来还是非常麻烦。
如果还要实现按钮处理等效果,那还要再进修学习一下 JavaScript 和 DOM 。
但是,我们又没有时间,怎么办呢?
这时 Vue 这类封装了 HTML、CSS、JavaScript 和 DOM 等组件的常用操作的框架,
就能派上用场,拯救我们这些懒人了 —— 高大上的说法是,迅速提高开发效率。
就像你买了一包泡面,只要按照说明用开水泡开、然后加上调料,就能填饱肚子了。
可惜的是,客户都不好伺候,各个项目也都有自己稀奇古怪的要求,
我们平常面对的情况就有点儿像用泡面开饭馆,应付一张张稍微有点儿挑剔的嘴巴。
所以,还是要了解一下哪些粗面哪些细面,主要有哪些口味。
大部分时候可能用不上,万一要用的时候百度一下就行 —— 不翻墙的话,最好还是必应或者 CSDN。
回到正题,大概就是这么一些网站了。没时间的话,可以先收藏起来。
- 教程类 —— 用于快速上手,部分也可以当成工具书来查阅
- 工具类 —— 就像新华字典和 JavaDoc,尤其是具体的组件或者函数的用法;等你有时间了,也多翻一翻
- 现代 JavaScript 教程: https://zh.javascript.info/
- 网道 JavaScript 教程: https://wangdoc.com/javascript/index.html
- CSS 速查手册: http://css.doyoe.com/
- MDN HTML 教程: https://developer.mozilla.org/zh-CN/docs/web/HTML
- MDN CSS 教程:https://developer.mozilla.org/zh-CN/docs/web/CSS
- MDN WEB 开发教程: https://developer.mozilla.org/zh-CN/docs/web/tutorials
- 练级类 —— 线上练练级,平时多流汗,战时少流血
- freecodecamp: https://www.freecodecamp.one