全栈开发学习路线

学习路线

• 学习路线
  • Web前端
    • 前端开发工具
    • SEO
  • HTML + CSS
    • HTML简介
    • HTML标签详解
    • 标签语义化
    • CSS概述
    • CSS属性
    • CSS样式的类型
    • CSS选择器
    • CSS背景
    • 元素的显示模式
    • CSS伪类
    • 字体相关属性
    • 盒子模型
    • margin
    • padding
    • 浮动
    • 定位
    • CSS相关案例
  • HTML5 + CSS3
    • HTML5新增标签
    • HTML5多媒体
    • HTML5音频播放
    • HTML5视频播放
    • HTML5DOM扩展
    • HTMl5自定义属性
    • 地理定位
    • 文件读取
    • 元素拖拽
    • 应用缓存
    • 历史管理
    • web存储
    • CSS3选择器
    • CSS3新属性
    • 2D转换与过渡
    • 3D转换
    • 动画
    • Web字体
    • Flex弹性布局
  • JavaScript + jQuery
    • JavaScript
      • JavaScript概述
      • 数据类型
      • 流程控制
      • 算法基础
      • 企业编程规范
      • JavaScript内置对象常用方法
      • 对象的创建方式
      • JavaScript中的对象
      • 面向对象
      • 原型
      • 作用域链
      • 函数的调用方式及this指向
      • 正则表达式
      • JavaScript高级
        • 递归与预解析
        • 数据类型
        • 函数
        • 词法分析
        • 作用域链
        • 事件编程
        • canvas绘图
        • 面向对象
        • JSON对象
        • 原型链
        • 设计模式
        • 正则表达式
      • JavaScript原理探究
        • 原型
        • 原型链
        • 继承
        • 闭包
        • ES5
        • ES6
    • jQuery
      • jQuery简介
      • jQuery的优势
      • jQuery选择器
      • jQuery中的动画
      • jQuery插件
      • jQueryUI
      • jQuery编程思想
      • 链式编程和隐式迭代
      • 编写jQuery插件
      • jQuery选择器
      • 属性操作
      • 事件编程
      • jQuery特效
      • 文档处理
      • 插件机制
      • jQuery中的Ajax
      • 开源jQuery项目实践
  • PHP +MySQL
    • 搭建环境
      • PHP简介
      • WEB程序的访问流程
      • 安装Apache
      • MySQL
      • PHP7
      • 配置虚拟主机
    • PHP7基础
      • 变量和常量
      • 数据类型
      • 运算符
      • 流程控制
      • 函数
      • 字符串
      • 数组
      • PSR规范
      • B/S结构
      • 参数传递GET/POST
      • 动态网站
      • 后台接口开发
      • 分支循环语句
    • MySQL数据库
      • MySQL简介
      • 基础SQL操作
      • 字符集
      • 列类型
      • 类属性
      • 表关系
      • 高级查询
      • 外键
      • 范式
      • 用户管理
      • 权限管理
      • 数据备份与还原
    • MySQL优化
      • MySQL优化概述
      • MySQL存储引擎
      • 列类型的选择
      • 数据库设计三范式与逆范式
      • MySQL中的执行计划
      • 数据库中索引的设计
      • MySQL中的其他功能
      • MySQL分表技术
      • Sphinx
      • 读写分离
    • 表单传值
      • 表单传值的方式
      • PHP接收数据的三种方式
      • PHP处理复选框数据
      • 文件上传
    • MySQLi扩展
      • 基本操作
      • 执行增删改操作
      • 执行查询操作
      • 与MySQLi相关的函数
      • MySQLi扩展应用案例
    • 文件编程
      • 文件操作的分类
      • 目录操作
      • 文件操作
      • 文件下载
    • 会话技术
      • 会话技术概述
      • Cookie与Session的区别
      • Cookie原理
      • Cookie操作
      • Session原理
      • Session操作
      • 垃圾回收机制
    • GD图像处理
      • GD库概述
      • GD画布实现
      • 验证码
      • 缩略图
      • 水印图
    • 面向对象
      • 面向对象概述
      • 面向对象实现
      • 封装
      • 继承
      • 多态
      • 对象遍历
      • 对象序列化
      • 反射机制
      • 命名空间
      • Trait新特性
    • PDO扩展
      • PDO简介
      • PDO类
      • PDOStatement类
      • PDO预处理
      • PDO事务处理
      • PDO异常处理
      • PDO属性
      • 封装PDO类
    • Smarty
      • Smarty概述
      • 模板设计
      • 程序设计
    • ThinkPHP5.0
      • ThinkPHP5框架概述
      • 基础
      • 架构
      • 路由
      • 控制器
      • 视图
      • 模型
      • 项目实用项
    • RESTful
      • RESTful概述
      • HTTP协议
      • RESTful API设计六要素
      • 编写API接口文档
      • 使用Lumen实现RESTful
    • MVC设计模式
      • MVC设计模式
      • 搭建自定义MVC框架
    • 博客项目
      • 项目开发流程
      • 数据表数据
      • 后台实现
      • 前台实现
      • 扩展功能
    • 数据表设计、后台设计、前台设计、会员设计、购物车设计、订单设计、接口设计（微信/支付宝、短信、QQ登录、邮件、地图、物流）、静态化
    • PHP+Swoole多进程爬虫
      • Swoole概述
      • Server
      • Client
      • Process
      • AsyncIO
      • Memory
      • HttpServer
      • WebSocket
      • Swoole综合案例：PHP+Swoole多进程爬虫
  • Web API
    • BOM操作
    • DOM操作
    • 事件处理
    • 浏览器兼容性处理
    • 页面动态效果
    • 动画
  • HTTP/HTTPS协议
    • HTTP协议概念
    • HTTP协议的特点
    • HTTP协议的分类
    • HTTP请求
    • HTTP响应
    • HTTP状态码
    • PHP模拟HTTP请求
    • 扩展：HTTPS协议
  • Ajax
    • Ajax概述
    • Ajax对象
    • GET与POST请求
    • 同步与异步概念
    • 缓存问题
    • Ajax与XML
    • Ajax与JSON
    • 封装Ajax框架
    • 跨域请求
    • 原生Ajax
    • jQuery的Ajax相关API使用
    • 低层原理分析
    • 缓存问题及处理方式
    • 跨域请求及解决方法
    • 实用案例
  • VueJS
    • Vue概述
    • Vue指令
    • Vue属性
    • 方法、事件、过滤器、事件处理、钩子函数
    • 组件、动画、路由、API请求
    • 常用系统指令
    • 数据绑定
    • 指令
    • 过滤器
    • 生命周期
    • 组件化
    • Vue组件
    • Vue过渡效果(动画)
    • 路由(vue-router库）
    • axios
  • WAMP & MAMP & LAMP
    • WEB程序的访问流程
    • Apache
    • MySQL
    • PHP
    • 配置虚拟主机
  • 设计模式
    • MVC
    • MVVM
  • Git开发
    • 命令行
    • git的基本使用
    • 对比文件差异、还原、合并 ，回滚操作
    • 远端仓库操作,使用github创建远端仓库，生成ssh key 并添加到github
  • Linux操作系统
    • Linux系统概述
    • VMware虚拟机的安装
    • CentOS系统安装
    • Shell指令
    • VI编辑器
    • Linux内核分析
    • 用户和组
    • 文件操作
    • 网络配置
    • FTP
    • LAMP部署
  • Nginx服务器集群
    • Nginx概述
    • LNMP的安装与配置
    • 缓存设置
    • 压缩设置
    • 负载均衡
  • Memcache缓存设计
    • 大型项目优化概述
    • Memcache软件的安装
    • Memcache指令详解
    • 使用PHP操作Memcache
    • Memcache应用场景
  • Redis 缓存\消息队列
    • Redis概述
    • Redis支持的数据类型
    • 持久化功能
    • Redis主从模式
    • PHP操作Redis
    • 消息队列
    • 商城系统缓存设计与秒杀实现
  • MongoDB (NoSQL数据库)
    • MongoDB概述
    • MongoDB进阶
    • MongoDB的权限机制
    • 使用PHP操作MongoDB
  • 网站优化(MySQL高级优化)
    • MySQL优化概述
    • MySQL存储引擎
    • 列类型的选择
    • 数据库设计三范式与逆范式
    • 执行计划
    • 索引
    • 分库分表技术
  • 网站优化(Sphinx,Xunsearch)
    • 主从服务器的讲解
    • 主从复制
    • 读写分离实战
  • 网站优化(主从复制,读写分离)
    • Sphinx概述
    • 安装Sphinx
    • 使用PHP+API接口连接Sphinx
    • Sphinx的匹配模式
    • Sphinx增量索引
  • 网站优化(页面静态化)
    • 页面静态化技术简介
    • 真静态
    • 伪静态
  • Laravel框架
    • Laravel概述
    • Laravel的安装
    • 目录分析
    • 控制器
    • 路由
    • 视图
    • HTTP请求与响应
    • 数据库
    • 模型
    • Laravel实用项
    • Redis数据库
    • 消息队列
  • Laravel +VueJS 在线直播平台
    • 前端界面开发
    • Laravel后台程序设计
    • Socket编程
    • Redis集群
    • ffmpeg转码
    • VOD点播
    • CDN加速
    • HLS技术
    • 在线教育平台实战
  • Canvas绘图
    • canvas概述
    • 绘图
    • echarts
    • svg
    • svg图标的使用
  • 移动Web开发(响应式设计)
    • 移动端屏幕介绍
    • 移动端浏览器介绍
    • 移动端操作系统介绍
    • Chrome模拟调试
    • 真机调试
    • Viewport
    • rem
    • 触屏touch事件
    • 手势封装
    • 媒体查询,设备尺寸划分
    • 主流响应式布局框架
    • 移动端框架
    • bootstrap
    • iScroll
    • swiper
    • fastclick
    • zepto
    • framework7
    • Canvas
    • Sass
    • vw
    • CSS预处理器LESS
  • 前端模块化
    • AMD
    • CMD
    • 模块化开发基本概念
    • 模块化演变过程分析
    • 设计规范
    • RequireJS
    • 淘宝的SeaJS
  • NodeJS详解
    • NodeJS历史
    • 发展
    • 特征与现状
    • ES6常用语法
    • 同步与异步
    • 环境安装
    • 文件操作
    • 网络操作
    • 模块化思想及操作
    • npm
    • 异步编程
    • Express
    • 工具模块
    • Web模块
    • 全局对象
  • Express框架
    • Express 简介
    • 安装
    • 请求与响应
    • 路由
    • 静态文件
    • 文件上传
    • Cookiet管理
  • AngularJS实战开发
    • 单页应用
    • MVC
    • 常用指令
    • 双向绑定和单向绑定
    • 模块
    • 控制器controller
    • $watch
    • 自定义指令
    • jqLite
    • 过滤器
    • 数据过滤
    • 服务$http $location
    • 前端路由
    • http拦截器
  • ReactJS实战开发
    • 快速入门
    • 虚拟DOM
    • 交互与动态UI
    • 数据渲染
    • JSX 语法
    • 组件开发
    • 组件复用
    • 生命周期
    • React操作dom元素
    • React绝对路由
    • webpack和gulp集成构建项目
    • flux
    • redux
    • state props context 等
    • 附加模块
    • 集成工具
    • 重定向组件
    • 代理方式进行跨域
    • 按需加载
  • 移动端项目 (全栈必备)
    • mui框架使用
    • 前端校验插件
    • echarts数据可视化
    • Ajax进度条组件
    • 模板引擎渲染
    • 图片上传插件
  • 后台项目 (全栈必备)
    • 后端渲染页面，使用会话技术实现登录，PHP操作MySQL数据库，开发接口，使用AJAX技术，模板引擎ArtTemplate完成页面功能的实现
  • vue项目 (全栈必备)
    • webpack
    • vue-cli
    • vuex
    • 打包发布
    • 组件开发
    • 权限管理
    • 外部接口调用
  • 微服务Docker (PHP进阶)
    • Docker概述
    • 为什么需要Docker
    • Docker环境开发流程
    • Docker安装与配置
    • Docker指令
    • DockerFile应用服务器
  • Swoole聊天室 (PHP进阶)
    • Swoole概述
    • Server
    • Client
    • Process
    • AsyncIO
    • Memory
    • HttpServer
    • WebSocket
    • PHP+Swoole聊天室
  • 微信开发（微擎/ EasyWechat）
    • 微信公众平台概述
    • 微信开发前期准备
    • 微信6大接收接口
    • 微信6大回复接口
    • 微信LBS接口开发
    • 微信机器人开发
    • 响应式设计
    • 微擎/EasyWechat
    • 微信综合案例
  • 微信小程序 (前端进阶)
    • 微信框架
    • 小程序界面设计
    • API接口设计
    • 小程序数据绑定
    • 小程序性能优化与实践
    • 小程序入门概念及演示
    • 小程序开发工具介绍与创建quick_start项目
    • 小程序文件结构
    • wxml
    • wxss
    • 常用组件(view,image,text,navigator,swiper等)
    • 小程序常用api
  • 微信公众号 (前端进阶)
    • 用JS-SDK技术做分享、拍照、支付、登录等功能。

知识点

• 前后端分离
  • 目前市面上都是前后端分离
    前 主要目的是 解耦 分离架构.
  • 前后端使用JSON交流,后端架构语言如何选择将和前端没有关系
  • 听说 TDD (Test-driven development，测试驱动开发) 可以改善代码的质量，我们便实施了 TDD；接着，听说 BDD (Behavior-driven development，行为驱动开发) 可以交付符合业务需求的软件，我们便实施了 BDD；后来，听说 DDD (Domain-driven design，领域驱动设计) 可以分离业务代码与基础代码，我们便实施了 DDD。今天，听说了前后端分离很流行，于是我们就实施了前后端分离——这就是传说中的 HDD（Hype-driven Development，热闹驱动开发）
  • 前后端只通过 JSON 来交流，组件化、工程化不需要依赖后端去实现。
  • 前后端分离和微服务一样，渐渐地影响了新的大型系统的架构。微服务和前后端分离要解决是类似的问题，解耦——可以解耦复杂的业务逻辑，解耦架构。可要是说相像吧，消息队伍和前后端便相似一些，通过传递数据的形式来解耦组件。
• TCP/IP 协议
  • TCP/IP协议簇是Internet的基础，也是当今最流行的组网形式。TCP/IP是一组协议的代名词，包括许多别的协议，组成了TCP/IP协议簇。其中比较重要的有SLIP协议、PPP协议、IP协议、ICMP协议、ARP协议、TCP协议、UDP协议、FTP协议、DNS协议、SMTP协议等。
• HTTP协议
  • 阅读 图解HTTP
• OSI参考模型
  • OSI（Open System Interconnect），即开放式系统互联。 一般都叫OSI参考模型，是ISO（国际标准化组织）组织在1985年研究的网络互联模型。该体系结构标准定义了网络互连的七层框架（物理层、数据链路层、网络层、传输层、会话层、表示层和应用层），即ISO开放系统互连参考模型。在这一框架下进一步详细规定了每一层的功能，以实现开放系统环境中的互连性、互操作性和应用的可移植性。

• web service 服务端应用

  • webService 三要素
    • SOAP、WSDL(WebServicesDescriptionLanguage)、UDDI(UniversalDescriptionDiscovery andIntegration)之一， soap用来描述传递信息的格式， WSDL 用来描述如何访问具体的接口， uddi用来管理，分发，查询webService 。具体实现可以搜索 Web Services简单实例 ; SOAP 可以和现存的许多因特网协议和格式结合使用，包括超文本传输协议（HTTP），简单邮件传输协议（SMTP），多用途网际邮件扩充协议（MIME）。它还支持从消息系统到远程过程调用（RPC）等大量的应用程序。SOAP使用基于XML的数据结构和超文本传输协议(HTTP)的组合定义了一个标准的方法来使用Internet上各种不同操作环境中的分布式对象。
    • SMTP 隶属于 TCP/IP协议

  • Web service是一个平*立的，低耦合的，自包含的、基于可编程的web的应用程序，可使用开放的XML（标准通用标记语言下的一个子集）标准来描述、发布、发现、协调和配置这些应用程序，用于开发分布式的互操作的应用程序。 [1]
    Web Service技术， 能使得运行在不同机器上的不同应用无须借助附加的、专门的第三方软件或硬件， 就可相互交换数据或集成。依据Web Service规范实施的应用之间， 无论它们所使用的语言、 平台或内部协议是什么， 都可以相互交换数据。Web Service是自描述、 自包含的可用网络模块， 可以执行具体的业务功能。Web Service也很容易部署， 因为它们基于一些常规的产业标准以及已有的一些技术，诸如标准通用标记语言下的子集XML、HTTP。Web Service减少了应用接口的花费。Web Service为整个企业甚至多个组织之间的业务流程的集成提供了一个通用机制。

  • web广泛用到的技术：
    . TCP/IP：通用网络协议，被各种设备使用

    . HTML（标准通用标记语言下的一个应用）：通用用户界面，可以使用HTML标签显示数据

    . .NET: 不同应用程序间共享数据与数据交换

    . Java：写一次可以在任何系统运行的通用编程语言，因为java具有跨平台特性

    . XML（标准通用标记语言下的一个子集）：通用数据表达语言，在web上传送结构化数据的容易方法

• Apache Nginx IIS >服务器软件

  • Apache
    • Apache是世界使用排名第一的Web服务器软件。它可以运行在几乎所有广泛使用的计算机平台上，由于其跨平台和安全性被广泛使用，是最流行的Web服务器端软件之一。它快速、可靠并且可通过简单的API扩充，将Perl/Python等解释器编译到服务器中。
    • Apache HTTP服务器是一个模块化的服务器，源于NCSAhttpd服务器，经过多次修改，成为世界使用排名第一的Web服务器软件。

  • Nginx

    • Nginx (engine x) 是一个高性能的HTTP和反向代理服务器，也是一个IMAP/POP3/SMTP服务器。Nginx是由伊戈尔·赛索耶夫为俄罗斯访问量第二的Rambler.ru站点（俄文：Рамблер）开发的，第一个公开版本0.1.0发布于2004年10月4日。
      其将源代码以类BSD许可证的形式发布，因它的稳定性、丰富的功能集、示例配置文件和低系统资源的消耗而闻名。2011年6月1日，nginx 1.0.4发布。
      Nginx是一款轻量级的Web 服务器/反向代理服务器及电子邮件（IMAP/POP3）代理服务器，并在一个BSD-like 协议下发行。其特点是占有内存少，并发能力强，事实上nginx的并发能力确实在同类型的网页服务器中表现较好，*使用nginx网站用户有：百度、京东、新浪、网易、腾讯、淘宝等。

  • IIS

    • iis是Internet Information Services的缩写，意为互联网信息服务，是由微软公司提供的基于运行Microsoft Windows的互联网基本服务。最初是Windows NT版本的可选包，随后内置在Windows 2000、Windows XP Professional和Windows Server 2003一起发行，但在Windows XP Home版本上并没有IIS。IIS是一种Web（网页）服务组件，其中包括Web服务器、FTP服务器、NNTP服务器和SMTP服务器，分别用于网页浏览、文件传输、新闻服务和邮件发送等方面，它使得在网络（包括互联网和局域网）上发布信息成了一件很容易的事。 [1]
      IIS的安全脆弱性曾长时间被业内诟病，一旦IIS出现远程执行漏洞威胁将会非常严重。远程执行代码漏洞存在于 HTTP 协议堆栈 (HTTP.sys) 中，当 HTTP.sys 未正确分析经特殊设计的 HTTP 请求时会导致此漏洞。 成功利用此漏洞的攻击者可以在系统帐户的上下文中执行任意代码，可以导致IIS服务器所在机器蓝屏或读取其内存中的机密数据。

• web server 网页端服务器

  • Web服务器一般指网站服务器，是指驻留于因特网上某种类型计算机的程序，可以向浏览器等Web客户端提供文档， [1] 也可以放置网站文件，让全世界浏览；可以放置数据文件，让全世界下载。目前最主流的三个Web服务器是Apache Nginx IIS。

• Weblogic Tomcat Jboss > 应用服务器

  • weblogic

    • WebLogic是美国Oracle公司出品的一个application server，确切的说是一个基于JAVAEE架构的中间件，WebLogic是用于开发、集成、部署和管理大型分布式Web应用、网络应用和数据库应用的Java应用服务器。将Java的动态功能和Java Enterprise标准的安全性引入大型网络应用的开发、集成、部署和管理之中。
      WebLogic是美商Oracle的主要产品之一，是并购BEA得来。是商业市场上主要的Java（J2EE）应用服务器软件（application server）之一，是世界上第一个成功商业化的J2EE应用服务器, 已推出到12c(12.2.1.3) 版。而此产品也延伸出WebLogic Portal，WebLogic Integration等企业用的中间件（但当下Oracle主要以Fusion Middleware融合中间件来取代这些WebLogic Server之外的企业包），以及OEPE(Oracle Enterprise Pack for Eclipse)开发工具。

  • Tomcat

    • Tomcat是Apache 软件基金会（Apache Software Foundation）的Jakarta 项目中的一个核心项目，由Apache、Sun 和其他一些公司及个人共同开发而成。由于有了Sun 的参与和支持，最新的Servlet 和JSP 规范总是能在Tomcat 中得到体现，Tomcat 5支持最新的Servlet 2.4 和JSP 2.0 规范。因为Tomcat 技术先进、性能稳定，而且免费，因而深受Java 爱好者的喜爱并得到了部分软件开发商的认可，成为目前比较流行的Web 应用服务器。
      Tomcat 服务器是一个免费的开放源代码的Web 应用服务器，属于轻量级应用服务器，在中小型系统和并发访问用户不是很多的场合下被普遍使用，是开发和调试JSP 程序的首选。对于一个初学者来说，可以这样认为，当在一台机器上配置好Apache 服务器，可利用它响应HTML（标准通用标记语言下的一个应用）页面的访问请求。实际上Tomcat是Apache 服务器的扩展，但运行时它是独立运行的，所以当你运行tomcat 时，它实际上作为一个与Apache 独立的进程单独运行的。

  • Jboss

    • 是一个基于J2EE的开放源代码的应用服务器。 JBoss代码遵循LGPL许可，可以在任何商业应用中免费使用。JBoss是一个管理EJB的容器和服务器，支持EJB 1.1、EJB 2.0和EJB3的规范。但JBoss核心服务不包括支持servlet/JSP的WEB容器，一般与Tomcat或Jetty绑定使用。

• RESTful API交互（如jQuery Ajax，Fetch API，ReactiveX）

  • Fetch API (新一代HTML请求方式)
  • ReactiveX (响应式编程)
    • ReactiveX 是一个基于一系列可观察的异步和基础事件编程组成的一个库。
      它继承观察者模式，支持序列数据或者事件。更高级的用法允许你将如下的一些抽象概念操作一起联合使用，比如低线程，同步，线程安全，数据并发，非阻塞I/O流。
      它通常被称为“函数响应式编程”，这是用词不当的。ReactiveX 可以是函数式的，可以是响应式的，但是和“函数响应式编程”是不同的概览。一个主要的不同点是“函数响应式编程”是对随着时间不停变化的值进行操作的，而ReactiveX是对超时提交产生的离散值上。
    • ReactiveX 简称 Rx，全称 Reactive Extensions，最初是LINQ的一个扩展，由微软的架构师Erik Meijer领导的团队开发，在2012年11月开源，Rx是一个编程模型，目标是提供一致的编程接口，帮助开发者更方便的处理异步数据流，Rx库支持.NET、JavaScript和C++，Java等几乎所有的编程语言。Rx扩展了观察者模式用于支持数据和事件序列，添加了一些操作符，它让你可以声明式的组合这些序列，而无需关注底层的实现：如线程、同步、线程安全、并发数据结构和非阻塞IO。
    • Reactive: 响应式
    • LINQ: Language Integrated Query的简称，它是集成在.NET编程语言中的一种特性。已成为编程语言的一个组成部分，在编写程序时可以得到很好的编译时语法检查，丰富的元数据，智能感知、 静态类型等强类型语言的好处。
      迭代器模式：核心思想是：通过定义遍历或查看对象中所有元素的方法的接口，并根据不同的类进行不同的方法实现相，已达到对类数据遍历的抽象以及对类内部如何获取数据的过程进行掩盖的目的。当于Java中的Iterator（迭代器）有它的继承接口如ListIterator和它的实现类等，我们在遍历Set、Map时，用到他们的Iterator，这样，他们具体怎么拿出数据的过程，我们不用知道。
    • 观察者模式：有时被称作发布/订阅模式，观察者模式定义了一种一对多的依赖关系，让多个观察者对象同时监听某一个主题对象。这个主题对象在状态发生变化时，会通知所有观察者对象，使它们能够自动更新自己。【下面RxJava的使用过程就是观察者模式的体现】
    • Rx = Observables【用于表示异步数据流】 + LINQ【用它的操作符查询异步数据流】 + Schedules【参数化异步数据流的并发处理】
    • Rx用到的设计模式精华：观察者模式、迭代器模式

• MVC & MVVM (设计模式)

  • 阅读 设计模式相关书籍
  • 针对不同语言有着不同定义.
  • 最典型的MVC就是JSP + servlet + javabean的模式
• I/O (输入输出)
  • I/O（input/output），即输入/输出端口。每个设备都会有一个专用的I/O地址，用来处理自己的输入输出信息。CPU与外部设备、存储器的连接和数据交换都需要通过接口设备来实现，前者被称为I/O接口，而后者则被称为存储器接口。存储器通常在CPU的同步控制下工作，接口电路比较简单；而I/O设备品种繁多，其相应的接口电路也各不相同，因此，习惯上说到接口只是指I/O接口。
• C/S & B/S
  • B/S
    • B/S结构（Browser/Server，浏览器/服务器模式），是WEB兴起后的一种网络结构模式，WEB浏览器是客户端最主要的应用软件。这种模式统一了客户端，将系统功能实现的核心部分集中到服务器上，简化了系统的开发、维护和使用。客户机上只要安装一个浏览器（Browser英 [‘braʊzə]美 [‘braʊzɚ]），如Netscape Navigator或Internet Explorer，服务器安装SQL Server、Oracle、MYSQL等数据库。浏览器通过Web Server 同数据库进行数据交互。
  • C/S
    • Client/Server结构(C/S结构)是大家熟知的客户机和服务器结构。它是软件系统体系结构，通过它可以充分利用两端硬件环境的优势，将任务合理分配到Client端和Server端来实现，降低了系统的通讯开销。目前大多数应用软件系统都是Client/Server形式的两层结构，由于现在的软件应用系统正在向分布式的Web应用发展，Web和Client/Server 应用都可以进行同样的业务处理，应用不同的模块共享逻辑组件；因此，内部的和外部的用户都可以访问新的和现有的应用系统，通过现有应用系统中的逻辑可以扩展出新的应用系统。这也就是目前应用系统的发展方向。
• SOA 面向服务架构
  • 面向服务的架构（SOA）是一个组件模型，它将应用程序的不同功能单元（称为服务）通过这些服务之间定义良好的接口和契约联系起来。接口是采用中立的方式进行定义的，它应该独立于实现服务的硬件平台、操作系统和编程语言。这使得构建在各种各样的系统中的服务可以以一种统一和通用的方式进行交互。
• J2EE 架构
  • J2EE（Java 2 Platform, Enterprise Edition）是一个为大企业主机级的计算类型而设计的Java平台。Sun微系统（与其工业伙伴一起，例如IBM）设计了J2EE，以此来简化在受客户级环境下的应用开发。由于创造了标准的可重用模块组件以及由于构建出能自动处理编程中多方面问题的等级结构，J2EE简化了应用程序的开发，也降低了对编程和对受训的程序员的要求。
  • J2EE是一套全然不同于传统应用开发的技术架构，包含许多组件，主要可简化且规范应用系统的开发与部署，进而提高可移植性、安全与再用价值。
    J2EE核心是一组技术规范与指南，其中所包含的各类组件、服务架构及技术层次，均有共同的标准及规格，让各种依循J2EE架构的不同平台之间，存在良好的兼容性，解决过去企业后端使用的信息产品彼此之间无法兼容，企业内部或外部难以互通的窘境。
    J2EE组件和“标准的” Java类的不同点在于：它被装配在一个J2EE应用中，具有固定的格式并遵守J2EE规范，由J2EE服务器对其进行管理。J2EE规范是这样定义J2EE组件的：客户端应用程序和applet是运行在客户端的组件；Java Servlet和Java Server Pages (JSP) 是运行在服务器端的Web组件；Enterprise Java Bean (EJB )组件是运行在服务器端的业务组件。
• 路由概念 (网络层)
• 微服务
  • 在介绍微服务时，首先得先理解什么是微服务，顾名思义，微服务得从两个方面去理解，什么是”微”、什么是”服务”， 微 狭义来讲就是体积小、著名的”2 pizza 团队”很好的诠释了这一解释（2 pizza 团队最早是亚马逊 CEO Bezos提出来的，意思是说单个服务的设计，所有参与人从设计、开发、测试、运维所有人加起来 只需要2个披萨就够了 ）。 而所谓服务，一定要区别于系统，服务一个或者一组相对较小且独立的功能单元，是用户可以感知最小功能集。
  • 微服务可以在“自己的程序”中运行，并通过“轻量级设备与HTTP型API进行沟通”。关键在于该服务可以在自己的程序中运行。通过这一点我们就可以将服务公开与微服务架构（在现有系统中分布一个API）区分开来。在服务公开中，许多服务都可以被内部独立进程所限制。如果其中任何一个服务需要增加某种功能，那么就必须缩小进程范围。在微服务架构中，只需要在特定的某种服务中增加所需功能，而不影响整体进程。
  • 为什么需要微服务
    在传统的IT行业软件大多都是各种独立系统的堆砌，这些系统的问题总结来说就是扩展性差，可靠性不高，维护成本高。到后面引入了SOA服务化，但是，由于 SOA 早期均使用了总线模式，这种总线模式是与某种技术栈强绑定的，比如：J2EE。这导致很多企业的遗留系统很难对接，切换时间太长，成本太高，新系统稳定性的收敛也需要一些时间。最终 SOA 看起来很美，但却成为了企业级奢侈品，中小公司都望而生畏。
• Spring (面向接口开源框架)
  • Spring是一个开放源代码的设计层面框架，他解决的是业务逻辑层和其他各层的松耦合问题，因此它将面向接口的编程思想贯穿整个系统应用。Spring是于2003 年兴起的一个轻量级的Java 开发框架，由Rod Johnson创建。简单来说，Spring是一个分层的JavaSE/EE full-stack(一站式) 轻量级开源框架。
• RESTful (软件架构风格)
  • 一种软件架构风格、设计风格，而不是标准，只是提供了一组设计原则和约束条件。它主要用于客户端和服务器交互类的软件。基于这个风格设计的软件可以更简洁，更有层次，更易于实现缓存等机制。
• 授权（如HTTP Basic、JWT等等）
  • JWT
    • Json web token (JWT), 是为了在网络应用环境间传递声明而执行的一种基于JSON的开放标准（(RFC 7519).该token被设计为紧凑且安全的，特别适用于分布式站点的单点登录（SSO）场景。JWT的声明一般被用来在身份提供者和服务提供者间传递被认证的用户身份信息，以便于从资源服务器获取资源，也可以增加一些额外的其它业务逻辑所必须的声明信息，该token也可直接被用于认证，也可被加密。
  • HTTP Basic
    • Basic Auth是开放平台的两种认证方式，简单点说明就是每次请求API时都提供用户的username和password。
  • OAuth
    • OAuth为用户资源的授权提供了一个安全、开放的标准，将会是以后开发平台普遍遵守的，目前Twitter、Sina微博、豆瓣、Google等都提供对它的支持。
• wget & curl Linux常用命令
  • curl
    • curl是利用URL语法在命令行方式下工作的开源文件传输工具。它被广泛应用在Unix、多种Linux发行版中，并且有DOS和Win32、Win64下的移植版本。
  • wget
    • wget 是一个从网络上自动下载文件的*工具，支持通过 HTTP、HTTPS、FTP 三个最常见的 TCP/IP协议 下载，并可以使用 HTTP 代理。”wget” 这个名称来源于 “World Wide Web” 与 “get” 的结合。

• php-fpm ∈ FastCGI (通用网关接口) (php处理进程的)

  • php-fpm

    • PHP-FPM(FastCGI Process Manager：FastCGI进程管理器)是一个PHPFastCGI管理器，对于PHP 5.3.3之前的php来说，是一个补丁包 [1] ，旨在将FastCGI进程管理整合进PHP包中。如果你使用的是PHP5.3.3之前的PHP的话，就必须将它patch到你的PHP源代码中，在编译安装PHP后才可以使用。
      相对Spawn-FCGI，PHP-FPM在CPU和内存方面的控制都更胜一筹，而且前者很容易崩溃，必须用crontab进行监控，而PHP-FPM则没有这种烦恼。

  • FastCGI

    • CGI全称是“通用网关接口”(Common Gateway Interface)，HTTP服务器与你的或其它机器上的程序进行“交谈”的一种工具，其程序一般运行在网络服务器上。 CGI可以用任何一种语言编写，只要这种语言具有标准输入、输出和环境变量。如php,perl,tcl等。
    • FastCGI像是一个常驻(long-live)型的CGI，它可以一直执行着，只要激活后，不会每次都要花费时间去fork一次(这是CGI最为人诟病的fork-and-execute 模式)。它还支持分布式的运算, 即 FastCGI 程序可以在网站服务器以外的主机上执行并且接受来自其它网站服务器来的请求。
      FastCGI是语言无关的、可伸缩架构的CGI开放扩展，其主要行为是将CGI解释器进程保持在内存中并因此获得较高的性能。众所周知，CGI解释器的反复加载是CGI性能低下的主要原因，如果CGI解释器保持在内存中并接受FastCGI进程管理器调度，则可以提供良好的性能、伸缩性、Fail- Over特性等等。
• Ruby 面向对象语言
  • Ruby，一种简单快捷的面向对象（面向对象程序设计）脚本语言，在20世纪90年代由日本人*(Yukihiro Matsumoto)开发，遵守GPL协议和Ruby License。它的灵感与特性来自于 Perl、Smalltalk、Eiffel、Ada以及 Lisp 语言。由 Ruby 语言本身还发展出了JRuby（Java平台）、IronRuby（.NET平台）等其他平台的 Ruby 语言替代品。Ruby的作者于1993年2月24日开始编写Ruby，直至1995年12月才正式公开发布于fj（新闻组）。因为Perl发音与6月诞生石pearl（珍珠）相同，因此Ruby以7月诞生石ruby（红宝石）命名。

• perl 一门脚本语言

  • Perl，一种功能丰富的计算机程序语言，运行在超过100种计算机平台上，适用广泛，从大型机到便携设备，从快速原型创建到大规模可扩展开发。 [1]
    Perl最初的设计者为拉里·沃尔（Larry Wall），于1987年12月18日发表。现在的版本为Perl 6，于2015年12月25日更新。
    Perl借取了C、sed、awk、shell 脚本语言以及很多其他程序语言的特性，其中最重要的特性是它内部集成了正则表达式的功能，以及巨大的第三方代码库CPAN。简而言之，Perl像C一样强大，像awk、sed等脚本描述语言一样方便，被Perl语言爱好者称之为“一种拥有各种语言功能的梦幻脚本语言”、“Unix 中的王牌工具”。
    Perl 一般被称为“实用报表提取语言”（Practical Extraction and Report Language），你也可能看到“perl”，所有的字母都是小写的。一般，“Perl”，有大写的 P，是指语言本身，而“perl”，小写的 p，是指程序运行的解释器。

• Java SE /EE /ME (java语言分类)

  • Java SE=Java Standard Edition
    Java EE=Java Enterprise Edition
    Java ME=Java Mobile Edition

    SE主要用于桌面程序,控制台开发(JFC)
    EE企业级开发(JSP,EJB)
    ME嵌入式开发(手机,小家电)

• less & sass CSS扩展语言

  • less
    • Less 是一门 CSS 预处理语言，它扩充了 CSS 语言，增加了诸如变量、混合（mixin）、函数等功能，让 CSS 更易维护、方便制作主题、扩充。Less 可以运行在 Node 或浏览器端。

  • sass

    • Sass 扩展了 CSS3，增加了规则、变量、混入、选择器、继承等等特性。Sass 生成良好格式化的 CSS 代码，易于组织和维护。
      SASS是对CSS3（层叠样式表）的语法的一种扩充，它可以使用巢状、混入、选择子继承等功能，可以更有效有弹性的写出Stylesheet。Sass最后还是会编译出合法的CSS让浏览可以使用，也就是说它本身的语法并不太容易让浏览器识别（虽然它和CSS的语法非常的像，几乎一样），因为它不是标准的CSS格式，在它的语法内部可以使用动态变量等，所以它更像一种极简单的动态语言。

    • SASS是Ruby语言写的，但是两者的语法没有关系。不懂Ruby，照样使用。只是必须先安装Ruby，然后再安装SASS。
      假定你已经安装好了Ruby，接着在命令行输入下面的命令：
      gem install sass
      然后，就可以使用了。

• JSP (java服务器页面)

  • JSP全名为Java Server Pages，中文名叫java服务器页面，其根本是一个简化的Servlet设计，它 [1] 是由Sun Microsystems公司倡导、许多公司参与一起建立的一种动态网页技术标准。JSP技术有点类似ASP技术，它是在传统的网页HTML（标准通用标记语言的子集）文件(.htm,.html)中插入Java程序段(Scriptlet)和JSP标记(tag)，从而形成JSP文件，后缀名为(*.jsp)。 用JSP开发的Web应用是跨平台的，既能在Linux下运行，也能在其他操作系统上运行。
    它实现了Html语法中的java扩展（以 <%, %>形式）。JSP与Servlet一样，是在服务器端执行的。通常返回给客户端的就是一个HTML文本，因此客户端只要有浏览器就能浏览。
    JSP技术使用Java编程语言编写类XML的tags和scriptlets，来封装产生动态网页的处理逻辑。网页还能通过tags和scriptlets访问存在于服务端的资源的应用逻辑。JSP将网页逻辑与网页设计的显示分离，支持可重用的基于组件的设计，使基于Web的应用程序的开发变得迅速和容易。 JSP(JavaServer Pages)是一种动态页面技术，它的主要目的是将表示逻辑从Servlet中分离出来。
    Java Servlet是JSP的技术基础，而且大型的Web应用程序的开发需要Java Servlet和JSP配合才能完成。JSP具备了Java技术的简单易用，完全的面向对象，具有平台无关性且安全可靠，主要面向因特网的所有特点。

• ES6 / CoffeScript / TypeScript 转译语言

  • ES6
    • ES6是ECMAScript标准十余年来变动最大的一个版本，其中添加了许多新的语法特性，既有大家耳熟能详的Promise，也有闻所未闻的Proxy代理和Reflection反射；既有可以通过转译器（Transpiler）等方式在旧版本浏览器中实现兼容的let、const、不定参数、展开运算符等功能，亦有无论如何都无法实现向前兼容的尾调用优化。深入理解ES6的特性对于所有JavaScript开发者而言至关重要，在可预见的未来，ES6中引入的语言特性会成为JavaScript应用程序的主流特性
  • coffeScript
    • CoffeeScript是一套JavaScript的转译语言，创建者 Jeremy Ashkenas 戏称它是- JavaScript 的不那么铺张的小兄弟。因为 CoffeeScript 会将类似 Ruby 语法的代码编译成 JavaScript，而且大部分结构都相似，但不同的是 CoffeeScript 拥有更严格的语法。
  • TypeScript
    • 是一种由微软开发的*和开源的编程语言。它是JavaScript的一个超集，而且本质上向这个语言添加了可选的静态类型和基于类的面向对象编程。安德斯·海尔斯伯格，C#的首席架构师，已工作于TypeScript的开发。2012年十月份，微软发布了首个公开版本的TypeScript，2013年6月19日，在经历了一个预览版之后微软正式发布了正式版TypeScript 0.9，向未来的TypeScript 1.0版迈进了很大一步。

• YAML语言

  • YAML是“YAML不是一种记语言”的外语缩写 [1] （见前方参考资料原文内容）；但为了强调这种语言以数据做为中心，而不是以置标语言为重点，而用返璞词重新命名。它是一种直观的能够被电脑识别的数据序列化格式，是一个可读性高并且容易被人类阅读，容易和脚本语言交互，用来表达资料序列的编程语言。
    它是类似于标准通用标记语言的子集XML的数据描述语言，语法比XML简单很多。

  • 使用场景

    • 脚本语言
      由于实现简单，解析成本很低，YAML特别适合在脚本语言中使用。列一下现有的语言实现：Ruby，Java，Perl，Python，PHP，OCaml，JavaScript，Go 除了Java 和 Go，其他都是脚本语言。

    • 配置文件
      YAML做配置文件也不错。写YAML要比写XML快得多(无需关注标签或引号)，并且比ini文档功能更强。
      比如Ruby on Rails的配置就选用的YAML。对ROR而言，这很自然，也很省事.
      由于兼容性问题，不同语言间的数据流转建议不要用YAML.

    • 序列化
      YAML比较适合做序列化。因为它是宿主语言数据类型直转的。

• DOM (网页文档对象)
  • 文档对象模型（Document Object Model，简称DOM），是W3C组织推荐的处理可扩展标志语言的标准编程接口。在网页上，组织页面（或文档）的对象被组织在一个树形结构中，用来表示文档中对象的标准模型就称为DOM。Document Object Model的历史可以追溯至1990年代后期微软与Netscape的“浏览器大战”，双方为了在JavaScript与JScript一决生死，于是大规模的赋予浏览器强大的功能。微软在网页技术上加入了不少专属事物，既有VBScript、ActiveX、以及微软自家的DHTML格式等，使不少网页使用非微软平台及浏览器无法正常显示。DOM即是当时蕴酿出来的杰作。

• ajax 前端处理方式

  • Ajax 即“Asynchronous Javascript And XML”（异步 JavaScript 和 XML），是指一种创建交互式网页应用的网页开发技术。
    Ajax = 异步 JavaScript 和 XML（标准通用标记语言的子集）。
    Ajax 是一种用于创建快速动态网页的技术。
    Ajax 是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术

  • XMLHttpRequest 是 AJAX 的基础。
    XmlHttpRequest 术语缩写为XHR，中文可以解释为可扩展超文本传输请求。

    XMLHttpRequest 对象可以在不向服务器提交整个页面的情况下，实现局部更新网页。

  • 简单来说就是网络请求,然后响应以后使用JavaScript操作DOM

• 数据格式（如JSON、XML）

  • JSON (轻量级的数据交换格式)
    • JSON(JavaScript Object Notation, JS 对象标记) 是一种轻量级的数据交换格式。它基于 ECMAScript (w3c制定的js规范)的一个子集，采用完全独立于编程语言的文本格式来存储和表示数据。简洁和清晰的层次结构使得 JSON 成为理想的数据交换语言。 易于人阅读和编写，同时也易于机器解析和生成，并有效地提升网络传输效率。
  • XML (工作几乎不用)
    • 可扩展标记语言，标准通用标记语言的子集，是一种用于标记电子文件使其具有结构性的标记语言。
      在电子计算机中，标记指计算机所能理解的信息符号，通过此种标记，计算机之间可以处理包含各种的信息比如文章等。它可以用来标记数据、定义数据类型，是一种允许用户对自己的标记语言进行定义的源语言。 它非常适合万维网传输，提供统一的方法来描述和交换独立于应用程序或供应商的结构化数据。是Internet环境中跨平台的、依赖于内容的技术，也是当今处理分布式结构信息的有效工具。早在1998年，W3C就发布了XML1.0规范，使用它来简化Internet的文档信息传输。

• 构建系统（gulp、grunt、webpack等等）

  • gulp & grunt (前端构建工具) & npm (NodeJS包管理和分发工具)
    • npm
      • NPM的全称是Node Package Manager ，是一个NodeJS包管理和分发工具，已经成为了非官方的发布Node模块（包）的标准。
        如果你熟悉ruby的gem，Python的pypi、setuptools，PHP的pear，那么你就知道NPM的作用是什么了。
        Nodejs自身提供了基本的模块，但是开发实际应用过程中仅仅依靠这些基本模块则还需要较多的工作。幸运的是，Nodejs库和框架为我们提供了帮助，让我们减少工作量。但是成百上千的库或者框架管理起来又很麻烦，有了NPM，可以很快的找到特定服务要使用的包，进行下载、安装以及管理已经安装的包。
    • gulp
      • Gulp基于Node.js的前端构建工具，通过Gulp的插件可以实现前端代码的编译（sass、less）、压缩、测试；图片的压缩；浏览器自动刷新，还有许多强大的插件可以在这里查找。比起Grunt不仅配置简单而且更容易阅读和维护
    • grunt
      • Grunt基于Node.js，安装之前要先安装Node.js。
      • 例如压缩、编译、单元测试、代码检查等，自动化工具可以减轻你的劳动，简化你的工作。
• 代码质量（如JSLint / ESLint / TSLint / CSLint）
  • JSLint & CSSLint & TSLint (静态代码分析) &CodeClimate(代码质量分析) (工程化)
    • JSLint
      • JSLint定义了一组编码约定，这比ECMA定义的语言更为严格。这些编码约定汲取了多年来的丰富编码经验，并以一条年代久远的编程原则 作为宗旨：能做并不意味着应该做。JSLint会对它认为有的编码实践加标志，另外还会指出哪些是明显的错误，从而促使你养成好的 JavaScript编码习惯。
    • CSSLint
    • TSLint
• 安全性（如跨域）
  • 跨域一词从字面意思看，就是跨域名嘛，但实际上跨域的范围绝对不止那么狭隘。具体概念如下：只要协议、域名、端口有任何一个不同，都被当作是不同的域。之所以会产生跨域这个问题呢，其实也很容易想明白，要是随便引用外部文件，不同标签下的页面引用类似的彼此的文件，浏览器很容易懵逼的，安全也得不到保障了就。什么事，都是安全第一嘛。但在安全限制的同时也给注入iframe或是ajax应用上带来了不少麻烦。所以我们要通过一些方法使本域的js能够操作其他域的页面对象或者使其他域的js能操作本域的页面对象（iframe之间）。
• 网页设计
  • 切页面
  • Flexbox布局
  • 网格布局（Grid Layout）
  • 响应式设计
  • 线框图（Wireframe）
  • 矢量图形 / 矢量图形动画（如SVG）
    • 可缩放矢量图形是基于可扩展标记语言（标准通用标记语言的子集），用于描述二维矢量图形的一种图形格式。它由万维网联盟制定，是一个开放标准。

• 常用前端三驾马车 react、vuejs、angularjs jQuery工具库

  • Node.js Javascript运行环境(runtime)
    • Node.js是一个Javascript运行环境(runtime)，发布于2009年5月，由Ryan Dahl开发，实质是对Chrome V8引擎进行了封装。Node.js对一些特殊用例进行优化，提供替代的API，使得V8在非浏览器环境下运行得更好。
      V8引擎执行Javascript的速度非常快，性能非常好。 [1] Node.js是一个基于Chrome JavaScript运行时建立的平台， 用于方便地搭建响应速度快、易于扩展的网络应用。Node.js 使用事件驱动， 非阻塞I/O 模型而得以轻量和高效，非常适合在分布式设备上运行数据密集型的实时应用。

  • jQuery JS框架

    • jQuery是一个快速、简洁的JavaScript框架，是继Prototype之后又一个优秀的JavaScript代码库（或JavaScript框架）。jQuery设计的宗旨是“write Less，Do More”，即倡导写更少的代码，做更多的事情。它封装JavaScript常用的功能代码，提供一种简便的JavaScript设计模式，优化HTML文档操作、事件处理、动画设计和Ajax交互。

  • React (Facebook内部项目)

    • React 起源于 Facebook 的内部项目，因为该公司对市场上所有 JavaScript MVC 框架，都不满意，就决定自己写一套，用来架设Instagram 的网站。做出来以后，发现这套东西很好用，就在2013年5月开源了。
    • React主要用于构建UI。你可以在React里传递多种类型的参数，如声明代码，帮助你渲染出UI、也可以是静态的HTML DOM元素、也可以传递动态变量、甚至是可交互的应用组件。
  • AngularJS
    • AngularJS [1] 诞生于2009年，由Misko Hevery 等人创建，后为Google所收购。是一款优秀的前端JS框架，已经被用于Google的多款产品当中。AngularJS有着诸多特性，最为核心的是：MVW（Model-View-Whatever）、模块化、自动化双向数据绑定、语义化标签、依赖注入等等。
      AngularJS 是一个 JavaScript框架。它是一个以 JavaScript 编写的库。它可通过 script 标签添加到HTML 页面。
      AngularJS 通过 指令 扩展了 HTML，且通过 表达式 绑定数据到 HTML。
      AngularJS 是以一个 JavaScript 文件形式发布的，可通过 script 标签添加到网页中。

• bootstrap 前端框架

  • Bootstrap，来自 Twitter，是目前很受欢迎的前端框架。Bootstrap 是基于 HTML、CSS、JavaScript 的，它简洁灵活，使得 Web 开发更加快捷。 [1] 它由Twitter的设计师Mark Otto和Jacob Thornton合作开发，是一个CSS/HTML框架。Bootstrap提供了优雅的HTML和CSS规范，它即是由动态CSS语言Less写成。Bootstrap一经推出后颇受欢迎，一直是GitHub上的热门开源项目，包括NASA的MSNBC（微软全国广播公司）的Breaking News都使用了该项目。 [2] 国内一些移动开发者较为熟悉的框架，如WeX5前端开源框架等，也是基于Bootstrap源码进行性能优化而来。

  • 在2017年8月下旬，Bootstrap四周岁之际，Bootstrap团队发布了Bootstrap 4 alpha版，4的最主要变化包括以下方面：

    从 Less 迁移到 Sass
    
    改进网格系统
    
    缺省弹性框支持
    
    Dropped wells, thumbnails, and panels for cards
    
    合并所有 HTML resets 到一个新的模块中：Reboot
    
    全新自定义选项
    
    不再支持 IE8
    
    重写所有的 JavaScript 插件
    
    改进工具提示和 popovers 的自动定位
    
    改进文档
    
    其他大量改进
    

• WeX5 多端部署工具

  • WeX5遵循Apache开源协议，完全开源免费，上百个组件框架，全部开放，可视化的组件框架，开发者可自定义组件，集成第三方组件，采用MVC设计模式，数据和视图分离，页面描述和代码逻辑分离，支持浏览器调试、真机调试、原生调试，等多种调试模式，开发者可掌握每一行代码。
    WeX5一直坚持采用H5+CSS3+JS标准技术，一次开发，多端任意部署，确保开发者成果始终通用、不受限制。WeX5的混合应用开发模式能轻松调用手机设备，如相机、地图、通讯录等，让开发者轻松应对各类复杂数据应用，代码量减少80%。同时开发出的应用能够媲美原生的运行体验。

• express & koa (nodeJS框架)

• swig (nodejs前端模板引擎)
  -

• 技能

  • CSS / CSS3 动画
  • 能封装业务组件和公用组件.
  • JavaScript 动画
  • Web字体嵌入
  • Icon 字体
  • 图形和图表
  • CSS / SVG Sprite（如glue）
  • DOM操作（如jQuery、React等等）

  • 模板引擎（如JSX、Handlebars、JSP、Mustache等等）

    • JSX

      • JSX是阵营的核心组成部分，它使用XML标记的方式去直接声明界面，界面组件之间可以互相嵌套。可以理解为在JS中编写与XML类似的语言，一种定义带属性树结构（DOM结构）的语法，它的目的不是要在浏览器或者引擎中实现，它的目的是通过各种编译器将这些标记编译成标准的JS语言。

    • JSP

      • JSP技术使用Java编程语言编写类XML的tags和scriptlets，来封装产生动态网页的处理逻辑。网页还能通过tags和scriptlets访问存在于服务端的资源的应用逻辑。JSP将网页逻辑与网页设计的显示分离，支持可重用的基于组件的设计，使基于Web的应用程序的开发变得迅速和容易。 JSP(JavaServer Pages)是一种动态页面技术，它的主要目的是将表示逻辑从Servlet中分离出来。
    • Handlebars
      • Handlebars 是 JavaScript 一个语义模板库，通过对view和data的分离来快速构建Web模板。它采用”Logic-less template”（无逻辑模版）的思路，在加载时被预编译，而不是到了客户端执行到代码时再去编译， 这样可以保证模板加载和运行的速度。Handlebars兼容Mustache，你可以在Handlebars中导入Mustache模板。
  • 调试
    • 浏览器调试
    • Debug工具
    • Wireshark / Charles抓包
    • 远程设备调试（如Chrome Inspect Devices）
    • 单元测试
    • 服务测试
    • UI测试
    • 集成测试
  • 版本管理（如git、svn）
  • PHP页面跳转、端口监听
  • 依赖管理
  • 包管理（如npm、bower）

  • 模块化（如CommonJS、WebPack）

    • commonJS
      • CommonJS API定义很多普通应用程序（主要指非浏览器的应用）使用的API，从而填补了这个空白。它的终极目标是提供一个类似Python，Ruby和Java标 准库。这样的话，开发者可以使用CommonJS API编写应用程序，然后这些应用可以运行在不同的JavaScript解释器和不同的主机环境中。在兼容CommonJS的系统中，你可以使用 JavaScript程序开发

    • WebPack

      • WebPack可以看做是模块打包机：它做的事情是，分析你的项目结构，找到JavaScript模块以及其它的一些浏览器不能直接运行的拓展语言（Scss，TypeScript等），并将其转换和打包为合适的格式供浏览器使用。

      • 其实Webpack和另外两个并没有太多的可比性，Gulp/Grunt是一种能够优化前端的开发流程的工具，而WebPack是一种模块化的解决方案，不过Webpack的优点使得Webpack在很多场景下可以替代Gulp/Grunt类的工具。
        Grunt和Gulp的工作方式是：在一个配置文件中，指明对某些文件进行类似编译，组合，压缩等任务的具体步骤，工具之后可以自动替你完成这些任务。

        Grunt和Gulp的工作流程
        Webpack的工作方式是：把你的项目当做一个整体，通过一个给定的主文件（如：index.js），Webpack将从这个文件开始找到你的项目的所有依赖文件，使用loaders处理它们，最后打包为一个（或多个）浏览器可识别的JavaScript文件。

      • Webpack的工作方式是：把你的项目当做一个整体，通过一个给定的主文件（如：index.js），Webpack将从这个文件开始找到你的项目的所有依赖文件，使用loaders处理它们，最后打包为一个（或多个）浏览器可识别的JavaScript文件。

  • 自动构建（脚本）

  • 前端工程化开发测试 打包 发布
  • 前端性能优化.
  • 在技术选型上,能给出你选择的方案是最优的数据说明
• 兼容性
  • 跨浏览器测试 （Chrome，IE，Firefox，Safari等等）
  • 跨平台测试（Windows、GNU/Linux，Mac OS等等）
  • 跨设备测试（Desktop，Android，iOS，Windows Phone）
  • 跨版本测试（同一个浏览器的不同版本）
• 正规表达式
  • 正规表达式由一个或多个字符型文字和/或元字符组成。在最简单的格式下，正规表达式仅由字符文字组成，如正规表达式 cat。它被读作字母 c，接着是字母 a 和 t，这种模式匹配 cat、location 和 catalog 之类的字符串。可以用它们验证数据、识别重复关键字的出现、检测不必要的空格、分析字符串、验证电话号码、邮政编码、电子邮件地址、社会安全号码、IP 地址、文件名和路径名等的格式，也可以查找如 HTML 标记、数字、日期之类的模式，或任意文本数据中符合任意模式的任何事物，并用其它的模式来替换它们。
• 性能与优化
  • 可用性
  • 性能测试（特别是移动Web
  • 加载优化（如gzip压缩、缓存等等
  • PageSpeed / Yslow 优化
    • Page Speed最 初是Google内部使用的改进网页设计的工具——它整合在Firefox的著名插件Firebug中。当用户运行Page Speed，可以立即获得如何改进网页载入速度的建议。
  • 压缩（如Minify、Uglify、CleanCSS等等）
    • CleanCSS是一个免费的CSS精简压缩工具，通过这个在线工具，可以将你的CSS文件压缩、优化成更精简，这将大大提高你的网站的载入速度。
• SEO
  • SEO
    • SEO（Search Engine Optimization）:汉译为搜索引擎优化。搜索引擎优化是一种利用搜索引擎的搜索规则来提高目前网站在有关搜索引擎内的自然排名的方式。SEO的目的理解是：为网站提供生态式的自我营销解决方案，让网站在行业内占据领先地位，从而获得品牌收益；SEO包含站外SEO和站内SEO两方面；SEO是指为了从搜索引擎中获得更多的免费流量，从网站结构、内容建设方案、用户互动传播、页面等角度进行合理规划，使网站更适合搜索引擎的索引原则的行为；使网站更适合搜索引擎的索引原则又被称为对搜索引擎优化，对搜索引擎优化不仅能够提高SEO的效果，还会使搜索引擎中显示的网站相关信息对用户来说更具有吸引力。
  • Sitemap（站点地图）
    • Sitemap 可方便网站管理员通知搜索引擎他们网站上有哪些可供抓取的网页。最简单的 Sitemap 形式，就是XML 文件，在其中列出网站中的网址以及关于每个网址的其他元数据（上次更新的时间、更改的频率以及相对于网站上其他网址的重要程度为何等），以便搜索引擎可以更加智能地抓取网站。
  • 页面静态内容生成
    • 静态页面，即静态网页，是实际存在的，无需经过服务器的编译，直接加载到客户浏览器上显示出来。静态页面需要占一定的服务器空间，且不能自主管理发布更新的页面，如果想更新网页内容，要通过FTP软件把文件DOWN下来用网页制作软件修改（通过fso等技术例外）。常见的静态页面举例：.html扩展名的、.htm扩展名的。
  • MicroData / MicroFormat
    • MicroData
      • Microdata 以自定义的词汇表（vocabulary）为中心，可以想象 HTML5 中所有的元素集合为一个词汇表，这个词汇表包含描述段落（section） 或文章（article）的元素，但是不包含描述事件（event） 或组织（organization）的元素。如果想在 Web 页面中表示一个事件或组织，则需要定义自己的词汇表，Microdata 允许你这么做，任何人都可以定义自己的词汇表，并且将其包含在自己的 Web 页面中。
    • MicroFormat
      • 微格式（Microformat），是通过语意相关让内容人机可读。网页上的允许的微格式数据包括事件、人物、地点等，它可以被其他的软件检测到，并提取出相应的信息，以及对信息进行索引、搜索、跨平台的参考，把这些信息以其他形式重复使用或组合。
  • 内部链接建设
• 面向对象 & 面向过程
• Laravel (PHP框架)
  • Laravel是一套简洁、优雅的PHP Web开发框架(PHP Web Framework)。它可以让你从面条一样杂乱的代码中解脱出来；它可以帮你构建一个完美的网络APP，而且每行代码都可以简洁、富于表达力。
    在Laravel中已经具有了一套高级的PHP ActiveRecord实现 – Eloquent ORM。它能方便的将“约束（constraints）”应用到关系的双方，这样你就具有了对数据的完全控制，而且享受到ActiveRecord的所有便利。Eloquent原生支持Fluent中查询构造器（query-builder）的所有方法。
• 个人博客 HEXO
• Java后台
  • Java基础
    • 阅读 Head First Java
    • 掌握DOS系统常用基本命令
  • 面向对象
    • 匿名对象
    • 继承
    • 多态
    • 抽象类
    • 接口
    • 内部类
  • 异常
    • 异常概述
    • 异常分类
    • 异常处理方案
    • 自定义异常
  • 集合
    • Collection接口下的常用集合
    • Map接口下的常用集合
    • 泛型
    • Iterator接口
  • I/O
    • 文件
    • 字节流
    • 字节缓冲流
    • 转换流
    • 序列化流
  • 多线程
    • 多线程运行原理
    • 多线程的实现方案
    • 线程生命周期
    • 线程同步
    • 线程池
  • 网络编程
    • 网络编程三要素
    • Socket原理机制
    • UDP传输
    • TCP传输
  • 反射
    • 类加载机制原理
    • 反射构造方法、字段、方法
    • Properties配置文件
  • XML
    • XML基本语法
    • XML的约束
    • XML的解析
    • BeanUtils的使用
  • 注解及动态代理
    • 注解的使用
    • 自定义注解
    • 动态代理Proxy
    • 类加载器
  • Mysql及JDBC开发
    • MySQL数据库
    • JDBC开发
    • 连接池
    • DBUtils
    • JDBC事物管理
  • 前端技术
    • html
    • css
    • js
    • jQuery
    • BootStrap
  • javaWeb核心
    • Tomcat
    • Servlet
    • Request和Response
    • Cookie和Session
    • jsp , el , jstl
    • Filter
    • Listener
  • ajax应用
    • ajax
    • jQuery ajax
    • EasyUI
  • linux和redis
    • Linux
    • Redis
  • javaWeb应用
    • 通用BaseServlet抽取
    • 缓存技术
    • JavaMail
    • 在线支付
    • 文件上传
    • Linux项目部署
    • 能够完成B/S结构网站开发，具备了真实环境的项目部署能力，能够完成中小型企业管理系统等传统项目的开发。
  • 框架
    • Hibernate5
    • Struts2
    • Spring
    • CRM项目
    • oracle
    • maven
    • mybatis框架
    • springmvc框架
    • Lucene、solr框架
  • 综合项目技能
    • 掌握Apache poi实现数据导入导出；
    • 掌握图形报表的生成技术，如JfreeChart、HighChart、AmChart
    • 掌握Apache Shiro技术
    • 掌握BRAC认证模型，有效进行用户权限管理
    • SSH框架整合
    • 使用maven进行项目的分模块开发
    • 页面布局采用前端主流jQuery插件easyui
    • 采用Redis实现缓存机制
    • 采用Oracle数据库
    • 引入WebService的CXF开发方式，并与Spring结合
    • 采用了BRAC认证模型，有效进行用户权限管理，同时加入当前流行的Shiro安全框架，从而高效快捷保证系统安全可靠
    • 加入了Quartz与spring整合实现定时任务调度
    • 引入JavaMail邮件机制，并实现Spring与JavaMail整合开发
    • 使用PowerDesigner建立企业级PDM模型
    • SSM框架整合
    • jsp+easyui视图层展现
    • KindEditor富文本编辑器应用
    • Freemarker模板引擎实现页面静态化
    • Dubbo分布式调用技术
    • Nginx反向代理
    • Redis缓存
    • Lucene/Solr全文检索解决方案
    • FastDFS图片服务器
    • ActivieMQ消息队列
    • maven项目管理
    • svn/git实现项目代码和文档管理
    • zookeeper分布式协调服务
    • mycat中间件