目录

0.前端基础

【0.1 - 前端基础】前端开发，工具推荐与环境搭建 【0.2 - 前端基础】Node.js安装与简单使用 【0.3 - 前端基础】NPM包管理器常用命令 【0.4 - 前端基础】ES6简单了解，var、let、const的区别 【0.5 - 前端基础】Babel转码器 【0.6 - 前端基础】模块化开发 【0.7 - 前端基础】Webpack打包 【0.8 - 前端基础】Mock实现模拟数据

前端文化

前端开发是创建Web页面或app等前端界面呈现给用户的过程，通过HTML，CSS及JavaScript以及衍生出来的各种技术、框架、解决方案，来实现互联网产品的用户界面交互。它从网页制作演变而来，名称上有很明显的时代特征。

互联网开始全面进入移动时代，前端开发的工作越来越重要。

最初所有的开发工作都是由后端工程师完成的，随着业务越来越繁杂，工作量变大，于是我们将项目中的可视化部分和一部分交互功能的开发工作剥离出来，形成了前端开发。

前端工作任务接收：PRD（产品原型-产品经理） - PSD（视觉设计-UI工程师） - HTML/CSS/JavaScript（PC/移动端网页，实现网页端的视觉展示和交互-前端工程师）

更多文化：百度百科

MVC、MVP、MVVM

MVC（Model View Conroller），前后端近乎一体的时代，例如SSM（Spring+SpringMVC+Mybatis），在前端与后端交互过程中由View持有Controller，再通过Controller触发Model事件。 SpringMVC框架便是MVC时代的一个代表。 MVP（Model View Presenter），将Controller层刚换为了Presenter，最大的改观就是实现了双向通信，交互方式可以是M→P→V，也可以是V→P→M。 MVP可以看作MVC与MVVM的过度。 MVVM（Model View ViewModel），也就是现在的前后端分离模式开发。通过ViewModel对View和Model进行双向绑定，中间工作由ViewModel处理，后端Model返回不再干涉前端View展示。 参考文章：MVC、MVP、MVVM、MVPVM区别

开发工具

Visual Studio Code（VSCode）：微软发行，免费使用，组件支持功能强大，支持多种开发语言。 WebStorm：是Jetbrains公司发行的前端开发工具，和IDEA出自一家，使用习惯也和IDEA想象，国内使用人数颇多。 HBuilder：是DCloud公司发行的一款开发工具，支持对Android和ios打包，也可以用来开发。 Dreamweaver：简称DW，国内使用人数相对较少。 Sublime：是一款文本编辑器，推荐辅助开发使用。 其他工具推荐：7个免费的web前端开发工具、Web前端开发工具

VSCode前端环境

语言包

首先安装中文插件：Chinese (Simplified) Language Pack for Visual Studio Code,重启生效 如果重启后如果界面没有变化，则 点击 左边栏Manage -> Command Paletet…（Ctrl+Shift+p），搜索configure display language，找到locale.json，修改属性"locale":“zh-cn”

ESLint

ESLint 是一个插件化的 javascript 代码检测工具，它可以用于检查常见的 JavaScript 代码错误，也可以进行代码风格检查。

利用 ESLint 检查代码质量 ESLint中文网

Live Server

live-server是一个具有实时加载功能的小型服务器。

Node.js（Node.js Modules Intellisense）

Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境。相当于一个一直在运行的JavaScript，提供给前后端交互的一个中介，但其功能不止这点。 Node.js中文网 Node.js官网 Node.js菜鸟教程

Node.js Modules Intellisense是Node.js的提示工具，写代码更有效率。

Vue.js

因为个人学习框架为Vue，所以装备的是Vue的插件。

其它设置

浏览打开

Ctrl+,打开设置，设置默认打开浏览器

Emmet语法支持