chore(learn): Applied MDX format to Chinese curriculum files (#40462)
This commit is contained in:
Randell Dawson
GitHub
@ -1,37 +1,16 @@
|
||||
---
|
||||
id: bd7156d8c242eddfaeb5bd13
|
||||
title: 建立一个露营者排行榜
|
||||
challengeType: 3
|
||||
videoUrl: ''
|
||||
title: 建立一个露营者排行榜
|
||||
---
|
||||
|
||||
## Description
|
||||
<section id="description"> <strong>目标：</strong>构建一个功能类似于此的<a href="https://codepen.io" target="_blank">CodePen.io</a>应用程序： <a href="https://codepen.io/freeCodeCamp/full/eZGMjp/" target="_blank">https</a> <strong>：</strong> <a href="https://codepen.io" target="_blank">//codepen.io/freeCodeCamp/full/eZGMjp/</a> 。完成以下<a href="https://en.wikipedia.org/wiki/User_story" target="_blank">用户故事</a> 。使用您需要的任何库或API。给它你自己的个人风格。 <strong>用户故事：</strong>我可以看到freeCodeCamp露营者的表格，他们在过去30天内获得了最多的布朗尼积分。 <strong>用户故事：</strong>我可以看到他们在过去30天内获得了多少布朗尼积分，以及他们获得了多少积分。 <strong>用户故事：</strong>我可以根据他们在过去30天内获得的布朗尼点数和他们总共获得的布朗尼点数来对列表进行排序。 <strong>提示：</strong>要获得过去30天的前100名营员： <a href="https://fcctop100.herokuapp.com/api/fccusers/top/recent" target="_blank">https</a> ： <a href="https://fcctop100.herokuapp.com/api/fccusers/top/recent" target="_blank">//fcctop100.herokuapp.com/api/fccusers/top/recent</a> 。 <strong>提示：</strong>要获得有史以来前100名的露营者： <a href="https://fcctop100.herokuapp.com/api/fccusers/top/alltime" target="_blank">https</a> ： <a href="https://fcctop100.herokuapp.com/api/fccusers/top/alltime" target="_blank">//fcctop100.herokuapp.com/api/fccusers/top/alltime</a> 。如果卡住，请记得使用<a href="https://forum.freecodecamp.org/t/how-to-get-help-when-you-are-stuck-coding/19514" target="_blank">Read-Search-Ask</a> 。完成后，单击“我已完成此挑战”按钮并包含指向CodePen的链接。您可以通过Facebook上的朋友分享您的项目反馈。 </section>
|
||||
# --description--
|
||||
|
||||
## Instructions
|
||||
<section id="instructions">
|
||||
</section>
|
||||
**目标：** 构建一个功能类似于此的[CodePen.io](https://codepen.io)应用程序： [https](https://codepen.io/freeCodeCamp/full/eZGMjp/) **：** [//codepen.io/freeCodeCamp/full/eZGMjp/](https://codepen.io) 。完成以下[用户故事](https://en.wikipedia.org/wiki/User_story) 。使用您需要的任何库或API。给它你自己的个人风格。 **用户故事：** 我可以看到freeCodeCamp露营者的表格，他们在过去30天内获得了最多的布朗尼积分。 **用户故事：** 我可以看到他们在过去30天内获得了多少布朗尼积分，以及他们获得了多少积分。 **用户故事：** 我可以根据他们在过去30天内获得的布朗尼点数和他们总共获得的布朗尼点数来对列表进行排序。 **提示：** 要获得过去30天的前100名营员： [https](https://fcctop100.herokuapp.com/api/fccusers/top/recent) ： [//fcctop100.herokuapp.com/api/fccusers/top/recent](https://fcctop100.herokuapp.com/api/fccusers/top/recent) 。 **提示：** 要获得有史以来前100名的露营者： [https](https://fcctop100.herokuapp.com/api/fccusers/top/alltime) ： [//fcctop100.herokuapp.com/api/fccusers/top/alltime](https://fcctop100.herokuapp.com/api/fccusers/top/alltime) 。如果卡住，请记得使用[Read-Search-Ask](https://forum.freecodecamp.org/t/how-to-get-help-when-you-are-stuck-coding/19514) 。完成后，单击“我已完成此挑战”按钮并包含指向CodePen的链接。您可以通过Facebook上的朋友分享您的项目反馈。
|
||||
|
||||
## Tests
|
||||
<section id='tests'>
|
||||
# --hints--
|
||||
|
||||
```yml
|
||||
tests: []
|
||||
|
||||
```
|
||||
# --solutions--
|
||||
|
||||
</section>
|
||||
|
||||
## Challenge Seed
|
||||
<section id='challengeSeed'>
|
||||
|
||||
</section>
|
||||
|
||||
## Solution
|
||||
<section id='solution'>
|
||||
|
||||
```js
|
||||
// solution required
|
||||
```
|
||||
|
||||
/section>
|
||||
|
||||
@ -1,37 +1,16 @@
|
||||
---
|
||||
id: 5a5d02bd919fcf9ca8cf46cb
|
||||
title: 构建一个明亮的应用程序
|
||||
challengeType: 3
|
||||
videoUrl: ''
|
||||
title: 构建一个明亮的应用程序
|
||||
---
|
||||
|
||||
## Description
|
||||
<section id="description"> <strong>目标：</strong>构建一个功能类似于此的<a href="https://codepen.io" target="_blank">CodePen.io</a>应用程序： <a href="https://codepen.io/freeCodeCamp/full/eyLYXE" target="_blank">https</a> <strong>：</strong> <a href="https://codepen.io" target="_blank">//codepen.io/freeCodeCamp/full/eyLYXE</a> 。 <strong>规则＃1：</strong>不要查看示例项目的代码。自己搞清楚。 <strong>规则＃2：</strong>完成以下<a href="https://en.wikipedia.org/wiki/User_story" target="_blank">用户故事</a> 。使用您需要的任何库或API。给它你自己的个人风格。 <strong>用户故事：</strong>我可以单击或拖动鼠标光标为圆圈着色。 <strong>用户故事：</strong>我可以双击彩色圆圈去除颜色。 <strong>用户故事：</strong>我可以点击彩色圆圈来改变它的颜色。 <strong>用户故事：</strong>每次点击我都会得到一个不同颜色的圆圈。 <strong>用户故事：</strong>我可以点击“重置”按钮删除最近的颜色。 <strong>用户故事：</strong>我可以单击“全部重置”按钮删除圆圈中的所有颜色。如果卡住，请记得使用<a href="https://forum.freecodecamp.org/t/how-to-get-help-when-you-are-stuck-coding/19514" target="_blank">Read-Search-Ask</a> 。完成后，单击“我已完成此挑战”按钮并包含指向CodePen的链接。您可以通过Facebook上的朋友分享您的项目反馈。 </section>
|
||||
# --description--
|
||||
|
||||
## Instructions
|
||||
<section id="instructions">
|
||||
</section>
|
||||
**目标：** 构建一个功能类似于此的[CodePen.io](https://codepen.io)应用程序： [https](https://codepen.io/freeCodeCamp/full/eyLYXE) **：** [//codepen.io/freeCodeCamp/full/eyLYXE](https://codepen.io) 。 **规则＃1：** 不要查看示例项目的代码。自己搞清楚。 **规则＃2：** 完成以下[用户故事](https://en.wikipedia.org/wiki/User_story) 。使用您需要的任何库或API。给它你自己的个人风格。 **用户故事：** 我可以单击或拖动鼠标光标为圆圈着色。 **用户故事：** 我可以双击彩色圆圈去除颜色。 **用户故事：** 我可以点击彩色圆圈来改变它的颜色。 **用户故事：** 每次点击我都会得到一个不同颜色的圆圈。 **用户故事：** 我可以点击“重置”按钮删除最近的颜色。 **用户故事：** 我可以单击“全部重置”按钮删除圆圈中的所有颜色。如果卡住，请记得使用[Read-Search-Ask](https://forum.freecodecamp.org/t/how-to-get-help-when-you-are-stuck-coding/19514) 。完成后，单击“我已完成此挑战”按钮并包含指向CodePen的链接。您可以通过Facebook上的朋友分享您的项目反馈。
|
||||
|
||||
## Tests
|
||||
<section id='tests'>
|
||||
# --hints--
|
||||
|
||||
```yml
|
||||
tests: []
|
||||
|
||||
```
|
||||
# --solutions--
|
||||
|
||||
</section>
|
||||
|
||||
## Challenge Seed
|
||||
<section id='challengeSeed'>
|
||||
|
||||
</section>
|
||||
|
||||
## Solution
|
||||
<section id='solution'>
|
||||
|
||||
```js
|
||||
// solution required
|
||||
```
|
||||
|
||||
/section>
|
||||
|
||||
@ -1,37 +1,16 @@
|
||||
---
|
||||
id: bd7158d8c443eddfaeb5bdff
|
||||
title: 建立夜生活协调应用程序
|
||||
challengeType: 4
|
||||
videoUrl: ''
|
||||
title: 建立夜生活协调应用程序
|
||||
---
|
||||
|
||||
## Description
|
||||
<section id="description"> <strong>目标：</strong>构建一个功能类似于此的完整堆栈JavaScript应用程序： <a href="http://whatsgoinontonight.herokuapp.com/" target="_blank">http</a> ： <a href="http://whatsgoinontonight.herokuapp.com/" target="_blank">//whatsgoinontonight.herokuapp.com/</a>并将其部署到Heroku。请注意，对于每个项目，您应该创建一个新的GitHub存储库和一个新的Heroku项目。如果您不记得如何执行此操作，请重新访问<a href="/challenges/get-set-for-our-dynamic-web-application-projects">https://freecodecamp.com/challenges/get-set-for-our-dynamic-web-application-projects</a> 。以下是您应为此项目实施的特定用户故事： <strong>用户故事：</strong>作为未经身份验证的用户，我可以查看我所在区域的所有条形图。 <strong>用户故事：</strong>作为一名经过身份验证的用户，我可以将自己添加到一个栏中，以表明我今晚要去那里。 <strong>用户故事：</strong>作为一名经过身份验证的用户，如果我不想再去那里，我可以将自己从酒吧中删除。 <strong>用户故事：</strong>作为未经身份验证的用户，当我登录时，我不应该再次搜索。 <strong>提示：</strong>尝试使用<a href="https://www.yelp.com/developers/documentation/v2/overview" target="_blank">Yelp API</a>查找用户搜索的城市中的场地。如果您使用Yelp的API，请务必在您的应用中提及。完成这些用户故事的实现后，单击“我已完成此挑战”按钮，然后输入GitHub存储库和在Heroku上运行的实时应用程序的URL。您可以通过Facebook上的朋友分享您的项目反馈。 </section>
|
||||
# --description--
|
||||
|
||||
## Instructions
|
||||
<section id="instructions">
|
||||
</section>
|
||||
**目标：** 构建一个功能类似于此的完整堆栈JavaScript应用程序： [http](http://whatsgoinontonight.herokuapp.com/) ： [//whatsgoinontonight.herokuapp.com/](http://whatsgoinontonight.herokuapp.com/)并将其部署到Heroku。请注意，对于每个项目，您应该创建一个新的GitHub存储库和一个新的Heroku项目。如果您不记得如何执行此操作，请重新访问[https://freecodecamp.com/challenges/get-set-for-our-dynamic-web-application-projects](/challenges/get-set-for-our-dynamic-web-application-projects) 。以下是您应为此项目实施的特定用户故事： **用户故事：** 作为未经身份验证的用户，我可以查看我所在区域的所有条形图。 **用户故事：** 作为一名经过身份验证的用户，我可以将自己添加到一个栏中，以表明我今晚要去那里。 **用户故事：** 作为一名经过身份验证的用户，如果我不想再去那里，我可以将自己从酒吧中删除。 **用户故事：** 作为未经身份验证的用户，当我登录时，我不应该再次搜索。 **提示：** 尝试使用[Yelp API](https://www.yelp.com/developers/documentation/v2/overview)查找用户搜索的城市中的场地。如果您使用Yelp的API，请务必在您的应用中提及。完成这些用户故事的实现后，单击“我已完成此挑战”按钮，然后输入GitHub存储库和在Heroku上运行的实时应用程序的URL。您可以通过Facebook上的朋友分享您的项目反馈。
|
||||
|
||||
## Tests
|
||||
<section id='tests'>
|
||||
# --hints--
|
||||
|
||||
```yml
|
||||
tests: []
|
||||
|
||||
```
|
||||
# --solutions--
|
||||
|
||||
</section>
|
||||
|
||||
## Challenge Seed
|
||||
<section id='challengeSeed'>
|
||||
|
||||
</section>
|
||||
|
||||
## Solution
|
||||
<section id='solution'>
|
||||
|
||||
```js
|
||||
// solution required
|
||||
```
|
||||
|
||||
/section>
|
||||
|
||||
@ -1,37 +1,16 @@
|
||||
---
|
||||
id: bd7158d8c443eddfaeb5bdee
|
||||
title: 建立一个Pinterest克隆
|
||||
challengeType: 4
|
||||
videoUrl: ''
|
||||
title: 建立一个Pinterest克隆
|
||||
---
|
||||
|
||||
## Description
|
||||
<section id="description"> <strong>目标：</strong>构建一个功能类似于此的<a href="https://glitch.com" target="_blank">Glitch</a>应用程序： <a href="https://wild-song.glitch.me/" target="_blank">https</a> ： <a href="https://wild-song.glitch.me/" target="_blank">//wild-song.glitch.me</a> 。完成以下<a href="https://en.wikipedia.org/wiki/User_story" target="_blank">用户故事</a> 。使用您需要的任何库或API。给它你自己的个人风格。 <strong>用户故事：</strong>作为未经身份验证的用户，我可以使用GitHub登录。 <strong>用户故事：</strong>作为经过身份验证的用户，我可以链接到图像。 <strong>用户故事：</strong>作为经过身份验证的用户，我可以删除已链接到的图像。 <strong>用户故事：</strong>作为一个经过身份验证的用户，我可以看到我所链接的所有图像的Pinterest风格的墙。 <strong>用户故事：</strong>作为未经身份验证的用户，我可以浏览其他用户的图像墙。 <strong>用户故事：</strong>作为经过身份验证的用户，如果我上传的图片已损坏，则会被占位符图片替换。 （可以使用jQuery破碎图像检测） <strong>提示：</strong> <a href="http://masonry.desandro.com/" target="_blank">Masonry.js</a>是一个允许Pinterest风格图像网格的库。完成这些用户故事的实现后，单击“我已完成此挑战”按钮，然后输入GitHub存储库和在Heroku上运行的实时应用程序的URL。您可以通过Facebook上的朋友分享您的项目反馈。 </section>
|
||||
# --description--
|
||||
|
||||
## Instructions
|
||||
<section id="instructions">
|
||||
</section>
|
||||
**目标：** 构建一个功能类似于此的[Glitch](https://glitch.com)应用程序： [https](https://wild-song.glitch.me/) ： [//wild-song.glitch.me](https://wild-song.glitch.me/) 。完成以下[用户故事](https://en.wikipedia.org/wiki/User_story) 。使用您需要的任何库或API。给它你自己的个人风格。 **用户故事：** 作为未经身份验证的用户，我可以使用GitHub登录。 **用户故事：** 作为经过身份验证的用户，我可以链接到图像。 **用户故事：** 作为经过身份验证的用户，我可以删除已链接到的图像。 **用户故事：** 作为一个经过身份验证的用户，我可以看到我所链接的所有图像的Pinterest风格的墙。 **用户故事：** 作为未经身份验证的用户，我可以浏览其他用户的图像墙。 **用户故事：** 作为经过身份验证的用户，如果我上传的图片已损坏，则会被占位符图片替换。 （可以使用jQuery破碎图像检测） **提示：** [Masonry.js](http://masonry.desandro.com/)是一个允许Pinterest风格图像网格的库。完成这些用户故事的实现后，单击“我已完成此挑战”按钮，然后输入GitHub存储库和在Heroku上运行的实时应用程序的URL。您可以通过Facebook上的朋友分享您的项目反馈。
|
||||
|
||||
## Tests
|
||||
<section id='tests'>
|
||||
# --hints--
|
||||
|
||||
```yml
|
||||
tests: []
|
||||
|
||||
```
|
||||
# --solutions--
|
||||
|
||||
</section>
|
||||
|
||||
## Challenge Seed
|
||||
<section id='challengeSeed'>
|
||||
|
||||
</section>
|
||||
|
||||
## Solution
|
||||
<section id='solution'>
|
||||
|
||||
```js
|
||||
// solution required
|
||||
```
|
||||
|
||||
/section>
|
||||
|
||||
@ -1,37 +1,16 @@
|
||||
---
|
||||
id: 5a4b7fcdb66f799f199e11db
|
||||
title: 建立乒乓球比赛
|
||||
challengeType: 3
|
||||
videoUrl: ''
|
||||
title: 建立乒乓球比赛
|
||||
---
|
||||
|
||||
## Description
|
||||
<section id="description"> <strong>目标：</strong>构建一个功能类似于此的<a href="https://codepen.io" target="_blank">CodePen.io</a>应用程序： <a href="https://codepen.io/satyamdev/full/pdMmBp" target="_blank">https</a> <strong>：</strong> <a href="https://codepen.io" target="_blank">//codepen.io/satyamdev/full/pdMmBp</a> 。 <strong>规则＃1：</strong>不要查看示例项目的代码。自己搞清楚。 <strong>规则＃2：</strong>完成以下<a href="https://en.wikipedia.org/wiki/User_story" target="_blank">用户故事</a> 。使用您需要的任何库或API。给它你自己的个人风格。 <strong>用户故事：</strong>我可以控制一个球拍。 <strong>用户故事：</strong>计算机可以控制另一个拨片。 <strong>用户故事：</strong>计算机的桨是无与伦比的。它绝不应该错过球。 <strong>用户故事：</strong>游戏记录玩家和计算机的分数。如果卡住，请记得使用<a href="https://forum.freecodecamp.org/t/how-to-get-help-when-you-are-stuck-coding/19514" target="_blank">Read-Search-Ask</a> 。完成后，单击“我已完成此挑战”按钮并包含指向CodePen的链接。您可以通过Facebook上的朋友分享您的项目反馈。 </section>
|
||||
# --description--
|
||||
|
||||
## Instructions
|
||||
<section id="instructions">
|
||||
</section>
|
||||
**目标：** 构建一个功能类似于此的[CodePen.io](https://codepen.io)应用程序： [https](https://codepen.io/satyamdev/full/pdMmBp) **：** [//codepen.io/satyamdev/full/pdMmBp](https://codepen.io) 。 **规则＃1：** 不要查看示例项目的代码。自己搞清楚。 **规则＃2：** 完成以下[用户故事](https://en.wikipedia.org/wiki/User_story) 。使用您需要的任何库或API。给它你自己的个人风格。 **用户故事：** 我可以控制一个球拍。 **用户故事：** 计算机可以控制另一个拨片。 **用户故事：** 计算机的桨是无与伦比的。它绝不应该错过球。 **用户故事：** 游戏记录玩家和计算机的分数。如果卡住，请记得使用[Read-Search-Ask](https://forum.freecodecamp.org/t/how-to-get-help-when-you-are-stuck-coding/19514) 。完成后，单击“我已完成此挑战”按钮并包含指向CodePen的链接。您可以通过Facebook上的朋友分享您的项目反馈。
|
||||
|
||||
## Tests
|
||||
<section id='tests'>
|
||||
# --hints--
|
||||
|
||||
```yml
|
||||
tests: []
|
||||
|
||||
```
|
||||
# --solutions--
|
||||
|
||||
</section>
|
||||
|
||||
## Challenge Seed
|
||||
<section id='challengeSeed'>
|
||||
|
||||
</section>
|
||||
|
||||
## Solution
|
||||
<section id='solution'>
|
||||
|
||||
```js
|
||||
// solution required
|
||||
```
|
||||
|
||||
/section>
|
||||
|
||||
@ -1,37 +1,16 @@
|
||||
---
|
||||
id: bd7155d8c242eddfaeb5bd13
|
||||
title: 建立配方盒
|
||||
challengeType: 3
|
||||
videoUrl: ''
|
||||
title: 建立配方盒
|
||||
---
|
||||
|
||||
## Description
|
||||
<section id="description"> <strong>目标：</strong>构建一个功能类似于此的<a href="https://codepen.io" target="_blank">CodePen.io</a>应用程序： <a href="https://codepen.io/freeCodeCamp/full/dNVazZ/" target="_blank">https</a> <strong>：</strong> <a href="https://codepen.io" target="_blank">//codepen.io/freeCodeCamp/full/dNVazZ/</a> 。完成以下<a href="https://en.wikipedia.org/wiki/User_story" target="_blank">用户故事</a> 。使用您需要的任何库或API。给它你自己的个人风格。 <strong>用户故事：</strong>我可以创建具有名称和成分的食谱。 <strong>用户故事：</strong>我可以看到一个索引视图，其中所有配方的名称都是可见的。 <strong>用户故事：</strong>我可以点击任何这些食谱来查看它。 <strong>用户故事：</strong>我可以编辑这些食谱。 <strong>用户故事：</strong>我可以删除这些食谱。 <strong>用户故事：</strong>我添加的所有新食谱都保存在浏览器的本地存储中。如果我刷新页面，这些配方仍然会在那里。 <strong>提示：</strong>您应该在CodePen上为本地存储密钥添加前缀，即<code>_username_recipes</code>如果卡住，请记住使用<a href="//github.com/FreeCodeCamp/freecodecamp/wiki/FreeCodeCamp-Get-Help" target="_blank">Read-Search-Ask</a> 。完成后，单击“我已完成此挑战”按钮并包含指向CodePen的链接。您可以通过Facebook上的朋友分享您的项目反馈。 </section>
|
||||
# --description--
|
||||
|
||||
## Instructions
|
||||
<section id="instructions">
|
||||
</section>
|
||||
**目标：** 构建一个功能类似于此的[CodePen.io](https://codepen.io)应用程序： [https](https://codepen.io/freeCodeCamp/full/dNVazZ/) **：** [//codepen.io/freeCodeCamp/full/dNVazZ/](https://codepen.io) 。完成以下[用户故事](https://en.wikipedia.org/wiki/User_story) 。使用您需要的任何库或API。给它你自己的个人风格。 **用户故事：** 我可以创建具有名称和成分的食谱。 **用户故事：** 我可以看到一个索引视图，其中所有配方的名称都是可见的。 **用户故事：** 我可以点击任何这些食谱来查看它。 **用户故事：** 我可以编辑这些食谱。 **用户故事：** 我可以删除这些食谱。 **用户故事：** 我添加的所有新食谱都保存在浏览器的本地存储中。如果我刷新页面，这些配方仍然会在那里。 **提示：** 您应该在CodePen上为本地存储密钥添加前缀，即`_username_recipes`如果卡住，请记住使用[Read-Search-Ask](//github.com/FreeCodeCamp/freecodecamp/wiki/FreeCodeCamp-Get-Help) 。完成后，单击“我已完成此挑战”按钮并包含指向CodePen的链接。您可以通过Facebook上的朋友分享您的项目反馈。
|
||||
|
||||
## Tests
|
||||
<section id='tests'>
|
||||
# --hints--
|
||||
|
||||
```yml
|
||||
tests: []
|
||||
|
||||
```
|
||||
# --solutions--
|
||||
|
||||
</section>
|
||||
|
||||
## Challenge Seed
|
||||
<section id='challengeSeed'>
|
||||
|
||||
</section>
|
||||
|
||||
## Solution
|
||||
<section id='solution'>
|
||||
|
||||
```js
|
||||
// solution required
|
||||
```
|
||||
|
||||
/section>
|
||||
|
||||
@ -1,37 +1,16 @@
|
||||
---
|
||||
id: bd7153d8c242eddfaeb5bd13
|
||||
title: 建立一个Roguelike Dungeon Crawler游戏
|
||||
challengeType: 3
|
||||
videoUrl: ''
|
||||
title: 建立一个Roguelike Dungeon Crawler游戏
|
||||
---
|
||||
|
||||
## Description
|
||||
<section id="description"> <strong>目标：</strong>构建一个功能类似于此的<a href="https://codepen.io" target="_blank">CodePen.io</a>应用程序： <a href="https://codepen.io/freeCodeCamp/full/apLXEJ/" target="_blank">https</a> <strong>：</strong> <a href="https://codepen.io" target="_blank">//codepen.io/freeCodeCamp/full/apLXEJ/</a> 。完成以下<a href="https://en.wikipedia.org/wiki/User_story" target="_blank">用户故事</a> 。使用您需要的任何库或API。给它你自己的个人风格。 <strong>用户故事：</strong>我有健康，水平和武器。我可以拿起更好的武器。我可以拿起健康食品。 <strong>用户故事：</strong>地图上的所有物品和敌人都是随机排列的。 <strong>用户故事：</strong>我可以在整个地图中移动，发现项目。 <strong>用户故事：</strong>我可以在地图边界内的任何地方移动，但是在我击败它之前我无法穿越敌人。 <strong>用户故事：</strong>大部分地图都是隐藏的。当我迈出一步时，所有与我在一定数量空间内的空间都会被揭示出来。 <strong>用户故事：</strong>当我击败敌人时，敌人消失，我得到了XP，最终提高了我的等级。 <strong>用户故事：</strong>当我与敌人作战时，我们会轮流造成伤害，直到我们其中一人失败为止。我根据自己的等级和武器造成伤害。敌人根据其等级造成伤害。损伤在一定范围内有些随机。 <strong>用户故事：</strong>当我找到并击败老板时，我赢了。 <strong>用户故事：</strong>游戏应该具有挑战性，但理论上可以获胜。如果卡住，请记得使用<a href="https://forum.freecodecamp.org/t/how-to-get-help-when-you-are-stuck-coding/19514" target="_blank">Read-Search-Ask</a> 。完成后，单击“我已完成此挑战”按钮并包含指向CodePen的链接。您可以通过Facebook上的朋友分享您的项目反馈。 </section>
|
||||
# --description--
|
||||
|
||||
## Instructions
|
||||
<section id="instructions">
|
||||
</section>
|
||||
**目标：** 构建一个功能类似于此的[CodePen.io](https://codepen.io)应用程序： [https](https://codepen.io/freeCodeCamp/full/apLXEJ/) **：** [//codepen.io/freeCodeCamp/full/apLXEJ/](https://codepen.io) 。完成以下[用户故事](https://en.wikipedia.org/wiki/User_story) 。使用您需要的任何库或API。给它你自己的个人风格。 **用户故事：** 我有健康，水平和武器。我可以拿起更好的武器。我可以拿起健康食品。 **用户故事：** 地图上的所有物品和敌人都是随机排列的。 **用户故事：** 我可以在整个地图中移动，发现项目。 **用户故事：** 我可以在地图边界内的任何地方移动，但是在我击败它之前我无法穿越敌人。 **用户故事：** 大部分地图都是隐藏的。当我迈出一步时，所有与我在一定数量空间内的空间都会被揭示出来。 **用户故事：** 当我击败敌人时，敌人消失，我得到了XP，最终提高了我的等级。 **用户故事：** 当我与敌人作战时，我们会轮流造成伤害，直到我们其中一人失败为止。我根据自己的等级和武器造成伤害。敌人根据其等级造成伤害。损伤在一定范围内有些随机。 **用户故事：** 当我找到并击败老板时，我赢了。 **用户故事：** 游戏应该具有挑战性，但理论上可以获胜。如果卡住，请记得使用[Read-Search-Ask](https://forum.freecodecamp.org/t/how-to-get-help-when-you-are-stuck-coding/19514) 。完成后，单击“我已完成此挑战”按钮并包含指向CodePen的链接。您可以通过Facebook上的朋友分享您的项目反馈。
|
||||
|
||||
## Tests
|
||||
<section id='tests'>
|
||||
# --hints--
|
||||
|
||||
```yml
|
||||
tests: []
|
||||
|
||||
```
|
||||
# --solutions--
|
||||
|
||||
</section>
|
||||
|
||||
## Challenge Seed
|
||||
<section id='challengeSeed'>
|
||||
|
||||
</section>
|
||||
|
||||
## Solution
|
||||
<section id='solution'>
|
||||
|
||||
```js
|
||||
// solution required
|
||||
```
|
||||
|
||||
/section>
|
||||
|
||||
@ -1,37 +1,16 @@
|
||||
---
|
||||
id: bd7158d8c442eddfaeb5bd1c
|
||||
title: 建立一个西蒙游戏
|
||||
challengeType: 3
|
||||
videoUrl: ''
|
||||
title: 建立一个西蒙游戏
|
||||
---
|
||||
|
||||
## Description
|
||||
<section id="description"> <strong>目标：</strong>构建一个功能类似于此的<a href="https://codepen.io" target="_blank">CodePen.io</a>应用程序： <a href="https://codepen.io/Em-Ant/full/QbRyqq/" target="_blank">https</a> <strong>：</strong> <a href="https://codepen.io" target="_blank">//codepen.io/freeCodeCamp/full/obYBjE</a> 。完成以下<a href="https://en.wikipedia.org/wiki/User_story" target="_blank">用户故事</a> 。使用您需要的任何库或API。给它你自己的个人风格。 <strong>用户故事：</strong>我看到一系列随机按钮。 <strong>用户故事：</strong>每当我正确输入一系列按钮时，我会看到同一系列的按钮按下，但还有一个额外的步骤。 <strong>用户故事：</strong>当按下一系列按钮时，以及当我亲自按下按钮时，我都会听到与每个按钮相对应的声音。 <strong>用户故事：</strong>如果我按下了错误的按钮，我会收到通知，告知我已经这样做了，然后再按一系列按钮开始提醒我模式，这样我就可以再试一次。 <strong>用户故事：</strong>我可以看到当前按钮按下的步数。 <strong>用户故事：</strong>如果我想重新启动，我可以点击一个按钮来执行此操作，游戏将返回一个步骤。 <strong>用户故事：</strong>我可以在严格的模式下玩，如果我按下按钮错误，它会通知我我已经这样做了，并且游戏重新开始按下一系列按钮。 <strong>用户故事：</strong>我可以通过一系列正确的20个步骤来赢得游戏。我被告知我的胜利，然后比赛重新开始。 <strong>提示：</strong>在这里<strong>，</strong>您可以使用每个按钮的MP3： <code>https://s3.amazonaws.com/freecodecamp/simonSound1.mp3</code> ， <code>https://s3.amazonaws.com/freecodecamp/simonSound2.mp3</code> ， <code>https://s3.amazonaws.com/freecodecamp/simonSound3.mp3</code> ， <code>https://s3.amazonaws.com/freecodecamp/simonSound4.mp3</code> 。如果卡住，请记得使用<a href="https://forum.freecodecamp.org/t/how-to-get-help-when-you-are-stuck-coding/19514" target="_blank">Read-Search-Ask</a> 。完成后，单击“我已完成此挑战”按钮并包含指向CodePen的链接。您可以通过Facebook上的朋友分享您的项目反馈。 </section>
|
||||
# --description--
|
||||
|
||||
## Instructions
|
||||
<section id="instructions">
|
||||
</section>
|
||||
**目标：** 构建一个功能类似于此的[CodePen.io](https://codepen.io)应用程序： [https](https://codepen.io/Em-Ant/full/QbRyqq/) **：** [//codepen.io/freeCodeCamp/full/obYBjE](https://codepen.io) 。完成以下[用户故事](https://en.wikipedia.org/wiki/User_story) 。使用您需要的任何库或API。给它你自己的个人风格。 **用户故事：** 我看到一系列随机按钮。 **用户故事：** 每当我正确输入一系列按钮时，我会看到同一系列的按钮按下，但还有一个额外的步骤。 **用户故事：** 当按下一系列按钮时，以及当我亲自按下按钮时，我都会听到与每个按钮相对应的声音。 **用户故事：** 如果我按下了错误的按钮，我会收到通知，告知我已经这样做了，然后再按一系列按钮开始提醒我模式，这样我就可以再试一次。 **用户故事：** 我可以看到当前按钮按下的步数。 **用户故事：** 如果我想重新启动，我可以点击一个按钮来执行此操作，游戏将返回一个步骤。 **用户故事：** 我可以在严格的模式下玩，如果我按下按钮错误，它会通知我我已经这样做了，并且游戏重新开始按下一系列按钮。 **用户故事：** 我可以通过一系列正确的20个步骤来赢得游戏。我被告知我的胜利，然后比赛重新开始。 **提示：** 在这里**，**您可以使用每个按钮的MP3： `https://s3.amazonaws.com/freecodecamp/simonSound1.mp3` ， `https://s3.amazonaws.com/freecodecamp/simonSound2.mp3` ， `https://s3.amazonaws.com/freecodecamp/simonSound3.mp3` ， `https://s3.amazonaws.com/freecodecamp/simonSound4.mp3` 。如果卡住，请记得使用[Read-Search-Ask](https://forum.freecodecamp.org/t/how-to-get-help-when-you-are-stuck-coding/19514) 。完成后，单击“我已完成此挑战”按钮并包含指向CodePen的链接。您可以通过Facebook上的朋友分享您的项目反馈。
|
||||
|
||||
## Tests
|
||||
<section id='tests'>
|
||||
# --hints--
|
||||
|
||||
```yml
|
||||
tests: []
|
||||
|
||||
```
|
||||
# --solutions--
|
||||
|
||||
</section>
|
||||
|
||||
## Challenge Seed
|
||||
<section id='challengeSeed'>
|
||||
|
||||
</section>
|
||||
|
||||
## Solution
|
||||
<section id='solution'>
|
||||
|
||||
```js
|
||||
// solution required
|
||||
```
|
||||
|
||||
/section>
|
||||
|
||||
@ -1,37 +1,16 @@
|
||||
---
|
||||
id: bd7158d8c442eedfaeb5bd1c
|
||||
title: 建立一个Tic Tac Toe游戏
|
||||
challengeType: 3
|
||||
videoUrl: ''
|
||||
title: 建立一个Tic Tac Toe游戏
|
||||
---
|
||||
|
||||
## Description
|
||||
<section id="description"> <strong>目标：</strong>构建一个功能类似于此的<a href="https://codepen.io" target="_blank">CodePen.io</a>应用程序： <a href="https://codepen.io/freeCodeCamp/full/KzXQgy/" target="_blank">https</a> <strong>：</strong> <a href="https://codepen.io" target="_blank">//codepen.io/freeCodeCamp/full/KzXQgy/</a> 。完成以下<a href="https://en.wikipedia.org/wiki/User_story" target="_blank">用户故事</a> 。使用您需要的任何库或API。给它你自己的个人风格。 <strong>用户故事：</strong>我可以用电脑玩Tic Tac Toe游戏。 <strong>用户故事：</strong>我的游戏一旦结束就会重置，所以我可以再玩一次。 <strong>用户故事：</strong>我可以选择是否要播放为X或O.如果卡住，请记得使用<a href="https://forum.freecodecamp.org/t/how-to-get-help-when-you-are-stuck-coding/19514" target="_blank">Read-Search-Ask</a> 。完成后，单击“我已完成此挑战”按钮并包含指向CodePen的链接。您可以通过Facebook上的朋友分享您的项目反馈。 </section>
|
||||
# --description--
|
||||
|
||||
## Instructions
|
||||
<section id="instructions">
|
||||
</section>
|
||||
**目标：** 构建一个功能类似于此的[CodePen.io](https://codepen.io)应用程序： [https](https://codepen.io/freeCodeCamp/full/KzXQgy/) **：** [//codepen.io/freeCodeCamp/full/KzXQgy/](https://codepen.io) 。完成以下[用户故事](https://en.wikipedia.org/wiki/User_story) 。使用您需要的任何库或API。给它你自己的个人风格。 **用户故事：** 我可以用电脑玩Tic Tac Toe游戏。 **用户故事：** 我的游戏一旦结束就会重置，所以我可以再玩一次。 **用户故事：** 我可以选择是否要播放为X或O.如果卡住，请记得使用[Read-Search-Ask](https://forum.freecodecamp.org/t/how-to-get-help-when-you-are-stuck-coding/19514) 。完成后，单击“我已完成此挑战”按钮并包含指向CodePen的链接。您可以通过Facebook上的朋友分享您的项目反馈。
|
||||
|
||||
## Tests
|
||||
<section id='tests'>
|
||||
# --hints--
|
||||
|
||||
```yml
|
||||
tests: []
|
||||
|
||||
```
|
||||
# --solutions--
|
||||
|
||||
</section>
|
||||
|
||||
## Challenge Seed
|
||||
<section id='challengeSeed'>
|
||||
|
||||
</section>
|
||||
|
||||
## Solution
|
||||
<section id='solution'>
|
||||
|
||||
```js
|
||||
// solution required
|
||||
```
|
||||
|
||||
/section>
|
||||
|
||||
@ -1,37 +1,16 @@
|
||||
---
|
||||
id: bd7158d8c443eddfaeb5bdef
|
||||
title: 建立一个投票应用程序
|
||||
challengeType: 4
|
||||
videoUrl: ''
|
||||
title: 建立一个投票应用程序
|
||||
---
|
||||
|
||||
## Description
|
||||
<section id="description"> <strong>目标：</strong>构建一个功能类似于此的完整堆栈JavaScript应用程序： <a href="https://fcc-voting-arthow4n.herokuapp.com/" target="_blank">https</a> ： <a href="https://fcc-voting-arthow4n.herokuapp.com/" target="_blank">//fcc-voting-arthow4n.herokuapp.com/</a>并将其部署到Heroku。请注意，对于每个项目，您应该创建一个新的GitHub存储库和一个新的Heroku项目。如果您不记得如何执行此操作，请重新访问<a href="/challenges/get-set-for-our-dynamic-web-application-projects">https://freecodecamp.com/challenges/get-set-for-our-dynamic-web-application-projects</a> 。以下是您应该为此项目实现的特定用户故事： <strong>用户故事：</strong>作为经过身份验证的用户，我可以保留我的民意调查，然后再回来访问它们。 <strong>用户故事：</strong>作为经过身份验证的用户，我可以与朋友分享我的民意调查。 <strong>用户故事：</strong>作为经过身份验证的用户，我可以看到我的民意调查的汇总结果。 <strong>用户故事：</strong>作为经过身份验证的用户，我可以删除我认为不再需要的民意调查。 <strong>用户故事：</strong>作为经过身份验证的用户，我可以创建包含任意数量项目的民意调查。 <strong>用户故事：</strong>作为未经身份验证或经过身份验证的用户，我可以查看并对每个人的民意调查进行投票。 <strong>用户故事：</strong>作为未经身份验证或经过身份验证的用户，我可以以图表形式查看民意调查的结果。 （这可以使用Chart.js或Google Charts实现。） <strong>用户故事：</strong>作为经过身份验证的用户，如果我不喜欢民意调查中的选项，我可以创建一个新选项。完成这些用户故事的实现后，单击“我已完成此挑战”按钮，然后输入GitHub存储库和在Heroku上运行的实时应用程序的URL。您可以通过Facebook上的朋友分享您的项目反馈。 </section>
|
||||
# --description--
|
||||
|
||||
## Instructions
|
||||
<section id="instructions">
|
||||
</section>
|
||||
**目标：** 构建一个功能类似于此的完整堆栈JavaScript应用程序： [https](https://fcc-voting-arthow4n.herokuapp.com/) ： [//fcc-voting-arthow4n.herokuapp.com/](https://fcc-voting-arthow4n.herokuapp.com/)并将其部署到Heroku。请注意，对于每个项目，您应该创建一个新的GitHub存储库和一个新的Heroku项目。如果您不记得如何执行此操作，请重新访问[https://freecodecamp.com/challenges/get-set-for-our-dynamic-web-application-projects](/challenges/get-set-for-our-dynamic-web-application-projects) 。以下是您应该为此项目实现的特定用户故事： **用户故事：** 作为经过身份验证的用户，我可以保留我的民意调查，然后再回来访问它们。 **用户故事：** 作为经过身份验证的用户，我可以与朋友分享我的民意调查。 **用户故事：** 作为经过身份验证的用户，我可以看到我的民意调查的汇总结果。 **用户故事：** 作为经过身份验证的用户，我可以删除我认为不再需要的民意调查。 **用户故事：** 作为经过身份验证的用户，我可以创建包含任意数量项目的民意调查。 **用户故事：** 作为未经身份验证或经过身份验证的用户，我可以查看并对每个人的民意调查进行投票。 **用户故事：** 作为未经身份验证或经过身份验证的用户，我可以以图表形式查看民意调查的结果。 （这可以使用Chart.js或Google Charts实现。） **用户故事：** 作为经过身份验证的用户，如果我不喜欢民意调查中的选项，我可以创建一个新选项。完成这些用户故事的实现后，单击“我已完成此挑战”按钮，然后输入GitHub存储库和在Heroku上运行的实时应用程序的URL。您可以通过Facebook上的朋友分享您的项目反馈。
|
||||
|
||||
## Tests
|
||||
<section id='tests'>
|
||||
# --hints--
|
||||
|
||||
```yml
|
||||
tests: []
|
||||
|
||||
```
|
||||
# --solutions--
|
||||
|
||||
</section>
|
||||
|
||||
## Challenge Seed
|
||||
<section id='challengeSeed'>
|
||||
|
||||
</section>
|
||||
|
||||
## Solution
|
||||
<section id='solution'>
|
||||
|
||||
```js
|
||||
// solution required
|
||||
```
|
||||
|
||||
/section>
|
||||
|
||||
@ -1,37 +1,16 @@
|
||||
---
|
||||
id: bd7158d8c442eddfaeb5bd19
|
||||
title: 构建Wikipedia查看器
|
||||
challengeType: 3
|
||||
videoUrl: ''
|
||||
title: 构建Wikipedia查看器
|
||||
---
|
||||
|
||||
## Description
|
||||
<section id="description"> <strong>目标：</strong>构建一个功能类似于此的<a href="https://codepen.io" target="_blank">CodePen.io</a>应用程序： <a href="https://codepen.io/freeCodeCamp/full/wGqEga/" target="_blank">https</a> <strong>：</strong> <a href="https://codepen.io" target="_blank">//codepen.io/freeCodeCamp/full/wGqEga/</a> 。完成以下<a href="https://en.wikipedia.org/wiki/User_story" target="_blank">用户故事</a> 。使用您需要的任何库或API。给它你自己的个人风格。 <strong>用户故事：</strong>我可以在搜索框中搜索维基百科条目，并查看生成的维基百科条目。 <strong>用户故事：</strong>我可以单击按钮查看随机的Wikipedia条目。 <span class="text-info">提示＃1：</span>这是一个可用于获取随机维基百科文章的URL： <code>https://en.wikipedia.org/wiki/Special:Random</code> ： <code>https://en.wikipedia.org/wiki/Special:Random</code> :Random。 <span class="text-info">提示＃2：</span>这是使用维基百科API的条目： <code>https://www.mediawiki.org/wiki/API:Main_page</code> ： <code>https://www.mediawiki.org/wiki/API:Main_page</code> ： <code>https://www.mediawiki.org/wiki/API:Main_page</code> 。 <span class="text-info">提示＃3：</span>使用此<a href="https://en.wikipedia.org/wiki/Special:ApiSandbox#action=query&titles=Main%20Page&prop=revisions&rvprop=content&format=jsonfm" target="_blank">链接</a>试验维基百科的API。如果卡住，请记得使用<a href="https://forum.freecodecamp.org/t/how-to-get-help-when-you-are-stuck-coding/19514" target="_blank">Read-Search-Ask</a> 。完成后，单击“我已完成此挑战”按钮并包含指向CodePen的链接。您可以通过Facebook上的朋友分享您的项目反馈。 </section>
|
||||
# --description--
|
||||
|
||||
## Instructions
|
||||
<section id="instructions">
|
||||
</section>
|
||||
**目标：** 构建一个功能类似于此的[CodePen.io](https://codepen.io)应用程序： [https](https://codepen.io/freeCodeCamp/full/wGqEga/) **：** [//codepen.io/freeCodeCamp/full/wGqEga/](https://codepen.io) 。完成以下[用户故事](https://en.wikipedia.org/wiki/User_story) 。使用您需要的任何库或API。给它你自己的个人风格。 **用户故事：** 我可以在搜索框中搜索维基百科条目，并查看生成的维基百科条目。 **用户故事：** 我可以单击按钮查看随机的Wikipedia条目。 提示＃1：这是一个可用于获取随机维基百科文章的URL： `https://en.wikipedia.org/wiki/Special:Random` ： `https://en.wikipedia.org/wiki/Special:Random` :Random。 提示＃2：这是使用维基百科API的条目： `https://www.mediawiki.org/wiki/API:Main_page` ： `https://www.mediawiki.org/wiki/API:Main_page` ： `https://www.mediawiki.org/wiki/API:Main_page` 。 提示＃3：使用此[链接](https://en.wikipedia.org/wiki/Special:ApiSandbox#action=query&titles=Main%20Page&prop=revisions&rvprop=content&format=jsonfm)试验维基百科的API。如果卡住，请记得使用[Read-Search-Ask](https://forum.freecodecamp.org/t/how-to-get-help-when-you-are-stuck-coding/19514) 。完成后，单击“我已完成此挑战”按钮并包含指向CodePen的链接。您可以通过Facebook上的朋友分享您的项目反馈。
|
||||
|
||||
## Tests
|
||||
<section id='tests'>
|
||||
# --hints--
|
||||
|
||||
```yml
|
||||
tests: []
|
||||
|
||||
```
|
||||
# --solutions--
|
||||
|
||||
</section>
|
||||
|
||||
## Challenge Seed
|
||||
<section id='challengeSeed'>
|
||||
|
||||
</section>
|
||||
|
||||
## Solution
|
||||
<section id='solution'>
|
||||
|
||||
```js
|
||||
// solution required
|
||||
```
|
||||
|
||||
/section>
|
||||
|
||||
@ -1,37 +1,16 @@
|
||||
---
|
||||
id: bd7158d8c443edefaeb5bdee
|
||||
title: 构建图像搜索抽象层
|
||||
challengeType: 4
|
||||
videoUrl: ''
|
||||
title: 构建图像搜索抽象层
|
||||
---
|
||||
|
||||
## Description
|
||||
<section id="description"> <strong>目标：</strong>构建一个完整的堆栈JavaScript应用程序，允许您搜索如下图像： <a href="https://cryptic-ridge-9197.herokuapp.com/api/imagesearch/lolcats%20funny?offset=10" target="_blank">https</a> ： <a href="https://cryptic-ridge-9197.herokuapp.com/api/imagesearch/lolcats%20funny?offset=10" target="_blank">//cryptic-ridge-9197.herokuapp.com/api/imagesearch/lolcats%20funny？offset = 10</a>并浏览此类最近的搜索查询： <a href="https://cryptic-ridge-9197.herokuapp.com/api/latest/imagesearch/" target="_blank">https</a> ： <a href="https://cryptic-ridge-9197.herokuapp.com/api/latest/imagesearch/" target="_blank">//cryptic-ridge-9197.herokuapp.com/api/latest/imagesearch/</a> 。然后将其部署到Glitch。请注意，对于每个项目，您应该创建一个新的GitHub存储库和一个新的Glitch项目。如果您不记得如何执行此操作，请重新访问<a href="/challenges/get-set-for-our-api-development-projects">https://freecodecamp.org/challenges/get-set-for-our-api-development-projects</a> 。以下是您应该为此项目实现的特定用户故事： <strong>用户故事：</strong>我可以获取与给定搜索字符串相关的一组图像的图像URL，替代文本和页面URL。 <strong>用户故事：</strong>我可以通过在URL中添加？offset = 2参数来对响应进行分页。 <strong>用户故事：</strong>我可以获得最近提交的搜索字符串列表。完成这些用户故事的实现后，单击“我已完成此挑战”按钮，然后输入GitHub存储库和在Glitch上运行的实时应用程序的URL。您可以通过Facebook上的朋友分享您的项目反馈。 </section>
|
||||
# --description--
|
||||
|
||||
## Instructions
|
||||
<section id="instructions">
|
||||
</section>
|
||||
**目标：** 构建一个完整的堆栈JavaScript应用程序，允许您搜索如下图像： [https](https://cryptic-ridge-9197.herokuapp.com/api/imagesearch/lolcats%20funny?offset=10) ： [//cryptic-ridge-9197.herokuapp.com/api/imagesearch/lolcats%20funny？offset = 10](https://cryptic-ridge-9197.herokuapp.com/api/imagesearch/lolcats%20funny?offset=10)并浏览此类最近的搜索查询： [https](https://cryptic-ridge-9197.herokuapp.com/api/latest/imagesearch/) ： [//cryptic-ridge-9197.herokuapp.com/api/latest/imagesearch/](https://cryptic-ridge-9197.herokuapp.com/api/latest/imagesearch/) 。然后将其部署到Glitch。请注意，对于每个项目，您应该创建一个新的GitHub存储库和一个新的Glitch项目。如果您不记得如何执行此操作，请重新访问[https://freecodecamp.org/challenges/get-set-for-our-api-development-projects](/challenges/get-set-for-our-api-development-projects) 。以下是您应该为此项目实现的特定用户故事： **用户故事：** 我可以获取与给定搜索字符串相关的一组图像的图像URL，替代文本和页面URL。 **用户故事：** 我可以通过在URL中添加？offset = 2参数来对响应进行分页。 **用户故事：** 我可以获得最近提交的搜索字符串列表。完成这些用户故事的实现后，单击“我已完成此挑战”按钮，然后输入GitHub存储库和在Glitch上运行的实时应用程序的URL。您可以通过Facebook上的朋友分享您的项目反馈。
|
||||
|
||||
## Tests
|
||||
<section id='tests'>
|
||||
# --hints--
|
||||
|
||||
```yml
|
||||
tests: []
|
||||
|
||||
```
|
||||
# --solutions--
|
||||
|
||||
</section>
|
||||
|
||||
## Challenge Seed
|
||||
<section id='challengeSeed'>
|
||||
|
||||
</section>
|
||||
|
||||
## Solution
|
||||
<section id='solution'>
|
||||
|
||||
```js
|
||||
// solution required
|
||||
```
|
||||
|
||||
/section>
|
||||
|
||||
@ -1,37 +1,16 @@
|
||||
---
|
||||
id: bd7154d8c242eddfaeb5bd13
|
||||
title: 打造生命游戏
|
||||
challengeType: 3
|
||||
videoUrl: ''
|
||||
title: 打造生命游戏
|
||||
---
|
||||
|
||||
## Description
|
||||
<section id="description"> <strong>目标：</strong>构建一个功能类似于此的<a href="https://codepen.io" target="_blank">CodePen.io</a>应用程序： <a href="https://codepen.io/freeCodeCamp/full/BpwMZv/" target="_blank">https</a> <strong>：</strong> <a href="https://codepen.io" target="_blank">//codepen.io/freeCodeCamp/full/BpwMZv/</a> 。完成以下<a href="https://en.wikipedia.org/wiki/User_story" target="_blank">用户故事</a> 。使用您需要的任何库或API。给它你自己的个人风格。 <strong>用户故事：</strong>当我第一次到达游戏时，它将随机生成一个棋盘并开始播放。 <strong>用户故事：</strong>我可以开始和停止董事会。 <strong>用户故事：</strong>我可以设置电路板。 <strong>用户故事：</strong>我可以清除董事会。 <strong>用户故事：</strong>当我按下开始时，游戏将播出。 <strong>用户故事：</strong>每次董事会改变，我都能看到已经过了多少代。 <strong>提示：</strong>以下是对Conway的生命游戏的解释，来自John Conway本人： <a href="https://www.youtube.com/watch?v=E8kUJL04ELA" target="_blank">https</a> ： <a href="https://www.youtube.com/watch?v=E8kUJL04ELA" target="_blank">//www.youtube.com/watch？v =</a> <strong>E8kUJL04ELA提示：</strong>这里是Conway生命游戏的概述，规则供您参考： <a href="https://en.wikipedia.org/wiki/Conway%27s_Game_of_Life" target="_blank">https：// en.wikipedia.org/wiki/Conway%27s_Game_of_Life</a>如果卡住，请记得使用<a href="//github.com/FreeCodeCamp/freecodecamp/wiki/FreeCodeCamp-Get-Help" target="_blank">Read-Search-Ask</a> 。完成后，单击“我已完成此挑战”按钮并包含指向CodePen的链接。您可以通过Facebook上的朋友分享您的项目反馈。 </section>
|
||||
# --description--
|
||||
|
||||
## Instructions
|
||||
<section id="instructions">
|
||||
</section>
|
||||
**目标：** 构建一个功能类似于此的[CodePen.io](https://codepen.io)应用程序： [https](https://codepen.io/freeCodeCamp/full/BpwMZv/) **：** [//codepen.io/freeCodeCamp/full/BpwMZv/](https://codepen.io) 。完成以下[用户故事](https://en.wikipedia.org/wiki/User_story) 。使用您需要的任何库或API。给它你自己的个人风格。 **用户故事：** 当我第一次到达游戏时，它将随机生成一个棋盘并开始播放。 **用户故事：** 我可以开始和停止董事会。 **用户故事：** 我可以设置电路板。 **用户故事：** 我可以清除董事会。 **用户故事：** 当我按下开始时，游戏将播出。 **用户故事：** 每次董事会改变，我都能看到已经过了多少代。 **提示：** 以下是对Conway的生命游戏的解释，来自John Conway本人： [https](https://www.youtube.com/watch?v=E8kUJL04ELA) ： [//www.youtube.com/watch？v =](https://www.youtube.com/watch?v=E8kUJL04ELA) **E8kUJL04ELA提示：** 这里是Conway生命游戏的概述，规则供您参考： [https：// en.wikipedia.org/wiki/Conway%27s_Game_of_Life](https://en.wikipedia.org/wiki/Conway%27s_Game_of_Life)如果卡住，请记得使用[Read-Search-Ask](//github.com/FreeCodeCamp/freecodecamp/wiki/FreeCodeCamp-Get-Help) 。完成后，单击“我已完成此挑战”按钮并包含指向CodePen的链接。您可以通过Facebook上的朋友分享您的项目反馈。
|
||||
|
||||
## Tests
|
||||
<section id='tests'>
|
||||
# --hints--
|
||||
|
||||
```yml
|
||||
tests: []
|
||||
|
||||
```
|
||||
# --solutions--
|
||||
|
||||
</section>
|
||||
|
||||
## Challenge Seed
|
||||
<section id='challengeSeed'>
|
||||
|
||||
</section>
|
||||
|
||||
## Solution
|
||||
<section id='solution'>
|
||||
|
||||
```js
|
||||
// solution required
|
||||
```
|
||||
|
||||
/section>
|
||||
|
||||
@ -1,37 +1,16 @@
|
||||
---
|
||||
id: bd7158d8c443eddfaeb5bd0e
|
||||
title: 图表股市
|
||||
challengeType: 4
|
||||
videoUrl: ''
|
||||
title: 图表股市
|
||||
---
|
||||
|
||||
## Description
|
||||
<section id="description"> <strong>目标：</strong>构建一个功能类似于此的完整堆栈JavaScript应用程序： <a href="http://watchstocks.herokuapp.com/" target="_blank">http</a> ： <a href="http://watchstocks.herokuapp.com/" target="_blank">//watchstocks.herokuapp.com/</a>并将其部署到Heroku。请注意，对于每个项目，您应该创建一个新的GitHub存储库和一个新的Heroku项目。如果您不记得如何执行此操作，请重新访问<a href="/challenges/get-set-for-our-dynamic-web-application-projects">https://freecodecamp.com/challenges/get-set-for-our-dynamic-web-application-projects</a> 。以下是您应为此项目实施的特定用户故事： <strong>用户故事：</strong>我可以查看显示每个添加的股票的最近趋势线的图表。 <strong>用户故事：</strong>我可以按符号名称添加新股票。 <strong>用户故事：</strong>我可以删除股票。 <strong>用户故事：</strong>当任何其他用户添加或删除股票时，我可以实时看到变化。为此，您需要使用Web套接字。完成这些用户故事的实现后，单击“我已完成此挑战”按钮，然后输入GitHub存储库和在Heroku上运行的实时应用程序的URL。您可以通过Facebook上的朋友分享您的项目反馈。 </section>
|
||||
# --description--
|
||||
|
||||
## Instructions
|
||||
<section id="instructions">
|
||||
</section>
|
||||
**目标：** 构建一个功能类似于此的完整堆栈JavaScript应用程序： [http](http://watchstocks.herokuapp.com/) ： [//watchstocks.herokuapp.com/](http://watchstocks.herokuapp.com/)并将其部署到Heroku。请注意，对于每个项目，您应该创建一个新的GitHub存储库和一个新的Heroku项目。如果您不记得如何执行此操作，请重新访问[https://freecodecamp.com/challenges/get-set-for-our-dynamic-web-application-projects](/challenges/get-set-for-our-dynamic-web-application-projects) 。以下是您应为此项目实施的特定用户故事： **用户故事：** 我可以查看显示每个添加的股票的最近趋势线的图表。 **用户故事：** 我可以按符号名称添加新股票。 **用户故事：** 我可以删除股票。 **用户故事：** 当任何其他用户添加或删除股票时，我可以实时看到变化。为此，您需要使用Web套接字。完成这些用户故事的实现后，单击“我已完成此挑战”按钮，然后输入GitHub存储库和在Heroku上运行的实时应用程序的URL。您可以通过Facebook上的朋友分享您的项目反馈。
|
||||
|
||||
## Tests
|
||||
<section id='tests'>
|
||||
# --hints--
|
||||
|
||||
```yml
|
||||
tests: []
|
||||
|
||||
```
|
||||
# --solutions--
|
||||
|
||||
</section>
|
||||
|
||||
## Challenge Seed
|
||||
<section id='challengeSeed'>
|
||||
|
||||
</section>
|
||||
|
||||
## Solution
|
||||
<section id='solution'>
|
||||
|
||||
```js
|
||||
// solution required
|
||||
```
|
||||
|
||||
/section>
|
||||
|
||||
@ -1,37 +1,16 @@
|
||||
---
|
||||
id: bd7158d8c443eddfaeb5bd0f
|
||||
title: 管理图书交易俱乐部
|
||||
challengeType: 4
|
||||
videoUrl: ''
|
||||
title: 管理图书交易俱乐部
|
||||
---
|
||||
|
||||
## Description
|
||||
<section id="description"> <strong>目标：</strong>构建一个功能类似于此的<a href="https://glitch.com" target="_blank">Glitch</a>应用程序： <a href="https://chrome-delivery.glitch.me/ /" target="_blank">https</a> ： <a href="https://chrome-delivery.glitch.me/ /" target="_blank">//chrome-delivery.glitch.me</a> 。完成以下<a href="https://en.wikipedia.org/wiki/User_story" target="_blank">用户故事</a> 。使用您需要的任何库或API。给它你自己的个人风格。 <strong>用户故事：</strong>我可以查看每个用户发布的所有图书。 <strong>用户故事：</strong>我可以添加一本新书。 <strong>用户故事：</strong>我可以更新我的设置以存储我的全名，城市和州。 <strong>用户故事：</strong>我可以提议交易并等待其他用户接受交易。完成这些用户故事的实现后，单击“我已完成此挑战”按钮，然后输入GitHub存储库和在Heroku上运行的实时应用程序的URL。您可以通过Facebook上的朋友分享您的项目反馈。 </section>
|
||||
# --description--
|
||||
|
||||
## Instructions
|
||||
<section id="instructions">
|
||||
</section>
|
||||
**目标：** 构建一个功能类似于此的[Glitch](https://glitch.com)应用程序： [https](<https://chrome-delivery.glitch.me/ />) ： [//chrome-delivery.glitch.me](<https://chrome-delivery.glitch.me/ />) 。完成以下[用户故事](https://en.wikipedia.org/wiki/User_story) 。使用您需要的任何库或API。给它你自己的个人风格。 **用户故事：** 我可以查看每个用户发布的所有图书。 **用户故事：** 我可以添加一本新书。 **用户故事：** 我可以更新我的设置以存储我的全名，城市和州。 **用户故事：** 我可以提议交易并等待其他用户接受交易。完成这些用户故事的实现后，单击“我已完成此挑战”按钮，然后输入GitHub存储库和在Heroku上运行的实时应用程序的URL。您可以通过Facebook上的朋友分享您的项目反馈。
|
||||
|
||||
## Tests
|
||||
<section id='tests'>
|
||||
# --hints--
|
||||
|
||||
```yml
|
||||
tests: []
|
||||
|
||||
```
|
||||
# --solutions--
|
||||
|
||||
</section>
|
||||
|
||||
## Challenge Seed
|
||||
<section id='challengeSeed'>
|
||||
|
||||
</section>
|
||||
|
||||
## Solution
|
||||
<section id='solution'>
|
||||
|
||||
```js
|
||||
// solution required
|
||||
```
|
||||
|
||||
/section>
|
||||
|
||||
@ -1,37 +1,16 @@
|
||||
---
|
||||
id: bd7108d8c242eddfaeb5bd13
|
||||
title: 全球地图数据
|
||||
challengeType: 3
|
||||
videoUrl: ''
|
||||
title: 全球地图数据
|
||||
---
|
||||
|
||||
## Description
|
||||
<section id="description"> <strong>目标：</strong>构建一个功能类似于此的<a href="https://codepen.io" target="_blank">CodePen.io</a>应用程序： <a href="https://codepen.io/freeCodeCamp/full/mVEJag" target="_blank">https</a> <strong>：</strong> <a href="https://codepen.io" target="_blank">//codepen.io/freeCodeCamp/full/mVEJag</a> 。完成以下<a href="https://en.wikipedia.org/wiki/User_story" target="_blank">用户故事</a> 。使用您需要的任何库或API。给它你自己的个人风格。 <strong>用户故事：</strong>我可以看到所有陨石落在世界地图上的位置。 <strong>用户故事：</strong>我可以通过查看陨石在地图上的表示方式来判断陨石的相对大小。 <strong>用户故事：</strong>我可以将鼠标悬停在陨石的数据点上以获取更多数据。 <strong>提示：</strong>这是一个可用于构建此数据集的数据集： <a href="https://raw.githubusercontent.com/freeCodeCamp/ProjectReferenceData/master/meteorite-strike-data.json" target="_blank">https</a> ： <a href="https://raw.githubusercontent.com/freeCodeCamp/ProjectReferenceData/master/meteorite-strike-data.json" target="_blank">//raw.githubusercontent.com/freeCodeCamp/ProjectReferenceData/master/meteorite-strike-data.json</a>如果卡住，请记住使用<a href="https://forum.freecodecamp.org/t/how-to-get-help-when-you-are-stuck-coding/19514" target="_blank">Read-Search-Ask</a> 。完成后，单击“我已完成此挑战”按钮并包含指向CodePen的链接。您可以通过Facebook上的朋友分享您的项目反馈。 </section>
|
||||
# --description--
|
||||
|
||||
## Instructions
|
||||
<section id="instructions">
|
||||
</section>
|
||||
**目标：** 构建一个功能类似于此的[CodePen.io](https://codepen.io)应用程序： [https](https://codepen.io/freeCodeCamp/full/mVEJag) **：** [//codepen.io/freeCodeCamp/full/mVEJag](https://codepen.io) 。完成以下[用户故事](https://en.wikipedia.org/wiki/User_story) 。使用您需要的任何库或API。给它你自己的个人风格。 **用户故事：** 我可以看到所有陨石落在世界地图上的位置。 **用户故事：** 我可以通过查看陨石在地图上的表示方式来判断陨石的相对大小。 **用户故事：** 我可以将鼠标悬停在陨石的数据点上以获取更多数据。 **提示：** 这是一个可用于构建此数据集的数据集： [https](https://raw.githubusercontent.com/freeCodeCamp/ProjectReferenceData/master/meteorite-strike-data.json) ： [//raw.githubusercontent.com/freeCodeCamp/ProjectReferenceData/master/meteorite-strike-data.json](https://raw.githubusercontent.com/freeCodeCamp/ProjectReferenceData/master/meteorite-strike-data.json)如果卡住，请记住使用[Read-Search-Ask](https://forum.freecodecamp.org/t/how-to-get-help-when-you-are-stuck-coding/19514) 。完成后，单击“我已完成此挑战”按钮并包含指向CodePen的链接。您可以通过Facebook上的朋友分享您的项目反馈。
|
||||
|
||||
## Tests
|
||||
<section id='tests'>
|
||||
# --hints--
|
||||
|
||||
```yml
|
||||
tests: []
|
||||
|
||||
```
|
||||
# --solutions--
|
||||
|
||||
</section>
|
||||
|
||||
## Challenge Seed
|
||||
<section id='challengeSeed'>
|
||||
|
||||
</section>
|
||||
|
||||
## Solution
|
||||
<section id='solution'>
|
||||
|
||||
```js
|
||||
// solution required
|
||||
```
|
||||
|
||||
/section>
|
||||
|
||||
@ -1,37 +1,16 @@
|
||||
---
|
||||
id: bd7150d8c442eddfafb5bd1c
|
||||
title: P2P视频聊天应用
|
||||
challengeType: 3
|
||||
videoUrl: ''
|
||||
title: P2P视频聊天应用
|
||||
---
|
||||
|
||||
## Description
|
||||
<section id="description"> <strong>目标：</strong>构建一个功能类似于此的<a href="https://glitch.com" target="_blank">Glitch</a>应用程序： <a href="https://grove-voice.glitch.me/" target="_blank">https</a> ： <a href="https://grove-voice.glitch.me/" target="_blank">//grove-voice.glitch.me</a> 。完成以下<a href="https://en.wikipedia.org/wiki/User_story" target="_blank">用户故事</a> 。使用您需要的任何库或API。给它你自己的个人风格。 <strong>用户故事：</strong>到达后，浏览器将提示我访问我的相机和麦克风。 <strong>用户故事：</strong>在我给予许可后，系统会提示我输入房间名称。 <strong>用户故事：</strong>输入房间名称后，如果之前没有该房间的房间，则会创建房间。 <strong>用户故事：我的</strong>一个朋友可以随后访问同一个网站，输入我输入的同一个房间，然后加入同一个房间，然后与我进行视频聊天。 <strong>用户故事：</strong>如果我输入房间名称，并且该房间已经有两个人，我会收到房间已满的通知。 <strong>用户故事：</strong>任何人都可以创建或加入任何房间。并且可以有任意数量的房间，但所有房间都必须具有唯一的名称。 <strong>用户故事：</strong>我可以选择不允许该网站访问我的麦克风和网络摄像头。如果我选择不这样做，如果出现其他一些驱动程序问题，我会看到一条错误消息，说明这些是必需的。 <strong>用户故事：</strong>当我选择取消房间名称输入步骤，或者如果我没有输入姓名或仅输入空格时，它应该再次要求我输入有效的房间名称。 <strong>用户故事：</strong>如果房间中的两个人中的一个断开连接，他们可以重新连接到同一个房间并继续聊天。如果卡住，请记得使用<a href="https://forum.freecodecamp.org/t/how-to-get-help-when-you-are-stuck-coding/19514" target="_blank">Read-Search-Ask</a> 。完成后，单击“我已完成此挑战”按钮，并包含指向您的Glitch应用程序的链接。您可以通过Facebook上的朋友分享您的项目反馈。 </section>
|
||||
# --description--
|
||||
|
||||
## Instructions
|
||||
<section id="instructions">
|
||||
</section>
|
||||
**目标：** 构建一个功能类似于此的[Glitch](https://glitch.com)应用程序： [https](https://grove-voice.glitch.me/) ： [//grove-voice.glitch.me](https://grove-voice.glitch.me/) 。完成以下[用户故事](https://en.wikipedia.org/wiki/User_story) 。使用您需要的任何库或API。给它你自己的个人风格。 **用户故事：** 到达后，浏览器将提示我访问我的相机和麦克风。 **用户故事：** 在我给予许可后，系统会提示我输入房间名称。 **用户故事：** 输入房间名称后，如果之前没有该房间的房间，则会创建房间。 **用户故事：我的** 一个朋友可以随后访问同一个网站，输入我输入的同一个房间，然后加入同一个房间，然后与我进行视频聊天。 **用户故事：** 如果我输入房间名称，并且该房间已经有两个人，我会收到房间已满的通知。 **用户故事：** 任何人都可以创建或加入任何房间。并且可以有任意数量的房间，但所有房间都必须具有唯一的名称。 **用户故事：** 我可以选择不允许该网站访问我的麦克风和网络摄像头。如果我选择不这样做，如果出现其他一些驱动程序问题，我会看到一条错误消息，说明这些是必需的。 **用户故事：** 当我选择取消房间名称输入步骤，或者如果我没有输入姓名或仅输入空格时，它应该再次要求我输入有效的房间名称。 **用户故事：** 如果房间中的两个人中的一个断开连接，他们可以重新连接到同一个房间并继续聊天。如果卡住，请记得使用[Read-Search-Ask](https://forum.freecodecamp.org/t/how-to-get-help-when-you-are-stuck-coding/19514) 。完成后，单击“我已完成此挑战”按钮，并包含指向您的Glitch应用程序的链接。您可以通过Facebook上的朋友分享您的项目反馈。
|
||||
|
||||
## Tests
|
||||
<section id='tests'>
|
||||
# --hints--
|
||||
|
||||
```yml
|
||||
tests: []
|
||||
|
||||
```
|
||||
# --solutions--
|
||||
|
||||
</section>
|
||||
|
||||
## Challenge Seed
|
||||
<section id='challengeSeed'>
|
||||
|
||||
</section>
|
||||
|
||||
## Solution
|
||||
<section id='solution'>
|
||||
|
||||
```js
|
||||
// solution required
|
||||
```
|
||||
|
||||
/section>
|
||||
|
||||
@ -1,37 +1,16 @@
|
||||
---
|
||||
id: bd7198d8c242eddfaeb5bd13
|
||||
title: 用力导向图显示全国连续性
|
||||
challengeType: 3
|
||||
videoUrl: ''
|
||||
title: 用力导向图显示全国连续性
|
||||
---
|
||||
|
||||
## Description
|
||||
<section id="description"> <strong>目标：</strong>构建一个功能类似于此的<a href="https://codepen.io" target="_blank">CodePen.io</a>应用程序： <a href="https://codepen.io/freeCodeCamp/full/xVopBo" target="_blank">https</a> <strong>：</strong> <a href="https://codepen.io" target="_blank">//codepen.io/freeCodeCamp/full/xVopBo</a> 。完成以下<a href="https://en.wikipedia.org/wiki/User_story" target="_blank">用户故事</a> 。使用您需要的任何库或API。给它你自己的个人风格。 <strong>用户故事：</strong>我可以看到一个强制导向图，显示哪些国家/地区共享边界。 <strong>用户故事：</strong>我可以在其节点上看到每个国家/地区的旗帜。 <strong>提示：</strong>这是一个可用于构建此数据集的数据集： <a href="https://raw.githubusercontent.com/DealPete/forceDirected/master/countries.json" target="_blank">https</a> <strong>：</strong> //raw.githubusercontent.com/DealPete/forceDirected/master/countries.json <strong>提示：</strong>您可以在<a href="https://www.flag-sprites.com" target="_blank">https：//www.flag-</a>创建国旗的spritesheet <a href="https://www.flag-sprites.com" target="_blank">sprites.com</a> 。如果卡住，请记得使用<a href="https://forum.freecodecamp.org/t/how-to-get-help-when-you-are-stuck-coding/19514" target="_blank">Read-Search-Ask</a> 。完成后，单击“我已完成此挑战”按钮并包含指向CodePen的链接。您可以通过Facebook上的朋友分享您的项目反馈。 </section>
|
||||
# --description--
|
||||
|
||||
## Instructions
|
||||
<section id="instructions">
|
||||
</section>
|
||||
**目标：** 构建一个功能类似于此的[CodePen.io](https://codepen.io)应用程序： [https](https://codepen.io/freeCodeCamp/full/xVopBo) **：** [//codepen.io/freeCodeCamp/full/xVopBo](https://codepen.io) 。完成以下[用户故事](https://en.wikipedia.org/wiki/User_story) 。使用您需要的任何库或API。给它你自己的个人风格。 **用户故事：** 我可以看到一个强制导向图，显示哪些国家/地区共享边界。 **用户故事：** 我可以在其节点上看到每个国家/地区的旗帜。 **提示：** 这是一个可用于构建此数据集的数据集： [https](https://raw.githubusercontent.com/DealPete/forceDirected/master/countries.json) **：** //raw.githubusercontent.com/DealPete/forceDirected/master/countries.json **提示：** 您可以在[https：//www.flag-](https://www.flag-sprites.com)创建国旗的spritesheet [sprites.com](https://www.flag-sprites.com) 。如果卡住，请记得使用[Read-Search-Ask](https://forum.freecodecamp.org/t/how-to-get-help-when-you-are-stuck-coding/19514) 。完成后，单击“我已完成此挑战”按钮并包含指向CodePen的链接。您可以通过Facebook上的朋友分享您的项目反馈。
|
||||
|
||||
## Tests
|
||||
<section id='tests'>
|
||||
# --hints--
|
||||
|
||||
```yml
|
||||
tests: []
|
||||
|
||||
```
|
||||
# --solutions--
|
||||
|
||||
</section>
|
||||
|
||||
## Challenge Seed
|
||||
<section id='challengeSeed'>
|
||||
|
||||
</section>
|
||||
|
||||
## Solution
|
||||
<section id='solution'>
|
||||
|
||||
```js
|
||||
// solution required
|
||||
```
|
||||
|
||||
/section>
|
||||
|
||||
@ -1,37 +1,16 @@
|
||||
---
|
||||
id: bd7158d8c442eddfaeb5bd10
|
||||
title: 显示当地天气
|
||||
challengeType: 3
|
||||
videoUrl: ''
|
||||
title: 显示当地天气
|
||||
---
|
||||
|
||||
## Description
|
||||
<section id="description"> <strong>目标：</strong>构建一个功能类似于此的<a href="https://codepen.io" target="_blank">CodePen.io</a>应用程序： <a href="https://codepen.io/freeCodeCamp/full/bELRjV" target="_blank">https</a> <strong>：</strong> <a href="https://codepen.io" target="_blank">//codepen.io/freeCodeCamp/full/bELRjV</a> 。 <strong>规则＃1：</strong>不要查看示例项目的代码。自己搞清楚。 <strong>规则＃2：</strong>完成以下<a href="https://en.wikipedia.org/wiki/User_story" target="_blank">用户故事</a> 。使用您需要的任何库或API。给它你自己的个人风格。 <strong>用户故事：</strong>我可以在当前位置看到天气。 <strong>用户故事：</strong>根据天气情况，我可以看到不同的图标或背景图像（例如雪山，炎热的沙漠）。 <strong>用户故事：</strong>我可以按一个按钮在华氏温度和摄氏温度之间切换。 <strong>注意：</strong>许多Internet浏览器现在需要HTTP Secure（ <code>https://</code> ）连接才能通过HTML5 Geolocation获取用户的语言环境。因此，我们建议使用HTML5 Geolocation获取用户位置，然后使用freeCodeCamp Weather API <a href="https://fcc-weather-api.glitch.me" target="_blank">https://fcc-weather-api.glitch.me</a> ，该API使用HTTP安全连接进行天气预报。此外，请务必通过<code>https://</code>连接到<a href="https://codepen.io" target="_blank">CodePen.io</a> 。如果卡住，请记得使用<a href="https://forum.freecodecamp.org/t/how-to-get-help-when-you-are-stuck-coding/19514" target="_blank">Read-Search-Ask</a> 。完成后，单击“我已完成此挑战”按钮并包含指向CodePen的链接。您可以通过Facebook上的朋友分享您的项目反馈。 </section>
|
||||
# --description--
|
||||
|
||||
## Instructions
|
||||
<section id="instructions">
|
||||
</section>
|
||||
**目标：** 构建一个功能类似于此的[CodePen.io](https://codepen.io)应用程序： [https](https://codepen.io/freeCodeCamp/full/bELRjV) **：** [//codepen.io/freeCodeCamp/full/bELRjV](https://codepen.io) 。 **规则＃1：** 不要查看示例项目的代码。自己搞清楚。 **规则＃2：** 完成以下[用户故事](https://en.wikipedia.org/wiki/User_story) 。使用您需要的任何库或API。给它你自己的个人风格。 **用户故事：** 我可以在当前位置看到天气。 **用户故事：** 根据天气情况，我可以看到不同的图标或背景图像（例如雪山，炎热的沙漠）。 **用户故事：** 我可以按一个按钮在华氏温度和摄氏温度之间切换。 **注意：** 许多Internet浏览器现在需要HTTP Secure（ `https://` ）连接才能通过HTML5 Geolocation获取用户的语言环境。因此，我们建议使用HTML5 Geolocation获取用户位置，然后使用freeCodeCamp Weather API <https://fcc-weather-api.glitch.me> ，该API使用HTTP安全连接进行天气预报。此外，请务必通过`https://`连接到[CodePen.io](https://codepen.io) 。如果卡住，请记得使用[Read-Search-Ask](https://forum.freecodecamp.org/t/how-to-get-help-when-you-are-stuck-coding/19514) 。完成后，单击“我已完成此挑战”按钮并包含指向CodePen的链接。您可以通过Facebook上的朋友分享您的项目反馈。
|
||||
|
||||
## Tests
|
||||
<section id='tests'>
|
||||
# --hints--
|
||||
|
||||
```yml
|
||||
tests: []
|
||||
|
||||
```
|
||||
# --solutions--
|
||||
|
||||
</section>
|
||||
|
||||
## Challenge Seed
|
||||
<section id='challengeSeed'>
|
||||
|
||||
</section>
|
||||
|
||||
## Solution
|
||||
<section id='solution'>
|
||||
|
||||
```js
|
||||
// solution required
|
||||
```
|
||||
|
||||
/section>
|
||||
|
||||
@ -1,37 +1,16 @@
|
||||
---
|
||||
id: bd7158d8c442eddfaeb5bd1f
|
||||
title: 使用Twitch JSON API
|
||||
challengeType: 3
|
||||
videoUrl: ''
|
||||
title: 使用Twitch JSON API
|
||||
---
|
||||
|
||||
## Description
|
||||
<section id="description"> <strong>目标：</strong>构建一个功能类似于此的<a href="https://codepen.io" target="_blank">CodePen.io</a>应用程序： <a href="https://codepen.io/freeCodeCamp/full/Myvqmo/" target="_blank">https</a> <strong>：</strong> <a href="https://codepen.io" target="_blank">//codepen.io/freeCodeCamp/full/Myvqmo/</a> 。完成以下<a href="https://en.wikipedia.org/wiki/User_story" target="_blank">用户故事</a> 。使用您需要的任何库或API。给它你自己的个人风格。 <strong>用户故事：</strong>我可以看到freeCodeCamp当前是否在Twitch.tv上流式传输。 <strong>用户故事：</strong>我可以点击状态输出并直接发送到freeCodeCamp的Twitch.tv频道。 <strong>用户故事：</strong>如果Twitch用户当前正在播放，我可以看到有关他们正在播放的内容的其他详细信息。 <strong>提示：</strong>请参阅<a href="http://forum.freecodecamp.org/t/use-the-twitchtv-json-api/19541" target="_blank">http://forum.freecodecamp.org/t/use-the-twitchtv-json-api/19541上</a>对Twitch.tv的JSONP API的示例调用。 <strong>提示：</strong>有关此API调用的相关文档位于： <a href="https://dev.twitch.tv/docs/v5/reference/streams/#get-stream-by-user" target="_blank">https</a> ： <a href="https://dev.twitch.tv/docs/v5/reference/streams/#get-stream-by-user" target="_blank">//dev.twitch.tv/docs/v5/reference/streams/#get-stream-by-user</a> 。 <strong>提示：</strong>这是定期传输的人的Twitch.tv用户名数组： <code>["ESL_SC2", "OgamingSC2", "cretetion", "freecodecamp", "storbeck", "habathcx", "RobotCaleb", "noobs2ninjas"]</code> <strong>更新：</strong>由于<a href="https://blog.twitch.tv/client-id-required-for-kraken-api-calls-afbb8e95f843#.f8hipkht1" target="_blank">此处</a>解释的API使用条件发生变化，Twitch.tv现在需要API密钥，但我们已经构建了一种解决方法。使用<a href="https://wind-bow.glitch.me" target="_blank">https://wind-bow.glitch.me/twitch-api</a>而不是twitch的API基本URL（即https://api.twitch.tv/kraken），您仍然可以获取帐户信息，而无需注册API密钥。如果卡住，请记得使用<a href="https://forum.freecodecamp.org/t/how-to-get-help-when-you-are-stuck-coding/19514" target="_blank">Read-Search-Ask</a> 。完成后，单击“我已完成此挑战”按钮并包含指向CodePen的链接。您可以通过Facebook上的朋友分享您的项目反馈。 </section>
|
||||
# --description--
|
||||
|
||||
## Instructions
|
||||
<section id="instructions">
|
||||
</section>
|
||||
**目标：** 构建一个功能类似于此的[CodePen.io](https://codepen.io)应用程序： [https](https://codepen.io/freeCodeCamp/full/Myvqmo/) **：** [//codepen.io/freeCodeCamp/full/Myvqmo/](https://codepen.io) 。完成以下[用户故事](https://en.wikipedia.org/wiki/User_story) 。使用您需要的任何库或API。给它你自己的个人风格。 **用户故事：** 我可以看到freeCodeCamp当前是否在Twitch.tv上流式传输。 **用户故事：** 我可以点击状态输出并直接发送到freeCodeCamp的Twitch.tv频道。 **用户故事：** 如果Twitch用户当前正在播放，我可以看到有关他们正在播放的内容的其他详细信息。 **提示：** 请参阅[http://forum.freecodecamp.org/t/use-the-twitchtv-json-api/19541上](http://forum.freecodecamp.org/t/use-the-twitchtv-json-api/19541)对Twitch.tv的JSONP API的示例调用。 **提示：** 有关此API调用的相关文档位于： [https](https://dev.twitch.tv/docs/v5/reference/streams/#get-stream-by-user) ： [//dev.twitch.tv/docs/v5/reference/streams/#get-stream-by-user](https://dev.twitch.tv/docs/v5/reference/streams/#get-stream-by-user) 。 **提示：** 这是定期传输的人的Twitch.tv用户名数组： `["ESL_SC2", "OgamingSC2", "cretetion", "freecodecamp", "storbeck", "habathcx", "RobotCaleb", "noobs2ninjas"]` **更新：** 由于[此处](https://blog.twitch.tv/client-id-required-for-kraken-api-calls-afbb8e95f843#.f8hipkht1)解释的API使用条件发生变化，Twitch.tv现在需要API密钥，但我们已经构建了一种解决方法。使用[https://wind-bow.glitch.me/twitch-api](https://wind-bow.glitch.me)而不是twitch的API基本URL（即`https://api.twitch.tv/kraken），您仍然可以获取帐户信息，而无需注册API密钥。如果卡住，请记得使用`[Read-Search-Ask](https://forum.freecodecamp.org/t/how-to-get-help-when-you-are-stuck-coding/19514) 。完成后，单击“我已完成此挑战”按钮并包含指向CodePen的链接。您可以通过Facebook上的朋友分享您的项目反馈。
|
||||
|
||||
## Tests
|
||||
<section id='tests'>
|
||||
# --hints--
|
||||
|
||||
```yml
|
||||
tests: []
|
||||
|
||||
```
|
||||
# --solutions--
|
||||
|
||||
</section>
|
||||
|
||||
## Challenge Seed
|
||||
<section id='challengeSeed'>
|
||||
|
||||
</section>
|
||||
|
||||
## Solution
|
||||
<section id='solution'>
|
||||
|
||||
```js
|
||||
// solution required
|
||||
```
|
||||
|
||||
/section>
|
||||
|
||||
Reference in New Issue
Block a user