本书按照功能与模块划分,采用项目化的方式进行结构组织,由走进移动电商Web前端开发、构建移动电商前端页面结构、美化移动电商前端页面、灵动移动电商页面、优化移动电商页面动效代码、构建管理员管理模块、构建后台商品管理模块及双创项目组成。本书融入了行业、企业现行的主流技术,体现生产、服务真实技术和流程,适合任务驱动式教学、案例式教学及项目化教学。
带着理想和情怀来做一套教材
作为一家产教融合背景下应用技术型人才培养的校企合作单位,我们希望开发出一套能够满足应用技术型人才培养要求的优秀教材,希望开发出来的教材能达到或接近一个理想的标准,这个理想的标准就是“准、新、特、实、认”。我们一直带着这个“理想”的标准践行着教材编写与开发工作。
“准”,是教材最基本要求,理念、依据、技术细节都要准确;“新”,是教材的形式和内容都要有所创新,表现、框架和体例都要新颖、生动、有趣,具有良好的用户体验,让入耳目一新;“特”,要做出应用型的特色和企业的特色,体现出校企合作在面向行业、企业需求人才培养的特色;“实”,实用,切实可用,既要注重实践教学,又要注重理论知识学习,编写一套理实结合、平衡的实用型教材。最后的“认”,也可以说是最高标准,即编写一本教师、学生、业界都认可的教材。
我们的教材编写与开发团队来自企业,是一批具有多年工作经验和技术积累的企业工程师;同时,我们的企业工程师进入合作高校承担部分专业核心课、实践课的授课工作。这种双重工作背景让我们的教材开发团队既能把握行业、企业最新的技术发展趋势,以及最需要的技术和技能,又能了解到教育教学、学习成长的规律和经验,可以说,我们具备了“懂技术、懂教学”的教材开发团队基础。
从学校到企业,从企业到学校,我们深感做的不仅仅是一份工作,而是一项事业,是一项教书育人的事业。我们带着这份“教育情怀”认真对待教材开发的每个部分,从开发理念到总体设计以及每个细节,我们都靠团队协作,细心打磨,以专业的精神尽量克服知识和经验的不足。
以“学习者”为中心的理念进行教材设计
在企业里做产品的人都知道,产品要以用户为中心,抓住用户的痛点,为用户解决问题。那么课程的最终用户是谁呢?是学习者。教师借助教材来“传道、授业、解惑”,而“学习者”是要通过教材学到知识和技术,学以致用。我们在以“学习者”为中心的理念下进行了教材的创新设计,具体如下:
◆教材内容的组织强调以学习行为为主线,构建了“学”与“导学”的内容逻辑。“学”是主体内容,包括项目描述、任务解决及项目总结;“导学”是引导学生自主学习、独立实践的部分,包括项目引入、交互窗口、思考练习、拓展训练及双创项目。
◆情景化、情景剧式的项目引入。模拟一个完整的项目团队,采用情景剧作为项目开篇,并融入职业元素,让内容更加接近于行业、企业和生产实际。项目引入更多的是还原工作场景,展示项目进程,嵌入岗位、行业认知、融入工作的方法和技巧,更多地传递一种解决问题的思路和理念。
基础篇 Web前端开发基础
项目1:走进移动电商web前端开发
1.1 任务一:移动电商系统构建规划
1.1.1 认知移动电商系统
1.1.2 使用人群及主要功能分析
1.1.3 移动电商业务流程分析
1.1.4 移动电商系统页面设计
1.1.5 前端开发模式及技术方案
1.1.6 任务回顾
1.2 任务二:创建第一个页面
1.2.1 开发环境搭建
1.2.2 HTML文档结构
1.2.3 浏览器预览与调试
1.2.4 任务回顾
1.3 项目总结
1.4 拓展训练
项目2:构建移动电商前端页面结构
2.1 任务一:HTML构建文本类模块
2.1.1 目录结构及页面整体结构
2.1.2 标题、华丽分隔线、段落
2 1.3 列表
2.1.4 任务回顾
2.2 任务二:HTML构建图文并茂类页面
2.2.1 插入图片
2 2.2 相对路径
2.2.3 为图片添加标题
2.2.4 任务回顾
2.3 任务三:用表格呈现数据
2.3.1 插入表格
2.3.2 、、表格分区
2.3.3 跨行、跨列
2.3.4 任务回顾
2.4 任务四:制作表单类页面
2.4.1 用户登录表单
2.4.2 用户反馈表单
2.4.3 任务回顾
2.5 任务五:超级链接
2.5.1 创建超级链接
2.5.2 任务回顾
2.6 项目总结
2.7 拓展训练
项目3:美化移动电商前端页面
3.1 任务一:走进五彩CSS世界
3.1.1 认知CSS样式
3.1.2 CSS样式表的分类
3.1.3 CSS选择器
3.1.4 美化页面“footer”部分
3.1.5 任务回顾
3.2 任务二:制作商品列表页
3.2.1 商品展示列表
3.2.2 排序模块
3.2.3 关键字搜索模块
3.2.4 任务回顾
3.3 项目总结
3.4 拓展训练
进阶篇 页面动效开发
项目4:灵动移动电商页面
4.1 任务一:初识JldvaScnpt编程
4.1.1 浏览器如何处理Web页面
4.1.2 如何创建JavaSript脚本
4.1.3 制作一个下拉菜单
4.1.4 任务回顾
4.2 任务二:Javascnpt制作移动电商首页的交互
4.2.1 JavaScript制作焦点图切换动效
4.2.2 Javascritp修改HTML的DOM节点
4.2.3 Javascript制作频道模块选项卡动效
4.2.4 任务回顾
4.3 任务三:用户注册表单验证
4.3.1 用户注册袁单验证
4 3.2 任务回顾
4.4 项目总结
4.5 拓展训练
项目5:优化移动电商页面动效代码
5.1 任务一:jQLiery翻开web前端开发新篇章
5.1.1 jQuery脱颖而出
5.1.2 选择元素
5.1.3 创建第一个jQuery页面
5.1.4 事件方法、事件对象及事件传播
5.1.5 jQHery控制元素css样式
5.1.6 jQuery DOM遍历
5 1.7 jQuevy实现首页分类导航交互
5.1.8 任务回顾
5.2 任务二:jQuery制作商品详情页动效
5.2.1 jQuery动画特效
5.2.2 jQuery制作商品相册模块
5.2.3 jQueFy实现商品购买数量增减
5.2.4 相关推荐模块
5.2.5 jQuery操作DOM制作商品评论模块
5.2.6 任务回顾
5.3 项目总结
5.4 拓展训练
拓展篇 数据交互开发
项目6:构建管理员管理模块
6.1 任务一:Aiax与JsON
6.1.1 什么是Ajax?
6.1.2 Ajax初体验
6.1.3 JSON数据格式
6.1.4 jQHery Ajax重构管理员登录功能
6.1.5 “管理员管理”与“角色管理”之间页面切换
6.1.6 任务回顾
6.2 任务二:实现“管理员管理”数据交互
6.2.1 加载管理员列表
6.2.2 删除管理员
6.2.3 添加管理员
6.2.4 修改管理员
6.2.5 任务回顾
6.3 项目总结
6.4 拓展训练
项目7:构建后台商品管理模块
7.1 任务一:初识Backbone框架
7.1.1 Backbone框架
7.1.2 创建第一个Backbone页面
7.1.3 Backl3one事件管理
7.1.4 Backbone模型
7.1.5 Backbone模型集合
7.1.6 Backbone视图及模板使用
7.1.7 Backbone路由实现“商品管理”模块导航
7.1.8 任务回顾
7.2 任务二:Backbone实现“上架商品”模块
7.2.1 下架商品
7.2.2 删除商品
7.2.3 编辑商品
7.2.4 关键字搜索商品
7.2.5 任务回顾
7.3 项目总结
7.4 拓展训练
双创项目——大数据应用实践
参考文献