大前端(全栈)学习路线指南

第一部分:前端页面重构

一:pc端网站布局项目

html基础,css基础,css核心属性
css样式层叠,继承,盒模型
容器,溢出及元素类型
浏览器兼容与宽高自适应
定位,锚点与透明
图片整合
表格,css属性与滤镜

二:html5+css3基础项目

html5新增元素与属性
表单域增强元素
css3选择器
文字字体相关样式
css3位移与变形处理

css3 2d转换与过度动画
css3 3d 转换与关键帧动画
弹性盒模型
媒体查询
响应式设计

三 webapp页面布局项目

移动端页面设计规范
移动端切图
文字流式、控件弹性,图片等比例,特殊设计的100%布局

等比缩放布局
viewport/meta
rem/vw的使用
flexbox详解
移动web 特别样式处理(reset。1px,border,高清图片)

第二部分:JavaScript高级程序设计

一:原生JavaScript交互功能开发项目

基本语法
循环语句
函数与数组
string与date
bom与dom
事件
拖拽效果
cookie存储
正则表达式
ajax
面向对象基础
运动与游戏开发

二:面向对象进阶与es5/es6应用项目

promise/A+
设计模式(观察者模式)
原型链
构造函数
执行上下文栈与执行上下文
变量对象与活动对象
作用域链
闭包
this
es5
es6

三 javascript工具库自主研发项目

dom库
事件库
ajax库
原型和继承库

第三部分:pc端全栈项目开发

一:jQuery经典交互特效开发

时间轴特效
tab页面切换效果
网页定位导航特效
滑动门特效
焦点图轮播特效
导航条菜单效果
瀑布流特效
弹出层效果
倒计时效果
抽奖效果

二 HTTP协议,ajax进阶与php/java开发项目

http(s)协议详解
ajax进阶,跨域与defered
PHP基础
Java基础
MySQL基础
apache与nginx环境搭建与配置
接口的定义
mock数据
restful
前后端联调
前端安全(xss,csrf,json注入)

三:前端工程化与模块化应用项目

gulp
webpack
npm
git/svn
commonjs
AMD
CMD
es6模块化

四:pc端网站开发项目

大首页,列表页与详情页
展示与交互特效
搜索
登录与注册
购物车

五:pc端管理信息系统前端开发项目

Jqueryui 与jQuery easyui
bootstrap(ACE)
Highcharts/Echarts
ArtTemplate
velocity
smarty
云平台系统前端

第四部分:移动端项目开发

一: touch端项目

canvas基础知识
绘制矩形,圆弧,线段,曲线,渐变与图像
Canvas图表绘制案例
localstorage,sessionStorage与离线缓存
animate.css
Yo/Mui
touch.js
zepto.js
swipe
iscroll

二:微信场景项目

WeUI
swiper animate在微信场景项目中的使用
常见的页面布局
常见的交互与动画
实战项目

三:应用Angular+ionic开发webapp项目

Angular
基础知识(ng-app,modules,controller,watch)
指令
过滤器
表单
服务
其他
directive指令,组件
ng-router

Ionic
css components
ionic 基于angularjs扩展的交互指令介绍
blank模板安装
头部与尾部
内容区域
列表
区域滚动
下拉刷新与上拉加载
页签导航
背景层与旋转svg图标

loading效果
actionsheet效果
弹出窗口
弹出浮动层
底部满屏滑动窗口
ionic自带的swiper滑动
基于swiper组件的swiper滑动
页面导航切换
侧边栏菜单

四:应用vue.js开发webapp项目

vue.js基础
模块化
单文件组件
路由
与服务器通信
转态管理
单元测试
生产发布
基于vue.js企业级项目开发

五:应用react.js开发webapp

react.js基础
jsx语法
组件
flux+redux
react-router路由
动画效果
基于react企业级项目研发

第五部分:混合(Hybrid,RN)开发

一:微信小程序开发

微信小程序简介及从技术上和产品上的分析
构建第一个应用:创建项目,创建小程序实例与创建页面
框架,组件,API及工具详解
微信小程序项目开发

二:react native

react native 介绍
原生组件
异步执行
触摸事件处理
弹性盒flex和样式
兼容通用标准和扩展性
react native项目开发

三:各类混合应用开发

cordova/phpone gap
嵌入客户端(iOS ,android)
微信公众号接口jssdk开发
html5+

第六部分:nodejs全栈开发

一:nodejs基础

nodejs介绍
开发环境搭建
模块与包管理工具
commonjs模块
url网址解析
querystring参数处理
HTTP模块
http小爬虫
request方法
事件events模块
文件fs模块
stream流模块
路由初步
读取图片文件
路由改造
参数接受
async
npm scripts

二:mongodb

mongodb介绍与环境搭建
数据库常用命令
collection聚集集合
document文档操作
聚集集合查询
nodejs连接mongodb

三:express

express介绍
安装和创建基于express的项目
express4.1x初始化项目详解
路由简介
模板引擎ejs
express+mongodb项目实战

四:socket

socket简介和通讯流程
基于net模块实现socket
Websocket
socket.io

五:测试框架:

搭建框架
断言assert
项目测试
运行多个测试

你可能感兴趣的:(前端)