From 28627ba2c9702b5760a5272a0de7639ce74564cd Mon Sep 17 00:00:00 2001 From: SI_Xiaolong Date: Tue, 23 Aug 2022 22:53:52 +0800 Subject: [PATCH 01/90] Create README.zh-cn.md --- translations/README.zh-cn.md | 112 +++++++++++++++++++++++++++++++++++ 1 file changed, 112 insertions(+) create mode 100644 translations/README.zh-cn.md diff --git a/translations/README.zh-cn.md b/translations/README.zh-cn.md new file mode 100644 index 00000000..bcacbbb6 --- /dev/null +++ b/translations/README.zh-cn.md @@ -0,0 +1,112 @@ +[![GitHub license](https://img.shields.io/github/license/microsoft/Web-Dev-For-Beginners.svg)](https://github.com/microsoft/Web-Dev-For-Beginners/blob/master/LICENSE) +[![GitHub contributors](https://img.shields.io/github/contributors/microsoft/Web-Dev-For-Beginners.svg)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/graphs/contributors/) +[![GitHub issues](https://img.shields.io/github/issues/microsoft/Web-Dev-For-Beginners.svg)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/issues/) +[![GitHub pull-requests](https://img.shields.io/github/issues-pr/microsoft/Web-Dev-For-Beginners.svg)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/pulls/) +[![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](http://makeapullrequest.com) + +[![GitHub watchers](https://img.shields.io/github/watchers/microsoft/Web-Dev-For-Beginners.svg?style=social&label=Watch&maxAge=2592000)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/watchers/) +[![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-Beginners.svg?style=social&label=Fork&maxAge=2592000)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/network/) +[![GitHub stars](https://img.shields.io/github/stars/microsoft/Web-Dev-For-Beginners.svg?style=social&label=Star&maxAge=2592000)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/stargazers/) + +[![Open in Visual Studio Code](https://img.shields.io/static/v1?logo=visualstudiocode&label=&message=Open%20in%20Visual%20Studio%20Code&labelColor=2c2c32&color=007acc&logoColor=007acc)](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners) + +# 初学者的 Web 开发课程 + +微软的Azure云倡导者很高兴地提供一个为期12周的24课时的课程,所有关于JavaScript、CSS和HTML的基础知识。每节课都包括课前和课后测验、完成课程的书面说明、解决方案、作业等。我们以项目为基础的教学方法使你能够边学边做,这是一种证明新技能能够“扎根”的方法。 + +**衷心感谢我们的作者Jen Looper、Chris Noring、Christopher Harrison、Jasmine Greenaway、Yohan Lasorsa、Floor Drees、和手绘艺术家Tomomi Imura!** + +# 你是学生吗? + +利用以下资源开始: + +- [Student Hub page](https://docs.microsoft.com/en-gb/learn/student-hub?WT.mc_id=academic-13441-cxa) 在这个页面,你会发现初学者资源、学生包,甚至是获得免费证书券的方法。这是一个你想加入书签并不时检查的页面,因为我们至少每月都会更换内容。 +- [Microsoft Student Learn ambassadors](https://studentambassadors.microsoft.com?WT.mc_id=academic-13441-cxa) 加入一个由学生大使组成的全球社区,这可能是你进入微软的途径。 + + +# 入门 + +> **对于老师**, 我们已经有了一些关于如何使用该课程的[建议](for-teachers.zh-cn.md)。 我们希望您能在我们的[讨论区](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)提出反馈意见! + +> **[对于学生](https://aka.ms/student-page)**,如果你想自己使用这个课程,你可以fork整个repo并自己完成练习,从课前测验开始,然后阅读课程并完成其余活动。尽量通过理解课程来创建项目,而不是复制解决方案的代码;不过,这些代码可以在每节课中的`/solutions`目录中找到。另一个方法是与朋友组成一个学习小组,一起学习这些内容。对于进一步的学习,我们建议通过[Microsoft Learn](https://docs.microsoft.com/users/jenlooper-2911/collections/jg2gax8pzd6o81?WT.mc_id=academic-13441-cxa) 和观看下面提到的视频。 + +[![Promo video](../images/web.gif)](https://youtube.com/watch?v=R1wrdtmBSII) + +Gif by [Mohit Jaisal](https://linkedin.com/in/mohitjaisal) + +> 🎥 点击上面的图像,观看关于该项目和创造该项目的人们的视频! + +## 教学宗旨 + +在建立这个课程时,我们选择了两个教学宗旨:确保它是基于项目的,并包括频繁的测验。在本系列课程结束时,学生将建立一个打字游戏,一个虚拟的花艺瓶,一个“绿色”浏览器扩展,一个“太空入侵者”类型的游戏,以及一个商业类型的银行应用程序,并将学会JavaScript、HTML和CSS的基础知识,以及当今网络开发人员的现代工具链。 + +> 🎓 你可以把这个课程的前几节课作为Microsoft Learn的[学习路径](https://docs.microsoft.com/learn/paths/web-development-101?WT.mc_id=academic-13441-cxa)来学习! + +通过确保内容与项目相一致,这个过程对学生来说更有吸引力,对概念的保持也会增强。我们还编写了几节关于JavaScript基础知识的入门课程来介绍概念,并配以“[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript?WT.mc_id=academic-13441-cxa)”的视频教程集,其中一些作者为这个课程做出了贡献。 + +此外,课前的低风险测验确定了学生对学习一个主题的意向如何,而课后的第二次测验则确保了学生知识的进一步保留。这个课程的设计是灵活而有趣的,可以全部或部分地学习。这些项目开始时很简单,到12周的周期结束时变得越来越复杂。 + +虽然我们有意避免介绍JavaScript框架,以便在采用框架之前集中于作为一个Web开发者所需的基本技能,但是完成本系列课程的一个好的去处就是通过“[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs?WT.mc_id=academic-13441-cxa)”来学习Node.js。 + +> 查看我们的[行为准则](../CODE_OF_CONDUCT.md)、[贡献](../CONTRIBUTING.md)和[翻译](../TRANSLATIONS.md)指南。我们欢迎你的建设性的反馈! + +## 每一课都包括: + +- 可能的手绘笔记 +- 可能的补充视频 +- 课前预习小测验 +- 书面课程 +- 对于基于项目的课程,关于如何建立项目的分步指南 +- 知识点检查 +- 一个挑战 +- 补充阅读 +- 作业 +- 课后小测验 + +> **关于测验的说明**: 所有的测验都包含在[这个应用程序](https://ashy-river-0debb7803.1.azurestaticapps.net/)中,总共有48个测验,每个测验三个问题。它们在课程中被链接,但测验应用程序可以在本地运行;按照`quiz-app`文件夹中的指示操作。它们正逐渐被本地化。 + +## 课程 + +| | 项目名称 | 教授概念 | 学习目标 | 课程链接 | 课程作者 | +| :-: | :------------------------------------------------------: | :--------------------------------------------------------------------: | ----------------------------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------------------------------------------------------------------------: | :---------------------: | +| 01 | 入门篇 | 编程语言和行业工具介绍 | 了解大多数编程语言背后的基本支撑,以及帮助专业开发人员完成工作的软件。 | [编程语言和工具介绍](/1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine | +| 02 | 入门篇 | GitHub的基础知识,包括与一个团队合作 | 如何在你的项目中使用GitHub,如何在代码库中与他人合作 | [GitHub介绍](/1-getting-started-lessons/2-github-basics/README.md) | Floor | +| 03 | 入门篇 | 无障碍性 | 学习网络无障碍的基本知识 | [无障碍基础知识](/1-getting-started-lessons/3-accessibility/README.md) | Christopher | +| 04 | JS基础 | JavaScript数据类型 | JavaScript数据类型的基础知识 | [数据类型](/2-js-basics/1-data-types/README.md) | Jasmine | +| 05 | JS基础 | 函数和方法 | 了解管理应用程序逻辑流的函数和方法 | [函数和方法](/2-js-basics/2-functions-methods/README.md) | Jasmine and Christopher | +| 06 | JS基础 | 用JS做出决定 | 学习如何使用决策方法在你的代码中创建条件 | [做出决定](/2-js-basics/3-making-decisions/README.md) | Jasmine | +| 07 | JS基础 | 数组和循环 | 在JavaScript中使用数组和循环来处理数据 | [数组和循环](/2-js-basics/4-arrays-loops/README.md) | Jasmine | +| 08 | [花艺瓶](/3-terrarium/solution/README.md) | 实践中的HTML | 构建HTML以创建一个在线花艺瓶,重点是构建一个布局 | [HTML简介](/3-terrarium/1-intro-to-html/README.md) | Jen | +| 09 | [花艺瓶](/3-terrarium/solution/README.md) | 实践中的CSS | 构建CSS,为在线花艺瓶设计样式,重点是CSS的基础知识,包括使页面具有响应性 | [CSS简介](/3-terrarium/2-intro-to-css/README.md) | Jen | +| 10 | [花艺瓶](/3-terrarium/solution/README.md) | JavaScript闭包,DOM操作 | 构建JavaScript,使水族馆成为一个拖/放界面,重点是闭包和DOM操作 | [JavaScript闭包,DOM操作](/3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen | +| 11 | [打字游戏](/4-typing-game/solution/README.md) | 建立一个打字游戏 | 学习如何使用键盘事件来驱动你的JavaScript应用程序的逻辑 | [事件驱动编程](/4-typing-game/typing-game/README.md) | Christopher | +| 12 | [绿色浏览器扩展](/5-browser-extension/solution/README.md) | 与浏览器协作 | 了解浏览器是如何工作的,它们的历史,以及如何为浏览器扩展的第一批元素提供支架 | [关于浏览器](/5-browser-extension/1-about-browsers/README.md) | Jen | +| 13 | [绿色浏览器扩展](/5-browser-extension/solution/README.md) | 构建一个表单,调用一个API,并在本地存储中存储变量 | 构建你的浏览器扩展的JavaScript元素,使用存储在本地存储中的变量调用API | [API、表单和本地存储](/5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen | +| 14 | [绿色浏览器扩展](/5-browser-extension/solution/README.md) | 浏览器中的后台进程,网络性能 | 使用浏览器的后台进程来管理扩展的图标;了解网络性能和一些优化 | [后台任务和性能](/5-browser-extension/3-background-tasks-and-performance/README.md) | Jen | +| 15 | [太空游戏](/6-space-game/solution/README.md) | 用JavaScript进行更高级的游戏开发 | 学习使用类和组合的继承以及Pub/Sub模式,为建立游戏做准备。 | [高级游戏开发简介](/6-space-game/1-introduction/README.md) | Chris | +| 16 | [太空游戏](/6-space-game/solution/README.md) | 在Canvas上绘图 | 了解用于在屏幕上绘制元素的Canvas API | [在Canvas上绘图](/6-space-game/2-drawing-to-canvas/README.md) | Chris | +| 17 | [太空游戏](/6-space-game/solution/README.md) | 在屏幕上移动元素 | 了解元素如何利用软轴坐标和Canvas API获得运动效果 | [移动元素](/6-space-game/3-moving-elements-around/README.md) | Chris | +| 18 | [太空游戏](/6-space-game/solution/README.md) | 碰撞检测 | 使用按键使元素相互碰撞和反应,并提供冷却功能以确保游戏的性能 | [碰撞检测](/6-space-game/4-collision-detection/README.md) | Chris | +| 19 | [太空游戏](/6-space-game/solution/README.md) | 记分 | 根据游戏的状态和性能进行数学计算 | [记分](/6-space-game/5-keeping-score/README.md) | Chris | +| 20 | [太空游戏](/6-space-game/solution/README.md) | 结束和重启游戏 | 学习结束和重启游戏的方法,包括清理资产和重设变量值 | [结束的条件](/6-space-game/6-end-condition/README.md) | Chris | +| 21 | [银行应用](/7-bank-project/solution/README.md) | 网络应用程序中的HTML模板和路线 | 学习如何使用路由和HTML模板创建多页面网站架构的支架 | [HTML模板和路线](/7-bank-project/1-template-route/README.md) | Yohan | +| 22 | [银行应用](/7-bank-project/solution/README.md) | 建立一个登录和注册表格 | 学习构建表单和交接验证程序的知识 | [表格](/7-bank-project/2-forms/README.md) | Yohan | +| 23 | [银行应用](/7-bank-project/solution/README.md) | 获取和使用数据的方法 | 数据如何流入和流出你的应用程序,如何获取它,存储它,并处理它 | [数据](/7-bank-project/3-data/README.md) | Yohan | +| 24 | [银行应用](/7-bank-project/solution/README.md) | 国家管理的概念 | 了解你的应用程序如何保留状态以及如何以编程方式管理它 | [国家管理](/7-bank-project/4-state-management/README.md) | Yohan | + +## 离线访问 + +你可以通过使用[Docsify](https://docsify.js.org/#/)离线运行这个文档。fork这个repo,在你的本地机器上安装Docsify,然后在这个repo的根文件夹中,输入 `docsify serve`。网站将在你的本地主机上的3000端口服务:`localhost:3000`。 + +## PDF + +所有课程的PDF文件可以在[这里](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf)找到 + +## 其他课程 + +我们的团队还制作了其他课程! 详见: + +- [Machine Learning for Beginners](https://aka.ms/ml-beginners) +- [IoT for Beginners](https://aka.ms/iot-beginners) +- [Data Science for Beginners](https://aka.ms/datascience-beginners) +- [AI for Beginners](https://aka.ms/ai-beginners) From 3b0e8e9929ba55d08ce801aef6eab3266ea150c9 Mon Sep 17 00:00:00 2001 From: SI_Xiaolong Date: Tue, 23 Aug 2022 22:53:52 +0800 Subject: [PATCH 02/90] Create README.zh-cn.md --- translations/README.zh-cn.md | 112 +++++++++++++++++++++++++++++++++++ 1 file changed, 112 insertions(+) create mode 100644 translations/README.zh-cn.md diff --git a/translations/README.zh-cn.md b/translations/README.zh-cn.md new file mode 100644 index 00000000..27226847 --- /dev/null +++ b/translations/README.zh-cn.md @@ -0,0 +1,112 @@ +[![GitHub license](https://img.shields.io/github/license/microsoft/Web-Dev-For-Beginners.svg)](https://github.com/microsoft/Web-Dev-For-Beginners/blob/master/LICENSE) +[![GitHub contributors](https://img.shields.io/github/contributors/microsoft/Web-Dev-For-Beginners.svg)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/graphs/contributors/) +[![GitHub issues](https://img.shields.io/github/issues/microsoft/Web-Dev-For-Beginners.svg)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/issues/) +[![GitHub pull-requests](https://img.shields.io/github/issues-pr/microsoft/Web-Dev-For-Beginners.svg)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/pulls/) +[![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](http://makeapullrequest.com) + +[![GitHub watchers](https://img.shields.io/github/watchers/microsoft/Web-Dev-For-Beginners.svg?style=social&label=Watch&maxAge=2592000)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/watchers/) +[![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-Beginners.svg?style=social&label=Fork&maxAge=2592000)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/network/) +[![GitHub stars](https://img.shields.io/github/stars/microsoft/Web-Dev-For-Beginners.svg?style=social&label=Star&maxAge=2592000)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/stargazers/) + +[![Open in Visual Studio Code](https://img.shields.io/static/v1?logo=visualstudiocode&label=&message=Open%20in%20Visual%20Studio%20Code&labelColor=2c2c32&color=007acc&logoColor=007acc)](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners) + +# 初学者的 Web 开发课程 + +微软的Azure云倡导者很高兴地提供一个为期12周的24课时的课程,所有关于JavaScript、CSS和HTML的基础知识。每节课都包括课前和课后测验、完成课程的书面说明、解决方案、作业等。我们以项目为基础的教学方法使你能够边学边做,这是一种证明新技能能够“扎根”的方法。 + +**衷心感谢我们的作者Jen Looper、Chris Noring、Christopher Harrison、Jasmine Greenaway、Yohan Lasorsa、Floor Drees和手绘艺术家Tomomi Imura!** + +# 你是学生吗? + +利用以下资源开始: + +- [Student Hub page](https://docs.microsoft.com/en-gb/learn/student-hub?WT.mc_id=academic-13441-cxa) 在这个页面,你会发现初学者资源、学生包,甚至是获得免费证书券的方法。这是一个你想加入书签并不时检查的页面,因为我们至少每月都会更换内容。 +- [Microsoft Student Learn ambassadors](https://studentambassadors.microsoft.com?WT.mc_id=academic-13441-cxa) 加入一个由学生大使组成的全球社区,这可能是你进入微软的途径。 + + +# 入门 + +> **对于老师**, 我们已经有了一些关于如何使用该课程的[建议](for-teachers.zh-cn.md)。 我们希望您能在我们的[讨论区](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)提出反馈意见! + +> **[对于学生](https://aka.ms/student-page)**,如果你想自己使用这个课程,你可以fork整个repo并自己完成练习,从课前测验开始,然后阅读课程并完成其余活动。尽量通过理解课程来创建项目,而不是复制解决方案的代码;不过,这些代码可以在每节课中的`/solutions`目录中找到。另一个方法是与朋友组成一个学习小组,一起学习这些内容。对于进一步的学习,我们建议通过[Microsoft Learn](https://docs.microsoft.com/users/jenlooper-2911/collections/jg2gax8pzd6o81?WT.mc_id=academic-13441-cxa) 和观看下面提到的视频。 + +[![Promo video](../images/web.gif)](https://youtube.com/watch?v=R1wrdtmBSII) + +Gif by [Mohit Jaisal](https://linkedin.com/in/mohitjaisal) + +> 🎥 点击上面的图像,观看关于该项目和创造该项目的人们的视频! + +## 教学宗旨 + +在建立这个课程时,我们选择了两个教学宗旨:确保它是基于项目的,并包括频繁的测验。在本系列课程结束时,学生将建立一个打字游戏,一个虚拟的花艺瓶,一个“绿色”浏览器扩展,一个“太空入侵者”类型的游戏,以及一个商业类型的银行应用程序,并将学会JavaScript、HTML和CSS的基础知识,以及当今网络开发人员的现代工具链。 + +> 🎓 你可以把这个课程的前几节课作为Microsoft Learn的[学习路径](https://docs.microsoft.com/learn/paths/web-development-101?WT.mc_id=academic-13441-cxa)来学习! + +通过确保内容与项目相一致,这个过程对学生来说更有吸引力,对概念的保持也会增强。我们还编写了几节关于JavaScript基础知识的入门课程来介绍概念,并配以“[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript?WT.mc_id=academic-13441-cxa)”的视频教程集,其中一些作者为这个课程做出了贡献。 + +此外,课前的低风险测验确定了学生对学习一个主题的意向如何,而课后的第二次测验则确保了学生知识的进一步保留。这个课程的设计是灵活而有趣的,可以全部或部分地学习。这些项目开始时很简单,到12周的周期结束时变得越来越复杂。 + +虽然我们有意避免介绍JavaScript框架,以便在采用框架之前集中于作为一个Web开发者所需的基本技能,但是完成本系列课程的一个好的去处就是通过“[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs?WT.mc_id=academic-13441-cxa)”来学习Node.js。 + +> 查看我们的[行为准则](../CODE_OF_CONDUCT.md)、[贡献](../CONTRIBUTING.md)和[翻译](../TRANSLATIONS.md)指南。我们欢迎你的建设性的反馈! + +## 每一课都包括: + +- 可能的手绘笔记 +- 可能的补充视频 +- 课前预习小测验 +- 书面课程 +- 对于基于项目的课程,关于如何建立项目的分步指南 +- 知识点检查 +- 一个挑战 +- 补充阅读 +- 作业 +- 课后小测验 + +> **关于测验的说明**: 所有的测验都包含在[这个应用程序](https://ashy-river-0debb7803.1.azurestaticapps.net/)中,总共有48个测验,每个测验三个问题。它们在课程中被链接,但测验应用程序可以在本地运行;按照`quiz-app`文件夹中的指示操作。它们正逐渐被本地化。 + +## 课程 + +| | 项目名称 | 教授概念 | 学习目标 | 课程链接 | 课程作者 | +| :-: | :------------------------------------------------------: | :--------------------------------------------------------------------: | ----------------------------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------------------------------------------------------------------------: | :---------------------: | +| 01 | 入门篇 | 编程语言和行业工具介绍 | 了解大多数编程语言背后的基本支撑,以及帮助专业开发人员完成工作的软件。 | [编程语言和工具介绍](/1-getting-started-lessons/1-intro-to-programming-languages/translations/README.zh-cn.md) | Jasmine | +| 02 | 入门篇 | GitHub的基础知识,包括与一个团队合作 | 如何在你的项目中使用GitHub,如何在代码库中与他人合作 | [GitHub介绍](/1-getting-started-lessons/2-github-basics/translations/README.zh-cn.md) | Floor | +| 03 | 入门篇 | 无障碍性 | 学习网络无障碍的基本知识 | [无障碍基础知识](/1-getting-started-lessons/3-accessibility/translations/README.zh-cn.md) | Christopher | +| 04 | JS基础 | JavaScript数据类型 | JavaScript数据类型的基础知识 | [数据类型](/2-js-basics/1-data-types/translations/README.zh-cn.md) | Jasmine | +| 05 | JS基础 | 函数和方法 | 了解管理应用程序逻辑流的函数和方法 | [函数和方法](/2-js-basics/2-functions-methods/translations/README.zh-cn.md) | Jasmine and Christopher | +| 06 | JS基础 | 用JS做出决定 | 学习如何使用决策方法在你的代码中创建条件 | [做出决定](/2-js-basics/3-making-decisions/translations/README.zh-cn.md) | Jasmine | +| 07 | JS基础 | 数组和循环 | 在JavaScript中使用数组和循环来处理数据 | [数组和循环](/2-js-basics/4-arrays-loops/translations/README.zh-cn.md) | Jasmine | +| 08 | [花艺瓶](/3-terrarium/solution/translations/README.zh-cn.md) | 实践中的HTML | 构建HTML以创建一个在线花艺瓶,重点是构建一个布局 | [HTML简介](/3-terrarium/1-intro-to-html/translations/README.zh-cn.md) | Jen | +| 09 | [花艺瓶](/3-terrarium/solution/translations/README.zh-cn.md) | 实践中的CSS | 构建CSS,为在线花艺瓶设计样式,重点是CSS的基础知识,包括使页面具有响应性 | [CSS简介](/3-terrarium/2-intro-to-css/translations/README.zh-cn.md) | Jen | +| 10 | [花艺瓶](/3-terrarium/solution/translations/README.zh-cn.md) | JavaScript闭包,DOM操作 | 构建JavaScript,使水族馆成为一个拖/放界面,重点是闭包和DOM操作 | [JavaScript闭包,DOM操作](/3-terrarium/3-intro-to-DOM-and-closures/translations/README.zh-cn.md) | Jen | +| 11 | [打字游戏](/4-typing-game/solution/translations/README.zh-cn.md) | 建立一个打字游戏 | 学习如何使用键盘事件来驱动你的JavaScript应用程序的逻辑 | [事件驱动编程](/4-typing-game/typing-game/translations/README.zh-cn.md) | Christopher | +| 12 | [绿色浏览器扩展](/5-browser-extension/solution/translations/README.zh-cn.md) | 与浏览器协作 | 了解浏览器是如何工作的,它们的历史,以及如何为浏览器扩展的第一批元素提供支架 | [关于浏览器](/5-browser-extension/1-about-browsers/translations/README.zh-cn.md) | Jen | +| 13 | [绿色浏览器扩展](/5-browser-extension/solution/translations/README.zh-cn.md) | 构建一个表单,调用一个API,并在本地存储中存储变量 | 构建你的浏览器扩展的JavaScript元素,使用存储在本地存储中的变量调用API | [API、表单和本地存储](/5-browser-extension/2-forms-browsers-local-storage/translations/README.zh-cn.md) | Jen | +| 14 | [绿色浏览器扩展](/5-browser-extension/solution/translations/README.zh-cn.md) | 浏览器中的后台进程,网络性能 | 使用浏览器的后台进程来管理扩展的图标;了解网络性能和一些优化 | [后台任务和性能](/5-browser-extension/3-background-tasks-and-performance/translations/README.zh-cn.md) | Jen | +| 15 | [太空游戏](/6-space-game/solution/translations/README.zh-cn.md) | 用JavaScript进行更高级的游戏开发 | 学习使用类和组合的继承以及Pub/Sub模式,为建立游戏做准备。 | [高级游戏开发简介](/6-space-game/1-introduction/translations/README.zh-cn.md) | Chris | +| 16 | [太空游戏](/6-space-game/solution/translations/README.zh-cn.md) | 在Canvas上绘图 | 了解用于在屏幕上绘制元素的Canvas API | [在Canvas上绘图](/6-space-game/2-drawing-to-canvas/translations/README.zh-cn.md) | Chris | +| 17 | [太空游戏](/6-space-game/solution/translations/README.zh-cn.md) | 在屏幕上移动元素 | 了解元素如何利用软轴坐标和Canvas API获得运动效果 | [移动元素](/6-space-game/3-moving-elements-around/translations/README.zh-cn.md) | Chris | +| 18 | [太空游戏](/6-space-game/solution/translations/README.zh-cn.md) | 碰撞检测 | 使用按键使元素相互碰撞和反应,并提供冷却功能以确保游戏的性能 | [碰撞检测](/6-space-game/4-collision-detection/translations/README.zh-cn.md) | Chris | +| 19 | [太空游戏](/6-space-game/solution/translations/README.zh-cn.md) | 记分 | 根据游戏的状态和性能进行数学计算 | [记分](/6-space-game/5-keeping-score/translations/README.zh-cn.md) | Chris | +| 20 | [太空游戏](/6-space-game/solution/translations/README.zh-cn.md) | 结束和重启游戏 | 学习结束和重启游戏的方法,包括清理资产和重设变量值 | [结束的条件](/6-space-game/6-end-condition/translations/README.zh-cn.md) | Chris | +| 21 | [银行应用](/7-bank-project/solution/translations/README.zh-cn.md) | 网络应用程序中的HTML模板和路线 | 学习如何使用路由和HTML模板创建多页面网站架构的支架 | [HTML模板和路线](/7-bank-project/1-template-route/translations/README.zh-cn.md) | Yohan | +| 22 | [银行应用](/7-bank-project/solution/translations/README.zh-cn.md) | 建立一个登录和注册表格 | 学习构建表单和交接验证程序的知识 | [表格](/7-bank-project/2-forms/translations/README.zh-cn.md) | Yohan | +| 23 | [银行应用](/7-bank-project/solution/translations/README.zh-cn.md) | 获取和使用数据的方法 | 数据如何流入和流出你的应用程序,如何获取它,存储它,并处理它 | [数据](/7-bank-project/3-data/translations/README.zh-cn.md) | Yohan | +| 24 | [银行应用](/7-bank-project/solution/translations/README.zh-cn.md) | 国家管理的概念 | 了解你的应用程序如何保留状态以及如何以编程方式管理它 | [国家管理](/7-bank-project/4-state-management/translations/README.zh-cn.md) | Yohan | + +## 离线访问 + +你可以通过使用[Docsify](https://docsify.js.org/#/)离线运行这个文档。fork这个repo,在你的本地机器上安装Docsify,然后在这个repo的根文件夹中,输入 `docsify serve`。网站将在你的本地主机上的3000端口服务:`localhost:3000`。 + +## PDF + +所有课程的PDF文件可以在[这里](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf)找到 + +## 其他课程 + +我们的团队还制作了其他课程! 详见: + +- [Machine Learning for Beginners](https://aka.ms/ml-beginners) +- [IoT for Beginners](https://aka.ms/iot-beginners) +- [Data Science for Beginners](https://aka.ms/datascience-beginners) +- [AI for Beginners](https://aka.ms/ai-beginners) From 182ea24d355a78944bd9218d861dc71ee3fe62bd Mon Sep 17 00:00:00 2001 From: SI_Xiaolong Date: Wed, 24 Aug 2022 01:06:25 +0800 Subject: [PATCH 03/90] Translate the README.md of 2-intro-to-css to zh-cn. --- .../translations/README.zh-cn.md | 264 ++++++++++++++++++ 1 file changed, 264 insertions(+) create mode 100644 3-terrarium/2-intro-to-css/translations/README.zh-cn.md diff --git a/3-terrarium/2-intro-to-css/translations/README.zh-cn.md b/3-terrarium/2-intro-to-css/translations/README.zh-cn.md new file mode 100644 index 00000000..518734a3 --- /dev/null +++ b/3-terrarium/2-intro-to-css/translations/README.zh-cn.md @@ -0,0 +1,264 @@ +# 花艺瓶项目 Part 1: CSS 简介 + +![Introduction to CSS](../../../sketchnotes/webdev101-css.png) +> 由 [Tomomi Imura](https://twitter.com/girlie_mac) 绘制 + +## 课前测试 + +[课前测试](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/17) + +### 介绍 + +CSS,即层叠样式表,解决了网络开发的一个重要问题:如何让你的网站看起来更漂亮。对你的应用程序进行样式设计可以使它们更实用、更美观;你还可以使用 CSS 来创建响应式网页设计(RWD)--使你的网页可以根据不同窗口大小改变呈现方式。CSS 不仅可以让你的网页看起来漂亮;它还包括动画和转换,可以为你的网页提供复杂的交互。CSS 工作组帮助维护当前的 CSS 规范;你可以在[万维网联盟的网站](https://www.w3.org/Style/CSS/members).上关注他们的工作。 + +> 注意,CSS 是一种不断发展的语言,就像网络上的所有东西一样,并不是所有的浏览器都支持规范的最新部分。要经常通过 [CanIUse.com](https://caniuse.com) 来检查你的实现在相关浏览器的支持情况。 + +在本课中,我们将为我们的在线花艺瓶添加样式,并进一步了解几个 CSS 概念:层叠(Cascade)、继承(Inheritance)和选择器(Selectors)的使用、定位(Positioning)以及使用 CSS 构建布局(Layout)。在这个过程中,我们将对花艺瓶进行布局,并创建实际的花艺瓶本身。 + +### 先决条件 + +你应该已经为你的水族箱建立了HTML,并准备好了样式。 + +### 任务 + +在你的 `terrarium` 目录中,创建一个名为 `style.css` 的新文件。在 `` 部分导入该文件: + +```html + +``` + +--- + +## 层叠(Cascade) + +层叠样式表包含了样式“层叠”的概念,即一个样式的应用由其优先级来指导。由网站作者设置的样式优先于由浏览器设置的样式。“内联(Inline)”设置的样式优先于外部样式表中设置的样式。 + +### 任务 +在你的 `

` 标签上添加内联样式 `"color: red"`: + +```HTML +

My Terrarium

+``` + +然后,在你的`style.css`文件中添加以下代码: + +```CSS +h1 { + color: blue; +} +``` + +✅ 你的网页显示了哪种颜色?为什么?你能找到一个覆盖该样式的方法吗?你什么时候会想这样做,或者为什么不这样做? + +--- + +## 继承(Inheritance) + +样式会从一个父级的样式继承到一个子级的样式,这样嵌套的元素就继承了它们父级的样式。 + +### 任务 + +将 body 的字体设置为给定的字体,并检查查看嵌套元素的字体: + +```CSS +body { + font-family: helvetica, arial, sans-serif; +} +``` + +打开你的浏览器控制台的“元素”标签,观察 H1 的字体。如浏览器中所述,它的字体继承自 body: + +![inherited font](images/1.png) + +✅ 你能让被嵌套的样式继承其他属性吗? + +--- + +## CSS 选择器(Selectors) + +### 标签 + +到目前为止,你的 `style.css` 文件只有几个标签的样式,而且页面看起来很奇怪: + +```CSS +body { + font-family: helvetica, arial, sans-serif; +} + +h1 { + color: #3a241d; + text-align: center; +} +``` + +这种给标签样式的方式只能控制特别的元素。当你需要控制你的花艺瓶中许多植物的样式时,你需要利用 CSS 选择器。 + +### ID(Ids) + +添加一些样式来布局左边和右边的容器。由于只有一个左边的容器和一个右边的容器,它们在标记中被赋予了 id 标记。要为它们设计样式,请使用 `#`。 + +```CSS +#left-container { + background-color: #eee; + width: 15%; + left: 0px; + top: 0px; + position: absolute; + height: 100%; + padding: 10px; +} + +#right-container { + background-color: #eee; + width: 15%; + right: 0px; + top: 0px; + position: absolute; + height: 100%; + padding: 10px; +} +``` + +在这里,你把这些容器用绝对定位放在屏幕的最左边和右边,并对它们的宽度使用了百分比,这样它们就可以在小屏幕上缩放来正常显示。 + +✅ 这段代码相当重复,因此不要照抄;你能找到一个更好的方法来给这些 id 样式,也许可以用一个 id 和一个 class ?你需要修改 HTML 和 CSS。 + +```html +
+``` + +### 类(Classes) + +在上面的例子中,你为屏幕上两个独特的元素设计了样式。如果你想让样式应用于屏幕上的许多元素,你可以使用 CSS 类。利用这种方法在左边和右边的容器中布局植物。 + +请注意,HTML 中的每个植物都有一个 id 和 class 的组合。JavaScript 稍后会利用 id 控制植物的摆放;CSS 则会使用 class 来选择并将样式套用在相应的植物上。 + +```html +
+ plant +
+``` + +在你的 `style.css` 文件中添加以下内容: + +```CSS +.plant-holder { + position: relative; + height: 13%; + left: -10px; +} + +.plant { + position: absolute; + max-width: 150%; + max-height: 150%; + z-index: 2; +} +``` + +这个片段中值得注意的是相对和绝对定位的混合,我们将在下一节中介绍。我们先来看看使用百分比处理高度的方式: + +你将 `plant-holder` 的高度设置为 13%,这是一个很好的数字,可以确保在不需要滚动的情况下,所有的植物都显示在每个垂直容器中。 + +你设置植物支架向左移动,让植物在其容器中居中。图片有大量的透明区域需要被拖拽进来,向左移动可以更好地在屏幕上显示。 + +然后,植物本身被赋予 150% 的最大宽度。这使得它可以随着浏览器的缩小而缩小。试着调整你的浏览器的窗口大小;植物将保持在它们的容器中,靠缩小尺寸以适应窗口大小。 + +同样值得注意的是 z-index 的使用,它可以控制一个元素的相对高度(这样,植物就可以坐在容器的顶部,看起来就像坐在花艺瓶内部一样)。 + +✅ 为什么你同时需要一个 `plant-holder` 和一个植物 CSS 选择器? + +## 定位(Positioning) + +混合位置属性(包括静态(Static)、相对(Relative)、固定(Fixed)、绝对(Absolute)和粘性(Sticky)位置)可能有点棘手,但如果操作得当,它可以让你很好地控制页面上的元素。 + +绝对定位的元素是相对于其父级元素定位的,如果没有,则根据 body 定位。 + +相对定位的元素是根据 CSS 指定的方向来调整其相对初始位置的位置。 + +在我们的例子中,`plant-holder` 是一个相对定位的元素,被定位在一个绝对定位的容器中。因此,容器被左右夹住,而嵌入其中的 `plant-holder` 会调整它在容器中的位置,为植物的竖排放置提供空间。 + +> `plant` 本身也有绝对定位,这是为了使其可拖动,你可以在下阶段课程中了解更多。 + +✅ 试着切换一下容器和 `plant-holder` 的定位类型。会发生什么? + +## 布局(Layouts) + +现在,你将利用你所学到的知识来建造花艺瓶本身,所有这些都是用CSS来完成的。 + +首先,使用CSS将 `.terrarium` div 的子级样式化为一个圆角矩形: + +```CSS +.jar-walls { + height: 80%; + width: 60%; + background: #d1e1df; + border-radius: 1rem; + position: absolute; + bottom: 0.5%; + left: 20%; + opacity: 0.5; + z-index: 1; +} + +.jar-top { + width: 50%; + height: 5%; + background: #d1e1df; + position: absolute; + bottom: 80.5%; + left: 25%; + opacity: 0.7; + z-index: 1; +} + +.jar-bottom { + width: 50%; + height: 1%; + background: #d1e1df; + position: absolute; + bottom: 0%; + left: 25%; + opacity: 0.7; +} + +.dirt { + width: 60%; + height: 5%; + background: #3a241d; + position: absolute; + border-radius: 0 0 1rem 1rem; + bottom: 1%; + left: 20%; + opacity: 0.7; + z-index: -1; +} +``` + +注意这里使用的是百分比。如果你缩小你的浏览器窗口,你可以看到罐子是如何缩放的。也可以注意到罐子元素的宽度和高度百分比,以及每个元素是如何被绝对定位在中心,钉在窗口的底部的。 + +我们还使用 `rem` 来表示 `border-radius`,这是一种字体相对的长度。在 [CSS 规范](https://www.w3.org/TR/css-values-3/#font-relative-lengths)中阅读更多关于这种相对测量的类型。 + +✅ 试着改变罐子的颜色和不透明度与泥土的颜色。会发生什么?为什么? + +--- + +## 🚀挑战 + +在瓶子的左边底部区域添加一个“气泡反光”,使其看起来更像玻璃。你将对 `.jar-glossy-long` 和 `.jar-glossy-short` 进行样式化,使其看起来像一个反射的光泽。下面是它的成果图: + +![花艺瓶成果图](../images/terrarium-final.png) + +要完成课后测验,请通过这个学习模块:[用 CSS 样式化你的 HTML 网页](https://docs.microsoft.com/learn/modules/build-simple-website/4-css-basics?WT.mc_id=academic-13441-cxa) + +## 课后测试 + +[课后测试](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/18) + +## 复习 & 预习 + +CSS 看似简单明了,但在试图为所有浏览器和所有屏幕尺寸完美地设计一个应用程序时,却存在许多挑战。CSS-Grid 和 Flexbox 是为了使这项工作更有条理、更可靠而开发的工具。通过游玩 [Flexbox Froggy](https://flexboxfroggy.com/) 和 [Grid Garden](https://codepip.com/games/grid-garden/) 来了解这些工具。 + +## 作业 + +[CSS 重构](assignment.md) From 47449916b2d96a1d500d99aed8118451cb1f93da Mon Sep 17 00:00:00 2001 From: SI_Xiaolong Date: Wed, 24 Aug 2022 01:12:30 +0800 Subject: [PATCH 04/90] Fix some link errors in README.zh-cn.md. --- translations/README.zh-cn.md | 48 ++++++++++++++++++------------------ 1 file changed, 24 insertions(+), 24 deletions(-) diff --git a/translations/README.zh-cn.md b/translations/README.zh-cn.md index 27226847..0e48946d 100644 --- a/translations/README.zh-cn.md +++ b/translations/README.zh-cn.md @@ -69,30 +69,30 @@ Gif by [Mohit Jaisal](https://linkedin.com/in/mohitjaisal) | | 项目名称 | 教授概念 | 学习目标 | 课程链接 | 课程作者 | | :-: | :------------------------------------------------------: | :--------------------------------------------------------------------: | ----------------------------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------------------------------------------------------------------------: | :---------------------: | -| 01 | 入门篇 | 编程语言和行业工具介绍 | 了解大多数编程语言背后的基本支撑,以及帮助专业开发人员完成工作的软件。 | [编程语言和工具介绍](/1-getting-started-lessons/1-intro-to-programming-languages/translations/README.zh-cn.md) | Jasmine | -| 02 | 入门篇 | GitHub的基础知识,包括与一个团队合作 | 如何在你的项目中使用GitHub,如何在代码库中与他人合作 | [GitHub介绍](/1-getting-started-lessons/2-github-basics/translations/README.zh-cn.md) | Floor | -| 03 | 入门篇 | 无障碍性 | 学习网络无障碍的基本知识 | [无障碍基础知识](/1-getting-started-lessons/3-accessibility/translations/README.zh-cn.md) | Christopher | -| 04 | JS基础 | JavaScript数据类型 | JavaScript数据类型的基础知识 | [数据类型](/2-js-basics/1-data-types/translations/README.zh-cn.md) | Jasmine | -| 05 | JS基础 | 函数和方法 | 了解管理应用程序逻辑流的函数和方法 | [函数和方法](/2-js-basics/2-functions-methods/translations/README.zh-cn.md) | Jasmine and Christopher | -| 06 | JS基础 | 用JS做出决定 | 学习如何使用决策方法在你的代码中创建条件 | [做出决定](/2-js-basics/3-making-decisions/translations/README.zh-cn.md) | Jasmine | -| 07 | JS基础 | 数组和循环 | 在JavaScript中使用数组和循环来处理数据 | [数组和循环](/2-js-basics/4-arrays-loops/translations/README.zh-cn.md) | Jasmine | -| 08 | [花艺瓶](/3-terrarium/solution/translations/README.zh-cn.md) | 实践中的HTML | 构建HTML以创建一个在线花艺瓶,重点是构建一个布局 | [HTML简介](/3-terrarium/1-intro-to-html/translations/README.zh-cn.md) | Jen | -| 09 | [花艺瓶](/3-terrarium/solution/translations/README.zh-cn.md) | 实践中的CSS | 构建CSS,为在线花艺瓶设计样式,重点是CSS的基础知识,包括使页面具有响应性 | [CSS简介](/3-terrarium/2-intro-to-css/translations/README.zh-cn.md) | Jen | -| 10 | [花艺瓶](/3-terrarium/solution/translations/README.zh-cn.md) | JavaScript闭包,DOM操作 | 构建JavaScript,使水族馆成为一个拖/放界面,重点是闭包和DOM操作 | [JavaScript闭包,DOM操作](/3-terrarium/3-intro-to-DOM-and-closures/translations/README.zh-cn.md) | Jen | -| 11 | [打字游戏](/4-typing-game/solution/translations/README.zh-cn.md) | 建立一个打字游戏 | 学习如何使用键盘事件来驱动你的JavaScript应用程序的逻辑 | [事件驱动编程](/4-typing-game/typing-game/translations/README.zh-cn.md) | Christopher | -| 12 | [绿色浏览器扩展](/5-browser-extension/solution/translations/README.zh-cn.md) | 与浏览器协作 | 了解浏览器是如何工作的,它们的历史,以及如何为浏览器扩展的第一批元素提供支架 | [关于浏览器](/5-browser-extension/1-about-browsers/translations/README.zh-cn.md) | Jen | -| 13 | [绿色浏览器扩展](/5-browser-extension/solution/translations/README.zh-cn.md) | 构建一个表单,调用一个API,并在本地存储中存储变量 | 构建你的浏览器扩展的JavaScript元素,使用存储在本地存储中的变量调用API | [API、表单和本地存储](/5-browser-extension/2-forms-browsers-local-storage/translations/README.zh-cn.md) | Jen | -| 14 | [绿色浏览器扩展](/5-browser-extension/solution/translations/README.zh-cn.md) | 浏览器中的后台进程,网络性能 | 使用浏览器的后台进程来管理扩展的图标;了解网络性能和一些优化 | [后台任务和性能](/5-browser-extension/3-background-tasks-and-performance/translations/README.zh-cn.md) | Jen | -| 15 | [太空游戏](/6-space-game/solution/translations/README.zh-cn.md) | 用JavaScript进行更高级的游戏开发 | 学习使用类和组合的继承以及Pub/Sub模式,为建立游戏做准备。 | [高级游戏开发简介](/6-space-game/1-introduction/translations/README.zh-cn.md) | Chris | -| 16 | [太空游戏](/6-space-game/solution/translations/README.zh-cn.md) | 在Canvas上绘图 | 了解用于在屏幕上绘制元素的Canvas API | [在Canvas上绘图](/6-space-game/2-drawing-to-canvas/translations/README.zh-cn.md) | Chris | -| 17 | [太空游戏](/6-space-game/solution/translations/README.zh-cn.md) | 在屏幕上移动元素 | 了解元素如何利用软轴坐标和Canvas API获得运动效果 | [移动元素](/6-space-game/3-moving-elements-around/translations/README.zh-cn.md) | Chris | -| 18 | [太空游戏](/6-space-game/solution/translations/README.zh-cn.md) | 碰撞检测 | 使用按键使元素相互碰撞和反应,并提供冷却功能以确保游戏的性能 | [碰撞检测](/6-space-game/4-collision-detection/translations/README.zh-cn.md) | Chris | -| 19 | [太空游戏](/6-space-game/solution/translations/README.zh-cn.md) | 记分 | 根据游戏的状态和性能进行数学计算 | [记分](/6-space-game/5-keeping-score/translations/README.zh-cn.md) | Chris | -| 20 | [太空游戏](/6-space-game/solution/translations/README.zh-cn.md) | 结束和重启游戏 | 学习结束和重启游戏的方法,包括清理资产和重设变量值 | [结束的条件](/6-space-game/6-end-condition/translations/README.zh-cn.md) | Chris | -| 21 | [银行应用](/7-bank-project/solution/translations/README.zh-cn.md) | 网络应用程序中的HTML模板和路线 | 学习如何使用路由和HTML模板创建多页面网站架构的支架 | [HTML模板和路线](/7-bank-project/1-template-route/translations/README.zh-cn.md) | Yohan | -| 22 | [银行应用](/7-bank-project/solution/translations/README.zh-cn.md) | 建立一个登录和注册表格 | 学习构建表单和交接验证程序的知识 | [表格](/7-bank-project/2-forms/translations/README.zh-cn.md) | Yohan | -| 23 | [银行应用](/7-bank-project/solution/translations/README.zh-cn.md) | 获取和使用数据的方法 | 数据如何流入和流出你的应用程序,如何获取它,存储它,并处理它 | [数据](/7-bank-project/3-data/translations/README.zh-cn.md) | Yohan | -| 24 | [银行应用](/7-bank-project/solution/translations/README.zh-cn.md) | 国家管理的概念 | 了解你的应用程序如何保留状态以及如何以编程方式管理它 | [国家管理](/7-bank-project/4-state-management/translations/README.zh-cn.md) | Yohan | +| 01 | 入门篇 | 编程语言和行业工具介绍 | 了解大多数编程语言背后的基本支撑,以及帮助专业开发人员完成工作的软件。 | [编程语言和工具介绍](/1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine | +| 02 | 入门篇 | GitHub的基础知识,包括与一个团队合作 | 如何在你的项目中使用GitHub,如何在代码库中与他人合作 | [GitHub介绍](/1-getting-started-lessons/2-github-basics/README.md) | Floor | +| 03 | 入门篇 | 无障碍性 | 学习网络无障碍的基本知识 | [无障碍基础知识](/1-getting-started-lessons/3-accessibility/README.md) | Christopher | +| 04 | JS基础 | JavaScript数据类型 | JavaScript数据类型的基础知识 | [数据类型](/2-js-basics/1-data-types/README.md) | Jasmine | +| 05 | JS基础 | 函数和方法 | 了解管理应用程序逻辑流的函数和方法 | [函数和方法](/2-js-basics/2-functions-methods/README.md) | Jasmine and Christopher | +| 06 | JS基础 | 用JS做出决定 | 学习如何使用决策方法在你的代码中创建条件 | [做出决定](/2-js-basics/3-making-decisions/README.md) | Jasmine | +| 07 | JS基础 | 数组和循环 | 在JavaScript中使用数组和循环来处理数据 | [数组和循环](/2-js-basics/4-arrays-loops/README.md) | Jasmine | +| 08 | [花艺瓶](/3-terrarium/solution/README.md) | 实践中的HTML | 构建HTML以创建一个在线花艺瓶,重点是构建一个布局 | [HTML简介](/3-terrarium/1-intro-to-html/README.md) | Jen | +| 09 | [花艺瓶](/3-terrarium/solution/README.md) | 实践中的CSS | 构建CSS,为在线花艺瓶设计样式,重点是CSS的基础知识,包括使页面具有响应性 | [CSS简介](/3-terrarium/2-intro-to-css/README.md) | Jen | +| 10 | [花艺瓶](/3-terrarium/solution/README.md) | JavaScript闭包,DOM操作 | 构建JavaScript,使水族馆成为一个拖/放界面,重点是闭包和DOM操作 | [JavaScript闭包,DOM操作](/3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen | +| 11 | [打字游戏](/4-typing-game/solution/README.md) | 建立一个打字游戏 | 学习如何使用键盘事件来驱动你的JavaScript应用程序的逻辑 | [事件驱动编程](/4-typing-game/typing-game/README.md) | Christopher | +| 12 | [绿色浏览器扩展](/5-browser-extension/solution/README.md) | 与浏览器协作 | 了解浏览器是如何工作的,它们的历史,以及如何为浏览器扩展的第一批元素提供支架 | [关于浏览器](/5-browser-extension/1-about-browsers/README.md) | Jen | +| 13 | [绿色浏览器扩展](/5-browser-extension/solution/README.md) | 构建一个表单,调用一个API,并在本地存储中存储变量 | 构建你的浏览器扩展的JavaScript元素,使用存储在本地存储中的变量调用API | [API、表单和本地存储](/5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen | +| 14 | [绿色浏览器扩展](/5-browser-extension/solution/README.md) | 浏览器中的后台进程,网络性能 | 使用浏览器的后台进程来管理扩展的图标;了解网络性能和一些优化 | [后台任务和性能](/5-browser-extension/3-background-tasks-and-performance/README.md) | Jen | +| 15 | [太空游戏](/6-space-game/solution/README.md) | 用JavaScript进行更高级的游戏开发 | 学习使用类和组合的继承以及Pub/Sub模式,为建立游戏做准备。 | [高级游戏开发简介](/6-space-game/1-introduction/README.md) | Chris | +| 16 | [太空游戏](/6-space-game/solution/README.md) | 在Canvas上绘图 | 了解用于在屏幕上绘制元素的Canvas API | [在Canvas上绘图](/6-space-game/2-drawing-to-canvas/README.md) | Chris | +| 17 | [太空游戏](/6-space-game/solution/README.md) | 在屏幕上移动元素 | 了解元素如何利用软轴坐标和Canvas API获得运动效果 | [移动元素](/6-space-game/3-moving-elements-around/README.md) | Chris | +| 18 | [太空游戏](/6-space-game/solution/README.md) | 碰撞检测 | 使用按键使元素相互碰撞和反应,并提供冷却功能以确保游戏的性能 | [碰撞检测](/6-space-game/4-collision-detection/README.md) | Chris | +| 19 | [太空游戏](/6-space-game/solution/README.md) | 记分 | 根据游戏的状态和性能进行数学计算 | [记分](/6-space-game/5-keeping-score/README.md) | Chris | +| 20 | [太空游戏](/6-space-game/solution/README.md) | 结束和重启游戏 | 学习结束和重启游戏的方法,包括清理资产和重设变量值 | [结束的条件](/6-space-game/6-end-condition/README.md) | Chris | +| 21 | [银行应用](/7-bank-project/solution/README.md) | 网络应用程序中的HTML模板和路线 | 学习如何使用路由和HTML模板创建多页面网站架构的支架 | [HTML模板和路线](/7-bank-project/1-template-route/README.md) | Yohan | +| 22 | [银行应用](/7-bank-project/solution/README.md) | 建立一个登录和注册表格 | 学习构建表单和交接验证程序的知识 | [表格](/7-bank-project/2-forms/README.md) | Yohan | +| 23 | [银行应用](/7-bank-project/solution/README.md) | 获取和使用数据的方法 | 数据如何流入和流出你的应用程序,如何获取它,存储它,并处理它 | [数据](/7-bank-project/3-data/README.md) | Yohan | +| 24 | [银行应用](/7-bank-project/solution/README.md) | 国家管理的概念 | 了解你的应用程序如何保留状态以及如何以编程方式管理它 | [国家管理](/7-bank-project/4-state-management/README.md) | Yohan | ## 离线访问 From efe394c9213c07ef6b756df0d53755c4e765f449 Mon Sep 17 00:00:00 2001 From: Ashkan Ebtekari <56440241+Chamepp@users.noreply.github.com> Date: Wed, 31 Aug 2022 10:04:39 +0430 Subject: [PATCH 05/90] Added readme persian (fa - farsi) translation --- translations/README.fa.md | 111 ++++++++++++++++++++++++++++++++++++++ 1 file changed, 111 insertions(+) create mode 100644 translations/README.fa.md diff --git a/translations/README.fa.md b/translations/README.fa.md new file mode 100644 index 00000000..c5514c16 --- /dev/null +++ b/translations/README.fa.md @@ -0,0 +1,111 @@ +[![GitHub license](https://img.shields.io/github/license/microsoft/Web-Dev-For-Beginners.svg)](https://github.com/microsoft/Web-Dev-For-Beginners/blob/master/LICENSE) +[![GitHub contributors](https://img.shields.io/github/contributors/microsoft/Web-Dev-For-Beginners.svg)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/graphs/contributors/) +[![GitHub issues](https://img.shields.io/github/issues/microsoft/Web-Dev-For-Beginners.svg)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/issues/) +[![GitHub pull-requests](https://img.shields.io/github/issues-pr/microsoft/Web-Dev-For-Beginners.svg)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/pulls/) +[![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](http://makeapullrequest.com) + +[![GitHub watchers](https://img.shields.io/github/watchers/microsoft/Web-Dev-For-Beginners.svg?style=social&label=Watch&maxAge=2592000)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/watchers/) +[![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-Beginners.svg?style=social&label=Fork&maxAge=2592000)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/network/) +[![GitHub stars](https://img.shields.io/github/stars/microsoft/Web-Dev-For-Beginners.svg?style=social&label=Star&maxAge=2592000)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/stargazers/) + +[![Open in Visual Studio Code](https://img.shields.io/static/v1?logo=visualstudiocode&label=&message=Open%20in%20Visual%20Studio%20Code&labelColor=2c2c32&color=007acc&logoColor=007acc)](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners) + +# توسعه وب برای مبتدیان - یک برنامه درسی + +آژوره کلود آدوکتس در مایکروسافت از ارائه یک برنامه درسی 12 هفته ای 24 درس در مورد مبانی جاوا اسکریپت، سی اس اس و اچ تی ام ال خوشحالند. هر درس شامل آزمون های قبل و بعد از درس، دستورالعمل های مکتوب برای تکمیل درس، یک راه حل، یک تکلیف و موارد دیگر است. آموزش مبتنی بر پروژه ما به شما امکان می دهد در حین ساختن یاد بگیرید، راهی ثابت شده برای "چسبیدن" مهارت های جدید. + +از نویسندگانمان جن لوپر، کریس نورینگ، کریستوفر هریسون، جاسمین گریناوی، یوهان لاسورسا، فلور دریس، و تومومی ایمورا، نویسندگان ما صمیمانه تشکر می‌کنیم! + +**از نویسندگانمان، جن لوپر، کریس نورینگ، کریستوفر هریسون، جاسمین گریناوی، یوهان لاسورسا، فلور دریس و تومومی ایمورا، نویسندگان ما صمیمانه تشکر می‌کنیم!** + +# شما دانش آموز هستید؟ + +با منابع زیر شروع کنید: + +- [Student Hub page](https://docs.microsoft.com/en-gb/learn/student-hub?WT.mc_id=academic-13441-cxa) در این صفحه، منابع مبتدی، بسته های دانشجویی و حتی راه های دریافت کوپن گواهی رایگان را خواهید یافت. این صفحه‌ای است که می‌خواهید هر چند وقت یک‌بار به عنوان نشانه‌گذاری و بررسی کنید، زیرا ما حداقل ماهانه محتوا را تغییر می‌دهیم +- [Microsoft Student Learn ambassadors](https://studentambassadors.microsoft.com?WT.mc_id=academic-13441-cxa) به یک جامعه جهانی از سفیران دانشجو بپیوندید، این می تواند راه شما برای ورود به مایکروسافت باشد + + +# شروع شدن + +> **معلمان** [شامل چند پیشنهاد](for-teachers.md) داریم در مورد نحوه استفاده از این برنامه درسی. [در انجمن بحث ما](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)! + +> **[دانش آموزان](https://aka.ms/student-page)**, برای استفاده از این برنامه درسی به تنهایی، کل مخزن را چنگال کنید و تمرینات را به تنهایی کامل کنید، با یک مسابقه قبل از سخنرانی شروع کنید، سپس سخنرانی را بخوانید و بقیه فعالیت ها را تکمیل کنید. سعی کنید پروژه ها را با درک درس ها به جای کپی کردن کد راه حل ایجاد کنید. با این حال، این کد در پوشه های /solutions در هر درس پروژه محور موجود است. ایده دیگر این است که یک گروه مطالعه با دوستان تشکیل دهید و مطالب را با هم مرور کنید. برای مطالعه بیشتر توصیه می کنیم [مايكروسافت لرن](https://docs.microsoft.com/users/jenlooper-2911/collections/jg2gax8pzd6o81?WT.mc_id=academic-13441-cxa) و با تماشای فیلم های ذکر شده در زیر. + +[![Promo video](images/web.gif)](https://youtube.com/watch?v=R1wrdtmBSII) + +گیف توسط [موهیت جیسال](https://linkedin.com/in/mohitjaisal) + +> 🎥 برای دریافت ویدیویی در مورد پروژه و افرادی که آن را ایجاد کرده اند، روی تصویر بالا کلیک کنید! + +## آموزش و پرورش + +ما در هنگام ساختن این برنامه درسی دو اصل آموزشی را انتخاب کرده ایم: اطمینان از پروژه محور بودن آن و اینکه شامل آزمون های مکرر است. تا پایان این مجموعه، دانش‌آموزان یک بازی تایپ، یک تراریوم مجازی، یک افزونه مرورگر سبز، یک بازی از نوع مهاجمان فضایی و یک برنامه بانکی از نوع کسب‌وکار خواهند ساخت و اصول جاوا اسکریپت را یاد خواهند گرفت. ، اچ تی ام ال و سی اس اس به همراه زنجیره ابزار مدرن توسعه دهندگان وب امروزی. +> 🎓 شما می توانید چند درس اول این برنامه درسی را در مایکروسافت لرن به عنوان یک [مسیر یادگیری](https://docs.microsoft.com/learn/paths/web-development-101?WT.mc_id=academic-13441-cxa) + بخوانید. + +با حصول اطمینان از همسویی محتوا با پروژه ها، این فرآیند برای دانش آموزان جذاب تر می شود و حفظ مفاهیم تقویت می شود. ما همچنین چندین درس ابتدایی در مبانی جاوا اسکریپت نوشتیم تا مفاهیم را معرفی کنیم، همراه با ویدئو از "[سری مبتدیان به: جاوا اسکریپت](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript?WT.mc_id=academic-13441-cxa)" مجموعه ای از آموزش های ویدئویی که برخی از نویسندگان آن در این برنامه درسی مشارکت داشته اند. + +علاوه بر این، یک مسابقه کم هزینه قبل از کلاس، قصد دانش آموز را برای یادگیری یک موضوع تعیین می کند، در حالی که آزمون دوم بعد از کلاس، حفظ بیشتر را تضمین می کند. این برنامه درسی به گونه ای طراحی شده است که انعطاف پذیر و سرگرم کننده باشد و می تواند به طور کامل یا جزئی انجام شود. پروژه ها کوچک شروع می شوند و در پایان چرخه 12 هفته ای به طور فزاینده ای پیچیده می شوند. + +در حالی که ما عمداً از معرفی فریمورک‌های جاوا اسکریپت خودداری کرده‌ایم تا بر مهارت‌های اساسی مورد نیاز به‌عنوان یک توسعه‌دهنده وب قبل از اتخاذ یک چارچوب تمرکز کنیم، گام بعدی خوب برای تکمیل این برنامه درسی، یادگیری در مورد Node.js از طریق مجموعه‌ای دیگر از ویدیوها است : "[سری مبتدی به: نود جی اس](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs?WT.mc_id=academic-13441-cxa)". + +> ما را پیدا کنید [کد رفتار](CODE_OF_CONDUCT.md), [کمک کردن](CONTRIBUTING.md), و [ترجمه](TRANSLATIONS.md) دستورالعمل ها. ما از بازخورد سازنده شما استقبال می کنیم! + +## هر درس شامل: + +- طرحی اختیاری +- ویدیوی تکمیلی اختیاری +- مسابقه گرم کردن قبل از درس +- درس نوشتاری +- برای درس های پروژه محور، راهنمای گام به گام نحوه ساخت پروژه +- بررسی دانش +- یک چالش +- خواندن تکمیلی +- وظیفه +- مسابقه بعد از درس + +> ** نکته ای در مورد آزمون ها **: همه آزمون ها [در این برنامه](https://ashy-river-0debb7803.1.azurestaticapps.net/) موجود است, برای 48 آزمون مجموع سه سوال هر کدام. آنها از داخل درس ها پیوند داده شده اند، اما برنامه مسابقه می تواند به صورت محلی اجرا شود. دستورالعمل موجود در پوشه «کویز-برنامه» را دنبال کنید. آنها به تدریج در حال بومی سازی هستند. + +## درس ها + +| | نام پروژه | مفاهیم تدریس شده | اهداف یادگیری | درس مرتبط | نویسنده | +| :-: | :------------------------------------------------------: | :--------------------------------------------------------------------: | ----------------------------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------------------------------------------------------------------------: | :---------------------: | +| 01 | شروع شدن | مقدمه ای بر برنامه نویسی و ابزارهای تجارت | زیربنای اساسی بیشتر زبان های برنامه نویسی و نرم افزاری را بیاموزید که به توسعه دهندگان حرفه ای کمک می کند کارهای خود را انجام دهند | [مقدمه ای بر زبان های برنامه نویسی و ابزارهای تجارت](/1-getting-started-lessons/1-intro-to-programming-languages/README.md) | جزمین | +| 02 | شروع شدن | اصول گیت هاب شامل کار با یک تیم است | نحوه استفاده از گیت هاب در پروژه خود، نحوه همکاری با دیگران بر اساس کد | [معرفی گیت هاب](/1-getting-started-lessons/2-github-basics/README.md) | فلور | +| 03 | شروع شدن | دسترسی | اصول دسترسی به وب را بیاموزید | [مبانی دسترسی](/1-getting-started-lessons/3-accessibility/README.md) | کریستفر | +| 04 | اصول جی اس | انواع داده جاوا اسکریپت | اصول اولیه انواع داده جاوا اسکریپت | [انواع داده ها](/2-js-basics/1-data-types/README.md) | جزمین | +| 05 | اصول جی اس | توابع و روش ها | با توابع و روش های مدیریت جریان منطقی برنامه آشنا شوید | [توابع و روش ها](/2-js-basics/2-functions-methods/README.md) | جزمین و کریستوفر | +| 06 | اصول جی اس | تصمیم گیری با جی اس | بیاموزید که چگونه با استفاده از روش های تصمیم گیری در کد خود شرایط ایجاد کنید | [تصمیم گیری](/2-js-basics/3-making-decisions/README.md) | جزمین | +| 07 | اصول جی اس | آرایه ها و حلقه ها | با داده ها با استفاده از آرایه ها و حلقه ها در جاوا اسکریپت کار کنید | [آرایه ها و حلقه ها](/2-js-basics/4-arrays-loops/README.md) | جزمین | +| 08 | [تراریوم](/3-terrarium/solution/README.md) | اچ تی ام ال در عمل | کد اچ تی ام ال را به صورت آنلاین بسازید، با تمرکز بر روی ایجاد یک صفحه بزرگ | [مقدمه ای بر اچ تی ام ال](/3-terrarium/1-intro-to-html/README.md) | جن | +| 09 | [تراریوم](/3-terrarium/solution/README.md) | سی اس اس در عمل | ساخت سی اس اس برای سبک تراریوم آنلاین، با تمرکز بر اصول اولیه سی اس اس از جمله پاسخگو بودن صفحه | [مقدمه ای بر سی اس اس](/3-terrarium/2-intro-to-css/README.md) | جن || 10 | [تراریوم](/3-terrarium/solution/README.md) | بسته شدن جاوا اسکریپت، دستکاری دام | جاوا اسکریپت را بسازید تا تراریوم به عنوان یک رابط کشیدن و رها کردن، با تمرکز بر بسته شدن و دستکاری دام عمل کند. | [بسته شدن جاوا اسکریپت، دستکاری دام](/3-terrarium/3-intro-to-DOM-and-closures/README.md) | جن | +| 11 | [بازی تایپ](/4-typing-game/solution/README.md) | یک بازی تایپ بسازید | با نحوه استفاده از رویدادهای صفحه کلید برای هدایت منطق برنامه جاوا اسکریپت خود آشنا شوید | [برنامه نویسی رویداد محور](/4-typing-game/typing-game/README.md) | کریستوفر | +| 12 | [پسوند مرورگر سبز](/5-browser-extension/solution/README.md) | کار با مرورگرها | با نحوه کار مرورگرها، تاریخچه آنها و نحوه ایجاد داربست در اولین عناصر یک برنامه افزودنی مرورگر آشنا شوید | [درباره مرورگرها](/5-browser-extension/1-about-browsers/README.md) | جن | +| 13 | [پسوند مرورگر سبز](/5-browser-extension/solution/README.md) | ساخت فرم، فراخوانی ای پی ای و ذخیره متغیرها در حافظه محلی | عناصر جاوا اسکریپت افزونه مرورگر خود را برای فراخوانی یک ای پی ای با استفاده از متغیرهای ذخیره شده در حافظه محلی بسازید | [ای پی ای، فرم‌ها و فضای ذخیره‌سازی محلی](/5-browser-extension/2-forms-browsers-local-storage/README.md) | جن | +| 14 | [پسوند مرورگر سبز](/5-browser-extension/solution/README.md) | فرآیندهای پس زمینه در مرورگر، عملکرد وب | از فرآیندهای پس‌زمینه مرورگر برای مدیریت نماد برنامه افزودنی استفاده کنید. در مورد عملکرد وب و برخی بهینه سازی هایی که باید انجام دهید بیاموزید | [وظایف و عملکرد پس زمینه](/5-browser-extension/3-background-tasks-and-performance/README.md) | جن | +| 15 | [بازی فضایی](/6-space-game/solution/README.md) | توسعه بازی پیشرفته تر با جاوا اسکریپت | با استفاده از کلاس‌ها و ترکیب و الگوی پاب/ساب، در آماده‌سازی برای ساختن یک بازی، درباره وراثت بیاموزید. | [مقدمه ای بر توسعه بازی پیشرفته](/6-space-game/1-introduction/README.md) | کریس | +| 16 | [بازی فضایی](/6-space-game/solution/README.md) | طراحی روی بوم | درباره کانواز ای پی ای که برای کشیدن عناصر به صفحه استفاده می شود، بیاموزید | [طراحی روی بوم](/6-space-game/2-drawing-to-canvas/README.md) | کریس | +| 17 | [بازی فضایی](/6-space-game/solution/README.md) | حرکت عناصر در اطراف صفحه نمایش | کشف کنید که چگونه عناصر می توانند با استفاده از مختصات دکارتی و کانواز ای پی ای حرکت کنند | [حرکت عناصر در اطراف](/6-space-game/3-moving-elements-around/README.md) | کریس | +| 18 | [بازی فضایی](/6-space-game/solution/README.md) | تشخیص برخورد | با استفاده از کلیدهای کلیدی، عناصر را با هم برخورد کرده و به یکدیگر واکنش نشان دهند و یک عملکرد خنک کننده برای اطمینان از عملکرد بازی ارائه دهید. | [تشخیص برخورد](/6-space-game/4-collision-detection/README.md) | کریس | +| 19 | [بازی فضایی](/6-space-game/solution/README.md) | حفظ امتیاز | محاسبات ریاضی را بر اساس وضعیت و عملکرد بازی انجام دهید | [حفظ امتیاز](/6-space-game/5-keeping-score/README.md) | کریس | +| 20 | [بازی فضایی](/6-space-game/solution/README.md) | پایان و شروع مجدد بازی | درباره پایان و شروع مجدد بازی، از جمله پاکسازی دارایی ها و بازنشانی مقادیر متغیر، اطلاعات کسب کنید | [شرط پایان](/6-space-game/6-end-condition/README.md) | کریس | +| 21 | [اپلیکیشن بانکداری](/7-bank-project/solution/README.md) | الگوها و مسیرهای اچ تی ام ال در یک برنامه وب | نحوه ایجاد داربست معماری یک وب سایت چند صفحه ای با استفاده از مسیریابی و قالب های اچ تی ام ال را بیاموزید | [الگوها و مسیرهای اچ تی ام ال](/7-bank-project/1-template-route/README.md) | یوهان | +| 22 | [اپلیکیشن بانکداری](/7-bank-project/solution/README.md) | یک فرم ورود و ثبت نام بسازید | در مورد ساخت فرم ها و روال های اعتبار سنجی ارائه اطلاعات کسب کنید | [فرم](/7-bank-project/2-forms/README.md) | یوهان | +| 23 | [اپلیکیشن بانکداری](/7-bank-project/solution/README.md) | روش های واکشی و استفاده از داده ها | چگونه داده ها به داخل و خارج از برنامه شما جریان می یابد، چگونه آن را واکشی کنید، ذخیره کنید، و از بین ببرید | [داده ها](/7-bank-project/3-data/README.md) | یوهان | +| 24 | [اپلیکیشن بانکداری](/7-bank-project/solution/README.md) | مفاهیم مدیریت دولتی | بیاموزید که چگونه برنامه شما حالت خود را حفظ می کند و چگونه آن را به صورت برنامه ریزی مدیریت کنید | [مدیریت ستیت](/7-bank-project/4-state-management/README.md) | یوهان | +## دسترسی آفلاین + +با استفاده از [Docsify](https://docsify.js.org/#/) می توانید این اسناد را به صورت آفلاین اجرا کنید. این مخزن را در دستگاه محلی خود [نصب کنید Docsify](https://docsify.js.org/#/quickstart) و سپس در پوشه اصلی این مخزن، «docsify serve» را تایپ کنید. این وب سایت در پورت 3000 در لوکال هاست شما ارائه می شود: «localhost:3000». +## پی دی اف + +پی دی اف تمام دروس را می توان یافت [اینجا](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf) + +## سایر برنامه های درسی + +تیم ما برنامه های درسی دیگری تولید می کند! وارسی: + +- [یادگیری ماشینی برای مبتدیان](https://aka.ms/ml-beginners) +- [اینترنت اشیا برای مبتدیان](https://aka.ms/iot-beginners) +- [علم داده برای مبتدیان](https://aka.ms/datascience-beginners) +- [هوش مصنوعی برای مبتدیان](https://aka.ms/ai-beginners) From 24b29e9ce33b6315f60ef57dd99f7a8a2812e074 Mon Sep 17 00:00:00 2001 From: Ashkan Ebtekari <56440241+Chamepp@users.noreply.github.com> Date: Sun, 4 Sep 2022 12:12:44 +0430 Subject: [PATCH 06/90] Completed fa (persian) quiz translation --- quiz-app/src/assets/translations/fa.json | 2509 ++++++++++++++++++++++ 1 file changed, 2509 insertions(+) create mode 100644 quiz-app/src/assets/translations/fa.json diff --git a/quiz-app/src/assets/translations/fa.json b/quiz-app/src/assets/translations/fa.json new file mode 100644 index 00000000..5e0baedd --- /dev/null +++ b/quiz-app/src/assets/translations/fa.json @@ -0,0 +1,2509 @@ +[ + { + "title": "توسعه وب برای مبتدیان: آزمون ها", + "complete": "تبریک می گویم، شما مسابقه را کامل کردید!", + "error": "متاسفم، دوباره سعی کنید", + "quizzes": [ + { + "id": 1, + "title": "درس 1 - مقدمه ای بر زبان های برنامه نویسی: آزمون قبل از سخنرانی", + "quiz": [ + { + "questionText": "یک برنامه را می توان بدون نوشتن هیچ کدی از سوی سازنده ایجاد کرد", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "true" + }, + { + "answerText": "false", + "isCorrect": "false" + } + ] + }, + { + "questionText": "زبان های سطح پایین یک انتخاب محبوب هستند", + "answerOptions": [ + { + "answerText": "وب سایت ها", + "isCorrect": "false" + }, + { + "answerText": "سخت افزار", + "isCorrect": "true" + }, + { + "answerText": "نرم افزار بازی های ویدیویی", + "isCorrect": "false" + } + ] + }, + { + "questionText": "کدام یک از این ابزارها به احتمال زیاد در محیط یک توسعه دهنده وب وجود دارد؟", + "answerOptions": [ + { + "answerText": "سخت افزار، مانند رزبری پای", + "isCorrect": "false" + }, + { + "answerText": "ابزارهای توسعه دهنده مرورگر", + "isCorrect": "true" + }, + { + "answerText": "مستندات سیستم عامل", + "isCorrect": "false" + } + ] + } + ] + }, + { + "id": 2, + "title": "درس 1 - مقدمه ای بر زبان های برنامه نویسی: آزمون پس از سخنرانی", + "quiz": [ + { + "questionText": "به احتمال زیاد از چه زبانی برای ایجاد یک وب سایت استفاده می کنید؟", + "answerOptions": [ + { + "answerText": "کد ماشین", + "isCorrect": "false" + }, + { + "answerText": "جاوا سکریپت", + "isCorrect": "true" + }, + { + "answerText": "بش", + "isCorrect": "false" + } + ] + }, + { + "questionText": "محیط های توسعه برای هر توسعه دهنده منحصر به فرد است", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "true" + }, + { + "answerText": "false", + "isCorrect": "false" + } + ] + }, + { + "questionText": "یک توسعه دهنده برای رفع اشکال باگ چه کاری انجام خواهد داد؟", + "answerOptions": [ + { + "answerText": "سینتکس هایلایتینگ", + "isCorrect": "false" + }, + { + "answerText": "دیباگینگ", + "isCorrect": "true" + }, + { + "answerText": "کد فرمتینگ", + "isCorrect": "false" + } + ] + } + ] + }, + { + "id": 3, + "title": "درس 2 - مقدمه ای بر گیت هاب: آزمون قبل از سخنرانی", + "quiz": [ + { + "questionText": "چگونه یک مخزن گیت هاب ایجاد می کنید؟", + "answerOptions": [ + { + "answerText": "git create", + "isCorrect": "false" + }, + { + "answerText": "git start", + "isCorrect": "false" + }, + { + "answerText": "git init", + "isCorrect": "true" + } + ] + }, + { + "questionText": "git add چه می کند؟", + "answerOptions": [ + { + "answerText": "کد شما را کامیت می کند", + "isCorrect": "false" + }, + { + "answerText": "فایل های شما را برای ردیابی به یک استیجینگ ایریا اضافه می کند", + "isCorrect": "true" + }, + { + "answerText": "فایل های شما را به گیت هاب اضافه می کند", + "isCorrect": "false" + } + ] + }, + { + "questionText": "چگونه بررسی می کنید که گیت روی رایانه شما نصب شده است؟", + "answerOptions": [ + { + "answerText": "type git --version", + "isCorrect": "true" + }, + { + "answerText": "type git --installed", + "isCorrect": "false" + }, + { + "answerText": "type git --init", + "isCorrect": "false" + } + ] + } + ] + }, + { + "id": 4, + "title": "درس 2 - مقدمه ای بر گیت هاب: آزمون پس از سخنرانی", + "quiz": [ + { + "questionText": "مکانی برای مقایسه و بحث در مورد تفاوت های معرفی شده در یک شعبه با بررسی، نظرات، تست های یکپارچه و موارد دیگر عبارت است از:", + "answerOptions": [ + { + "answerText": "گیت هاب", + "isCorrect": "false" + }, + { + "answerText": "یک درخواست پول رکوست", + "isCorrect": "true" + }, + { + "answerText": "یک شاخه ویژگی", + "isCorrect": "false" + } + ] + }, + { + "questionText": "چگونه می توانید تمام تعهدات را از یک شعبه راه دور دریافت و ادغام کنید؟", + "answerOptions": [ + { + "answerText": "git fetch", + "isCorrect": "false" + }, + { + "answerText": "git pull", + "isCorrect": "true" + }, + { + "answerText": "git commits -r", + "isCorrect": "false" + } + ] + }, + { + "questionText": "چگونه به شعبه تغییر می کنید؟", + "answerOptions": [ + { + "answerText": "git checkout [branch-name]", + "isCorrect": "false" + }, + { + "answerText": "git switch [branch-name]", + "isCorrect": "true" + }, + { + "answerText": "git load [branch-name]", + "isCorrect": "false" + } + ] + } + ] + }, + { + "id": 5, + "title": "درس 3 - ایجاد صفحات وب در دسترس: آزمون قبل از سخنرانی", + "quiz": [ + { + "questionText": "یک وب سایت قابل دسترسی را می توان در کدام ابزار مرورگر بررسی کرد", + "answerOptions": [ + { + "answerText": "Lighthouse", + "isCorrect": "true" + }, + { + "answerText": "Deckhouse", + "isCorrect": "false" + }, + { + "answerText": "Cleanhouse", + "isCorrect": "false" + } + ] + }, + { + "questionText": "برای آزمایش قابلیت دسترسی برای کاربران کم بینا به یک صفحه خوان فیزیکی نیاز دارید", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "false" + }, + { + "answerText": "false", + "isCorrect": "true" + } + ] + }, + { + "questionText": "دسترسی فقط در وب سایت های دولتی مهم است", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "false" + }, + { + "answerText": "false", + "isCorrect": "true" + } + ] + } + ] + }, + { + "id": 6, + "title": "درس 3 - ایجاد صفحات وب در دسترس: آزمون پس از سخنرانی", + "quiz": [ + { + "questionText": "Lighthouse فقط مشکلات دسترسی را بررسی می کند", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "false" + }, + { + "answerText": "false", + "isCorrect": "true" + } + ] + }, + { + "questionText": "پالت های ایمن رنگ به افراد کمک می کند", + "answerOptions": [ + { + "answerText": "کور رنگی", + "isCorrect": "false" + }, + { + "answerText": "اختلالات بینایی", + "isCorrect": "false" + }, + { + "answerText": "هر دو مورد بالا", + "isCorrect": "true" + } + ] + }, + { + "questionText": "پیوندهای توصیفی برای وب سایت های قابل دسترس حیاتی هستند", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "true" + }, + { + "answerText": "false", + "isCorrect": "false" + } + ] + } + ] + }, + { + "id": 7, + "title": "درس 4 - مبانی جاوا اسکریپت - انواع داده: آزمون قبل از سخنرانی", + "quiz": [ + { + "questionText": "Booleans یک نوع داده است که می توانید از آن برای آزمایش طول یک رشته استفاده کنید", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "false" + }, + { + "answerText": "false", + "isCorrect": "true" + } + ] + }, + { + "questionText": "عملیات زیر می توانید بر روی یک رشته انجام دهید", + "answerOptions": [ + { + "answerText": "concatenation", + "isCorrect": "true" + }, + { + "answerText": "appending", + "isCorrect": "false" + }, + { + "answerText": "splicing", + "isCorrect": "false" + } + ] + }, + { + "questionText": "== و === قابل تعویض هستند", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "false" + }, + { + "answerText": "false", + "isCorrect": "true" + } + ] + } + ] + }, + { + "id": 8, + "title": "درس 4 - مبانی جاوا اسکریپت - انواع داده: آزمون پس از سخنرانی", + "quiz": [ + { + "questionText": "ثابت ها مانند let و var برای اعلام متغیرها هستند به جز", + "answerOptions": [ + { + "answerText": "ثابت ها باید مقداردهی اولیه شوند", + "isCorrect": "true" + }, + { + "answerText": "ثابت ها را می توان تغییر داد", + "isCorrect": "false" + }, + { + "answerText": "ثابت ها را می توان دوباره اختصاص داد", + "isCorrect": "false" + } + ] + }, + { + "questionText": "عدد ها و ____ اولیه جاوا اسکریپت هستند که داده های عددی را مدیریت می کنند", + "answerOptions": [ + { + "answerText": "bigint", + "isCorrect": "true" + }, + { + "answerText": "boolean", + "isCorrect": "false" + }, + { + "answerText": "star", + "isCorrect": "false" + } + ] + }, + { + "questionText": "رشته ها می توانند بین هر دو نقل قول تکی و دوگانه قرار گیرند", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "true" + }, + { + "answerText": "false", + "isCorrect": "false" + } + ] + } + ] + }, + { + "id": 9, + "title": "درس 5 - مبانی جاوا اسکریپت - روش ها و توابع: آزمون قبل از سخنرانی", + "quiz": [ + { + "questionText": "استدلال چیست؟", + "answerOptions": [ + { + "answerText": "این چیزی است که شما در تعریف تابع اعلام می کنید", + "isCorrect": "false" + }, + { + "answerText": "این چیزی است که در زمان فراخوانی به یک تابع منتقل می کنید", + "isCorrect": "true" + }, + { + "answerText": "این چیزی است که با افرادی که می شناسید دارید", + "isCorrect": "false" + } + ] + }, + { + "questionText": "یک تابع باید چیزی را برگرداند", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "false" + }, + { + "answerText": "false", + "isCorrect": "true" + } + ] + }, + { + "questionText": "شما می توانید یک تابع را هر چیزی نامگذاری کنید", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "false" + }, + { + "answerText": "false", + "isCorrect": "false" + }, + { + "answerText": "true, اما باید یک نام توصیفی باشد", + "isCorrect": "true" + } + ] + } + ] + }, + { + "id": 10, + "title": "درس 5 - مبانی جاوا اسکریپت - روش ها و توابع: آزمون بعد از سخنرانی", + "quiz": [ + { + "questionText": "برای تمام پارامترهای یک تابع باید آرگومان ارائه شود", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "false" + }, + { + "answerText": "false", + "isCorrect": "true" + } + ] + }, + { + "questionText": "یک مقدار پیش فرض چه کاری انجام می دهد؟", + "answerOptions": [ + { + "answerText": "مقدار صحیحی را تنظیم می کند", + "isCorrect": "false" + }, + { + "answerText": "یک مقدار شروع برای یک پارامتر می دهد، بنابراین اگر یک آرگومان برای آن حذف کنید، کد شما همچنان رفتار می کند", + "isCorrect": "true" + }, + { + "answerText": "هیچ کاربردی ندارد", + "isCorrect": "false" + } + ] + }, + { + "questionText": "عملکرد فلش چربی به شما این امکان را می دهد", + "answerOptions": [ + { + "answerText": "ایجاد توابع سنگین", + "isCorrect": "false" + }, + { + "answerText": "کلمه کلیدی تابع را حذف کنید", + "isCorrect": "true" + }, + { + "answerText": "یک تابع ناشناس ایجاد کنید", + "isCorrect": "false" + } + ] + } + ] + }, + { + "id": 11, + "title": "درس 6 - مبانی جاوا اسکریپت - تصمیم گیری: آزمون قبل از سخنرانی", + "quiz": [ + { + "questionText": "عملگر زیر == فراخوانی می شود", + "answerOptions": [ + { + "answerText": "برابری", + "isCorrect": "true" + }, + { + "answerText": "برابری شدید", + "isCorrect": "false" + }, + { + "answerText": "وظیفه", + "isCorrect": "false" + } + ] + }, + { + "questionText": "مقایسه در جاوا اسکریپت کدام نوع را برمی گرداند؟", + "answerOptions": [ + { + "answerText": "boolean", + "isCorrect": "true" + }, + { + "answerText": "null", + "isCorrect": "false" + }, + { + "answerText": "string", + "isCorrect": "false" + } + ] + }, + { + "questionText": "! نماد در جاوا اسکریپت به این معنی است:", + "answerOptions": [ + { + "answerText": "منطقی نه", + "isCorrect": "true" + }, + { + "answerText": "مهم", + "isCorrect": "false" + }, + { + "answerText": "برابر است", + "isCorrect": "false" + } + ] + } + ] + }, + { + "id": 12, + "title": "درس 6 - مبانی جاوا اسکریپت - تصمیم گیری: آزمون بعد از سخنرانی", + "quiz": [ + { + "questionText": "کد زیر چه چیزی را برمی گرداند: '1' == 1", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "true" + }, + { + "answerText": "false", + "isCorrect": "false" + }, + { + "answerText": "null", + "isCorrect": "false" + } + ] + }, + { + "questionText": "کد زیر چه چیزی را برمی گرداند: '1' === 1", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "false" + }, + { + "answerText": "false", + "isCorrect": "true" + }, + { + "answerText": "null", + "isCorrect": "false" + } + ] + }, + { + "questionText": "عملگر صحیح را برای بیان منطق "یا" انتخاب کنید", + "answerOptions": [ + { + "answerText": "a | b", + "isCorrect": "false" + }, + { + "answerText": "a || b", + "isCorrect": "true" + }, + { + "answerText": "a or b", + "isCorrect": "false" + } + ] + } + ] + }, + { + "id": 13, + "title": "درس 7 - مبانی جاوا اسکریپت - آرایه ها و حلقه ها: آزمون قبل از سخنرانی", + "quiz": [ + { + "questionText": "برای ارجاع به یک آیتم خاص در یک آرایه، از a استفاده کنید", + "answerOptions": [ + { + "answerText": "براکت مربع []", + "isCorrect": "false" + }, + { + "answerText": "فهرست مطالب", + "isCorrect": "true" + }, + { + "answerText": "آکولاد {}", + "isCorrect": "false" + } + ] + }, + { + "questionText": "چگونه می توان تعداد آیتم های یک آرایه را بدست آورد؟", + "answerOptions": [ + { + "answerText": "روش 'len(array)'", + "isCorrect": "false" + }, + { + "answerText": "اندازه ویژگی روی آرایه", + "isCorrect": "false" + }, + { + "answerText": "ویژگی length در آرایه", + "isCorrect": "true" + } + ] + }, + { + "questionText": "در جاوا اسکریپت، ایندکس ها با شروع شروع می شوند", + "answerOptions": [ + { + "answerText": "0", + "isCorrect": "true" + }, + { + "answerText": "1", + "isCorrect": "false" + }, + { + "answerText": "2", + "isCorrect": "false" + } + ] + } + ] + }, + { + "id": 14, + "title": "درس 7 - مبانی جاوا اسکریپت - آرایه ها و حلقه ها: آزمون بعد از سخنرانی", + "quiz": [ + { + "questionText": "چه بخشی از یک حلقه for را باید تغییر دهید تا تکرار آن 5 افزایش یابد؟", + "answerOptions": [ + { + "answerText": "وضعیت", + "isCorrect": "false" + }, + { + "answerText": "پیشخوان", + "isCorrect": "false" + }, + { + "answerText": "تکرار-بیان", + "isCorrect": "true" + } + ] + }, + { + "questionText": "تفاوت بین while و for-loop چیست؟", + "answerOptions": [ + { + "answerText": "یک حلقه for دارای شمارنده و تکرار-عبارت است که در آن while فقط یک شرط دارد", + "isCorrect": "true" + }, + { + "answerText": "A while دارای یک شمارنده و عبارت تکراری است که در آن حلقه for فقط یک شرط دارد", + "isCorrect": "false" + }, + { + "answerText": "آنها یکسان هستند، فقط یک نام مستعار برای یکدیگر", + "isCorrect": "false" + } + ] + }, + { + "questionText": "با توجه به کد (بگذارید i=1; i < 5; i++)، چند تکرار انجام دهد؟", + "answerOptions": [ + { + "answerText": "5", + "isCorrect": "false" + }, + { + "answerText": "4", + "isCorrect": "true" + } + ] + } + ] + }, + { + "id": 15, + "title": "درس 8 - پروژه تراریوم - مقدمه ای بر HTML: آزمون قبل از سخنرانی", + "quiz": [ + { + "questionText": "HTML مخفف عبارت HyperText Mockup Language است", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "false" + }, + { + "answerText": "false", + "isCorrect": "true" + } + ] + }, + { + "questionText": "همه تگ های HTML به هر دو تگ باز و بسته نیاز دارند", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "false" + }, + { + "answerText": "false", + "isCorrect": "true" + } + ] + }, + { + "questionText": "استفاده از نشانه گذاری معنایی بسیار مهم است", + "answerOptions": [ + { + "answerText": "خوانایی کد", + "isCorrect": "false" + }, + { + "answerText": "صفحه خوان ها", + "isCorrect": "true" + }, + { + "answerText": "maintenance", + "isCorrect": "false" + } + ] + } + ] + }, + { + "id": 16, + "title": "درس 8 - پروژه تراریوم - مقدمه ای بر HTML: آزمون بعد از سخنرانی", + "quiz": [ + { + "questionText": "Span ها و Div ها قابل تعویض هستند", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "false" + }, + { + "answerText": "false", + "isCorrect": "true" + } + ] + }, + { + "questionText": "سر یک سند HTML می تواند شامل موارد زیر باشد:", + "answerOptions": [ + { + "answerText": "برچسب عنوان", + "isCorrect": "false" + }, + { + "answerText": "فراداده", + "isCorrect": "false" + }, + { + "answerText": "همه موارد بالا", + "isCorrect": "true" + } + ] + }, + { + "questionText": "شما نمی توانید از برچسب های منسوخ شده در نشانه گذاری خود استفاده کنید", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "false" + }, + { + "answerText": "false", + "isCorrect": "false" + }, + { + "answerText": "false, اما آنها به دلایل خوبی منسوخ شده اند", + "isCorrect": "true" + } + ] + } + ] + }, + { + "id": 17, + "title": "درس 9 - پروژه تراریوم - مقدمه ای بر CSS: آزمون قبل از سخنرانی", + "quiz": [ + { + "questionText": "عناصر HTML باید دارای یک کلاس یا یک شناسه برای استایل دهی شوند", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "false" + }, + { + "answerText": "false", + "isCorrect": "true" + } + ] + }, + { + "questionText": "CSS مخفف عبارت Complete Style Sheets است", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "false" + }, + { + "answerText": "false", + "isCorrect": "true" + } + ] + }, + { + "questionText": "از CSS می توان برای ساخت انیمیشن استفاده کرد", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "true" + }, + { + "answerText": "false", + "isCorrect": "false" + } + ] + } + ] + }, + { + "id": 18, + "title": "درس 9 - پروژه تراریوم - مقدمه ای بر CSS: آزمون بعد از سخنرانی", + "quiz": [ + { + "questionText": "می توانید CSS را مستقیماً در قسمت head فایل HTML خود بنویسید", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "true" + }, + { + "answerText": "false", + "isCorrect": "false" + } + ] + }, + { + "questionText": "همیشه لازم است که CSS را در برنامه خود قرار دهید", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "false" + }, + { + "answerText": "false", + "isCorrect": "false" + }, + { + "answerText": "false, اما اگر می خواهید خوب به نظر برسد احتمالاً به CSS نیاز دارید", + "isCorrect": "true" + } + ] + }, + { + "questionText": "از کدام ابزار مرورگر می توان برای بررسی CSS استفاده کرد؟", + "answerOptions": [ + { + "answerText": "عناصر", + "isCorrect": "false" + }, + { + "answerText": "سبک ها", + "isCorrect": "true" + }, + { + "answerText": "شبکه", + "isCorrect": "false" + } + ] + } + ] + }, + { + "id": 19, + "title": "درس 10 - پروژه تراریوم - دستکاری DOM و بسته شدن: آزمون قبل از سخنرانی", + "quiz": [ + { + "questionText": "DOM مخفف Document Object Management است", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "false" + }, + { + "answerText": "false", + "isCorrect": "true" + } + ] + }, + { + "questionText": "DOM را می توان به عنوان یک درخت در نظر گرفت", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "true" + }, + { + "answerText": "false", + "isCorrect": "false" + } + ] + }, + { + "questionText": "با استفاده از Web API، می توانید DOM را دستکاری کنید", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "true" + }, + { + "answerText": "false", + "isCorrect": "false" + } + ] + } + ] + }, + { + "id": 20, + "title": "درس 10 - پروژه تراریوم - دستکاری DOM و بسته شدن: آزمون بعد از سخنرانی", + "quiz": [ + { + "questionText": "DOM مدلی برای نمایش یک سند در وب است", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "true" + }, + { + "answerText": "false", + "isCorrect": "false" + } + ] + }, + { + "questionText": "از بسته های جاوا اسکریپت برای انجام موارد زیر استفاده کنید:", + "answerOptions": [ + { + "answerText": "توابع را در توابع بنویسید", + "isCorrect": "true" + }, + { + "answerText": "DOM را محصور کنید", + "isCorrect": "false" + }, + { + "answerText": "بستن بلوک های اسکریپت", + "isCorrect": "false" + } + ] + }, + { + "questionText": "جای خالی را پر کنید: بسته شدن زمانی مفید است که یک یا چند تابع نیاز به دسترسی به یک تابع بیرونی دارند...", + "answerOptions": [ + { + "answerText": "آرایه ها", + "isCorrect": "false" + }, + { + "answerText": "محدوده", + "isCorrect": "true" + }, + { + "answerText": "کارکرد", + "isCorrect": "false" + } + ] + } + ] + }, + { + "id": 21, + "title": "درس 11 - بازی تایپ: آزمون قبل از سخنرانی", + "quiz": [ + { + "questionText": "برنامه نویسی رویداد محور زمانی است که یک کاربر", + "answerOptions": [ + { + "answerText": "روی یک دکمه کلیک می کند", + "isCorrect": "false" + }, + { + "answerText": "یک مقدار را تغییر می دهد", + "isCorrect": "false" + }, + { + "answerText": "با صفحه تعامل دارد", + "isCorrect": "false" + }, + { + "answerText": "هر یک از موارد فوق", + "isCorrect": "true" + } + ] + }, + { + "questionText": "در برنامه نویسی رویه ای، توابع نامیده می شوند", + "answerOptions": [ + { + "answerText": "هر زمان", + "isCorrect": "false" + }, + { + "answerText": "به ترتیب خاصی", + "isCorrect": "true" + }, + { + "answerText": "چپ به راست", + "isCorrect": "false" + } + ] + }, + { + "questionText": "روش جهانی ارائه شده در DOM برای ثبت کنترل کننده رویداد نامیده می شود", + "answerOptions": [ + { + "answerText": "addEventListener", + "isCorrect": "true" + }, + { + "answerText": "addListener", + "isCorrect": "false" + }, + { + "answerText": "addEvent", + "isCorrect": "false" + } + ] + } + ] + }, + { + "id": 22, + "title": "درس 11 - بازی تایپ: آزمون بعد از سخنرانی", + "quiz": [ + { + "questionText": "تقریباً هر کاری که کاربر در یک صفحه انجام می دهد، یک رویداد را مطرح می کند", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "true" + }, + { + "answerText": "false", + "isCorrect": "false" + } + ] + }, + { + "questionText": "رویدادهای رایج شامل", + "answerOptions": [ + { + "answerText": "click_event", + "isCorrect": "false" + }, + { + "answerText": "select_event", + "isCorrect": "false" + }, + { + "answerText": "input_event", + "isCorrect": "false" + }, + { + "answerText": "همه اینها", + "isCorrect": "true" + } + ] + }, + { + "questionText": "می توانید از توابع ناشناس برای ایجاد کنترل کننده رویداد استفاده کنید", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "true" + }, + { + "answerText": "false", + "isCorrect": "false" + } + ] + } + ] + }, + { + "id": 23, + "title": "درس 12 - پروژه توسعه مرورگر - همه چیز درباره مرورگرها: آزمون قبل از سخنرانی", + "quiz": [ + { + "questionText": "شما می توانید پسوندهای مرورگر را از", + "answerOptions": [ + { + "answerText": "والمارت", + "isCorrect": "false" + }, + { + "answerText": "فروشگاه افزونه مرورگر", + "isCorrect": "true" + }, + { + "answerText": "فروشگاه App", + "isCorrect": "false" + } + ] + }, + { + "questionText": "NPM مخفف", + "answerOptions": [ + { + "answerText": "Node Package Manager", + "isCorrect": "true" + }, + { + "answerText": "Netscape Primary Mix", + "isCorrect": "false" + }, + { + "answerText": "Natural Processing Manager", + "isCorrect": "false" + } + ] + }, + { + "questionText": "مرورگر شما می تواند صفحات وب را هم به صورت ایمن و هم ناامن ارائه دهد", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "true" + }, + { + "answerText": "false", + "isCorrect": "false" + } + ] + } + ] + }, + { + "id": 24, + "title": "درس 12 - پروژه توسعه مرورگر - همه چیز درباره مرورگرها: آزمون بعد از سخنرانی", + "quiz": [ + { + "questionText": "شبکه جهانی وب توسط اختراع شد", + "answerOptions": [ + { + "answerText": "Tom Barnard-Loft", + "isCorrect": "false" + }, + { + "answerText": "Tim Berners-Lee", + "isCorrect": "true" + }, + { + "answerText": "Trish Berth-Pool", + "isCorrect": "false" + } + ] + }, + { + "questionText": "اولین مرورگر نامیده شد", + "answerOptions": [ + { + "answerText": "WorldWideWeb", + "isCorrect": "true" + }, + { + "answerText": "Mozilla", + "isCorrect": "false" + }, + { + "answerText": "Netscape", + "isCorrect": "false" + } + ] + }, + { + "questionText": "مرورگرها می توانند تاریخچه مرور کاربر را ذخیره کنند", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "true" + }, + { + "answerText": "false", + "isCorrect": "false" + } + ] + } + ] + }, + { + "id": 25, + "title": "درس 13 - پروژه افزونه مرورگر - فراخوانی یک API، استفاده از فضای ذخیره‌سازی محلی: آزمون قبل از سخنرانی", + "quiz": [ + { + "questionText": "API ها مخفف هستند", + "answerOptions": [ + { + "answerText": "رابط های برنامه نویسی کاربردی", + "isCorrect": "true" + }, + { + "answerText": "یک استنتاج برنامه نویسی", + "isCorrect": "false" + }, + { + "answerText": "ضد نیت های اثبات شده", + "isCorrect": "false" + } + ] + }, + { + "questionText": "از یک API برای تعامل استفاده کنید", + "answerOptions": [ + { + "answerText": "یکی دیگر از دارایی های متصل به وب", + "isCorrect": "false" + }, + { + "answerText": "یک پایگاه داده", + "isCorrect": "false" + }, + { + "answerText": "هر یک از موارد بالا", + "isCorrect": "true" + } + ] + }, + { + "questionText": "هر کسی می تواند یک API ایجاد کند", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "true" + }, + { + "answerText": "false", + "isCorrect": "false" + } + ] + } + ] + }, + { + "id": 26, + "title": "درس 13 - پروژه افزونه مرورگر - فراخوانی یک API، استفاده از فضای ذخیره‌سازی محلی: آزمون پس از سخنرانی", + "quiz": [ + { + "questionText": "هر بار که پنجره مرورگر را ببندید LocalStorage پاک می شود", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "false" + }, + { + "answerText": "false", + "isCorrect": "true" + } + ] + }, + { + "questionText": "هر بار که پنجره مرورگر را ببندید LocalStorage پاک می شود", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "true" + }, + { + "answerText": "false", + "isCorrect": "false" + } + ] + }, + { + "questionText": "REST در یک زمینه API مخفف آن است", + "answerOptions": [ + { + "answerText": "انتقال دولتی نمایندگی", + "isCorrect": "true" + }, + { + "answerText": "بازگشت وظایف دولت", + "isCorrect": "false" + }, + { + "answerText": "رندر حالت به مرورگر", + "isCorrect": "false" + } + ] + } + ] + }, + { + "id": 27, + "title": "درس 14 - پروژه توسعه مرورگر - در مورد وظایف پس زمینه و عملکرد بیاموزید: آزمون قبل از سخنرانی", + "quiz": [ + { + "questionText": "عملکرد اپلیکیشن خود را تست کنید", + "answerOptions": [ + { + "answerText": "استفاده از ابزارهای مرورگر", + "isCorrect": "true" + }, + { + "answerText": "استفاده از مرورگر با استفاده از بسته های نرم افزاری جداگانه", + "isCorrect": "false" + }, + { + "answerText": "به صورت دستی", + "isCorrect": "false" + } + ] + }, + { + "questionText": ""عملکرد" ​​یک وب سایت تجزیه و تحلیل است", + "answerOptions": [ + { + "answerText": "How fast it loads", + "isCorrect": "false" + }, + { + "answerText": "کد روی آن چقدر سریع اجرا می شود", + "isCorrect": "false" + }, + { + "answerText": "هر دو مورد بالا", + "isCorrect": "true" + } + ] + }, + { + "questionText": "به طور کلی، "وزن" صفحات وب در چند سال گذشته بوده است", + "answerOptions": [ + { + "answerText": "سبک تر شد", + "isCorrect": "false" + }, + { + "answerText": "سنگین تر شد", + "isCorrect": "true" + }, + { + "answerText": "همینطور ماند", + "isCorrect": "false" + } + ] + } + ] + }, + { + "id": 28, + "title": "درس 14 - پروژه توسعه مرورگر - در مورد وظایف پس زمینه و عملکرد بیاموزید: آزمون بعد از سخنرانی", + "quiz": [ + { + "questionText": "برای اینکه دید بهتری از عملکرد سایت خود داشته باشید، حافظه پنهان آن را پاک کرده و در پروفایلر بارگذاری مجدد کنید", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "true" + }, + { + "answerText": "false", + "isCorrect": "false" + } + ] + }, + { + "questionText": "پسوندهای مرورگر ذاتا کارایی دارند", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "false" + }, + { + "answerText": "false", + "isCorrect": "true" + } + ] + }, + { + "questionText": "موارد زیر را برای تنگناهای عملکرد تجزیه و تحلیل کنید", + "answerOptions": [ + { + "answerText": "پیمایش های DOM", + "isCorrect": "false" + }, + { + "answerText": "بهینه سازی جاوا اسکریپت", + "isCorrect": "false" + }, + { + "answerText": "مدیریت دارایی", + "isCorrect": "false" + }, + { + "answerText": "همه موارد بالا", + "isCorrect": "true" + } + ] + } + ] + }, + { + "id": 29, + "title": "درس 15 - بازی فضایی - مقدمه: آزمون قبل از سخنرانی", + "quiz": [ + { + "questionText": "جاوا اسکریپت یک زبان غیرمحبوب برای ساخت بازی است", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "false" + }, + { + "answerText": "false", + "isCorrect": "true" + } + ] + }, + { + "questionText": "Pub/Sub یک الگوی ترجیحی برای مدیریت دارایی ها و جریان بازی است", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "true" + }, + { + "answerText": "false", + "isCorrect": "false" + } + ] + }, + { + "questionText": "وراثت شی را می توان با استفاده از کلاس ها یا ترکیب انجام داد", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "true" + }, + { + "answerText": "false", + "isCorrect": "false" + } + ] + } + ] + }, + { + "id": 30, + "title": "درس 15 - بازی فضایی - مقدمه: آزمون پس از سخنرانی", + "quiz": [ + { + "questionText": "طبقات برای نسبت دادن به رفتارها به وراثت متکی هستند", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "true" + }, + { + "answerText": "false", + "isCorrect": "false" + } + ] + }, + { + "questionText": "ترکیب، الگوی طراحی ترجیحی برای اشیاء بازی است", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "false" + }, + { + "answerText": "false", + "isCorrect": "true" + } + ] + }, + { + "questionText": "Pub/Sub مخفف:", + "answerOptions": [ + { + "answerText": "Publish/Subscribe", + "isCorrect": "true" + }, + { + "answerText": "Print/Staple", + "isCorrect": "false" + }, + { + "answerText": "Publish/Sanitize", + "isCorrect": "false" + } + ] + } + ] + }, + { + "id": 31, + "title": "درس 16 - بازی فضایی - قرعه کشی قهرمان و هیولا روی بوم: مسابقه قبل از سخنرانی", + "quiz": [ + { + "questionText": "عنصر Canvas چیزی است که برای ترسیم روی صفحه استفاده می کنید", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "true" + }, + { + "answerText": "false", + "isCorrect": "false" + } + ] + }, + { + "questionText": "شما فقط می توانید اشکال هندسی ساده را با استفاده از Canvas API ترسیم کنید", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "false" + }, + { + "answerText": "false", + "isCorrect": "true" + } + ] + }, + { + "questionText": "نقطه 0.0 در پایین سمت چپ است", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "false" + }, + { + "answerText": "false", + "isCorrect": "true" + } + ] + } + ] + }, + { + "id": 32, + "title": "درس 16 - بازی فضایی - قرعه کشی قهرمان و هیولا روی بوم: آزمون بعد از سخنرانی", + "quiz": [ + { + "questionText": "می توانید عملیات طراحی را مستقیماً روی بوم انجام دهید", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "false" + }, + { + "answerText": "false", + "isCorrect": "true" + } + ] + }, + { + "questionText": "شما به رویداد onload گوش می دهید تا بدانید چه زمانی یک تصویر به صورت ناهمزمان بارگیری شده است", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "true" + }, + { + "answerText": "false", + "isCorrect": "false" + } + ] + }, + { + "questionText": "شما با عملیاتی به نام تصاویر را روی یک صفحه می کشید:", + "answerOptions": [ + { + "answerText": "paintImage()", + "isCorrect": "false" + }, + { + "answerText": "drawImage()", + "isCorrect": "true" + }, + { + "answerText": "draw()", + "isCorrect": "false" + } + ] + } + ] + }, + { + "id": 33, + "title": "درس 17 - بازی فضایی - اضافه کردن حرکت: آزمون قبل از سخنرانی", + "quiz": [ + { + "questionText": "هر شی روی صفحه می تواند رویدادهای صفحه کلید را دریافت کند", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "true" + }, + { + "answerText": "false", + "isCorrect": "false" + } + ] + }, + { + "questionText": "می توانید از همین روش برای گوش دادن به رویدادهای کلیدی و رویدادهای ماوس استفاده کنید", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "false" + }, + { + "answerText": "false", + "isCorrect": "true" + } + ] + }, + { + "questionText": "برای اینکه همه چیز در یک بازه زمانی منظم اتفاق بیفتد، از چه تابعی استفاده می کنید؟", + "answerOptions": [ + { + "answerText": "setInterval()", + "isCorrect": "true" + }, + { + "answerText": "setTimeout()", + "isCorrect": "false" + }, + { + "answerText": "sleep()", + "isCorrect": "false" + } + ] + } + ] + }, + { + "id": 34, + "title": "Lesson 17 - Space Game - Adding Motion: Post-Lecture Quiz", + "quiz": [ + { + "questionText": "Lesson 17 - Space Game - Adding Motion: Post-Lecture Quiz", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "false" + }, + { + "answerText": "false", + "isCorrect": "true" + } + ] + }, + { + "questionText": "حلقه بازی چیست؟", + "answerOptions": [ + { + "answerText": "عملکردی که تضمین می کند بازی می تواند دوباره راه اندازی شود", + "isCorrect": "false" + }, + { + "answerText": "عملکردی که تعیین می کرد بازی چقدر باید اجرا شود", + "isCorrect": "false" + }, + { + "answerText": "تابعی که در فواصل زمانی معین فراخوانی می شود و آنچه را که کاربر باید ببیند ترسیم می کند", + "isCorrect": "true" + } + ] + }, + { + "questionText": "یک مورد خوب برای طراحی مجدد صفحه نمایش است", + "answerOptions": [ + { + "answerText": "یک تعامل کاربر اتفاق افتاد", + "isCorrect": "false" + }, + { + "answerText": "چیزی حرکت کرده است", + "isCorrect": "true" + }, + { + "answerText": "زمان گذشت", + "isCorrect": "false" + } + ] + } + ] + }, + { + "id": 35, + "title": "درس 18 - بازی فضایی - اضافه کردن لیزر و تشخیص برخورد: آزمون قبل از سخنرانی", + "quiz": [ + { + "questionText": "تشخیص برخورد نحوه برخورد دو چیز است", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "true" + }, + { + "answerText": "false", + "isCorrect": "false" + } + ] + }, + { + "questionText": "چگونه می توانیم یک مورد را از صفحه نمایش حذف کنیم؟", + "answerOptions": [ + { + "answerText": "با زباله جمع کن تماس بگیر", + "isCorrect": "false" + }, + { + "answerText": "آن را به‌عنوان مرده علامت‌گذاری کنید، دفعه بعد که صفحه را کشیدیم فقط اشیاء مرده را رنگ کنید", + "isCorrect": "true" + }, + { + "answerText": "مورد را روی یک مختصات منفی قرار دهید", + "isCorrect": "false" + } + ] + }, + { + "questionText": "یک راه خوب برای شبیه سازی پرتاب لیزر در جاوا اسکریپت این است:", + "answerOptions": [ + { + "answerText": "یک عنصر بصری را به یک رویداد کلیدی پاسخ دهد", + "isCorrect": "true" + }, + { + "answerText": "گیف های متحرک بسازید", + "isCorrect": "false" + }, + { + "answerText": "دشمنان را در فواصل زمانی منفجر کنید", + "isCorrect": "false" + } + ] + } + ] + }, + { + "id": 36, + "title": "درس 18 - بازی فضایی - اضافه کردن لیزر و تشخیص برخورد: آزمون بعد از سخنرانی", + "quiz": [ + { + "questionText": "در تشخیص برخورد شما دو مورد را با هم مقایسه می کنید", + "answerOptions": [ + { + "answerText": "دایره ها و اینکه آیا آنها تلاقی می کنند یا خیر", + "isCorrect": "false" + }, + { + "answerText": "مستطیل ها و اینکه آیا آنها همدیگر را قطع می کنند", + "isCorrect": "true" + }, + { + "answerText": "فاصله بین دو نقطه", + "isCorrect": "false" + } + ] + }, + { + "questionText": "دلیل اجرای یک افکت خنک کننده به این دلیل است", + "answerOptions": [ + { + "answerText": "بازی را سخت تر می کند زیرا نمی توانید به طور مکرر لیزر را برای از بین بردن دشمنان شلیک کنید", + "isCorrect": "false" + }, + { + "answerText": "جاوا اسکریپت فقط می تواند تعداد معینی رویداد را در واحد زمان تولید کند، بنابراین باید آنها را محدود کنید", + "isCorrect": "true" + } + ] + }, + { + "questionText": "ثابت ها در کد قابل شناسایی هستند زیرا", + "answerOptions": [ + { + "answerText": "با حروف بزرگ نوشته می شوند", + "isCorrect": "true" + }, + { + "answerText": "اسامی خاصی دارند", + "isCorrect": "false" + }, + { + "answerText": "به این شکل در کباب نوشته شده اند", + "isCorrect": "false" + } + ] + } + ] + }, + { + "id": 37, + "title": "درس 19 - بازی فضایی - امتیازدهی و زندگی: آزمون قبل از سخنرانی", + "quiz": [ + { + "questionText": "چگونه با استفاده از عنصر Canvas، متنی را بر روی صفحه می‌کشیم؟", + "answerOptions": [ + { + "answerText": "متن را در یک عنصر div یا span قرار دهید", + "isCorrect": "false" + }, + { + "answerText": "() drawText را در عنصر Canvas فراخوانی کنید", + "isCorrect": "false" + }, + { + "answerText": "FillText() را در شیء متن فراخوانی کنید", + "isCorrect": "true" + } + ] + }, + { + "questionText": "چرا مفهوم "زندگی" را در یک بازی دارید؟", + "answerOptions": [ + { + "answerText": "برای اینکه نشان دهید چقدر می توانید خسارت وارد کنید", + "isCorrect": "false" + }, + { + "answerText": "به طوری که بازی بلافاصله تمام نمی شود، اما قبل از پایان بازی n تعداد فرصت دارید", + "isCorrect": "true" + } + ] + }, + { + "questionText": "با استفاده از بوم به متن رنگ اضافه کنید", + "answerOptions": [ + { + "answerText": "fillColor", + "isCorrect": "false" + }, + { + "answerText": "fillStyle", + "isCorrect": "true" + }, + { + "answerText": "textAlign", + "isCorrect": "false" + } + ] + } + ] + }, + { + "id": 38, + "title": "درس 19 - بازی فضایی - امتیازدهی و زندگی: آزمون بعد از سخنرانی", + "quiz": [ + { + "questionText": "یک راه سرگرم کننده برای نشان دادن چند زندگی از یک بازیکن چیست؟", + "answerOptions": [ + { + "answerText": "تعدادی کشتی", + "isCorrect": "false" + }, + { + "answerText": "یک سیستم امتیازی", + "isCorrect": "true" + } + ] + }, + { + "questionText": "چگونه متن را با استفاده از عنصر Canvas در وسط صفحه قرار می دهید؟", + "answerOptions": [ + { + "answerText": "شما از Flexbox استفاده می کنید", + "isCorrect": "false" + }, + { + "answerText": "شما دستور می دهید که متن در مختصات x عرض پنجره مشتری رسم شود", + "isCorrect": "true" + }, + { + "answerText": "شما ویژگی textAlign را روی مرکز ارزش در شیء زمینه تنظیم می کنید", + "isCorrect": "false" + } + ] + }, + { + "questionText": "در کد، یک زندگی مانند این را کسر کنید:", + "answerOptions": [ + { + "answerText": "this.life-", + "isCorrect": "false" + }, + { + "answerText": "this.life--", + "isCorrect": "true" + }, + { + "answerText": "this.life++", + "isCorrect": "false" + } + ] + } + ] + }, + { + "id": 39, + "title": "درس 20 - بازی فضایی - پایان و شروع مجدد: آزمون قبل از سخنرانی", + "quiz": [ + { + "questionText": "چه زمانی زمان مناسبی برای شروع مجدد بازی است", + "answerOptions": [ + { + "answerText": "زمانی که یک بازیکن برنده یا می بازد", + "isCorrect": "true" + }, + { + "answerText": "هر گاه", + "isCorrect": "false" + } + ] + }, + { + "questionText": "کی باید یک بازی تمام شود", + "answerOptions": [ + { + "answerText": "زمانی که یک کشتی دشمن منهدم می شود", + "isCorrect": "false" + }, + { + "answerText": "وقتی یک کشتی قهرمان نابود می شود", + "isCorrect": "true" + }, + { + "answerText": "وقتی امتیاز جمع می شود", + "isCorrect": "false" + } + ] + }, + { + "questionText": "یک راه خوب برای اضافه کردن یک سطح به بازی خود این است:", + "answerOptions": [ + { + "answerText": "مقدار امتیاز لازم برای تکمیل یک سطح مشخص را افزایش دهید", + "isCorrect": "true" + }, + { + "answerText": "بازیکنان بیشتری را به بازی اضافه کنید", + "isCorrect": "false" + }, + { + "answerText": "گرافیک بیشتری به بازی اضافه کنید", + "isCorrect": "false" + } + ] + } + ] + }, + { + "id": 40, + "title": "درس 20 - بازی فضایی - پایان و شروع مجدد: آزمون پس از سخنرانی", + "quiz": [ + { + "questionText": "وقتی شرط پایان بازی برآورده شد، چه الگویی مناسب برای استفاده است؟", + "answerOptions": [ + { + "answerText": "نمایش یک پیام مناسب", + "isCorrect": "false" + }, + { + "answerText": "دست از بازی بردارید", + "isCorrect": "false" + }, + { + "answerText": "یک پیام مناسب را نمایش دهید، به پخش کننده پیشنهاد دهید که مجدداً راه اندازی شود، و نمایش دهید که چه کلیدی را برای آن عمل بزند", + "isCorrect": "true" + } + ] + }, + { + "questionText": "شما باید فقط زمانی که بازی به پایان رسیده است، راه اندازی مجدد ارائه دهید", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "false" + }, + { + "answerText": "false", + "isCorrect": "true" + } + ] + }, + { + "questionText": "یک راه خوب برای پاک کردن EventEmitter هنگام پایان دادن به بازی این است:", + "answerOptions": [ + { + "answerText": "پاک کردن شنوندگان", + "isCorrect": "true" + }, + { + "answerText": "پاک کردن شنوندگان", + "isCorrect": "false" + }, + { + "answerText": "بستن پنجره بازی", + "isCorrect": "false" + } + ] + } + ] + }, + { + "id": 41, + "title": "درس 21 - پروژه بانک - الگوهای HTML و مسیرها در یک برنامه وب: آزمون قبل از سخنرانی", + "quiz": [ + { + "questionText": "برای نمایش صفحات مختلف در یک برنامه وب باید چندین فایل HTML ایجاد کنید", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "false" + }, + { + "answerText": "false", + "isCorrect": "true" + } + ] + }, + { + "questionText": "می‌توانید داده‌ها را به صورت محلی در یک برنامه وب ذخیره و نگهداری کنید", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "true" + }, + { + "answerText": "false", + "isCorrect": "false" + } + ] + }, + { + "questionText": "بهترین ارائه دهنده داده برای یک برنامه وب چیست؟", + "answerOptions": [ + { + "answerText": "یک پایگاه داده محلی", + "isCorrect": "false" + }, + { + "answerText": "یک شی جاوا اسکریپت", + "isCorrect": "false" + }, + { + "answerText": "سروری با JSON API", + "isCorrect": "true" + } + ] + } + ] + }, + { + "id": 42, + "title": "درس 21 - الگوهای HTML پروژه بانک و مسیرها در یک برنامه وب: آزمون پس از سخنرانی", + "quiz": [ + { + "questionText": "قالب های HTML به طور پیش فرض بخشی از DOM هستند", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "false" + }, + { + "answerText": "false", + "isCorrect": "true" + } + ] + }, + { + "questionText": "کدام قسمت از URL برای مسیریابی مورد نیاز است؟", + "answerOptions": [ + { + "answerText": "window.location.pathname", + "isCorrect": "false" + }, + { + "answerText": "window.location.origin", + "isCorrect": "false" + }, + { + "answerText": "both", + "isCorrect": "true" + } + ] + }, + { + "questionText": "نام رویدادی که هنگام فراخوانی تابع history.pushState() راه اندازی می شود چیست؟", + "answerOptions": [ + { + "answerText": "pushstate", + "isCorrect": "false" + }, + { + "answerText": "popstate", + "isCorrect": "true" + }, + { + "answerText": "navigate", + "isCorrect": "false" + } + ] + } + ] + }, + { + "id": 43, + "title": "درس 22 - پروژه بانک - ساخت فرم ورود و ثبت نام: آزمون قبل از سخنرانی", + "quiz": [ + { + "questionText": "فرم‌های HTML به شما امکان می‌دهند ورودی کاربر را بدون استفاده از جاوا اسکریپت به سرور ارسال کنید", + "answerOptions": [ + { + "answerText": "true", + "isCorrect": "true" + }, + { + "answerText": "false", + "isCorrect": "false" + } + ] + }, + { + "questionText": "عناصر