飞雪团队

 找回密码
 立即注册
搜索
热搜: 活动 交友 discuz
查看: 54827|回复: 40

三个月从入门成为前端开发工程师系列视频教程

[复制链接]

6415

主题

6503

帖子

2万

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
21569
发表于 2016-6-20 17:34:18 | 显示全部楼层 |阅读模式
看到美观而设计感强的页面,怎样把它做出来?你的想法能不能变成别人眼前的现实?本课程以解决实际案例为导向,从切图开始,通过学习HTML标签与CSS设计,让你独立完成从效果图到网页的编码实现。下载地址:
游客,如果您要查看本帖隐藏内容请回复
2 J! F; U. r/ E. F' Z2 ?5 I

7 h6 A& A% s+ o' H0 W0 q# |) s; w6 a) A* {2 u' X4 `3 i
课程目录:
% d7 S0 ~# w  Z  n" h$ {0 }: i3 e
$ F1 h2 E* \- e页面制作" z, H; O. K2 p6 ?' R$ y3 U

0 U% |( k6 G# M) C- P* I
单元(章)课题(节)内容
1.Photoshop切图1.工具、面板、视图介绍切图概念、PS软件、PS的面板+常用工具+辅助视图。
2.测量、取色介绍并演示获取信息的方法:测量与取色
3.切图切图及切图的各种操作:隐藏文字(独立图层和非独立图层的不同操作方法)、png8和png24格式的切图方式、可平铺背景的切图方式及活动页的切图方式。
4.保存保存图片的操作,图片的几种保存格式(png8\png24\jpg)
5.修改、维护图片的修改与维护方式
6.图片优化与合并图片的使用方法,图片的优化合并方案(包括图片合并的排列方式及分类合并方案),图片兼容方案。
2.开发、调试工具1.开发、调试工具常用开发工具和调试工具的功能介绍与使用方法
3.HTML1.HTML简介简要介绍HTML发展历史、基本概念和文档声明等
2.标签介绍标签语法、各类标签及语义化
3.实体字符介绍常用实体字符
4.CSS1.CSS简介简要介绍CSS发展历史和基本概念、引入、基本语法
2.选择器基本选择器、属性选择器、伪类选择器、伪元素选择器、组合选择器、分组选择器、优先级、层叠、继承、!important
3.文本字体的基本设置、对齐方式、格式处理、高级设置等
4.盒模型盒模型概念、width、height、padding、margin(水平居中)、border、border-radius、overflow、box-sizing、box-shadow、outline
5.背景background基本属性、线性渐变、径向渐变
6.布局布局简介、display(水平居中、居中导航)、position(轮播头图、固定顶栏、遮罩、三行自适应布局)、float(两列布局)、flex(三行两列自适应)
7.变形2d变形方法、3d变形方法
8.动画过渡动画、帧动画$ A4 S9 J% T8 A/ M$ N8 Y
) _' X6 {/ e. x0 ~+ E  a$ U

9 a6 ?( G- X4 P, }: ?( m' A0 n4 Y
JavaScript程序设计  g2 R' W& D$ W) Q* Q% e# _8 ^

3 I2 e( u' k; ~  b
单元(章)课题(节)内容
1.基础篇1.JS介绍html、css --> js、hello  world、js特性、js&DOM、js历史
2.JS调试alert、console、展示chrome,ff,ie   调试器界面、以Chrome为例子,详细展示、展示面板作用、查找要调试的文件、设置断点,debugger、展示4个按钮,并展示响应的堆栈变化,watch
3.基本语法标识符、变量、直接量、关键字和保留字、语句、区分大小写、注释
4.基本类型Number(Interger, Float, NaN,Infinity)、String("",’’)、Boolean(true,false)、undefined(什么情况下为undefined)、null、Object({})、原始类型和引用类型的区别、typeof
5.运算符与表达式表达式、运算符、一元操作符(++,--, +,-)、算术运算(+、-、*、/、%)、关系运算(>、<、== 、!=、>=、<=、===、!==)、逻辑运算(!、&&、 ||)、位运算(&、|、^、~、<<、>>,>>>)、赋值运算(=)、条件运算(?、逗号运算(,)、对象运算符(new delete . [] instanceof)、运算符的优先级
6.语句语句、条件(if,swich)、循环(for/for in/ while/ do-while) lable break continue、异常 (try catch finally)、with、label
7.数值Math(abs、round、ceil、floor、max、min、random、其他)、parseInt、parseFloat、Number、NaN、toFixed
8.字符串定义、length、charAt(下标)、indexOf、lastIndexOf、search、match、replace、substring、slice、substr、split、toLowerCase、toUpperCase、连接、转字符串(+、String())、转义
9.对象定义、创建(new、直接量)、属性、方法、constructor、toString、valueOf、hasOwnproperty
10.数组定义、创建(new、直接量)、length、indexOf、forEach、【(reverse、sort)、(push、unshift)、(shift、pop)、splice】、【slice、concat、join、reduce】
11.函数函数定义(函数声明、函数表达式、函数参数、return)、函数调用、arguments、作用域、对象方法、构造函数、function.prototype
12.Datenew Date(), Date.getXXXX(),格式化, Date.setXXX(),求天数, Date.getTime()
13.RegExp字符类、元字符、量词、多选分支、转义、捕获、匹配模式
14.JSON定义,JSON.parse(),JSON.stringify
2.进阶篇1.类型进阶参数识别应用场景(字符串和数组的例子)、类型识别方法:typeof,constructor,Object.prototype.toString,instanceof和其他(Array.isArray, isNaN)、类型转换(所有的方法+隐式转换)
2.函数进阶函数定义(函数声明、函数表达式、new Function)、arguments(callee、转数组)、apply、call、bind、高阶函数(AOP、curry、记忆函数)
3.原型原型(概念)、构造函数、原型链(原型链,原型链查找,原型链修改,原型链删除,Function.prototype,Object.prototype)、原型继承
4.变量作用域动态作用域和静态作用域,词法环境(函数作用域),作用域链,with/catch
5.闭包闭包举例、闭包原理、闭包应用
6.面向对象JS面向对象
3 d0 a9 E, Z; P' G
2 C- _# \( I$ v$ @9 ~
; e. I0 |6 w6 t( l/ Z7 x
. h3 a( J$ ^' T( ]: N8 Q
DOM编程艺术
5 [9 ?( n: I8 g% t( r1 i2 W# r* e5 E" N$ }+ m5 J# f5 q. F

/ I( v7 l" B( C
单元(章)课题(节)内容
1.基础篇1.文档树dom范围,节点类型,节点关系,getElements,children,sibling
2.节点操作getElementById,getElementsByClassName,getElementsByTagName,querySelector(All),createElement,innerHTML,innerText,appendChild,insertBefore,insertAdjacentELement(HTML),removeChild,replaceChild
3.属性操作getAttribute,setAttribute,datalist
4.样式操作className   ,classList,style,cssText
5.事件capture、target、bubble,事件注册、取消事件注册、事件触发;事件对象;阻止事件冒泡、阻止默认事件,DOM事件分类及继承关系;鼠标事件类型、鼠标事件对象、鼠标事件举例;键盘、输入、焦点事件类型、事件对象、事件举例;其他常用事件介绍与举例,事件代理原理、事件代理例子、事件代理优缺点
6.数据通信http协议中的头信息字段及应用
ajax(xhr2,跨域),CORS,jsonp
7.数据存储cookie
localStorage、sessionStorage
8.动画setInterval,   setTimeout, requestAnimationFrame(),幻灯片切换动画实例
9.音频、视频audio和video常用属性、方法和事件
10.canvas介绍canvas基本用法和常用API
11.BOMScreen,navigator,location,history对话框,窗体互操作,load,beforeunload,scroll,resize等事件
12.表单操作input、select、textarea
! A: A( `5 c3 V0 L7 z" {/ j- G  表单验证属性、接口、事件、应用
9 b! l9 l3 Y5 Z% H7 f  表单提交属性、接口、事件、应用( A* U2 t7 S4 a) B! Q3 m8 I' d
  案例讲解表单的综合应用
