GitHub上热度爆表!Vue.JS实战手册助你跳槽涨薪

发表时间: 2023-12-19 16:52

前言

如今,前端框架可谓百家争鸣,但每一个框架的产生都是为了解决具体问题的。Vue.js 以渐进式切入,对不同阶段的开发者提供了不同的开发模式,由浅入深。Vue.js提供了友好的API和强大的功能,包括双向数据绑定、路由、状态管理、动画、组件化、SSR,无论是简单的页面还是复杂的系统,从可复用性、便捷性和维护性上都精益求精。

手册分为“基础篇”“进阶篇”和“实战篇”三部分,其中基础篇涵盖了Vue.js 2的所有基础内容,包括:

  • 双向绑定数据;
  • 计算属性;
  • 内置指令与自定义指令;
  • 组件。

基础篇内容相对容易,适合刚入门 Vue.js的开发者。

进阶篇更深入Vue.js 的工程化,内容包括:

  • Render 函数;
  • webpack的使用;
  • Vue.js插件。

实战篇首先剖析了 iView 的两个经典组件的设计和实现思路,然后充分利用Vue.js的内容完成了两个完整的实战项目。

因为内容太多所以仅展示了部分内容,需要完整版内容的朋友可以私信【前端】即可获取

目录

内容概述

第一篇 基础篇

第1章初识Vue.js

本章主要介绍与Vue.js有关的一些概念与技术,并帮助你了解它们背后相关的工作原理。通过对本章的学习,即使从未接触过Vue.js,你也可以运用这些知识点快速构建出一个Vue.js,应用。




第2章数据绑定和第一个Vue应用

学习任何一种框架,从一个Hello World应用开始是最快了解该框架特性的途径,我们先从一段简单的HTML代码开始,感受Vue.js最核心的功能。




第3章计算屈性

模板内的表达式常用于简单的运算,当其过长或逻辑复杂时,会难以维护,本章的计算属性就是用于解决该问题的。




第4章v-bind及class与style绑定

DOM元素经常会动态地绑定一些class类名或style样式,本章将介绍使用v-bind指令来绑定class和 style的多种方法。




第5章内置指令

回顾一下第2.2节,我们已经介绍过指令(Directive)的概念了,Vue.js 的指令是带有特殊前缀“v-”的HTML 特性,它绑定一个表达式,并将一些特性应用到DOM上。其实我们已经用到过很多 Vue内置的指令,比如v-html、v-pre,还有上一章的v-bind。本章将继续介绍 Vue.js中更多常用的内置指令。



第6章表单与v-model

表单类控件承载了一个网页数据的录入与交互,本章将介绍如何使用指令v-model完成表单的数据双向绑定。



因为内容太多所以仅展示了部分内容,需要完整版内容的朋友可以私信【前端】即可获取

第7章组件详解

组件(Component)是Vue.js最核心的功能,也是整个框架设计最精彩的地方,当然也是最难掌握的。本章将带领你由浅入深地学习组件的全部内容,并通过几个实战项目熟练使用Vue组件。



第8章自定义指令

在第5章里我们已经介绍过了许多Vue内置的指令,比如v-if、v-show等,这些丰富的内置指令能满足我们的绝大部分业务需求,不过在需要一些特殊功能时,我们仍然希望对DOM进行底层的操作,这时就要用到自定义指令。




第二篇 进阶篇

第9章Render函数

Vue.js 2.x 与Vue.js 1.x最大的区别就在于2.x使用了Virtual Dom(虚拟DOM)来更新DOM节点,提升渲染性能。

虽然前面章节我们的组件模板都是写在 template选项里的,但是在 Vue.js编译时,都会解析为Virtual Dom。

本章我们就来探索Vue.js用于实现 Virtual Dom的 Render函数用法,在介绍Render函数前,我们先来看看什么是Virtual Dom。



第10章使用webpack

高效的开发离不开基础工程的搭建。本章主要介绍目前热门的JavaScript应用程序的模块打包工具 webpack。在开始学习本章前,需要先安装Node.js和NPM,如果你不熟悉它们,可以先查阅相关资料,完成安装并了解 NPM最基本的用法。



第11章插件

Vue.js 提供了插件机制,可以在全局添加一些功能。它们可以简单到几个方法、属性,也可以很复杂,比如一整套组件库。本章将介绍几个官方的核心插件,然后通过实战来开发一个插件。



第三篇 实战篇

第12章iview经典组件剖析

iView是一套基于Vue.js 2的开源UI组件库,主要服务于PC 界面的中后台产品。简单地理解,它是深度封装的40多个常用业务组件,比如Input、Checkbox、Select、Table;但它同时也是一整套的前端解决方案,包括设计规范、基础样式,支持服务端渲染(SSR),同时提供了可视化脚手架,方便快速构建项目工程。



第13章实战:知乎日报项目开发

知乎日报是由知乎开发的一款资讯类阅读 App,每日提供来自知乎社区精选的问答或专栏文章。本章将使用Vue和 webpack等相关技术,利用知乎日报的接口开发一个 Web App。



第14章实战:电商网站项目开发

本章将结合本书所有的知识点(包括webpack、Vuex、vue-router等)来开发一个具有代表性的电商网站项目。所涉及的内容涵盖了许多典型场景,如商品列表按照价格、销量排序;商品列表按照品牌、价格过滤:动态的购物车:使用优惠码等。



第15章相关开源项目介绍

本章将介绍一些实际开发中经常使用的与Vue.js 相关的开源项目,它们包括服务端渲染框架Nuxt.js、HTTP库 axios以及多语言插件vue-i18n。使用好的开源项目可以让你的团队事半功倍。


结尾

需要的同学转发本文+关注+私信【前端】即可获取!