Vuejs 中文教程
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
code_example
config
images
real_project_chapter
styles
.gitignore
Capfile 增加了部署脚本例子 Jul 23, 2017
Gemfile 增加了部署脚本例子 Jul 23, 2017
README.md
SUMMARY.md
advanced_component.md
advanced_knowledge.md
advanced_vue.md
basic_command_line.md
best_practices.md
book.json
build_and_deploy.md
build_project.md
component.md
computed_properties_and_watchers.md
cover.jpg
custom_directive.md
define_a_page.md
es_script.md
event.md 修改了 {{ Jun 24, 2018
file_structure.md 完善webpack下的vuejs的介绍部分 Jun 25, 2018
form.md
form_submit.md
git.md
hello_world_bare_vuejs.md
how_is_page_rendered.md
how_to_check_api.md
how_to_debug.md
how_to_read_vuejs_document.md
http_request.md
hybrid_app.md
life_cycle.md
mixin.md
nginx_fix_cross_domain_problem.md
nvm.md
origin_vuejs.md
parse_paremters.md
preface.md 润色文字, README, preface Jun 23, 2018
preparation.md
real_project.md
real_world.md
render_directive.md
router.md
scope_and_this.md
scss_less.md
setup_vuejs_devtools.md
single_page_app.md
slot.md 增加了named slot Jun 25, 2018
styling.md
user_register.md
v_bind.md
view_basic.md
vue_react_angular.md 增加了Vuejs与其他框架的对比 Jun 23, 2018
vuejs_basic.md
vuejs_projects.md 添加了使用vuejs的项目和著名公司 Jul 23, 2017
vuejs_vue_demo.siwei.me.png 校对了剩余的几节, 增加了 最佳实践 Jul 23, 2017
vuex.md
webpack.md 增加了webpack Jun 25, 2018
wechat_and_weex.md
weixin_pay.md
why_vue.md

README.md

本书缘起

这个教程,是根据我公司过去两年多的实际项目经验写的。

我从2016年经营自己的软件公司。 到2018年6月,我们做了近三十个项目。 这些项目中,对于手机端的web的呼声很高。 大部分都要求在手机端使用web打开。

在使用Vuejs之前, 我考察过Angular(包括1.x, 2.x 版本), React,Meteor,这几个框架都不行。

要么是学习曲线陡峭,概念复杂,把简单的事情复杂化(例如Angular),

要么就是编码风格不好,前后端代码混写一起,(例如React, Meteor)

而Vuejs是当时在stackoverflow等国外技术站点上被一致看好的技术。

第一次使用是在2016年4月。 Vuejs 1.x的时候。 我们发现入门特别快,稍微有一定web开发经验的程序员,在一周内就可以上手做项目, 认真学习的话,一个月就可以达到熟手水平(快速的开发项目), 两三个月左右就可以达到高级水平(熟练使用Vuex, 自己写component等)

这么快的上手速度,在其他语言中是不可想象的。 根据我的实际体会, 使用Angular 入门需要一个月。 使用React入门速度也没有这么快。

总之,越是简洁的框架,就越好学。

后来我们在项目中使用它,一发不可收拾。 只要是个h5项目,就可以很好的用起来。 快速开发,快速迭代,性能杠杠的。

而且,额外的好处,是可以非常好的跟Native App的开发结合。在IOS上可以做到完美呈现, 让人无法分辨哪个页面是原生,哪个页面是H5做的。

学习目标

本教程是我公司的员工培训教程,可以在极短的时间内(例如一周)让人上手Vuejs项目。 让人:

  1. 看得懂代码
  2. 可以写一些基本的功能
  3. 可以调试, 部署

这就算入门H5开发了。

使用说明

如果世界上文档分成两类:

  • guide, 教程型文档。
  • api, 接口型文档.

本文档就是入门的教程型文档。 在线查看地址:http://vue_book.siwei.me/

本教程的代码,都来源于这个demo: https://github.com/sg552/vue_js_lesson_demo

以及: code_example 目录。

本书使用gitbook写就,可以自行编译, (安装环境和编译命令,参考:http://siwei.me/blog/posts/gitbook-gitbook)

本书中的出现的命令行,都统一以 $ 作为开始, 例如:

$ npm install vue-cli

各位对命令行不熟悉的同学,记得在敲命令的时候,跳过最前面的 $ 即可.

版本说明

截止到2016年6月底, Vuejs的版本是 2.5.16. 本书中的大部分例子都是在该版本下演示的。

如果您是一名没有任何工作经验的新人,在windows 环境下,建议使用 sublime(免费) + git bash (免费) ,就可以运行本书中的所有例子了。

如果您是一名有工作经验的老鸟,那么Linux, Mac则是非常好的选择~

那么,我们开始一段的令人兴奋的学习历程吧!