13.列表操作列表的显示、添加、删除、更新、选择操作,面向视图编程和面向数据编程方式的实现对比
2.实践篇1、组件实践弹窗组件和轮播组件
; d8 j" M( N6 {
2 s) j. \/ r2 |3 v' y/ V
+ D) k/ V4 c& H7 ^

  z8 y% b' h, _% G1 W页面架构
" N4 J6 t8 N, D! M4 G# i2 l$ e  V  S& V
单元(章)课题(节)内容
1.CSS   Reset1.CSS ResetCSS Reset方法和应用
2.布局解决方案1.居中布局各种居中布局的多种解决方案和优缺点
2.多列布局自适应布局、等分布局、等高布局的多种解决方案和优缺点
3.全屏布局全屏布局的多种解决方案和优缺点
3.响应式1.响应式响应式原理和实现
4.页面优化1.页面优化页面优化方法
5.规范与模块化1.规范为什么要制定规范、如何为团队制定页面规范
2.模块化什么是模块、为什么要模块化、如何实现页面模块化4 s7 h8 I# T- R' L; P% K

$ O( u: b% X  f5 b6 C
( S( x- Y5 e, E: k3 z/ M

: [' T8 E6 t! P+ f: V+ h产品前端架构
3 I0 a. u& @. R2 G! E+ k8 G! S, Q- m; g' q
单元(章)课题(节)内容
1.协作流程1.WEB系统介绍典型的基于MVC的WEB系统架构
2.角色定义根据对技能掌握程度的差异定义不同的角色
3.协作流程介绍前后端分离并行开发模式流程
4.职责说明通过流程总结各角色的职责
2.接口设计1.概述介绍为什么要制定协议、哪几部分需要制定协议、各协议定义的范围
2.接口规范页面摘要定义的内容、范例解说,同步数据协议定义的内容、范例解说,异步接口协议定义的内容、范例解说
3.规范应用协议的实际应用:构建项目工程、模拟同步数据、模拟异步接口
4.本地开发前端如何利用协议及导出的模拟数据独立进行开发
3.版本管理1.简介VCS、本地、中央、分布式
2.分支模型分支的抽象理解、分支模型和产品级模型介绍
3.git历史、介绍、安装
4 s0 H3 d/ r* B6 {$ ^  help、config、status、init、add、rm、commit、log、diff、File级别的checkout、reset$ ^( R7 J- D/ [, M
    branch、checkout、reset、reset-vs-checkout、merge、rebase、rebase-vs-merge、tag* x3 t$ m4 H/ q# b: |5 e
  push、remote、fetch、pull、clone
4.技术选型1.模块化反模式-对象字面量-IIFE-命名空间-依赖管理,Commonjs/module、AMD-ES6、MODULE、Systemjs
2.框架解答框架与库的What\Why\How,Dom、通信、模板、utility、组件、路由、MV*架构.分别推荐解决方案
5.开发实践1.系统设计案例介绍说明,案例讲解根据交互分解系统,案例讲解如何提取接口,如何输出接口规范,案例讲解通过输出规范构建项目工程,包括结构、数据
2.系统实现案例讲解组件的提取、实现、封装,案例讲解数据层、控制层的代码实现
3.测试发布案例讲解测试环境配置、测试数据构建、测试工具使用,案例讲解系统发布、优化配置5 b4 Z, a. m5 @. D1 }& _
) V  c0 ?9 p3 R7 M! E# a( ^* ^

0 p# [9 H. t- V5 w6 Q6 c1 `2 y  ~* C
) A2 R7 Q8 s3 @% m: ?( Q) k3 x
回复

使用道具 举报

0

主题

138

帖子

435

积分

VIP会员

积分
435
发表于 2016-10-31 23:35:25 | 显示全部楼层
回复 支持 1 反对 0

使用道具 举报

0

主题

160

帖子

429

积分

VIP会员

积分
429
发表于 2016-6-21 08:35:43 | 显示全部楼层
很好的资料,谢谢分享
回复 支持 反对

使用道具 举报

0

主题

270

帖子

780

积分

VIP会员

积分
780
发表于 2016-6-21 14:25:43 | 显示全部楼层
回复

使用道具 举报

0

主题

386

帖子

817

积分

VIP会员

积分
817
发表于 2016-6-22 11:23:07 | 显示全部楼层
回复

使用道具 举报

0

主题

242

帖子

1033

积分

VIP会员

积分
1033
发表于 2016-7-3 19:55:55 | 显示全部楼层
想看看专业的是咋做前端的
回复 支持 反对

使用道具 举报

0

主题

128

帖子

222

积分

VIP会员

积分
222
发表于 2016-7-4 10:48:36 | 显示全部楼层
三个月从入门成为前端开发工程师系列视频教程
回复 支持 反对

使用道具 举报

0

主题

166

帖子

461

积分

VIP会员

积分
461
发表于 2016-7-7 22:19:57 | 显示全部楼层
回复 支持 反对

使用道具 举报

0

主题

310

帖子

884

积分

VIP会员

积分
884
发表于 2016-8-8 11:49:20 | 显示全部楼层
三个月从入门成为前端开发工程师系列视频教程
回复 支持 反对

使用道具 举报

0

主题

125

帖子

208

积分

VIP会员

积分
208
发表于 2016-10-27 12:29:33 | 显示全部楼层
向前端开发工程师进军
回复 支持 反对

使用道具 举报

懒得打字嘛,点击右侧快捷回复 【右侧内容,后台自定义】
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

手机版|飞雪团队

GMT+8, 2025-4-26 02:48 , Processed in 0.079687 second(s), 26 queries , Gzip On.

Powered by Discuz! X3.4

Copyright © 2001-2021, Tencent Cloud.

快速回复 返回顶部 返回列表