Nanodegree key: nd001-cn-basic
Version: 1.0.0
Locale: zh-cn
学习网页开发的基本原理和应用知识,完成一系列实战项目,为成为一名前端工程师打下基础!
Content
Part 01 : 欢迎
开始学习纳米学位课程,并了解如何充分利用优达学城的资源!
-
Module 01:
欢迎
-
Lesson 01: 欢迎
了解什么是纳米课程,什么是优等生社群以及如何最好的利用优达学城的资源
-
Part 02 : 培养开发者思维
在培养开发者思维这一课程中,你将会学习 Web 语言,Web 发展的历史,和我们作为 Web 开发者今天所处的位置。
-
Module 01:
项目 - 培养开发者思维
-
Lesson 01: 培养开发者思维
在这一课程中,你将了解什么是 Web 语言和 Web 发展的历史。在实战项目中,你需要写一封信给将来的你,关于你将会如何面对和克服在此纳米学位项目中可能会遇到的困难,并设置你的目标。
-
Part 03 : 博客文章
学习基础 HTML 知识,将一个博客文章原型转换成一个真的网页!
相关技能:HTML
-
Module 01:
HTML 语法
-
Lesson 01: HTML 语法
学习 HTML 基本语法,了解如何查询你想要使用的 HTML 元素。
- Concept 01: 课程简介
- Concept 02: HTML 结构 第 1 部分
- Concept 03: 创建第一个元素
- Concept 04: 环境
- Concept 05: 文本编辑器
- Concept 06: Sublime Text 使用教程
- Concept 07: Atom 使用教程
- Concept 08: Visual Studio Code 使用教程
- Concept 09: 浏览器
- Concept 10: 工作流
- Concept 11: 树
- Concept 12: HTML 和树
- Concept 13: 发现 Bug
- Concept 14: HTML 查找
- Concept 15: HTML 结构 第 2 部分
- Concept 16: 深入了解 HTML 文档
- Concept 17: 课程回顾
-
-
Module 02:
项目 - 博客文章
-
Lesson 01: 项目 - 博客文章
通过将博客文章原型转换为真实网站,练习 HTML 语法!
-
Part 04 : 动物交换卡
运用你的 CSS 知识,将设计原型转换为一个功能完全的网页!
相关技能:CSS,高效开发
-
Module 01:
CSS 语法
-
Lesson 01: CSS 语法
学习 CSS 的基础知识,以向网站添加样式,并获取使用浏览器开发者工具的经验。
- Concept 01: CSS 入门指南
- Concept 02: CSS 简介
- Concept 03: CSS 还是 HTML?
- Concept 04: CSS 规则集
- Concept 05: CSS 语法
- Concept 06: 注释
- Concept 07: 标签选择器
- Concept 08: 属性和选择器
- Concept 09: 使用选择器
- Concept 10: 使用 CSS 参考
- Concept 11: 开发者工具
- Concept 12: 不同浏览器上的开发者工具
- Concept 13: 使用开发者工具
- Concept 14: CSS 单位
- Concept 15: CSS 中的单位
- Concept 16: CSS 颜色
- Concept 17: 识别颜色
- Concept 18: 总结和习题集
-
Lesson 02: CSS 语法习题集
在此习题集中探索新的属性,并练习编写 CSS 和为网页添加样式。
-
-
Module 02:
项目 - 动物交换卡
-
Lesson 01: 项目 - 动物交换卡
通过你对 CSS 的了解,将设计原型转换为功能完备的网页!
-
Part 05 : 编写你的作品集网页
你将使用 HTML 和 CSS 将设计原型变为一个真正的网页。你将开发一个响应式网页,显示你在前端工程师纳米学位课程中将完成的每个实战项目的图像、描述和链接。
-
Module 01:
盒模型和语义元素
-
Lesson 01: 盒模型和语义元素
探索盒模型,了解为何 Web 上的所有内容都只是一个盒子。
- Concept 01: 猜想渲染游戏
- Concept 02: James 的解决方案
- Concept 03: Cameron 的解决方案
- Concept 04: 谁是赢家?
- Concept 05: 盒子无处不在
- Concept 06: Web 上的框
- Concept 07: 盒子模型
- Concept 08: 盒边界
- Concept 09: 更改盒
- Concept 10: 盒模型大小调整
- Concept 11: 容器
- Concept 12: 相对宽度
- Concept 13: 内联元素
- Concept 14: 语义元素
- Concept 15: 元素类型
- Concept 16: 元素调查
- Concept 17: 总结
-
Lesson 03: HTML,CSS 和盒子
跟着 Jessica Uelmen 和 Cameron Pittman,学习如何使用 HTML 和 CSS 来创建盒子模型布局。
- Concept 01: 第一步
- Concept 02: 探索 Web
- Concept 03: 页面结构
- Concept 04: HTML 小结
- Concept 05: 视觉样式设置
- Concept 06: HTML-CSS-DOM
- Concept 07: 盒子无处不在
- Concept 08: 盒子、网格和规则
- Concept 09: 将设计图分解为盒子
- Concept 10: 采访 Jacques
- Concept 11: 从盒子到 HTML
- Concept 12: 创建文件
- Concept 13: 添加样式
- Concept 14: 理解 CSS
- Concept 15: 确定样式
- Concept 16: 使用语义标记
- Concept 17: 再次学习盒子
- Concept 18: 放置盒子
- Concept 19: 添加图片
- Concept 20: 编码、测试、优化
- Concept 21: 更多关于开发者工具的信息
- Concept 22: 与设计原型比较
- Concept 23: 总结
-
Lesson 04: CSS 框架和响应式布局
继续了解网格设计,并设计出在桌面端和移动端都显示良好的网页。
- Concept 01: 简介
- Concept 02: 基于网格的设计
- Concept 03: 构建一个框架
- Concept 04: 响应式网页
- Concept 05: 定义布局
- Concept 06: 创建项目
- Concept 07: 从想法到代码
- Concept 08: 框架
- Concept 09: 负空间
- Concept 10: 溢出
- Concept 11: 特定媒体 CSS
- Concept 12: CSS 重设
- Concept 13: 你的问题之前已得到解决
- Concept 14: 应用框架
- Concept 15: 语义结构
- Concept 16: 调整页面
- Concept 17: 持续改进
- Concept 18: 编码、测试、优化、重复
- Concept 19: 结论
-
Lesson 05: Bootstrap 和其他框架
学习使用 Bootstrap——这一目前最流行的框架之一来流程化你的网页开发工作。
- Concept 01: 简介
- Concept 02: 网站结构
- Concept 03: 选择框架
- Concept 04: 阅读文档
- Concept 05: 选择功能
- Concept 06: 最小化 CSS 文件
- Concept 07: 探索框架
- Concept 08: 应用 Bootstrap 网格系统
- Concept 09: 响应式页面
- Concept 10: 使用 Bootstrap 排版
- Concept 11: 为你的网站自定义 CSS
- Concept 12: 看前端工程师如何做
- Concept 13: 看前端工程师如何做 2
- Concept 14: 交互性初探
- Concept 15: 自构建框架与现有框架
- Concept 16: 结论
-
-
Module 02:
响应式网页设计基础
-
Lesson 01: 响应式的重要性
跟着 Pete Lepage 和 Cameron Pittman 学习响应式设计的重要性,并设置好你的开发环境。
-
Lesson 02: 从小处开始
学习页面上的像素如何被渲染,以及对于不同的窗口大小,需要注意的事项。
- Concept 01: 定义窗口
- Concept 02: 像素、像素和更多像素!
- Concept 03: 像素化
- Concept 04: 计算 DPR
- Concept 05: 有何差别?
- Concept 06: 计算 CSS 像素
- Concept 07: 窗口的宽度如何?
- Concept 08: 设置窗口
- Concept 09: 大型固定宽度元素
- Concept 10: 元素的最大宽度
- Concept 11: 相对大小
- Concept 12: 点按目标大小
- Concept 13: 点按目标
- Concept 14: 从小处开始
- Concept 15: 项目第 1 部分
- Concept 16: 项目解决方案
- Concept 17: 小结
-
Lesson 03: 搭建
学习如何使用媒体查询来在你的页面上设置清楚的断点,并深入了解弹性框模块。
- Concept 01: 简介
- Concept 02: 基本媒体查询简介
- Concept 03: 添加基本媒体查询
- Concept 04: 添加基本媒体查询 2
- Concept 05: “下一步”媒体查询
- Concept 06: 应用了哪些样式?
- Concept 07: 断点
- Concept 08: 断点 第 2 部分
- Concept 09: 断点数量
- Concept 10: 选择断点
- Concept 11: 选择断点 2
- Concept 12: 选择一个断点
- Concept 13: 复杂媒体查询
- Concept 14: 应用了哪些样式?
- Concept 15: 网格
- Concept 16: 弹性框简介
- Concept 17: 弹性框容器
- Concept 18: 弹性项目
- Concept 19: 解构弹性框布局
- Concept 20: 解构弹性框布局
- Concept 21: 小结
-
Lesson 04: 常见响应模式
跟着 Cameron 学习常见的布局模式,以及如何在你自己的设计中使用这些布局。
-
-
Module 03:
响应式图片
-
Lesson 01: 准备工作
跟随 Sam Dutton 和 Cameron Pittman,了解响应式图片的重要性,并开始设置你的开发环境。
-
Lesson 02: 单位,格式和环境
学习什么让图片很大,特定 CSS 单位,栅格和矢量图片,以及设置优化工具。
- Concept 01: 调整大小简介
- Concept 02: 比特和像素
- Concept 03: 请求和盈利
- Concept 04: 相对大小
- Concept 05: 重要!优达学城前端反馈插件
- Concept 06: calc()
- Concept 07: 横向和纵向
- Concept 08: 鲜为人知的 CSS 单位
- Concept 09: 栅格和矢量
- Concept 10: 栅格或矢量横幅?
- Concept 11: 栅格和矢量识别
- Concept 12: 文件格式
- Concept 13: 找出差别
- Concept 14: 压缩、优化和自动化
- Concept 15: 图片优化环境
- Concept 16: 找出差别 2
- Concept 17: 图片压缩
- Concept 18: 项目第 1 部分
- Concept 19: 结束
-
Lesson 03: 标记图片
学习如何使用符号、图标字体和 SVG 技巧处理文本图像。
-
-
Module 04:
项目 - 编写你的作品集网页
-
Lesson 01: 项目 - 编写你的作品集网页
请根据提供的设计原型 PDF 文件,使用 HTML 和 CSS 再现该设计。
-
Part 06 : 电子简历
在掌握了前端工程师应有的技能后,你需要为他人留下深刻的第一印象。因此,你需要一份引人注目的简历,建立简历不仅有助于培养重要的技能,还可以使你能简单明了地向雇佣者说明你适合某一工作的具体原因。在完成纳米学位项目的过程中,你可以不断地更新简历中的技能和项目内容。
-
Module 01:
JavaScript 入门
-
Lesson 01: 什么是 JavaScript?
了解 JavaScript 的历史,开始使用 JavaScript 控制台编写代码。
-
Lesson 02: 数据类型和变量
学习使用 JavaScript 变量来表示真实世界的数据,知道如何区分各种数据类型。
- Concept 01: 数据类型入门
- Concept 02: 数字
- Concept 03: 注释
- Concept 04: 练习:第一个表达式 (2-1)
- Concept 05: 字符串
- Concept 06: 字符串连接
- Concept 07: 变量
- Concept 08: 练习:温度换算 (2-2)
- Concept 09: 字符串索引
- Concept 10: 转义字符串
- Concept 11: 比较字符串
- Concept 12: 练习:最喜欢的食物 (2-3)
- Concept 13: 练习:字符串全部相等 (2-4)
- Concept 14: 练习:都系起来了 (2-5)
- Concept 15: 练习:Yosa Buson (2-6)
- Concept 16: 布尔值
- Concept 17: 练习:Facebook 帖子 (2-7)
- Concept 18: Null、Undefined 和 NaN
- Concept 19: 等式
- Concept 20: 练习:分号!(2-8)
- Concept 21: 练习:我的姓名是什么?(2-9)
- Concept 22: 练习:出去吃饭了 (2-10)
- Concept 23: 练习:Mad Libs (2-11)
- Concept 24: 练习:一条常见的消息 (2-12)
- Concept 25: 第 2 节课总结
-
Lesson 03: 条件语句
了解如何使用条件语句向你的 JavaScript 程序添加逻辑。
- Concept 01: 条件语句入门
- Concept 02: 练习:流程图 (3-1)
- Concept 03: 代码流程图
- Concept 04: If...Else 语句
- Concept 05: Else If 语句
- Concept 06: 练习:偶数或奇数 (3-2)
- Concept 07: 练习:音乐团体 (3-3)
- Concept 08: 练习:谋杀之谜 (3-4)
- Concept 09: 更复杂的问题
- Concept 10: 逻辑运算符
- Concept 11: 逻辑 AND 和 OR
- Concept 12: 练习:查看余额 (3-5)
- Concept 13: 练习:冰激凌 (3-6)
- Concept 14: 练习:穿什么 (3-7)
- Concept 15: 高级条件语句
- Concept 16: 真值和假值
- Concept 17: 三元运算符
- Concept 18: 练习:了解食物链 (3-8)
- Concept 19: Switch 语句
- Concept 20: 传递
- Concept 21: 练习:学历 (3-9)
- Concept 22: 第 3 节课总结
-
Lesson 04: 循环
利用 JavaScript 循环,减少重复的代码,并自动执行重复性的任务。
- Concept 01: 循环入门
- Concept 02: While 循环
- Concept 03: While 循环的各个部分
- Concept 04: 练习:JuliaJames (4-1)
- Concept 05: 练习:99 瓶果汁 (4-2)
- Concept 06: 练习:倒计时,发射! (4-3)
- Concept 07: For 循环
- Concept 08: For 循环的各个部分
- Concept 09: 嵌套循环
- Concept 10: 递增和递减
- Concept 11: 练习:更改循环 (4-4)
- Concept 12: 练习: 纠正错误 1 (4-5)
- Concept 13: 练习:纠正错误 2 (4-6)
- Concept 14: 练习:阶乘!(4-7)
- Concept 15: 练习:找到我的座位 (4-8)
- Concept 16: 第 4 节课总结
-
Lesson 05: 函数
进入 JavaScript 函数的世界,学会利用函数的力量来简化和整理你的程序。
- Concept 01: 函数入门
- Concept 02: 函数示例
- Concept 03: 声明函数
- Concept 04: 函数总结
- Concept 05: 练习:哈哈大笑 1 (5-1)
- Concept 06: 练习:哈哈大笑 2 (5-2)
- Concept 07: 返回值
- Concept 08: 使用返回值
- Concept 09: 作用域
- Concept 10: 作用域示例
- Concept 11: 覆盖
- Concept 12: 全局变量
- Concept 13: 作用域总结
- Concept 14: 提升
- Concept 15: 提升总结
- Concept 16: 练习:构建三角形 (5-3)
- Concept 17: 函数表达式
- Concept 18: 函数表达式模式
- Concept 19: 函数表达式总结
- Concept 20: 练习:laugh (5-4)
- Concept 21: 练习:Cry (5-5)
- Concept 22: 练习:内嵌 (5-6)
- Concept 23: 第 5 节课总结
-
Lesson 06: 数组
了解如何使用数组在 JavaScript 程序中存储复杂数据。
- Concept 01: 数组入门
- Concept 02: 甜甜圈到代码
- Concept 03: 创建数组
- Concept 04: 访问数组元素
- Concept 05: 数组索引
- Concept 06: 练习:UdaciFamily (6-1)
- Concept 07: 练习:构建船员 (6-2)
- Concept 08: 练习:价格正确 (6-3)
- Concept 09: 数组属性和方法
- Concept 10: 长度
- Concept 11: Push
- Concept 12: Pop
- Concept 13: Splice
- Concept 14: 练习:彩虹的颜色 (6-4)
- Concept 15: 练习:魁地奇杯 (6-5)
- Concept 16: 练习:加入船员队伍 (6-6)
- Concept 17: 练习:查看文档 (6-7)
- Concept 18: 数组循环
- Concept 19: forEach 循环
- Concept 20: 练习:另一种类型的循环 (6-8)
- Concept 21: Map
- Concept 22: 练习:我有账单 (6-9)
- Concept 23: 数组中的数组
- Concept 24: 二维 Donut 数组
- Concept 25: 练习:嵌套数字 (6-10)
- Concept 26: 第 6 节课总结
-
Lesson 07: 对象
认识下一个 JavaScript 数据结构:对象。学习使用对象来存储复杂的数据和数组。
- Concept 01: 对象入门
- Concept 02: 代码中的对象
- Concept 03: 练习:Umbrella (7-1)
- Concept 04: 对象
- Concept 05: 对象字面值
- Concept 06: 命名规则
- Concept 07: 对象总结
- Concept 08: 练习:菜单内容 (7-2)
- Concept 09: 练习:银行账户 1 (7-3)
- Concept 10: 练习:银行账户 2 (7-4)
- Concept 11: 练习:Facebook 好友 (7-5)
- Concept 12: 练习:再次使用 Donut 示例 (7-6)
- Concept 13: 第 7 节课总结
-
Lesson 08: 准备工作
跟随 Cameron Pittman 和 James Williams 学习“电子简历”项目,了解一些基本的 JavaScript 语法。
- Concept 01: 欢迎参加课程!
- Concept 02: 简历项目简介
- Concept 03: 你的目标
- Concept 04: GitHub 代码库
- Concept 05: 下载代码库
- Concept 06: 有关 HTML 的注释
- Concept 07: 电子简历的 HTML
- Concept 08: 简历中的 CSS 和 JS
- Concept 09: 浏览器 JavaScript 控制台
- Concept 10: console.log()
- Concept 11: 编辑优达学城主页
- Concept 12: 使用 .append() 构建页面
- Concept 13: 亲自尝试 .append()
- Concept 14: 技术和技巧练习
-
Lesson 09: 数据类型
学习在 JavaScript 中表示数据的方法。你将获得处理字符串、布尔值、数组和 JSON 的经验。
- Concept 01: var loveJS = true;
- Concept 02: 保存并 .append() 数据
- Concept 03: string.replace()
- Concept 04: 组合使用 .replace() 和 .append()
- Concept 05: 格式化数据,生成简历标题
- Concept 06: 字符串操控练习 1
- Concept 07: 真/假
- Concept 08: var quiz = true;
- Concept 09: 数组
- Concept 10: .append()ing 数组练习
- Concept 11: 数组操作
- Concept 12: 字符串操控练习 2
- Concept 13: 对象字面值标记
- Concept 14: 档案练习
- Concept 15: 点和括号标记
- Concept 16: 练习使用对象
- Concept 17: 关于 JSON 的注释
- Concept 18: JSON
- Concept 19: 验证 JSON
- Concept 20: 验证 JSON 练习
- Concept 21: 所有简历部分
-
Lesson 10: 流程控制
学习如何在程序中使用常见的循环模式、条件迭代及添加逻辑流程。
- Concept 01: If 语句
- Concept 02: While 循环
- Concept 03: For 循环
- Concept 04: For-In 循环
- Concept 05: Work!
- Concept 06: 关于 For-In 循环的注释
- Concept 07: 函数
- Concept 08: 点击指标
- Concept 09: 收集点击位置
- Concept 10: Return 语句
- Concept 11: 名称国际化
- Concept 12: 封装
- Concept 13: 封装函数
- Concept 14: 独立研究
- Concept 15: 定制作品集
- Concept 16: 最终项目!
-
-
Module 02:
jQuery 入门
-
Lesson 01: 基础:DOM、$ 和选择器
跟随 Cameron Pittman 学习我们为什么使用 jQuery、“文档对象模型(DOM)”是什么,以及如何使用 jQuery 来抓取页面中的某些元素。
-
Lesson 02: 技巧:DOM 操作
既然你知道如何选择元素,学习如何使用 jQuery 来 操作 DOM 并更改页面的演示。
- Concept 01: jQuery 文档和你
- Concept 02: you.toggleClass() 练习
- Concept 03: 切换课程练习
- Concept 04: 更改属性练习
- Concept 05: 修改 CSS 练习
- Concept 06: 推送 HTML 和文本
- Concept 07: 收集值练习
- Concept 08: 移除 DOM 元素
- Concept 09: 添加 DOM 元素
- Concept 10: 添加子元素
- Concept 11: 构建 DOM 树结构!
- Concept 12: 通过 each() 进行迭代
- Concept 13: 为什么使用 jQuery
- Concept 14: 总结
- Concept 15: $(function)
-
Lesson 03: 使用 jQuery 的事件侦听器
跟随 Richard Kalehoff 学习如何使用 jQuery 处理单击、键盘输入、滚动和其他可能发生的常见事件。
- Concept 01: 使用 jQuery 的事件侦听简介
- Concept 02: 浏览器事件简介
- Concept 03: monitorEvents 练习
- Concept 04: 事件类型
- Concept 05: jQuery 事件侦听器的剖析
- Concept 06: jQuery 事件侦听器顺序练习
- Concept 07: jQuery 事件侦听器
- Concept 08: 事件对象
- Concept 09: Convenience 方法
- Concept 10: Convenience 方法练习
- Concept 11: jQuery 的多功能 .on 方法
- Concept 12: 事件代理
- Concept 13: 总结
-
-
Module 03:
项目 - 电子简历
-
Lesson 01: 项目准备
掌握前端 Web 开发人员的技能后,你希望给人留下完美的第一印象。你需要一份脱颖而出的简历。你制作的简历不仅会帮助你塑造重要的技能,还将易于向雇主展示你为何适合此工作。随着你通过纳米学位项目的进展, 可使用你的新技能和项目更新简历。
-
Part 07 (Elective) : 如何使用 Git 和 GitHub
学习如何使用版本控制系统,例如 Git 和 GitHub 保存和分享你的项目作品。
-
Module 01:
如何使用 Git 和 GitHub(选修)
-
Lesson 01: 操纵提交历史
学习几种不同的版本控制系统,认识 Git 为什么对程序员很重要。使用 Git 浏览一个现有项目的历史。
- Concept 01: 简介
- Concept 02: 课程概述
- Concept 03: 两个文件之间的差异
- Concept 04: 查找较大文件之间的差异
- Concept 05: 思考
- Concept 06: 思考:使用 diff 查找 bug
- Concept 07: 版本来自哪里?
- Concept 08: 思考:使用历史记录提高效率
- Concept 09: 代码 VCS 的特性
- Concept 10: Git 中的手动提交
- Concept 11: 创建概念图
- Concept 12: 使用 Git 浏览历史
- Concept 13: 概念图:diff
- Concept 14: 为每项合逻辑的更改进行一次提交
- Concept 15: 思考:手动提交
- Concept 16: 追踪多个文件
- Concept 17: 多文件 Git 提交
- Concept 18: 思考:多文件提交
- Concept 19: 采访 Jeffrey Middleton
- Concept 20: 安装 Git
- Concept 21: 克隆和探索版本库
- Concept 22: 思考:使用 Git 浏览历史
- Concept 23: 概念图:版本库、克隆、日志
- Concept 24: Git 错误和警告
- Concept 25: 检出代码的旧版本
- Concept 26: 思考:对版本控制的信心
- Concept 27: 采访 Lewis Kaneshiro
- Concept 28: Git 工作空间
- Concept 29: 在 Windows 上设置你的工作空间
- Concept 30: 在 Mac 上设置你的工作空间
- Concept 31: 思考:你想如何使用 Git?
- Concept 32: 第 1 课小结
-
Lesson 02: 创建和修改代码库
学习如何创建代码库,保存你的项目的不同版本。内容包括:暂存区、提交代码、建立分支和合并。
- Concept 01: 简介
- Concept 02: 版本库有何特点?
- Concept 03: 初始化版本库
- Concept 04: 检查新版本库
- Concept 05: 思考:初始化版本库
- Concept 06: 暂存区
- Concept 07: 概念图:初始化、添加、暂存区
- Concept 08: 思考:暂存区
- Concept 09: 写好提交信息
- Concept 10: 提交更改
- Concept 11: 再次学习 git diff
- Concept 12: 提交修复错误的更改
- Concept 13: 思考:提交大小
- Concept 14: 分支
- Concept 15: 创建分支
- Concept 16: 思考:何时使用分支
- Concept 17: 采访 Mike Wales
- Concept 18: 用分支协同工作
- Concept 19: 可访问性
- Concept 20: 再次学习分离的 HEAD
- Concept 21: 思考:利用图表直观显示内容
- Concept 22: 合并简单文件
- Concept 23: 使用原始版本合并文件
- Concept 24: 将 Coins 分支合并入 Master
- Concept 25: 通过命令行合并
- Concept 26: 思考:合并两个分支
- Concept 27: 合并冲突
- Concept 28: 检测冲突
- Concept 29: 更新 Easy Mode 分支
- Concept 30: 解决合并冲突
- Concept 31: 提交冲突解决
- Concept 32: 概念图:分支和合并
- Concept 33: 思考:自动合并与手动合并
- Concept 34: 采访 Jeffrey Middleton
- Concept 35: 小结
-
Lesson 03: 使用 GitHub 协作
练习使用 GitHub 来协作多开发者项目,在 GitHub 上创建和审阅 Pull Request。
- Concept 01: 简介
- Concept 02: GitHub 简介
- Concept 03: 创建 GitHub 账户
- Concept 04: 使版本库保持同步
- Concept 05: 添加远程版本库
- Concept 06: 在 GitHub 上编辑文件
- Concept 07: 思考:何时使用远程版本库
- Concept 08: 拉取更改
- Concept 09: 概念图:GitHub、Push、Pull、Remote
- Concept 10: 思考:手动与自动拉取
- Concept 11: Fork版本库
- Concept 12: Fork菜谱版本库
- Concept 13: 推送更改到菜谱版本库
- Concept 14: 思考:Fork、克隆和分支
- Concept 15: 协作引发冲突
- Concept 16: 修改 Chili 菜谱
- Concept 17: Sarah 修改 Chili 菜谱
- Concept 18: 模拟 Sarah 的更改
- Concept 19: 更新远程分支的本地副本
- Concept 20: 合并更改
- Concept 21: 快进合并
- Concept 22: 思考:远程分支的本地副本
- Concept 23: 创建拉取请求
- Concept 24: 更新拉取请求
- Concept 25: 思考:使用 GitHub 协作
- Concept 26: 冲突的更改
- Concept 27: 更新本地版本库
- Concept 28: 合并拉取请求
- Concept 29: 概念图:Fork、提取、拉取请求
- Concept 30: 采访 GitHub 的 Brent Beer
- Concept 31: 思考:何时使用独立的分支
- Concept 32: 修改历险记版本库
- Concept 33: 保持Fork最新
- Concept 34: 小结
-
Lesson 04: 使用 GitHub 搭建你的网站
学习使用 GitHub 来搭建一个网站,展示你的前端工程师纳米学位实战项目,并与朋友和家人分享。
-
Part 08 (Elective) : 选修材料
探索与网站开发相关的其他内容。
-
Module 01:
编写 README 文档
-
Lesson 01: 编写 README 文档
在本课程中,你将学习什么是文档,为何文档是开发流程的重要组成部分。你将学习如何编写结构清晰的 README,并运用在后续的项目中。学完本课程后,你将能够使用 Markdown 编写自己的 README 文件。
- Concept 01: 欢迎
- Concept 02: 什么是文档?
- Concept 03: 文档是写给谁看的?
- Concept 04: Nija 如何使用文档?
- Concept 05: 为什么 Art 应该为他的代码编写文档?
- Concept 06: README 简介
- Concept 07: README 的构成
- Concept 08: 记录不断扩大的代码库
- Concept 09: 用 Markdown 编写易读的 README 文档
- Concept 10: 基本 Markdown 语法
- Concept 11: 基本 Markdown 语法
- Concept 12: 更多 Markdown 语法
- Concept 13: 将一切记录在案!
-
-
Module 02:
Shell 讲习班
-
Lesson 01: Shell 讲习班
Unix shell 对所有领域的开发工程师来说都是一款强大的工具。在这节课,我们将快速讲解下在计算机上使用该工具的基本知识。
- Concept 01: 欢迎!
- Concept 02: Windows:安装 Git Bash
- Concept 03: 打开终端
- Concept 04: 你的第一个命令 (echo)
- Concept 05: 浏览目录 (ls, cd, ..)
- Concept 06: 当前工作目录 (pwd)
- Concept 07: 参数和选项 (ls -l)
- Concept 08: 整理文件 (mkdir, mv)
- Concept 09: 下载 (curl)
- Concept 10: 查看文件 (cat, less)
- Concept 11: 删除内容 (rm, rmdir)
- Concept 12: 搜索和管道 (grep, wc)
- Concept 13: Shell 和环境变量
- Concept 14: 起始文件 (.bash_profile)
- Concept 15: 控制 shell 提示符 ($PS1)
- Concept 16: 别名
- Concept 17: 继续学习!
-
-
Module 03:
JavaScript 和 DOM(文档对象模型)
-
Lesson 01: 文档对象模型
文档对象模型 (DOM) 让开发者可以与渲染的页面进行交互,并对其进行控制。在本课程中,你将学到 DOM 是如何构成的、节点和元素是什么,以及如何从 DOM 中选择项目。
-
Lesson 02: 使用 JavaScript 创建内容
静态毫无新意,所以我们要用 JavaScript 和 DOM 方法来创建新的页面内容、更新现有内容和删除内容。你还会学到如何查看和设置页面元素的样式。
-
Lesson 03: 使用浏览器事件
每当你与网页互动时,都会触发数百个事件。你将了解事件是什么、如何监听事件并对其作出回应、事件包含哪些数据,以及事件的各个阶段。
-
Lesson 04: 性能
学习如何测量你编写的代码,以确保其高效运行,以及重排和重绘如何影响性能。学习如何利用 JavaScript 事件循环来提高性能。
-
-
Module 04:
构建高转化率页面表单
-
Lesson 02: 高效输入(第二部分)
开始向输入中添加其他功能,例如自动填充和验证功能。
- Concept 01: 第 2 节课简介
- Concept 02: 突击练习 HS
- Concept 03: 标签元素
- Concept 04: 制作标签
- Concept 05: Luke W. 访谈(第三部分)
- Concept 06: 标签大小和位置
- Concept 07: 占位符
- Concept 08: 占位符
- Concept 09: 日历
- Concept 10: 日历
- Concept 11: 拼写错误
- Concept 12: 自动填充
- Concept 13: 自动填充
- Concept 14: 自动聚焦
- Concept 15: 使用以前的数据填充输入字段
- Concept 16: 验证
- Concept 17: 数字验证
- Concept 18: 验证一些输入
- Concept 19: Constraints Validation API
- Concept 20: 验证一些数据
- Concept 21: Luke W 访谈(第四部分)
- Concept 22: 第 2 节课总结
-
Lesson 03: 更快的表单
开始优化整个表单,而不是单个元素,以创建高转化率的网络表单。
- Concept 01: 第 3 节课简介
- Concept 02: 表单原则
- Concept 03: 来一场头脑风暴吧
- Concept 04: Luke W. 访谈(第五部分)
- Concept 05: 我只需查看我的付款信息
- Concept 06: 我还没打算注册
- Concept 07: 得出结论
- Concept 08: 在另一个设备上完成操作
- Concept 09: 表单速度越快,转化率越高
- Concept 10: Luke W 访谈(第六部分)
- Concept 11: 一项神奇的技巧
- Concept 12: 位置信息
- Concept 13: 构建结算表单
- Concept 14: Luke W 访谈(第七部分)
- Concept 15: 第 3 节课总结