/Web-Front

前端自学:HTML、CSS、ECMAScript、Nodejs、MongoDB、Vue、微信小程序等

Primary LanguageJavaScript

Web-Front

前端学习

实操项目展示:TanGuangZhi/Web-Front: 前端自学

工作流/学习流

20211026200644

第一阶段

2021.10.11~2021.11.07

阶段目标: 熟练运用 HTML 和 CSS 样式属性完成页面的布局和美化,基于 PSD 原稿完成页面像素级还原布局和设计。

第一周

2021.10.11~2021.10.16 知识要点:PhotoShop 抠图、切片技巧、pxcook 标注、Web 前端开发环境、HTML 常用标签、表单元素、CSS 基础样式使用、字体图标设计

课程目标:熟练运用 HTML 和 CSS 样式属性完成页面的布局和美化,基于 PSD 原稿完成页面像素级还原布局和设计。

日更:

  1. 掌握 Photoshop 对图形的操作
  2. 熟悉基本 HTML 语法
  3. 使用 table 布局绘制界面,如百度首页,简易计算器,电影播放等
  4. 学习基本 css 样式,内联/外联样式等

第二周

2021.10.18~2021.10.23 知识要点:选择器、选择器权重计算样式继承、IFC、BFC、常见布局技巧、CSS 新增特性

课程目标:熟练掌握网页布局技巧,熟悉 CSS3 新特性完成页面设计和优化

日更:

  1. 学习 CSS 选择器与一些进阶 CSS 属性
  2. 块级、行级元素和转化
  3. 学习盒子布局、padding、margin
  4. 学习 css 选择器、浮动
  5. 学习相对定位、绝对定位、固定等布局样式

第三周

2021.10.25~2021.10.30 知识要点:弹性布局、transtion 过渡、tranform 动画、Animation 动画使用技巧,2D 动画和 3D 动画设计,预编译 CSS 技术:Sass 基础知识、响应式布局原理、BootStrap 源码分析以及插件的运用

课程目标:理解动画的原理,掌握动画的基础设计并完成网页动态效果设计,熟练掌握网页布局,能够熟练使用 Less、Sass 完成项目开发,深入了解 BootStrap 设计,

日更:

  1. 学习 HTML5 与语义化标签
  2. 学习 CSS 渐变
  3. 学习 Flex 弹性布局框架
  4. 学习 css 动画,兼容性设置
  5. 2d,3d,sass 学习

第四周

2021.11.01~2021.11.06 知识要点:使用 HTML、CSS、LESS、SASS 等技术完成蜗牛家具网项目实战

课程目标:通过项目掌握第一阶段 HTML、CSS 的内容、完成 PC 端页面设计和后台管理系统页面设计

日更:

  1. 学习 animation 动画
  2. 学习响应式布局
  3. 学习 EM 和 REM,Bootstrap . .
  4. 结业项目

第二阶段

2021.11.08~2021.12.18 知识要点:Nodejs 的概念开发环境的搭建,变量、流程语句以及算法的训练,数组的使用以及排序算法。函数化编程优化代码

课程目标:掌握 JavaScript 的基本概念,完成常见的算法的练习,完成计算器、AYM 程序的设计。

第一周

2021.11.08 ~2021.11.13 知识要点:JavaScript 发展及组成、变量、数据类型、控制结构、数组和函数

课程目标:了解 JavaScript 的发展,熟练掌握 JavaScript 的基础知识

日更:

  1. 学习 js 历史,变量
  2. 学习 js 变量,运算符
  3. 学习 js 顺序结构、if 结构
  4. 学习循环结构。
  5. 学习数组、数组常用 api

第二周

2021.11.15 ~2021.11.20 第一周拖堂了...这一周还是上一周的目标。

  1. 练习数组,对象,数组对象等引用格式
  2. 学习函数,箭头函数
  3. 学习定时器

第三周

2021.11.29 ~2021.12.04 知识要点:BOM操作和DOM操作学习,熟练使用jQuery框架开发,代码优化。

课程目标:熟练使用BOM的各种对象、熟练操作DOM的对象

  1. 了解DOM
  2. 学习DOM操作,如获取DOM,操作DOM等
  3. 学习创建节点,操作节点,正则表达式
  4. 学习Javascript事件

第四周

2021.12.06~2021.12.11

猜:JQuery,BOM等

第五周

2021.12.13~2021.12.18 知识要点:jQuery实战、H5相关api、以及canvas 绘图技术使用、随机数据模拟

第三阶段

2021.12.20~ 知识要点:Nodejs环境搭建,npm的概念介绍、 常用api的使用,基于expree框架完成服务端接口设计,mongodb完成数据库的设计,表关联设计

课程目标:基于Nodejs和模版引擎完成整站的开发,完成前后端业务的设计。

第一周

2021.12.20~

知识要点:JavaScript高级特性:闭包、作用域链、递归、IIFE、立即函数等,ES6新增特性:解构赋值、扩展运算符,箭头函数等

课程目标:掌握高级特性概念以及运用,熟练使用ES6的新增特性