一、背景1、前端是做什么的？前端开发是创建前端界面（例如网页或应用程序）以呈现给用户的过程。前端开发通过HTML、CSS和JavaScript以及各种衍生技术、框架和解决方案实现互联网产品的用户界面交互。2、前端应该掌握哪些技能？基础：HTMLCSSJSES6等浏览器：cookies、session、localStorage等服务器和网络：http/https、跨域、axios/fetch库、前端安全XSS/CSRF、websocket前端框架：Front-Vue/React/Angular端性能优化：服务端渲染、压缩打包、代码拆分等。3、目前流行的框架有哪些？反应式和可组合视图组件c。专注于核心库，路由、全局状态管理等其他功能交给相关库处理。区别：vue比react好用b。React更加繁荣。二、vue项目入门，快速搭建项目1.vue-cli生成工程项目a。打开bash终端工具，输入命令：cnpminstall-g@vue/clib，通过命令创建项目：vuecreatevue-example为了直观展示运行过程，使用：vueui步骤：vue项目管理器->创建->输入项目名称->预设选择手动配置（勾选选项参考下图1）->创建并等待完成2.项目目录结构├─buildwebpack一些配置文件和服务启动文件├─config主要是构建依赖于├─dist├─node_modules├─src页面和逻辑文件夹│├─assets│├─components│├─router│├─App.vue│├─main.js├─staticfontandpublicstyle文件夹├─.babelrces6编译文件配置├─.editorconfig写风格配置文件，比如缩进文件格式├─.eslintignore忽略检测一些文件格式├─.eslintrc.js代码标准化配置文件├─.gitignore忽略上传一些文件或配置├─.postcssrc.js使用js处理scss├─index.html主文件入口├─package-lock.json├─package.json开发和生产环境的npm依赖和模块包└─README.md解释项目做什么3.项目启动和打包a.npminstall#安装项目依赖b.npmrundev#dev启动c,npmrunbuild#项目编译打包注意：如果页面是通过域名访问的，需要在本地主机添加一条记录：#127.0.0.1xxx.xxx.com然后修改配置文件中的host/config/index.js，重新运行端口后可以通过域名访问端口3.深入讲解flex布局1.flex引入工具：通过一个属性，子元素可以优雅地居中或均匀分布，甚至自动适应窗口的缩放。首先设置父容器`display:flex`，然后设置`justify-content:center`实现水平居中，最后设置`align-items:center`实现垂直居中。#dad{显示：flex；证明内容：居中；align-items:center}2.flex常用方法3.flex客服实际工作台-订单页面4.其他工具介绍less/sass,fetch,webpack
