Class Central is learner-supported. When you buy through links on our site, we may earn an affiliate commission.

XuetangX

Web前端交互和框架技术

Shaanxi Vocational and Technical College via XuetangX

Overview

随着科技高速发展,Web前端开发已是当今时代信息技术的重要组成部分,并不断与其他新技术紧密相连,推动时代发展与进步。本课程带领同学们循序渐进地掌握Web前端技术发开知识和主流框架技术,按照知识点将课程内容划分为8大项目,首先从走进Web前端交互与框架技术,打开学习认知大门,铺垫行业背景知识,随后通过实操案例依次引入,设置页面内容,定义页面样式,优化页面布局,展现页面动态交互,巧用框架开发 ,实操提升技能 ,求职就业拓展的学习内容,从使学习者更加轻松易懂的角度出发,每个知识点都设有案例引导,以及代码开发步骤分解,每个任务板块都设置了主题实操训练。其中,在巧用框架开发项目中,由具备多年开发经验的企业工程师,通过项目实操,带领同学们逐步掌握高效开发技巧,领悟框架技术对前端发展的巨大推动作用。在综合实战项目部分,由行业领军企业资深工程师,带领同学们实战训练企业项目,从项目需求分析,到各个系统模块的设计与实现进行详细讲解与操作,将企业文化、开发流程、开发思路与技巧,融会贯通在学习中,提高同学们的工程应用实践能力。课程思政渗透在整体教学中,核心价值为引领,立德树人润无声,引导学生们树立良好的职业素养,工匠精神,增强技术自信,文化自信,培养爱国情怀,民族自豪感和社会责任感。知识点合理分布贯穿,有利于同学们系统学习,这是一门具有丰富的操作性与实践性课程。

 

 

 

 

Syllabus

  • 项目一 走进Web前端交互和框架技术 任务一 打开学习认知
    • 1.1.1 Web前端交互和框架技术发展
  • 项目一 走进Web前端交互和框架技术 任务二 核心技术掌握
    • 1.2.1 统一资源定位符
    • 1.2.2 浏览器内核及引擎
  • 项目二 设置页面内容 任务一 HTML使用规范
    • 2.1.1 HTML文件结构及语法格式
  • 项目二 设置页面内容 任务二 HTML标记掌握
    • 2.2.1 HTML常用标记
    • 2.2.2 HTML超链接
    • 2.2.3 HTML5语义标记扩展
  • 项目二 设置页面内容 任务三 HTML表格与表单
    • 2.3.1 表格的结构与属性
    • 2.3.2 表单的结构与标记
    • 2.3.3 实操训练--古诗词网站注册信息页面
  • 项目三 定义页面样式 任务一 CSS选择器
    • 3.1.1 CSS特点与引用方式
    • 3.1.2 CSS基础选择器
    • 3.1.3 CSS复合选择器
    • 3.1.4 伪类与伪元素
  • 项目三 定义页面样式 任务二 CSS文本美化
    • 3.2.1 字体样式属性
    • 3.2.2 文本外观属性
    • 3.2.3 实操训练--中国古诗文页面
  • 项目三 定义页面样式 任务三 CSS盒子模型
    • 3.3.1 认识盒子模型
    • 3.3.2 盒子模型边距布局控制
    • 3.3.3 盒子模型边框属性
    • 3.3.4 盒子模型美化修饰
    • 3.3.5 实操训练--中国古诗词名家榜
  • 项目四 优化页面布局 任务一 CSS页面布局
    • 4.1.1 CSS浮动布局
    • 4.1.2 CSS定位布局
    • 4.1.3 背景样式
    • 4.1.4 颜色渐变
    • 4.1.5 弹性布局
    • 4.1.6 交叉轴
    • 4.1.7 排序控制
    • 4.1.8 实操训练--《中华诗词曲赋》网站主页布局设计
  • 项目四 优化页面布局 任务二 CSS响应式设计
    • 4.2.1 响应式设计认知
    • 4.2.2 虚拟视口与媒体查询
    • 4.2.3 媒体查询的逻辑条件
    • 4.2.4 响应计算与CSS相对长度单位
    • 4.2.5 实操训练--《中华诗词曲赋》网站的响应式设计
  • 项目五 展现页面动态交互 任务一 JavaScript认知
    • 5.1.1 JavaScript作用与使用方法
  • 项目五 展现页面动态交互 任务二 JavaScript语言结构
    • 5.2.1 运算符与表达式
    • 5.2.2 流程控制语句
    • 5.2.3 数据类型
    • 5.2.4 数组与DOM操作
  • 项目五 展现页面动态交互 任务三 JavaScript函数及对象
    • 5.3.1 函数的声明与调用
    • 5.3.2 箭头函数的作用及使用语法
    • 5.3.3 JavaScript中的对象
    • 5.3.4 实操训练--中国二十四节气文化轮播图
  • 项目六 巧用框架开发 任务一 Web前端框架技术认知
    • 6.1.1 Web前端框架发展及应用方向
    • 6.1.2 Web软件服务器认识
  • 项目六 巧用框架开发 任务二 Web前端框架实现高效开发
    • 6.2.1 jQuery框架
    • 6.2.2 Bootstrap框架
    • 6.2.3 VUE3框架
    • 6.2.4 uni-app框架
    • 6.2.5 实操训练--node.js环境搭建
    • 6.2.6 实操训练--VUE脚手架工具
  • 项目七 实操提升技能 任务一 综合项目实战
    • 7.1.1 校园党建管理系统需求分析实战
    • 7.1.2 校园党建管理系统用户角色创建实战
    • 7.1.3 校园党建管理系统登录模块实战
    • 7.1.4 校园党建管理系统新闻发布模块实战
    • 7.1.5 校园党建管理系统人员信息采集模块实战
    • 7.1.6 校园党建管理系统话题讨论模块实战
  • 项目八 求职就业技巧 任务一 求职就业
    • 8.1.1前端工程师的职业规划与成长路径
  • 期末考试

    Taught by

    YangLan, Liu Minjuan, HeYanNi, BiZhiChao, TianXueMei, Li Weize, Yuanyuan Ma, and YinJianJun

    Tags

    Reviews

    Start your review of Web前端交互和框架技术

    Never Stop Learning.

    Get personalized course recommendations, track subjects and courses with reminders, and more.

    Someone learning on their laptop while sitting on the floor.