mirror of
https://github.com/freeCodeCamp/freeCodeCamp.git
synced 2026-01-05 21:03:24 -05:00
chore(i18n,learn): processed translations (#48171)
This commit is contained in:
camperbot
@@ -15,7 +15,7 @@ dashedName: state-name-puzzle
|
||||
|
||||
Write a function to solve the challenge for a given array of actual U.S. state names, and for fictional state names.
|
||||
|
||||
The function should return an array. Each element should be an object in this form: `{"from":[],"to":[]}`. The `"from"` array should contain the original names and the `"to"` array should contain the resultant names.
|
||||
The function should return an array. Each element should be an object in this form: `{"from":[],"to":[]}`. The `from` array should contain the original names and the `to` array should contain the resultant names.
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
@@ -7,7 +7,7 @@ dashedName: step-5
|
||||
|
||||
# --description--
|
||||
|
||||
أسفل عنصرك `.header`، أنشئ عنصر `div` جديد مع `class` يسمى `"gallery"`. سيكون `div` حاوية لصور المَعْرِض.
|
||||
Below your `.header` element, create a new `div` element and assign it a `class` of `gallery`. سيكون `div` حاوية لصور المَعْرِض.
|
||||
|
||||
في عنصر `.gallery`، أنشئ تسع عناصر `img`.
|
||||
|
||||
|
||||
@@ -17,7 +17,7 @@ You should use compound assignment to add the string `Right! You win 20 gold!` t
|
||||
assert.match(pick.toString(), /text\.innerText\s*\+=\s*('|")Right! You win 20 gold!\1/);
|
||||
```
|
||||
|
||||
You should use compound assignment add `20` to the value of `gold`.
|
||||
You should use compound assignment to add `20` to the value of `gold`.
|
||||
|
||||
```js
|
||||
assert.match(pick.toString(), /gold\s*\+=\s*20/);
|
||||
|
||||
@@ -11,12 +11,12 @@ dashedName: escape-sequences-in-strings
|
||||
|
||||
引號不是字符串中唯一可以被轉義（<dfn>escaped</dfn>）的字符。 使用轉義字符有兩個原因：
|
||||
|
||||
1. To allow you to use characters you may not otherwise be able to type out, such as a newline.
|
||||
1. 首先是可以讓你使用無法輸入的字符，例如換行。
|
||||
2. 其次是可以讓你在一個字符串中表示多個引號，而不會出錯。
|
||||
|
||||
我們在之前的挑戰中學到了這個。
|
||||
|
||||
<table class='table table-striped'><thead><tr><th>代碼</th><th>輸出</th></tr></thead><tbody><tr><td><code>\'</code></td><td>單引號</td></tr><tr><td><code>\"</code></td><td>雙引號</td></tr><tr><td><code>\\</code></td><td>反斜槓</td></tr><tr><td><code>\n</code></td><td>換行符</td></tr><tr><td><code>\t</code></td><td>tab</td></tr><tr><td><code>\r</code></td><td>carriage return</td></tr><tr><td><code>\b</code></td><td>退格</td></tr><tr><td><code>\f</code></td><td>換頁符</td></tr></tbody></table>
|
||||
<table class='table table-striped'><thead><tr><th>代碼</th><th>輸出</th></tr></thead><tbody><tr><td><code>\'</code></td><td>單引號</td></tr><tr><td><code>\"</code></td><td>雙引號</td></tr><tr><td><code>\\</code></td><td>反斜槓</td></tr><tr><td><code>\n</code></td><td>換行符</td></tr><tr><td><code>\t</code></td><td>製表符</td></tr><tr><td><code>\r</code></td><td>回車</td></tr><tr><td><code>\b</code></td><td>退格</td></tr><tr><td><code>\f</code></td><td>換頁符</td></tr></tbody></table>
|
||||
|
||||
*請注意，必須對反斜槓本身進行轉義，它才能顯示爲反斜槓。*
|
||||
|
||||
|
||||
@@ -71,7 +71,7 @@ assert(
|
||||
);
|
||||
```
|
||||
|
||||
Global variables should not be used to cache the array.
|
||||
不應使用全局變量來緩存數組。
|
||||
|
||||
```js
|
||||
countdown(1)
|
||||
|
||||
@@ -56,7 +56,7 @@ assert.deepStrictEqual(rangeOfNumbers(6, 9), [6, 7, 8, 9]);
|
||||
assert.deepStrictEqual(rangeOfNumbers(4, 4), [4]);
|
||||
```
|
||||
|
||||
Global variables should not be used to cache the array.
|
||||
不應使用全局變量來緩存數組。
|
||||
|
||||
```js
|
||||
rangeOfNumbers(1, 3)
|
||||
|
||||
@@ -12,9 +12,9 @@ ES6 提供了一個新的創建對象的語法，使用關鍵字 <dfn>class</dfn
|
||||
|
||||
值得注意的是，`class` 只是一個語法糖，它並不像 Java、Python 或者 Ruby 這一類的語言一樣，嚴格履行了面向對象的開發規範。
|
||||
|
||||
In ES5, an object can be created by defining a `constructor` function and using the `new` keyword to instantiate the object.
|
||||
在 ES5 裏面，我們通常會定義一個函數 `constructor`，然後使用 `new` 關鍵字來實例化一個對象。
|
||||
|
||||
In ES6, a `class` declaration has a `constructor` method that is invoked with the `new` keyword. If the `constructor` method is not explicitly defined, then it is implicitly defined with no arguments.
|
||||
在 ES6 裏，`class` 聲明有一個 `constructor` 方法，與 `new` 關鍵字一起被調用。 如果 `constructor` 方法沒有明確定義，那麼它就被含蓄地定義爲沒有參數。
|
||||
|
||||
```js
|
||||
// Explicit constructor
|
||||
|
||||
@@ -42,7 +42,7 @@ assert.deepEqual(steamrollArray([1, {}, [3, [[4]]]]), [1, {}, 3, 4]);
|
||||
assert(!code.match(/\.\s*flat\s*\(/) && !code.match(/\.\s*flatMap\s*\(/));
|
||||
```
|
||||
|
||||
Global variables should not be used.
|
||||
不應使用全局變量。
|
||||
|
||||
```js
|
||||
steamrollArray([1, {}, [3, [[4]]]])
|
||||
|
||||
@@ -8,7 +8,7 @@ dashedName: build-a-25--5-clock
|
||||
|
||||
# --description--
|
||||
|
||||
**Objective:** Build an app that is functionally similar to this: <a href="https://25--5-clock.freecodecamp.rocks" target="_blank" rel="noopener noreferrer nofollow">https://25--5-clock.freecodecamp.rocks</a>.
|
||||
**目標：** 構建一個應用，功能和 <a href="https://25--5-clock.freecodecamp.rocks" target="_blank" rel="noopener noreferrer nofollow">https://25--5-clock.freecodecamp.rocks</a> 類似。
|
||||
|
||||
完成以下需求，並且通過所有測試。 可以使用你需要的任何庫或 API。 賦予它你自己的個人風格。
|
||||
|
||||
|
||||
@@ -8,7 +8,7 @@ dashedName: build-a-drum-machine
|
||||
|
||||
# --description--
|
||||
|
||||
**Objective:** Build an app that is functionally similar to this: <a href="https://drum-machine.freecodecamp.rocks/" target="_blank" rel="noopener noreferrer nofollow">https://drum-machine.freecodecamp.rocks/</a>.
|
||||
**目標：** 構建一個應用，功能和 <a href="https://drum-machine.freecodecamp.rocks/" target="_blank" rel="noopener noreferrer nofollow">https://drum-machine.freecodecamp.rocks/</a> 類似。
|
||||
|
||||
完成以下需求，並且通過所有測試。 可以使用你需要的任何庫或 API。 賦予它你自己的個人風格。
|
||||
|
||||
|
||||
@@ -8,7 +8,7 @@ dashedName: build-a-javascript-calculator
|
||||
|
||||
# --description--
|
||||
|
||||
**Objective:** Build an app that is functionally similar to this: <a href="https://javascript-calculator.freecodecamp.rocks/" target="_blank" rel="noopener noreferrer nofollow">https://javascript-calculator.freecodecamp.rocks/</a>.
|
||||
**目標：** 構建一個應用，功能和 <a href="https://javascript-calculator.freecodecamp.rocks/" target="_blank" rel="noopener noreferrer nofollow">https://javascript-calculator.freecodecamp.rocks/</a> 類似。
|
||||
|
||||
完成以下需求，並且通過所有測試。 可以使用你需要的任何庫或 API。 賦予它你自己的個人風格。
|
||||
|
||||
|
||||
@@ -8,7 +8,7 @@ dashedName: build-a-markdown-previewer
|
||||
|
||||
# --description--
|
||||
|
||||
**Objective:** Build an app that is functionally similar to this: <a href="https://markdown-previewer.freecodecamp.rocks/" target="_blank" rel="noopener noreferrer nofollow">https://markdown-previewer.freecodecamp.rocks/</a>.
|
||||
**目標：** 構建一個應用，功能和 <a href="https://markdown-previewer.freecodecamp.rocks/" target="_blank" rel="noopener noreferrer nofollow">https://markdown-previewer.freecodecamp.rocks/</a> 類似。
|
||||
|
||||
完成以下需求，並且通過所有測試。 可以使用你需要的任何庫或 API。 賦予它你自己的個人風格。
|
||||
|
||||
|
||||
@@ -8,7 +8,7 @@ dashedName: build-a-random-quote-machine
|
||||
|
||||
# --description--
|
||||
|
||||
**Objective:** Build an app that is functionally similar to this: <a href="https://random-quote-machine.freecodecamp.rocks/" target="_blank" rel="noopener noreferrer nofollow">https://random-quote-machine.freecodecamp.rocks/</a>.
|
||||
**目標：** 構建一個應用，功能和 <a href="https://random-quote-machine.freecodecamp.rocks/" target="_blank" rel="noopener noreferrer nofollow">https://random-quote-machine.freecodecamp.rocks/</a> 類似。
|
||||
|
||||
完成以下需求，並且通過所有測試。 可以使用你需要的任何庫或 API。 賦予它你自己的個人風格。
|
||||
|
||||
|
||||
@@ -18,7 +18,7 @@ dashedName: learn-how-script-tags-and-document-ready-work
|
||||
|
||||
在 `script` 標籤中添加代碼 `$(document).ready(function() {`。 然後在後面（仍在該 `script` 標籤內）用 `});` 閉合它。
|
||||
|
||||
稍後將詳細介紹 `functions`， 現在需要知道的是，只要瀏覽器加載頁面，`function` 中放入的代碼就會運行。
|
||||
稍後將詳細介紹 `functions`， 重要的是要知道，在瀏覽器加載頁面後，你放入此 `function` 的代碼將立即運行。
|
||||
|
||||
有一點很重要，如果沒有 `document ready function`，代碼將在 HTML 頁面呈現之前運行，這可能會導致錯誤。
|
||||
|
||||
|
||||
@@ -10,7 +10,7 @@ dashedName: authentication-strategies
|
||||
|
||||
策略是認證用戶的一種方式。 如果你讓用戶在註冊時填寫了用戶信息，那你就可以基於這些信息進行驗證。或者也可以引入第三方登錄，如 Google 或者 Github。 在這個項目中，我們將使用 Passport 中間件。 Passport 提供了一套全面的策略，支持使用用戶名和密碼、GitHub、谷歌等進行認證。
|
||||
|
||||
`passport-local@~1.0.0` has already been added as a dependency, so add it to your server as follows: `const LocalStrategy = require('passport-local');`
|
||||
已經引入 `passport-local@~1.0.0` 作爲依賴，將它添加到服務器，就像這樣：`const LocalStrategy = require('passport-local');`
|
||||
|
||||
然後，需要讓 passport **使用**一個實例化的 LocalStrategy 對象，這個對象的一些設置已完成。 請注意，接下來的所有代碼都應寫在連接數據庫的回調中，因爲它們的執行都依賴數據庫。
|
||||
|
||||
|
||||
@@ -10,7 +10,7 @@ dashedName: authentication-with-socket-io
|
||||
|
||||
目前，你還無法確定連接到服務器的用戶身份。 雖然 `req.user` 包含用戶信息，但這個只在用戶直接與服務器交互時產生。當用戶通過 web socket 與服務器連接時，由於不存在 `req` 對象，我們就無法獲取用戶數據。 解決這個問題的方法之一是通過讀取和解析請求中包含 passport session 的 cookie，然後反序列化，進而獲取用戶信息對象。 幸運的是，NPM 上有可以讓這個複雜的流程簡單化的庫。
|
||||
|
||||
`passport.socketio@~3.7.0`, `connect-mongo@~3.2.0`, and `cookie-parser@~1.4.5` have already been added as dependencies. Require them as `passportSocketIo`, `MongoStore`, and `cookieParser` respectively. Also, we need to initialize a new memory store, from `express-session` which we previously required. It should look like this:
|
||||
`passport.socketio@~3.7.0`、`connect-mongo@~3.2.0` 和 `cookie-parser@~1.4.5` 已經被添加爲依賴項。 分別請求它們爲 `passportSocketIo`、`MongoStore` 和 `cookieParser`。 同時，我們需要從之前引入的 `express-session` 中初始化新的內存。 就像這樣：
|
||||
|
||||
```js
|
||||
const MongoStore = require('connect-mongo')(session);
|
||||
@@ -65,7 +65,7 @@ console.log('user ' + socket.request.user.name + ' connected');
|
||||
|
||||
它將在服務器控制檯記錄已連接的用戶！
|
||||
|
||||
完成以上要求後，請提交你的頁面鏈接。 If you're running into errors, you can check out the project up to this point <a href="https://gist.github.com/camperbot/1414cc9433044e306dd7fd0caa1c6254" target="_blank" rel="noopener noreferrer nofollow">https://gist.github.com/camperbot/1414cc9433044e306dd7fd0caa1c6254</a>.
|
||||
完成以上要求後，請提交你的頁面鏈接。 如果你遇到了問題，可以參考 <a href="https://gist.github.com/camperbot/1414cc9433044e306dd7fd0caa1c6254" target="_blank" rel="noopener noreferrer nofollow">https://gist.github.com/camperbot/1414cc9433044e306dd7fd0caa1c6254</a>。
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
@@ -26,7 +26,7 @@ module.exports = function (app, myDataBase) {
|
||||
|
||||
現在，我們來把 server.js 中與驗證相關的代碼分離到 auth.js 中，例如序列化，設置驗證策略等。 請正確添加依賴，並在 server.js 中調用 `auth(app, myDataBase)`。
|
||||
|
||||
完成上述要求後，請提交你的頁面鏈接。 If you're running into errors, you can <a href="https://gist.github.com/camperbot/2d06ac5c7d850d8cf073d2c2c794cc92" target="_blank" rel="noopener noreferrer nofollow">check out an example of the completed project</a>.
|
||||
完成上述要求後，請提交你的頁面鏈接。 如果你在運行時遇到錯誤，你可以<a href="https://gist.github.com/camperbot/2d06ac5c7d850d8cf073d2c2c794cc92" target="_blank" rel="noopener noreferrer nofollow">查看已執行項目的當前進度</a>。
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
@@ -38,7 +38,7 @@ socket.on('user count', function(data) {
|
||||
|
||||
現在你可以嘗試啓動你的 app 並登錄，你會看到在客戶端的控制檯打印出了 “1”，這就表示目前連接到服務器的用戶數爲 1。 你可以試着通過打開多個 app 來驗證數量是否會增加。
|
||||
|
||||
完成上述要求後，請提交你的頁面鏈接。 If you're running into errors, you can <a href="https://gist.github.com/camperbot/28ef7f1078f56eb48c7b1aeea35ba1f5" target="_blank" rel="noopener noreferrer nofollow">check out the project completed up to this point</a>.
|
||||
完成上述要求後，請提交你的頁面鏈接。 如果你在運行時遇到錯誤，你可以<a href="https://gist.github.com/camperbot/28ef7f1078f56eb48c7b1aeea35ba1f5" target="_blank" rel="noopener noreferrer nofollow">查看已執行項目的當前進度</a>。
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
@@ -31,7 +31,7 @@ app
|
||||
});
|
||||
```
|
||||
|
||||
完成上述要求後，請提交你的頁面鏈接。 If you're running into errors, you can <a href="https://gist.github.com/camperbot/ae49b8778cab87e93284a91343da0959" target="_blank" rel="noopener noreferrer nofollow">check out the project completed up to this point</a>.
|
||||
完成上述要求後，請提交你的頁面鏈接。 如果你在運行時遇到錯誤，你可以<a href="https://gist.github.com/camperbot/ae49b8778cab87e93284a91343da0959" target="_blank" rel="noopener noreferrer nofollow">查看已執行項目的當前進度</a>。
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
@@ -22,7 +22,7 @@ socket.on('disconnect', () => {
|
||||
|
||||
**注意：**和 `'disconnect'` 類似，所有 socket 可以發送到服務器的事件，我們都應該在有 “socket” 定義的連接監聽器裏處理。
|
||||
|
||||
完成上述要求後，請提交你的頁面鏈接。 If you're running into errors, you can <a href="https://gist.github.com/camperbot/ab1007b76069884fb45b215d3c4496fa" target="_blank" rel="noopener noreferrer nofollow">check out the project completed up to this point</a>.
|
||||
完成上述要求後，請提交你的頁面鏈接。 如果你在運行時遇到錯誤，你可以<a href="https://gist.github.com/camperbot/ab1007b76069884fb45b215d3c4496fa" target="_blank" rel="noopener noreferrer nofollow">查看已執行項目的當前進度</a>。
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
@@ -10,7 +10,7 @@ dashedName: hashing-your-passwords
|
||||
|
||||
回過頭來看信息安全，你也許記得在數據庫中存儲明文密碼是*絕對*禁止的。 現在，我們需要引入 BCrypt 來解決這個問題。
|
||||
|
||||
`bcrypt@~5.0.0` has already been added as a dependency, so require it in your server. 你需要在兩個步驟中使用哈希運算：註冊和保存新賬戶，以及登錄時檢查密碼是否正確。
|
||||
`bcrypt@~5.0.0` 已被添加爲依賴項，在你的服務器中請求它。 你需要在兩個步驟中使用哈希運算：註冊和保存新賬戶，以及登錄時檢查密碼是否正確。
|
||||
|
||||
目前處理註冊的路由中，我們是這樣把密碼添加到數據庫的：`password: req.body.password`。 保存哈希值的一個簡單方式是在數據庫邏輯中添加 `const hash = bcrypt.hashSync(req.body.password, 12);`，然後把 `req.body.password` 替換爲 `password: hash`。
|
||||
|
||||
@@ -24,7 +24,7 @@ if (!bcrypt.compareSync(password, user.password)) {
|
||||
|
||||
當你需要存儲密碼時，這樣做可以有效地提升網站的安全性。
|
||||
|
||||
完成上述要求後，請提交你的頁面鏈接。 If you're running into errors, you can <a href="https://gist.github.com/camperbot/dc16cca09daea4d4151a9c36a1fab564" target="_blank" rel="noopener noreferrer nofollow">check out the project completed up to this point</a>.
|
||||
完成上述要求後，請提交你的頁面鏈接。 如果你在運行時遇到錯誤，你可以<a href="https://gist.github.com/camperbot/dc16cca09daea4d4151a9c36a1fab564" target="_blank" rel="noopener noreferrer nofollow">查看已執行項目的當前進度</a>。
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
@@ -24,7 +24,7 @@ h2.center#welcome Welcome, #{username}!
|
||||
a(href='/logout') Logout
|
||||
```
|
||||
|
||||
完成上述要求後，請提交你的頁面鏈接。 If you're running into errors, you can <a href="https://gist.github.com/camperbot/136b3ad611cc80b41cab6f74bb460f6a" target="_blank" rel="noopener noreferrer nofollow">check out the project completed up to this point</a>.
|
||||
完成上述要求後，請提交你的頁面鏈接。 如果你在運行時遇到錯誤，你可以<a href="https://gist.github.com/camperbot/136b3ad611cc80b41cab6f74bb460f6a" target="_blank" rel="noopener noreferrer nofollow">查看已執行項目的當前進度</a>。
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
@@ -18,7 +18,7 @@ dashedName: how-to-use-passport-strategies
|
||||
|
||||
這時，由於我們還沒有實現註冊功能，如果你在表單裏輸入了用戶名和密碼，路由將會重定向到主頁 `/`，在服務端將會打印 `'User {USERNAME} attempted to log in.'`。
|
||||
|
||||
完成上述要求後，請提交你的頁面鏈接。 If you're running into errors, you can <a href="https://gist.github.com/camperbot/7ad011ac54612ad53188b500c5e99cb9" target="_blank" rel="noopener noreferrer nofollow">check out the project completed up to this point</a>.
|
||||
完成上述要求後，請提交你的頁面鏈接。 如果你在運行時遇到錯誤，你可以<a href="https://gist.github.com/camperbot/7ad011ac54612ad53188b500c5e99cb9" target="_blank" rel="noopener noreferrer nofollow">查看已執行項目的當前進度</a>。
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
@@ -10,7 +10,7 @@ dashedName: implement-the-serialization-of-a-passport-user
|
||||
|
||||
截至目前，我們還沒有配置完數據庫，因此還無法加載用戶數據。 實現這個的方式很多，但對於我們的項目，一旦服務器啓動，那麼只要有 app 實例在運行，數據庫就應一直處於連接狀態。 爲此，你需要在環境變量 `MONGO_URI` 中添加你的數據庫地址（比如：`mongodb+srv://:@cluster0-jvwxi.mongodb.net/?retryWrites=true&w=majority`）。 我們會在 `connection.js` 文件中調用它。
|
||||
|
||||
*If you are having issues setting up a free database on MongoDB Atlas, check out <a href="https://www.freecodecamp.org/news/get-started-with-mongodb-atlas/" target="_blank" rel="noopener noreferrer nofollow">tutorial</a>.*
|
||||
*如果你在 MongoDB Atlas 設置免費數據庫時遇到問題，請查看<a href="https://chinese.freecodecamp.org/news/get-started-with-mongodb-atlas/" target="_blank" rel="noopener noreferrer nofollow">教程</a>。*
|
||||
|
||||
現在我們想要連接到數據庫，然後開始監聽請求。 這樣做的目的是在連接數據庫之前或者出現數據庫錯誤時，不接收任何請求。 要實現這一點，你需要在以下代碼中包含序列化和應用的路由：
|
||||
|
||||
@@ -40,7 +40,7 @@ myDB(async client => {
|
||||
|
||||
記得要取消 `deserializeUser` 中 `myDataBase` 的註釋，並把 `doc` 添加到 `done(null, null)`。
|
||||
|
||||
完成上述要求後，請提交你的頁面鏈接。 If you're running into errors, you can <a href="https://gist.github.com/camperbot/175f2f585a2d8034044c7e8857d5add7" target="_blank" rel="noopener noreferrer nofollow">check out the project completed up to this point</a>.
|
||||
完成上述要求後，請提交你的頁面鏈接。 如果你在運行時遇到錯誤，你可以<a href="https://gist.github.com/camperbot/175f2f585a2d8034044c7e8857d5add7" target="_blank" rel="noopener noreferrer nofollow">查看已執行項目的當前進度</a>。
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
@@ -8,13 +8,13 @@ dashedName: implementation-of-social-authentication-ii
|
||||
|
||||
# --description--
|
||||
|
||||
設置 GitHub 驗證的最後一步是創建策略本身。 `passport-github@~1.1.0` has already been added as a dependency, so require it in your `auth.js` file as `GithubStrategy` like this: `const GitHubStrategy = require('passport-github').Strategy;`. 別忘了請求和配置 `dotenv`，使用你的環境變量。
|
||||
設置 GitHub 驗證的最後一步是創建策略本身。 已經添加 `passport-github@~1.1.0` 作爲依賴，在 `auth.js` 中請求它，作爲 `GithubStrategy`，像這樣：`const GitHubStrategy = require('passport-github').Strategy;`。 別忘了請求和配置 `dotenv`，使用你的環境變量。
|
||||
|
||||
爲了設置 GitHub 策略，我們需要在 Passport 中使用實例化的 `GitHubStrategy`，它可以接收兩個參數：一個對象（包括 `clientID`、`clientSecret` 和 `callbackURL`），以及一個回調函數。在這個回調函數中，我們要處理驗證成功時，判斷用戶是否已經在數據庫中存在的邏輯，以及在用戶數據庫對象中最初保存哪些字段。 這種處理方式適用於絕大部分第三方驗證策略，但有些策略會需要我們提供更多的信息，詳情請參考相關策略的 GitHub README。 例如，Google 的驗證策略會要求你提供一個 *scope*，用於標示用戶成功登錄後，你需要從返回的對象中獲取那些信息。以及，這也需要經過用戶同意，你纔可以獲取到。
|
||||
|
||||
The current strategy we are implementing authenticates users using a GitHub account and OAuth 2.0 tokens. The client ID and secret obtained when creating an application are supplied as options when creating the strategy. The strategy also requires a `verify` callback, which receives the access token and optional refresh token, as well as `profile` which contains the authenticated user's GitHub profile. The `verify` callback must call `cb` providing a user to complete authentication.
|
||||
當前策略是使用 GitHub 賬戶和 OAuth 2.0 令牌驗證用戶。 創建應用程序時獲得的客戶 ID 和密碼在創建策略時作爲選項提供。 策略還需要 `verify` 回調，接收訪問令牌和可選刷新令牌， 以及包含認證用戶的 GitHub 資料的 `profile`。 `verify` 回調必須調用 `cb` 提供用戶完成驗證。
|
||||
|
||||
Here's how your new strategy should look at this point:
|
||||
你的新策略應該是這樣的：
|
||||
|
||||
```js
|
||||
passport.use(new GitHubStrategy({
|
||||
@@ -29,13 +29,13 @@ passport.use(new GitHubStrategy({
|
||||
));
|
||||
```
|
||||
|
||||
Your authentication won't be successful yet, and it will actually throw an error without the database logic and callback, but it should log your GitHub profile to your console if you try it!
|
||||
目前，你的驗證部分不會成功。由於沒有數據庫的邏輯和回調函數，你的代碼目前還會報錯。但如果你試一試，就可以在控制檯裏看到輸出了你的 GitHub 個人信息。
|
||||
|
||||
Submit your page when you think you've got it right. If you're running into errors, you can <a href="https://gist.github.com/camperbot/ff3a1166684c1b184709ac0bee30dee6" target="_blank" rel="noopener noreferrer nofollow">check out the project completed up to this point</a>.
|
||||
完成上述要求後，請提交你的頁面鏈接。 如果你在運行時遇到錯誤，你可以<a href="https://gist.github.com/camperbot/ff3a1166684c1b184709ac0bee30dee6" target="_blank" rel="noopener noreferrer nofollow">查看已執行項目的當前進度</a>。
|
||||
|
||||
# --hints--
|
||||
|
||||
passport-github dependency should be added.
|
||||
應正確添加依賴 passport-github。
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
@@ -54,7 +54,7 @@ passport-github dependency should be added.
|
||||
);
|
||||
```
|
||||
|
||||
passport-github should be required.
|
||||
應正確請求依賴 passport-github。
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
@@ -72,7 +72,7 @@ passport-github should be required.
|
||||
);
|
||||
```
|
||||
|
||||
GitHub strategy should be setup correctly thus far.
|
||||
到目前爲止，GitHub 策略應正確設置。
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
|
||||
@@ -42,7 +42,7 @@ myDataBase.findOneAndUpdate(
|
||||
|
||||
你現在應該可以登錄你的應用了，試試吧。
|
||||
|
||||
完成上述要求後，你可以在下方提交你的頁面鏈接。 If you're running into errors, you can <a href="https://gist.github.com/camperbot/183e968f0e01d81dde015d45ba9d2745" target="_blank" rel="noopener noreferrer nofollow">check out the project completed up to this point</a>.
|
||||
完成上述要求後，你可以在下方提交你的頁面鏈接。 如果你在運行時遇到錯誤，你可以<a href="https://gist.github.com/camperbot/183e968f0e01d81dde015d45ba9d2745" target="_blank" rel="noopener noreferrer nofollow">查看已執行項目的當前進度</a>。
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
@@ -18,7 +18,7 @@ dashedName: implementation-of-social-authentication
|
||||
|
||||
在 OAuth 驗證策略中，我們至少需要提供 *Client ID* 和 *Client Secret*，這樣第三方平臺就會獲悉驗證請求的來源，以及這個來源是否有效。 爲此，需要去我們使用的第三方驗證平臺（比如 GitHub）獲取這兩個字段的值。 注意，我們獲取到的這個值是唯一的，僅對我們的當前 app 有效——**因此，千萬不要分享給別人**，更不要上傳到公共倉庫或者直接寫在代碼裏。 通常，我們會把它們放在 `.env` 文件裏，並通過 `process.env.GITHUB_CLIENT_ID` 獲取。 對於這次挑戰，我們將會使用 GitHub 作爲驗證平臺。
|
||||
|
||||
Obtaining your *Client ID and Secret* from GitHub is done in your account profile settings under 'developer settings', then <a href="https://github.com/settings/developers" target="_blank" rel="noopener noreferrer nofollow">'OAuth applications'</a>. 點擊 “Register a new application（註冊一個新的應用）”，設置你的應用名稱，然後把你的 Replit 主頁地址（**不是項目代碼的 url**）粘貼到 Homepage URL。然後，回調 url 需要設置成上面 Homepage URL 裏你粘貼的地址，但後面要加上 `/auth/github/callback`。 這樣在用戶通過 Github 驗證後才能跳轉到我們指定的頁面。 在你的 `.env` 文件裏將返回的信息保存爲 `'GITHUB_CLIENT_ID'` 和 `'GITHUB_CLIENT_SECRET'`。
|
||||
首先，你需要進入賬戶設置裏的 “developer settings（開發者設置）”板塊，在 <a href="https://github.com/settings/developers" target="_blank" rel="noopener noreferrer nofollow">'OAuth applications'</a> 獲取 *用戶 ID 和密碼*。 點擊 “Register a new application（註冊一個新的應用）”，設置你的應用名稱，然後把你的 Replit 主頁地址（**不是項目代碼的 url**）粘貼到 Homepage URL。然後，回調 url 需要設置成上面 Homepage URL 裏你粘貼的地址，但後面要加上 `/auth/github/callback`。 這樣在用戶通過 Github 驗證後才能跳轉到我們指定的頁面。 在你的 `.env` 文件裏將返回的信息保存爲 `'GITHUB_CLIENT_ID'` 和 `'GITHUB_CLIENT_SECRET'`。
|
||||
|
||||
在你的 `routes.js` 文件中，添加 `showSocialAuth: true` 到主頁路由，在 `showRegistration: true` 的後面。 然後，爲 `/auth/github` 和 `/auth/github/callback` 創建兩個接收 GET 請求的路由。 第一個只需要通過調用 passport 來驗證 `'github'`。 第二個應該調用 passport 來驗證 `'github'`，但需要在失敗時跳轉回主頁 `/`，成功時跳轉到用戶頁面 `/profile`（跳轉的邏輯與上一個項目中的邏輯一樣）。
|
||||
|
||||
@@ -31,7 +31,7 @@ app.route('/login')
|
||||
});
|
||||
```
|
||||
|
||||
完成上述要求後，請提交你的頁面鏈接。 If you're running into errors, you can check out the project up to this point <a href="https://gist.github.com/camperbot/1f7f6f76adb178680246989612bea21e" target="_blank" rel="noopener noreferrer nofollow">https://gist.github.com/camperbot/1f7f6f76adb178680246989612bea21e</a>.
|
||||
完成上述要求後，請提交你的頁面鏈接。 如果你遇到了問題，可以參考 <a href="https://gist.github.com/camperbot/1f7f6f76adb178680246989612bea21e" target="_blank" rel="noopener noreferrer nofollow">https://gist.github.com/camperbot/1f7f6f76adb178680246989612bea21e</a>。
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
@@ -30,11 +30,11 @@ app.use((req, res, next) => {
|
||||
});
|
||||
```
|
||||
|
||||
完成上述要求後，請提交你的頁面鏈接。 If you're running into errors, you can <a href="https://gist.github.com/camperbot/c3eeb8a3ebf855e021fd0c044095a23b" target="_blank" rel="noopener noreferrer nofollow">check out the project completed up to this point</a>.
|
||||
完成上述要求後，請提交你的頁面鏈接。 如果你在運行時遇到錯誤，你可以<a href="https://gist.github.com/camperbot/c3eeb8a3ebf855e021fd0c044095a23b" target="_blank" rel="noopener noreferrer nofollow">查看已執行項目的當前進度</a>。
|
||||
|
||||
# --hints--
|
||||
|
||||
`req.logout()` should be called in your `/logout` route.
|
||||
`req.logout()` 應在 `/logout` 路由中調用。
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
|
||||
@@ -47,7 +47,7 @@ app.route('/register')
|
||||
);
|
||||
```
|
||||
|
||||
完成上述要求後，請提交你的頁面鏈接。 If you're running into errors, you can <a href="https://gist.github.com/camperbot/b230a5b3bbc89b1fa0ce32a2aa7b083e" target="_blank" rel="noopener noreferrer nofollow">check out the project completed up to this point</a>.
|
||||
完成上述要求後，請提交你的頁面鏈接。 如果你在運行時遇到錯誤，你可以<a href="https://gist.github.com/camperbot/b230a5b3bbc89b1fa0ce32a2aa7b083e" target="_blank" rel="noopener noreferrer nofollow">查看已執行項目的當前進度</a>。
|
||||
|
||||
**注意：**接下來的挑戰可能會在運行 *picture-in-picture*（畫中畫）模式的瀏覽器中出現問題。 如果你使用的線上 IDE 提供在 IDE 內預覽 app 的功能，請考慮打開新的標籤頁預覽。
|
||||
|
||||
|
||||
@@ -28,7 +28,7 @@ socket.emit('chat message', messageToSend);
|
||||
|
||||
至此，我們已經完成發送信息到所有客戶端的功能。
|
||||
|
||||
完成上述要求後，請提交你的頁面鏈接。 If you're running into errors, you can <a href="https://gist.github.com/camperbot/d7af9864375207e254f73262976d2016" target="_blank" rel="noopener noreferrer nofollow">check out the project completed up to this point</a>.
|
||||
完成上述要求後，請提交你的頁面鏈接。 如果你在運行時遇到錯誤，你可以<a href="https://gist.github.com/camperbot/d7af9864375207e254f73262976d2016" target="_blank" rel="noopener noreferrer nofollow">查看已執行項目的當前進度</a>。
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
@@ -12,7 +12,7 @@ dashedName: serialization-of-a-user-object
|
||||
|
||||
我們需要用到序列化和反序列化的方法來進行配置。 passport 爲我們提供了 `passport.serializeUser( OURFUNCTION )` 和 `passport.deserializeUser( OURFUNCTION )` 兩個方法。
|
||||
|
||||
`serializeUser` 方法接收兩個參數，分別是表示用戶的對象和一個回調函數。 其中，回調函數的返回值應爲這個用戶的唯一標識符：最簡單的寫法就是讓它返回用戶的 `_id`。 它應當是唯一的，是由 MongoDB 產生的。 類似地，`deserializeUser` 也接收兩個參數，分別是在序列化時生成的標識符以及一個回調函數。在回調函數裏，我們需要根據根據傳入的標識符（比如 \_id）返回表示用戶的對象。 爲了在 MongoDB 中通過 query（查詢語句）獲取 `_id` 字段，首先我們需要創建 `const ObjectID = require('mongodb').ObjectID;`；然後調用它：`new ObjectID(THE_ID)`。 `mongodb@~3.6.0` has already been added as a dependency. 你可以在下面的例子中看到：
|
||||
`serializeUser` 方法接收兩個參數，分別是表示用戶的對象和一個回調函數。 其中，回調函數的返回值應爲這個用戶的唯一標識符：最簡單的寫法就是讓它返回用戶的 `_id`。 它應當是唯一的，是由 MongoDB 產生的。 類似地，`deserializeUser` 也接收兩個參數，分別是在序列化時生成的標識符以及一個回調函數。在回調函數裏，我們需要根據根據傳入的標識符（比如 \_id）返回表示用戶的對象。 爲了在 MongoDB 中通過 query（查詢語句）獲取 `_id` 字段，首先我們需要創建 `const ObjectID = require('mongodb').ObjectID;`；然後調用它：`new ObjectID(THE_ID)`。 `mongodb@~3.6.0` 已經被添加爲依賴項。 你可以在下面的例子中看到：
|
||||
|
||||
```js
|
||||
passport.serializeUser((user, done) => {
|
||||
@@ -28,7 +28,7 @@ passport.deserializeUser((id, done) => {
|
||||
|
||||
因此，在我們在下一步中配置 DB 前，`deserializeUser` 會拋出錯誤。所以，現在請先註釋掉上面的代碼，在 `deserializeUser` 中僅調用 `done(null, null)` 即可。
|
||||
|
||||
完成上述要求後，請提交你的頁面鏈接。 If you're running into errors, you can <a href="https://gist.github.com/camperbot/7068a0d09e61ec7424572b366751f048" target="_blank" rel="noopener noreferrer nofollow">check out the project completed up to this point</a>.
|
||||
完成上述要求後，請提交你的頁面鏈接。 如果你在運行時遇到錯誤，你可以<a href="https://gist.github.com/camperbot/7068a0d09e61ec7424572b366751f048" target="_blank" rel="noopener noreferrer nofollow">查看已執行項目的當前進度</a>。
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
@@ -10,25 +10,25 @@ dashedName: set-up-a-template-engine
|
||||
|
||||
你可以採用下面的任意一種方式完成這些挑戰：
|
||||
|
||||
- Clone <a href="https://github.com/freeCodeCamp/boilerplate-advancednode/" target="_blank" rel="noopener noreferrer nofollow">this GitHub repo</a> and complete these challenges locally.
|
||||
- Use <a href="https://replit.com/github/freeCodeCamp/boilerplate-advancednode" target="_blank" rel="noopener noreferrer nofollow">our Replit starter project</a> to complete these challenges.
|
||||
- 克隆<a href="https://github.com/freeCodeCamp/boilerplate-advancednode/" target="_blank" rel="noopener noreferrer nofollow">這個 GitHub 倉庫</a>，並在本地完成這些挑戰。
|
||||
- 使用<a href="https://replit.com/github/freeCodeCamp/boilerplate-advancednode" target="_blank" rel="noopener noreferrer nofollow">我們在 Replit 上的初始化項目</a>來完成這些挑戰。
|
||||
- 使用一個你選擇的站點生成器來完成項目。 需要確定包含了我們 GitHub 倉庫的所有文件。
|
||||
|
||||
完成本項目後，請將一個正常運行的 demo（項目演示）託管在可以公開訪問的平臺。 然後在 `Solution Link` 框中提交你的項目 URL。
|
||||
|
||||
你可以在應用的模版引擎中使用靜態模板文件（如那些寫在 *Pug* 裏的）。 在運行時，模版引擎會用服務端的真實數據替換掉模版文件中的變量， 然後將模版轉譯成發送給客戶端的 HTML 靜態文件。 這樣可以輕鬆地構造 HTML 頁面，允許在頁面直接顯示變量內容而不需要從客戶端發送 API 請求。
|
||||
|
||||
`pug@~3.0.0` has already been installed, and is listed as a dependency in your `package.json` file.
|
||||
`pug@~3.0.0` 已經被安裝，並且在你項目的 `package.json` 文件中作爲依賴。
|
||||
|
||||
Express 需要知道你正在使用哪個模板引擎。 我們將使用 `set` 方法來分配 `pug` 作爲 `view engine` 屬性的值： `app.set('view engine', 'pug')`。
|
||||
|
||||
Your page will be blank until you correctly render the index file in the `views/pug` directory.
|
||||
在正確渲染 `views/pug` 目錄中的索引文件之後，加載頁面。
|
||||
|
||||
To render the `pug` template, you need to use `res.render()` in the `/` route. Pass the file path to the `views/pug` directory as the argument to the method. The path can be a relative path (relative to views), or an absolute path, and does not require a file extension.
|
||||
要渲染 `pug` 模板，你需要在 `/` 路由中使用 `res.render()`。 將文件路徑作爲參數傳遞到方法的 `views/pug` 目錄。 這個路徑可以是相對路徑（相對於 views），也可以是絕對路徑，不需要文件擴展。
|
||||
|
||||
If all went as planned, your app home page will no longer be blank and will display a message indicating you've successfully rendered the Pug template!
|
||||
如果一切按計劃進行，你的應用程序主頁將不再是空白的，並將顯示一條信息，表明你已經成功地渲染了 Pug 模板！
|
||||
|
||||
完成以上要求後，請提交你的頁面鏈接。 If you're running into errors, you can <a href="https://gist.github.com/camperbot/3515cd676ea4dfceab4e322f59a37791" target="_blank" rel="noopener noreferrer nofollow">check out the project completed up to this point</a>.
|
||||
完成以上要求後，請提交你的頁面鏈接。 如果你在運行時遇到錯誤，你可以<a href="https://gist.github.com/camperbot/3515cd676ea4dfceab4e322f59a37791" target="_blank" rel="noopener noreferrer nofollow">查看已執行項目的當前進度</a>。
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
@@ -8,13 +8,13 @@ dashedName: set-up-passport
|
||||
|
||||
# --description--
|
||||
|
||||
現在我們來創建 *Passport*，最終我們需要用它來實現用戶註冊和登錄。 除了 Passport，我們還會用 Express-session 來處理 session（會話）。 Express-session has a ton of advanced features you can use, but for now we're just going to use the basics! Using this middleware saves the session id as a cookie in the client and allows us to access the session data using that id on the server. This way we keep personal account information out of the cookie used by the client to verify to our server they are authenticated and just keep the *key* to access the data stored on the server.
|
||||
現在我們來創建 *Passport*，最終我們需要用它來實現用戶註冊和登錄。 除了 Passport，我們還會用 Express-session 來處理 session（會話）。 Express-session 有許多高級特性，但我們暫時只需要瞭解其基礎功能。 在客戶端，我們可以用這個中間件把 session id 儲存到 cookie。同時，我們可以在服務器上通過這個 id 訪問 session 數據。 通過這種方式，我們無需把用戶的個人賬號信息存到 cookie，來完成用戶的驗證。只需要用這個 id 作爲 *key* 來訪問服務器上用戶的數據即可。
|
||||
|
||||
`passport@~0.4.1` and `express-session@~1.17.1` are already installed, and are both listed as dependencies in your `package.json` file.
|
||||
`passport@~0.4.1` 和 `express-session@~1.17.1` 已經安裝，並且在你的 `package.json` 文件中均被列爲依賴項。
|
||||
|
||||
You will need to set up the session settings now and initialize Passport. Be sure to first create the variables 'session' and 'passport' to require 'express-session' and 'passport' respectively.
|
||||
現在，你需要配置 session 並初始化 Passport。 請先創建變量 “session” 和 “passport” 來分別引入 “express-session” 和 “passport”。
|
||||
|
||||
To set up your express app to use the session we'll define just a few basic options. Be sure to add 'SESSION_SECRET' to your .env file and give it a random value. This is used to compute the hash used to encrypt your cookie!
|
||||
爲了讓 express 應用可以使用 session，我們需要添加一些基礎選項。 請在 .env 文件中添加字段 “SESSION_SECRET”，並給它賦一個隨機值， 便於加密 cookie、計算哈希。
|
||||
|
||||
```js
|
||||
app.use(session({
|
||||
@@ -25,13 +25,13 @@ app.use(session({
|
||||
}));
|
||||
```
|
||||
|
||||
As well you can go ahead and tell your express app to **use** 'passport.initialize()' and 'passport.session()'. (For example, `app.use(passport.initialize());`)
|
||||
還有，我們需要讓 express **使用** “passport.initialize()” 和 “passport.session()”。 （例如，`app.use(passport.initialize());`）。
|
||||
|
||||
Submit your page when you think you've got it right. If you're running into errors, you can <a href="https://gist.github.com/camperbot/4068a7662a2f9f5d5011074397d6788c" target="_blank" rel="noopener noreferrer nofollow">check out the project completed up to this point</a>.
|
||||
完成上述要求後，請提交你的頁面鏈接。 如果你在運行時遇到錯誤，你可以<a href="https://gist.github.com/camperbot/4068a7662a2f9f5d5011074397d6788c" target="_blank" rel="noopener noreferrer nofollow">查看已執行項目的當前進度</a>。
|
||||
|
||||
# --hints--
|
||||
|
||||
Passport and Express-session should be dependencies.
|
||||
應添加 Passport 和 Express-session 作爲依賴。
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
@@ -55,7 +55,7 @@ Passport and Express-session should be dependencies.
|
||||
);
|
||||
```
|
||||
|
||||
Dependencies should be correctly required.
|
||||
依賴應正確引入。
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
@@ -78,7 +78,7 @@ Dependencies should be correctly required.
|
||||
);
|
||||
```
|
||||
|
||||
Express app should use new dependencies.
|
||||
Express app 可以使用新的依賴。
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
@@ -101,7 +101,7 @@ Express app should use new dependencies.
|
||||
);
|
||||
```
|
||||
|
||||
Session and session secret should be correctly set up.
|
||||
應正確設置 Session 和會話密碼。
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
|
||||
@@ -10,7 +10,7 @@ dashedName: set-up-the-environment
|
||||
|
||||
在接下來的挑戰中，我們將會用到 `chat.pug` 文件。 首先，在你的 `routes.js` 文件中爲 `/chat` 添加一個處理 GET 請求的路由，並給它傳入 `ensureAuthenticated`。在回調函數中，我們需要讓它渲染 `chat.pug` 文件，並在響應中包含 `{ user: req.user }` 信息。 現在，請修改 `/auth/github/callback` 路由，讓它可以像這樣設置 user_id：`req.session.user_id = req.user.id`，並在設置完成後重定向至 `/chat`。
|
||||
|
||||
`socket.io@~2.3.0` has already been added as a dependency, so require/instantiate it in your server as follows with `http` (comes built-in with Nodejs):
|
||||
已添加 `socket.io@~2.3.0` 作爲依賴項，在你的服務器中和 `http` （內置在 Nodejs 中）一起導入/實例化，具體如下：
|
||||
|
||||
```javascript
|
||||
const http = require('http').createServer(app);
|
||||
@@ -19,7 +19,7 @@ const io = require('socket.io')(http);
|
||||
|
||||
現在我們的 *express 應用*已經包含了 *http* 服務，接下來我們需要監聽 *http* 服務的事件。 爲此，我們需要把 `app.listen` 更新爲 `http.listen`。
|
||||
|
||||
需要處理的第一件事是監聽客戶端的新連接。 <dfn>on</dfn> 關鍵字就是監聽這個特定事件。 It requires 2 arguments: a string containing the title of the event that's emitted, and a function with which the data is passed through. 在連接監聽器中，我們用 *socket* 來代表它所包含的數據。 socket 就是指已連接到服務器的客戶端。
|
||||
需要處理的第一件事是監聽客戶端的新連接。 <dfn>on</dfn> 關鍵字就是監聽這個特定事件。 它需要 2 個參數：一個包含所發出事件標題的字符串，以及一個用於傳遞數據的函數。 在連接監聽器中，我們用 *socket* 來代表它所包含的數據。 socket 就是指已連接到服務器的客戶端。
|
||||
|
||||
爲了可以監聽服務器的連接事件，我們在數據庫連接的部分加入如下代碼：
|
||||
|
||||
@@ -42,7 +42,7 @@ let socket = io();
|
||||
|
||||
**注意：**只有在連接到處於同一個 url/server 上的 socket 時，`io()`纔可以正常執行。 如果需要連接到外部的 socket，就需要這樣調用：`io.connect('URL');`。
|
||||
|
||||
完成上述要求後，請提交你的頁面鏈接。 If you're running into errors, you can <a href="https://gist.github.com/camperbot/aae41cf59debc1a4755c9a00ee3859d1" target="_blank" rel="noopener noreferrer nofollow">check out the project completed up to this point</a>.
|
||||
完成上述要求後，請提交你的頁面鏈接。 如果你在運行時遇到錯誤，你可以<a href="https://gist.github.com/camperbot/aae41cf59debc1a4755c9a00ee3859d1" target="_blank" rel="noopener noreferrer nofollow">查看已執行項目的當前進度</a>。
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
@@ -12,9 +12,9 @@ dashedName: use-a-template-engines-powers
|
||||
|
||||
在 Pug 文件中，你可以用變量名來調用變量，比如寫成 `#{variable_name}` 來實現行內調用，或像 `p=variable_name` 把元素與變量直接寫在一起，這表示 p 元素的內容等價於這個變量。
|
||||
|
||||
Pug is all about using whitespace and tabs to show nested elements and cutting down on the amount of code needed to make a beautiful site. Read the Pug documentation for more information on usage and syntax.
|
||||
Pug 是關於使用空白和製表符來顯示嵌套元素，並減少製作一個漂亮網站所需的代碼量。 閱讀 Pug 文檔以獲取更多關於使用和語法的信息。
|
||||
|
||||
Here is an example:
|
||||
下面是一個例子：
|
||||
|
||||
```html
|
||||
<!--Typing this using Pug-->
|
||||
@@ -38,17 +38,17 @@ dashedName: use-a-template-engines-powers
|
||||
</body>
|
||||
```
|
||||
|
||||
Looking at our pug file `index.pug` included in your project, we used the variables `title` and `message`.
|
||||
查看在你的項目中的 pug 文件 `index.pug`，我們使用了變量 `title` 和 `message`。
|
||||
|
||||
To pass those along from our server, you will need to add an object as a second argument to your `res.render` with the variables and their values. For example, pass this object along setting the variables for your index view: `{title: 'Hello', message: 'Please login'}`
|
||||
爲了從服務器傳遞這些信息，你需要給 `res.render` 的第二個參數傳入一個對象，其中包含變量和對應的值。 例如，在設置索引視圖的變量時傳遞此對象：`{title: 'Hello', message: 'Please login'}`。
|
||||
|
||||
It should look like: `res.render(process.cwd() + '/views/pug/index', {title: 'Hello', message: 'Please login'});` Now refresh your page and you should see those values rendered in your view in the correct spot as laid out in your `index.pug` file!
|
||||
看起來應該像這樣：`res.render(process.cwd() + '/views/pug/index', {title: 'Hello', message: 'Please login'});`。現在刷新頁面，你應該看到那些值就像在 `index.pug` 文件中一樣被渲染在頁面上正確的位置。
|
||||
|
||||
Submit your page when you think you've got it right. If you're running into errors, you can check out the <a href="https://gist.github.com/camperbot/4af125119ed36e6e6a8bb920db0c0871" target="_blank" rel="noopener noreferrer nofollow">project completed up to this point</a>.
|
||||
完成上述要求後，你可以在下方提交你的頁面鏈接。 如果你在運行時遇到錯誤，你可以查看<a href="https://gist.github.com/camperbot/4af125119ed36e6e6a8bb920db0c0871" target="_blank" rel="noopener noreferrer nofollow">已執行項目的當前進度</a>。
|
||||
|
||||
# --hints--
|
||||
|
||||
Pug should correctly render variables.
|
||||
Pug 應正確地展示變量。
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
|
||||
@@ -8,7 +8,7 @@ dashedName: assert-deep-equality-with--deepequal-and--notdeepequal
|
||||
|
||||
# --description--
|
||||
|
||||
As a reminder, this project is being built upon the following starter project on <a href="https://replit.com/github/freeCodeCamp/boilerplate-mochachai" target="_blank" rel="noopener noreferrer nofollow">Replit</a> or cloned from <a href="https://github.com/freeCodeCamp/boilerplate-mochachai/" target="_blank" rel="noopener noreferrer nofollow">GitHub</a>.
|
||||
請注意，本項目是在 <a href="https://replit.com/github/freeCodeCamp/boilerplate-mochachai" target="_blank" rel="noopener noreferrer nofollow">Replit</a> 上的初始化項目的基礎上進行開發，你也可以從 <a href="https://github.com/freeCodeCamp/boilerplate-mochachai/" target="_blank" rel="noopener noreferrer nofollow">GitHub</a> 上克隆。
|
||||
|
||||
`deepEqual()` 斷言兩個對象是否深度相等。
|
||||
|
||||
|
||||
@@ -8,15 +8,15 @@ dashedName: compare-the-properties-of-two-elements
|
||||
|
||||
# --description--
|
||||
|
||||
As a reminder, this project is being built upon the following starter project on <a href="https://replit.com/github/freeCodeCamp/boilerplate-mochachai" target="_blank" rel="noopener noreferrer nofollow">Replit</a>, or cloned from <a href="https://github.com/freeCodeCamp/boilerplate-mochachai/" target="_blank" rel="noopener noreferrer nofollow">GitHub</a>.
|
||||
請注意，本項目是在 <a href="https://replit.com/github/freeCodeCamp/boilerplate-mochachai" target="_blank" rel="noopener noreferrer nofollow">Replit</a> 上的初始化項目的基礎上進行開發，你也可以從 <a href="https://github.com/freeCodeCamp/boilerplate-mochachai/" target="_blank" rel="noopener noreferrer nofollow">GitHub</a> 上克隆。
|
||||
|
||||
# --instructions--
|
||||
|
||||
Within `tests/1_unit-tests.js` under the test labelled `#8` in the `Comparisons` suite, change each `assert` to either `assert.isAbove` or `assert.isAtMost` to make the test pass (should evaluate to `true`). Do not alter the arguments passed to the asserts.
|
||||
在 `tests/1_unit-tests.js` 中，在標有 `#8` 的 `Comparisons` 套件裏，將每個 `assert` 改成 `assert.isAbove` 或 `assert.isAtMost` 方法，讓測試通過（結果應該返回 `true`）。 不要修改傳給斷言的參數。
|
||||
|
||||
# --hints--
|
||||
|
||||
All tests should pass.
|
||||
應通過所有測試。
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
@@ -30,7 +30,7 @@ All tests should pass.
|
||||
);
|
||||
```
|
||||
|
||||
You should choose the correct method for the first assertion - `isAbove` vs. `isAtMost`.
|
||||
請爲第一個斷言選擇正確的方法 — `isAbove` 或 `isAtMost`。
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
@@ -48,7 +48,7 @@ You should choose the correct method for the first assertion - `isAbove` vs. `is
|
||||
);
|
||||
```
|
||||
|
||||
You should choose the correct method for the second assertion - `isAbove` vs. `isAtMost`.
|
||||
請爲第二個斷言選擇正確的方法 — `isAbove` 或 `isAtMost`。
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
@@ -62,7 +62,7 @@ You should choose the correct method for the second assertion - `isAbove` vs. `i
|
||||
);
|
||||
```
|
||||
|
||||
You should choose the correct method for the third assertion - `isAbove` vs. `isAtMost`.
|
||||
請爲第三個斷言選擇正確的方法 — `isAbove` 或 `isAtMost`。
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
@@ -80,7 +80,7 @@ You should choose the correct method for the third assertion - `isAbove` vs. `is
|
||||
);
|
||||
```
|
||||
|
||||
You should choose the correct method for the fourth assertion - `isAbove` vs. `isAtMost`.
|
||||
請爲第四個斷言選擇正確的方法 — `isAbove` 或 `isAtMost`。
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
|
||||
@@ -10,8 +10,8 @@ dashedName: learn-how-javascript-assertions-work
|
||||
|
||||
你可以採用下面的任意一種方式完成這些挑戰：
|
||||
|
||||
- Clone <a href="https://github.com/freeCodeCamp/boilerplate-mochachai/" target="_blank" rel="noopener noreferrer nofollow">this GitHub repo</a> and complete these challenges locally.
|
||||
- Use <a href="https://replit.com/github/freeCodeCamp/boilerplate-mochachai" target="_blank" rel="noopener noreferrer nofollow">our Replit starter project</a> to complete these challenges.
|
||||
- 克隆<a href="https://github.com/freeCodeCamp/boilerplate-mochachai/" target="_blank" rel="noopener noreferrer nofollow">這個 GitHub 倉庫</a>，並在本地完成這些挑戰。
|
||||
- 使用<a href="https://replit.com/github/freeCodeCamp/boilerplate-mochachai" target="_blank" rel="noopener noreferrer nofollow">我們在 Replit 上的初始化項目</a>來完成這些挑戰。
|
||||
- 使用一個你喜歡的站點生成器來完成項目。 需要確定包含了我們 GitHub 倉庫的所有文件。
|
||||
|
||||
完成本項目後，請將一個正常運行的 demo（項目演示）託管在可以公開訪問的平臺。 然後在 `Solution Link` 框中提交你的項目 URL。
|
||||
|
||||
@@ -8,7 +8,7 @@ dashedName: run-functional-tests-on-an-api-response-using-chai-http-iii---put-me
|
||||
|
||||
# --description--
|
||||
|
||||
As a reminder, this project is being built upon the following starter project on <a href="https://replit.com/github/freeCodeCamp/boilerplate-mochachai" target="_blank" rel="noopener noreferrer nofollow">Replit</a>, or cloned from <a href="https://github.com/freeCodeCamp/boilerplate-mochachai/" target="_blank" rel="noopener noreferrer nofollow">GitHub</a>.
|
||||
請注意，本項目是在 <a href="https://replit.com/github/freeCodeCamp/boilerplate-mochachai" target="_blank" rel="noopener noreferrer nofollow">Replit</a> 上的初始化項目的基礎上進行開發，你也可以從 <a href="https://github.com/freeCodeCamp/boilerplate-mochachai/" target="_blank" rel="noopener noreferrer nofollow">GitHub</a> 上克隆。
|
||||
|
||||
當你測試一個 `PUT` 請求時，你經常會隨同它一起發送數據。 你在 `PUT` 請求中包含的數據被稱爲請求的主體。
|
||||
|
||||
|
||||
@@ -8,7 +8,7 @@ dashedName: run-functional-tests-on-an-api-response-using-chai-http-iv---put-met
|
||||
|
||||
# --description--
|
||||
|
||||
As a reminder, this project is being built upon the following starter project on <a href="https://replit.com/github/freeCodeCamp/boilerplate-mochachai" target="_blank" rel="noopener noreferrer nofollow">Replit</a>, or cloned from <a href="https://github.com/freeCodeCamp/boilerplate-mochachai/" target="_blank" rel="noopener noreferrer nofollow">GitHub</a>.
|
||||
請注意，本項目是在 <a href="https://replit.com/github/freeCodeCamp/boilerplate-mochachai" target="_blank" rel="noopener noreferrer nofollow">Replit</a> 上的初始化項目的基礎上進行開發，你也可以從 <a href="https://github.com/freeCodeCamp/boilerplate-mochachai/" target="_blank" rel="noopener noreferrer nofollow">GitHub</a> 上克隆。
|
||||
|
||||
這個練習與上一個類似。
|
||||
|
||||
|
||||
@@ -8,7 +8,7 @@ dashedName: run-functional-tests-on-api-endpoints-using-chai-http-ii
|
||||
|
||||
# --description--
|
||||
|
||||
As a reminder, this project is being built upon the following starter project on <a href="https://replit.com/github/freeCodeCamp/boilerplate-mochachai" target="_blank" rel="noopener noreferrer nofollow">Replit</a>, or cloned from <a href="https://github.com/freeCodeCamp/boilerplate-mochachai/" target="_blank" rel="noopener noreferrer nofollow">GitHub</a>.
|
||||
請注意，本項目是在 <a href="https://replit.com/github/freeCodeCamp/boilerplate-mochachai" target="_blank" rel="noopener noreferrer nofollow">Replit</a> 上的初始化項目的基礎上進行開發，你也可以從 <a href="https://github.com/freeCodeCamp/boilerplate-mochachai/" target="_blank" rel="noopener noreferrer nofollow">GitHub</a> 上克隆。
|
||||
|
||||
# --instructions--
|
||||
|
||||
|
||||
@@ -8,7 +8,7 @@ dashedName: run-functional-tests-on-api-endpoints-using-chai-http
|
||||
|
||||
# --description--
|
||||
|
||||
As a reminder, this project is being built upon the following starter project on <a href="https://replit.com/github/freeCodeCamp/boilerplate-mochachai" target="_blank" rel="noopener noreferrer nofollow">Replit</a>, or cloned from <a href="https://github.com/freeCodeCamp/boilerplate-mochachai/" target="_blank" rel="noopener noreferrer nofollow">GitHub</a>.
|
||||
請注意，本項目是在 <a href="https://replit.com/github/freeCodeCamp/boilerplate-mochachai" target="_blank" rel="noopener noreferrer nofollow">Replit</a> 上的初始化項目的基礎上進行開發，你也可以從 <a href="https://github.com/freeCodeCamp/boilerplate-mochachai/" target="_blank" rel="noopener noreferrer nofollow">GitHub</a> 上克隆。
|
||||
|
||||
Mocha 允許你使用名爲 `chai-http` 的插件測試異步操作，例如調用 API 端點。
|
||||
|
||||
|
||||
@@ -8,11 +8,11 @@ dashedName: run-functional-tests-using-a-headless-browser-ii
|
||||
|
||||
# --description--
|
||||
|
||||
As a reminder, this project is being built upon the following starter project on <a href="https://replit.com/github/freeCodeCamp/boilerplate-mochachai" target="_blank" rel="noopener noreferrer nofollow">Replit</a>, or cloned from <a href="https://github.com/freeCodeCamp/boilerplate-mochachai/" target="_blank" rel="noopener noreferrer nofollow">GitHub</a>.
|
||||
請注意，本項目是在 <a href="https://replit.com/github/freeCodeCamp/boilerplate-mochachai" target="_blank" rel="noopener noreferrer nofollow">Replit</a> 上的初始化項目的基礎上進行開發，你也可以從 <a href="https://github.com/freeCodeCamp/boilerplate-mochachai/" target="_blank" rel="noopener noreferrer nofollow">GitHub</a> 上克隆。
|
||||
|
||||
# --instructions--
|
||||
|
||||
Within `tests/2_functional-tests.js`, in the `'Submit the surname "Vespucci" in the HTML form'` test (`// #6`), automate the following:
|
||||
在 `tests/2_functional-tests.js` 中，在 `'Submit the surname "Vespucci" in the HTML form'` 測試（`// #6`），自動執行以下操作：
|
||||
|
||||
1. 在表格中填寫姓氏 `Vespucci`。
|
||||
2. 點擊提交按鈕
|
||||
|
||||
@@ -8,7 +8,7 @@ dashedName: run-functional-tests-using-a-headless-browser
|
||||
|
||||
# --description--
|
||||
|
||||
As a reminder, this project is being built upon the following starter project on <a href="https://replit.com/github/freeCodeCamp/boilerplate-mochachai" target="_blank" rel="noopener noreferrer nofollow">Replit</a>, or cloned from <a href="https://github.com/freeCodeCamp/boilerplate-mochachai/" target="_blank" rel="noopener noreferrer nofollow">GitHub</a>.
|
||||
請注意，本項目是在 <a href="https://replit.com/github/freeCodeCamp/boilerplate-mochachai" target="_blank" rel="noopener noreferrer nofollow">Replit</a> 上的初始化項目的基礎上進行開發，你也可以從 <a href="https://github.com/freeCodeCamp/boilerplate-mochachai/" target="_blank" rel="noopener noreferrer nofollow">GitHub</a> 上克隆。
|
||||
|
||||
在頁面上有一個輸入表單。 它將數據作爲 AJAX 請求發送到 `PUT /travellers` 端點。
|
||||
|
||||
|
||||
@@ -7,7 +7,7 @@ dashedName: simulate-actions-using-a-headless-browser
|
||||
|
||||
# --description--
|
||||
|
||||
As a reminder, this project is being built upon the following starter project on <a href="https://replit.com/github/freeCodeCamp/boilerplate-mochachai" target="_blank" rel="noopener noreferrer nofollow">Replit</a>, or cloned from <a href="https://github.com/freeCodeCamp/boilerplate-mochachai/" target="_blank" rel="noopener noreferrer nofollow">GitHub</a>.
|
||||
請注意，本項目是在 <a href="https://replit.com/github/freeCodeCamp/boilerplate-mochachai" target="_blank" rel="noopener noreferrer nofollow">Replit</a> 上的初始化項目的基礎上進行開發，你也可以從 <a href="https://github.com/freeCodeCamp/boilerplate-mochachai/" target="_blank" rel="noopener noreferrer nofollow">GitHub</a> 上克隆。
|
||||
|
||||
在接下來的挑戰中，你將使用無頭瀏覽器模擬人類與頁面的交互。
|
||||
|
||||
|
||||
@@ -8,7 +8,7 @@ dashedName: test-for-truthiness
|
||||
|
||||
# --description--
|
||||
|
||||
As a reminder, this project is being built upon the following starter project on <a href="https://replit.com/github/freeCodeCamp/boilerplate-mochachai" target="_blank" rel="noopener noreferrer nofollow">Replit</a>, or cloned from <a href="https://github.com/freeCodeCamp/boilerplate-mochachai/" target="_blank" rel="noopener noreferrer nofollow">GitHub</a>.
|
||||
請注意，本項目是在 <a href="https://replit.com/github/freeCodeCamp/boilerplate-mochachai" target="_blank" rel="noopener noreferrer nofollow">Replit</a> 上的初始化項目的基礎上進行開發，你也可以從 <a href="https://github.com/freeCodeCamp/boilerplate-mochachai/" target="_blank" rel="noopener noreferrer nofollow">GitHub</a> 上克隆。
|
||||
|
||||
`isTrue()` 僅當給出的值爲 Boolean 的 `true` 時可以通過測試；`isNotTrue()` 則會在給出除 `true` 以外的值時通過測試。
|
||||
|
||||
|
||||
@@ -8,7 +8,7 @@ dashedName: test-if-a-string-contains-a-substring
|
||||
|
||||
# --description--
|
||||
|
||||
As a reminder, this project is being built upon the following starter project on <a href="https://replit.com/github/freeCodeCamp/boilerplate-mochachai" target="_blank" rel="noopener noreferrer nofollow">Replit</a>, or cloned from <a href="https://github.com/freeCodeCamp/boilerplate-mochachai/" target="_blank" rel="noopener noreferrer nofollow">GitHub</a>.
|
||||
請注意，本項目是在 <a href="https://replit.com/github/freeCodeCamp/boilerplate-mochachai" target="_blank" rel="noopener noreferrer nofollow">Replit</a> 上的初始化項目的基礎上進行開發，你也可以從 <a href="https://github.com/freeCodeCamp/boilerplate-mochachai/" target="_blank" rel="noopener noreferrer nofollow">GitHub</a> 上克隆。
|
||||
|
||||
`include()` 和 `notInclude()` 同樣可以用於字符串。 `include()` 用於斷言字符串中包含某個子字符串。
|
||||
|
||||
|
||||
@@ -8,7 +8,7 @@ dashedName: test-if-a-value-falls-within-a-specific-range
|
||||
|
||||
# --description--
|
||||
|
||||
As a reminder, this project is being built upon the following starter project on <a href="https://replit.com/github/freeCodeCamp/boilerplate-mochachai" target="_blank" rel="noopener noreferrer nofollow">Replit</a>, or cloned from <a href="https://github.com/freeCodeCamp/boilerplate-mochachai/" target="_blank" rel="noopener noreferrer nofollow">GitHub</a>.
|
||||
請注意，本項目是在 <a href="https://replit.com/github/freeCodeCamp/boilerplate-mochachai" target="_blank" rel="noopener noreferrer nofollow">Replit</a> 上的初始化項目的基礎上進行開發，你也可以從 <a href="https://github.com/freeCodeCamp/boilerplate-mochachai/" target="_blank" rel="noopener noreferrer nofollow">GitHub</a> 上克隆。
|
||||
|
||||
```javascript
|
||||
.approximately(actual, expected, delta, [message])
|
||||
|
||||
@@ -8,7 +8,7 @@ dashedName: test-if-a-value-is-a-string
|
||||
|
||||
# --description--
|
||||
|
||||
As a reminder, this project is being built upon the following starter project on <a href="https://replit.com/github/freeCodeCamp/boilerplate-mochachai" target="_blank" rel="noopener noreferrer nofollow">Replit</a>, or cloned from <a href="https://github.com/freeCodeCamp/boilerplate-mochachai/" target="_blank" rel="noopener noreferrer nofollow">GitHub</a>.
|
||||
請注意，本項目是在 <a href="https://replit.com/github/freeCodeCamp/boilerplate-mochachai" target="_blank" rel="noopener noreferrer nofollow">Replit</a> 上的初始化項目的基礎上進行開發，你也可以從 <a href="https://github.com/freeCodeCamp/boilerplate-mochachai/" target="_blank" rel="noopener noreferrer nofollow">GitHub</a> 上克隆。
|
||||
|
||||
`isString` 或 `isNotString` 斷言一個值是否爲字符串。
|
||||
|
||||
|
||||
@@ -8,7 +8,7 @@ dashedName: test-if-a-value-is-of-a-specific-data-structure-type
|
||||
|
||||
# --description--
|
||||
|
||||
As a reminder, this project is being built upon the following starter project on <a href="https://replit.com/github/freeCodeCamp/boilerplate-mochachai" target="_blank" rel="noopener noreferrer nofollow">Replit</a>, or cloned from <a href="https://github.com/freeCodeCamp/boilerplate-mochachai/" target="_blank" rel="noopener noreferrer nofollow">GitHub</a>.
|
||||
請注意，本項目是在 <a href="https://replit.com/github/freeCodeCamp/boilerplate-mochachai" target="_blank" rel="noopener noreferrer nofollow">Replit</a> 上的初始化項目的基礎上進行開發，你也可以從 <a href="https://github.com/freeCodeCamp/boilerplate-mochachai/" target="_blank" rel="noopener noreferrer nofollow">GitHub</a> 上克隆。
|
||||
|
||||
`#typeOf` 斷言一個值的類型符合給定的類型，這個類型與 `Object.prototype.toString` 一致。
|
||||
|
||||
|
||||
@@ -8,7 +8,7 @@ dashedName: test-if-a-variable-or-function-is-defined
|
||||
|
||||
# --description--
|
||||
|
||||
As a reminder, this project is being built upon the following starter project on <a href="https://replit.com/github/freeCodeCamp/boilerplate-mochachai" target="_blank" rel="noopener noreferrer nofollow">Replit</a>, or cloned from <a href="https://github.com/freeCodeCamp/boilerplate-mochachai/" target="_blank" rel="noopener noreferrer nofollow">GitHub</a>.
|
||||
請注意，本項目是在 <a href="https://replit.com/github/freeCodeCamp/boilerplate-mochachai" target="_blank" rel="noopener noreferrer nofollow">Replit</a> 上的初始化項目的基礎上進行開發，你也可以從 <a href="https://github.com/freeCodeCamp/boilerplate-mochachai/" target="_blank" rel="noopener noreferrer nofollow">GitHub</a> 上克隆。
|
||||
|
||||
# --instructions--
|
||||
|
||||
|
||||
@@ -8,7 +8,7 @@ dashedName: test-if-an-array-contains-an-item
|
||||
|
||||
# --description--
|
||||
|
||||
As a reminder, this project is being built upon the following starter project on <a href="https://replit.com/github/freeCodeCamp/boilerplate-mochachai" target="_blank" rel="noopener noreferrer nofollow">Replit</a>, or cloned from <a href="https://github.com/freeCodeCamp/boilerplate-mochachai/" target="_blank" rel="noopener noreferrer nofollow">GitHub</a>.
|
||||
請注意，本項目是在 <a href="https://replit.com/github/freeCodeCamp/boilerplate-mochachai" target="_blank" rel="noopener noreferrer nofollow">Replit</a> 上的初始化項目的基礎上進行開發，你也可以從 <a href="https://github.com/freeCodeCamp/boilerplate-mochachai/" target="_blank" rel="noopener noreferrer nofollow">GitHub</a> 上克隆。
|
||||
|
||||
# --instructions--
|
||||
|
||||
|
||||
@@ -8,7 +8,7 @@ dashedName: test-if-an-object-has-a-property
|
||||
|
||||
# --description--
|
||||
|
||||
As a reminder, this project is being built upon the following starter project on <a href="https://replit.com/github/freeCodeCamp/boilerplate-mochachai" target="_blank" rel="noopener noreferrer nofollow">Replit</a>, or cloned from <a href="https://github.com/freeCodeCamp/boilerplate-mochachai/" target="_blank" rel="noopener noreferrer nofollow">GitHub</a>.
|
||||
請注意，本項目是在 <a href="https://replit.com/github/freeCodeCamp/boilerplate-mochachai" target="_blank" rel="noopener noreferrer nofollow">Replit</a> 上的初始化項目的基礎上進行開發，你也可以從 <a href="https://github.com/freeCodeCamp/boilerplate-mochachai/" target="_blank" rel="noopener noreferrer nofollow">GitHub</a> 上克隆。
|
||||
|
||||
`property` 斷言一個對象含有給定屬性。
|
||||
|
||||
|
||||
@@ -8,7 +8,7 @@ dashedName: test-if-an-object-is-an-instance-of-a-constructor
|
||||
|
||||
# --description--
|
||||
|
||||
As a reminder, this project is being built upon the following starter project on <a href="https://replit.com/github/freeCodeCamp/boilerplate-mochachai" target="_blank" rel="noopener noreferrer nofollow">Replit</a>, or cloned from <a href="https://github.com/freeCodeCamp/boilerplate-mochachai/" target="_blank" rel="noopener noreferrer nofollow">GitHub</a>.
|
||||
請注意，本項目是在 <a href="https://replit.com/github/freeCodeCamp/boilerplate-mochachai" target="_blank" rel="noopener noreferrer nofollow">Replit</a> 上的初始化項目的基礎上進行開發，你也可以從 <a href="https://github.com/freeCodeCamp/boilerplate-mochachai/" target="_blank" rel="noopener noreferrer nofollow">GitHub</a> 上克隆。
|
||||
|
||||
`#instanceOf` 斷言一個對象是一個構造器的實例。
|
||||
|
||||
|
||||
@@ -8,7 +8,7 @@ dashedName: test-if-one-value-is-below-or-at-least-as-large-as-another
|
||||
|
||||
# --description--
|
||||
|
||||
As a reminder, this project is being built upon the following starter project on <a href="https://replit.com/github/freeCodeCamp/boilerplate-mochachai" target="_blank" rel="noopener noreferrer nofollow">Replit</a>, or cloned from <a href="https://github.com/freeCodeCamp/boilerplate-mochachai/" target="_blank" rel="noopener noreferrer nofollow">GitHub</a>.
|
||||
請注意，本項目是在 <a href="https://replit.com/github/freeCodeCamp/boilerplate-mochachai" target="_blank" rel="noopener noreferrer nofollow">Replit</a> 上的初始化項目的基礎上進行開發，你也可以從 <a href="https://github.com/freeCodeCamp/boilerplate-mochachai/" target="_blank" rel="noopener noreferrer nofollow">GitHub</a> 上克隆。
|
||||
|
||||
# --instructions--
|
||||
|
||||
|
||||
@@ -8,11 +8,11 @@ dashedName: use-assert-isok-and-assert-isnotok
|
||||
|
||||
# --description--
|
||||
|
||||
As a reminder, this project is being built upon the following starter project on <a href="https://replit.com/github/freeCodeCamp/boilerplate-mochachai" target="_blank" rel="noopener noreferrer nofollow">Replit</a>, or cloned from <a href="https://github.com/freeCodeCamp/boilerplate-mochachai/" target="_blank" rel="noopener noreferrer nofollow">GitHub</a>.
|
||||
請注意，本項目是在 <a href="https://replit.com/github/freeCodeCamp/boilerplate-mochachai" target="_blank" rel="noopener noreferrer nofollow">Replit</a> 上的初始化項目的基礎上進行開發，你也可以從 <a href="https://github.com/freeCodeCamp/boilerplate-mochachai/" target="_blank" rel="noopener noreferrer nofollow">GitHub</a> 上克隆。
|
||||
|
||||
`isOk()` 用來測試值是否爲真值，`isNotOk()` 用來測試值是否爲假值。
|
||||
|
||||
To learn more about truthy and falsy values, try our <a href="https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures/basic-algorithm-scripting/falsy-bouncer" target="_blank" rel="noopener noreferrer nofollow">Falsy Bouncer</a> challenge.
|
||||
可以在<a href="https://chinese.freecodecamp.org/learn/javascript-algorithms-and-data-structures/basic-algorithm-scripting/falsy-bouncer" target="_blank" rel="noopener noreferrer nofollow">過濾數組中的假值</a>這個挑戰中瞭解更多關於真值和假值的信息。
|
||||
|
||||
# --instructions--
|
||||
|
||||
|
||||
@@ -8,7 +8,7 @@ dashedName: use-regular-expressions-to-test-a-string
|
||||
|
||||
# --description--
|
||||
|
||||
As a reminder, this project is being built upon the following starter project on <a href="https://replit.com/github/freeCodeCamp/boilerplate-mochachai" target="_blank" rel="noopener noreferrer nofollow">Replit</a>, or cloned from <a href="https://github.com/freeCodeCamp/boilerplate-mochachai/" target="_blank" rel="noopener noreferrer nofollow">GitHub</a>.
|
||||
請注意，本項目是在 <a href="https://replit.com/github/freeCodeCamp/boilerplate-mochachai" target="_blank" rel="noopener noreferrer nofollow">Replit</a> 上的初始化項目的基礎上進行開發，你也可以從 <a href="https://github.com/freeCodeCamp/boilerplate-mochachai/" target="_blank" rel="noopener noreferrer nofollow">GitHub</a> 上克隆。
|
||||
|
||||
`match()` 斷言一個值匹配一個正則表達式（第二個參數）。
|
||||
|
||||
|
||||
@@ -8,7 +8,7 @@ dashedName: use-the-double-equals-to-assert-equality
|
||||
|
||||
# --description--
|
||||
|
||||
As a reminder, this project is being built upon the following starter project on <a href="https://replit.com/github/freeCodeCamp/boilerplate-mochachai" target="_blank" rel="noopener noreferrer nofollow">Replit</a>, or cloned from <a href="https://github.com/freeCodeCamp/boilerplate-mochachai/" target="_blank" rel="noopener noreferrer nofollow">GitHub</a>.
|
||||
請注意，本項目是在 <a href="https://replit.com/github/freeCodeCamp/boilerplate-mochachai" target="_blank" rel="noopener noreferrer nofollow">Replit</a> 上的初始化項目的基礎上進行開發，你也可以從 <a href="https://github.com/freeCodeCamp/boilerplate-mochachai/" target="_blank" rel="noopener noreferrer nofollow">GitHub</a> 上克隆。
|
||||
|
||||
`equal()` 使用 `==` 比較對象。
|
||||
|
||||
|
||||
@@ -8,7 +8,7 @@ dashedName: use-the-triple-equals-to-assert-strict-equality
|
||||
|
||||
# --description--
|
||||
|
||||
As a reminder, this project is being built upon the following starter project on <a href="https://replit.com/github/freeCodeCamp/boilerplate-mochachai" target="_blank" rel="noopener noreferrer nofollow">Replit</a>, or cloned from <a href="https://github.com/freeCodeCamp/boilerplate-mochachai/" target="_blank" rel="noopener noreferrer nofollow">GitHub</a>.
|
||||
請注意，本項目是在 <a href="https://replit.com/github/freeCodeCamp/boilerplate-mochachai" target="_blank" rel="noopener noreferrer nofollow">Replit</a> 上的初始化項目的基礎上進行開發，你也可以從 <a href="https://github.com/freeCodeCamp/boilerplate-mochachai/" target="_blank" rel="noopener noreferrer nofollow">GitHub</a> 上克隆。
|
||||
|
||||
`strictEqual()` 使用 `===` 比較對象。
|
||||
|
||||
|
||||
@@ -8,10 +8,10 @@ dashedName: american-british-translator
|
||||
|
||||
# --description--
|
||||
|
||||
Build a full stack JavaScript app that is functionally similar to this: <a href="https://american-british-translator.freecodecamp.rocks/" target="_blank" rel="noopener noreferrer nofollow">https://american-british-translator.freecodecamp.rocks/</a>. 可以採用下面的任意一種方式完成這個挑戰：
|
||||
構建一個 JavaScript 全棧應用，在功能上與 <a href="https://american-british-translator.freecodecamp.rocks/" target="_blank" rel="noopener noreferrer nofollow">https://american-british-translator.freecodecamp.rocks/</a> 類似。 可以採用下面的任意一種方式完成這個挑戰：
|
||||
|
||||
- Clone <a href="https://github.com/freeCodeCamp/boilerplate-project-american-british-english-translator/" target="_blank" rel="noopener noreferrer nofollow">this GitHub repo</a> and complete your project locally.
|
||||
- Use <a href="https://replit.com/github/freeCodeCamp/boilerplate-project-american-british-english-translator" target="_blank" rel="noopener noreferrer nofollow">our Replit starter project</a> to complete your project.
|
||||
- 克隆<a href="https://github.com/freeCodeCamp/boilerplate-project-american-british-english-translator/" target="_blank" rel="noopener noreferrer nofollow">這個 GitHub 倉庫</a>，並在本地完成你的項目。
|
||||
- 使用<a href="https://replit.com/github/freeCodeCamp/boilerplate-project-american-british-english-translator" target="_blank" rel="noopener noreferrer nofollow">我們在 Replit 上的初始化項目</a>來完成你的項目。
|
||||
- 使用您選擇的站點生成器來完成項目。 並確保包含了我們 GitHub 倉庫的所有文件。
|
||||
|
||||
當完成本項目，請確認有一個可以公開訪問的正常運行 demo 。 然後將 URL 提交到 `Solution Link` 中。 此外，還可以將項目的源碼提交到 `GitHub Link` 中。
|
||||
|
||||
@@ -8,10 +8,10 @@ dashedName: issue-tracker
|
||||
|
||||
# --description--
|
||||
|
||||
Build a full stack JavaScript app that is functionally similar to this: <a href="https://issue-tracker.freecodecamp.rocks/" target="_blank" rel="noopener noreferrer nofollow">https://issue-tracker.freecodecamp.rocks/</a>. 可以採用下面的任意一種方式完成這個挑戰：
|
||||
構建一個 JavaScript 全棧應用，在功能上與 <a href="https://issue-tracker.freecodecamp.rocks/" target="_blank" rel="noopener noreferrer nofollow">https://issue-tracker.freecodecamp.rocks/</a> 類似。 可以採用下面的任意一種方式完成這個挑戰：
|
||||
|
||||
- Clone <a href="https://github.com/freeCodeCamp/boilerplate-project-issuetracker/" target="_blank" rel="noopener noreferrer nofollow">this GitHub repo</a> and complete your project locally.
|
||||
- Use <a href="https://replit.com/github/freeCodeCamp/boilerplate-project-issuetracker" target="_blank" rel="noopener noreferrer nofollow">this Replit starter project</a> to complete your project.
|
||||
- 克隆<a href="https://github.com/freeCodeCamp/boilerplate-project-issuetracker/" target="_blank" rel="noopener noreferrer nofollow">這個 GitHub 倉庫</a>，並在本地完成你的項目。
|
||||
- 使用<a href="https://replit.com/github/freeCodeCamp/boilerplate-project-issuetracker" target="_blank" rel="noopener noreferrer nofollow">我們的 Replit 初始化項目</a>來完成你的項目。
|
||||
- 使用一個你喜歡的站點生成器來完成項目。 需要確定包含了我們 GitHub 倉庫的所有文件。
|
||||
|
||||
完成本項目後，請將一個正常運行的 demo（項目演示）託管在可以公開訪問的平臺。 然後在 `Solution Link` 框中提交你的項目 URL。 此外，還可以將項目的源碼提交到 `GitHub Link` 中。
|
||||
|
||||
@@ -8,10 +8,10 @@ dashedName: metric-imperial-converter
|
||||
|
||||
# --description--
|
||||
|
||||
Build a full stack JavaScript app that is functionally similar to this: <a href="https://metric-imperial-converter.freecodecamp.rocks/" target="_blank" rel="noopener noreferrer nofollow">https://metric-imperial-converter.freecodecamp.rocks/</a>. 可以採用下面的任意一種方式完成這個挑戰：
|
||||
構建一個 JavaScript 全棧應用，在功能上與 <a href="https://metric-imperial-converter.freecodecamp.rocks/" target="_blank" rel="noopener noreferrer nofollow">https://metric-imperial-converter.freecodecamp.rocks/</a> 類似。 可以採用下面的任意一種方式完成這個挑戰：
|
||||
|
||||
- Clone <a href="https://github.com/freeCodeCamp/boilerplate-project-metricimpconverter/" target="_blank" rel="noopener noreferrer nofollow">this GitHub repo</a> and complete your project locally.
|
||||
- Use <a href="https://replit.com/github/freeCodeCamp/boilerplate-project-metricimpconverter" target="_blank" rel="noopener noreferrer nofollow">our Replit starter project</a> to complete your project.
|
||||
- 克隆<a href="https://github.com/freeCodeCamp/boilerplate-project-metricimpconverter/" target="_blank" rel="noopener noreferrer nofollow">這個 GitHub 倉庫</a>，並在本地完成你的項目。
|
||||
- 使用<a href="https://replit.com/github/freeCodeCamp/boilerplate-project-metricimpconverter" target="_blank" rel="noopener noreferrer nofollow">我們在 Replit 上的初始化項目</a>來完成你的項目。
|
||||
- 使用一個你喜歡的站點生成器來完成項目。 需要確定包含了我們 GitHub 倉庫的所有文件。
|
||||
|
||||
完成本項目後，請將一個正常運行的 demo（項目演示）託管在可以公開訪問的平臺。 然後在 `Solution Link` 框中提交你的項目 URL。 此外，還可以將項目的源碼提交到 `GitHub Link` 中。
|
||||
|
||||
@@ -8,10 +8,10 @@ dashedName: personal-library
|
||||
|
||||
# --description--
|
||||
|
||||
Build a full stack JavaScript app that is functionally similar to this: <a href="https://personal-library.freecodecamp.rocks/" target="_blank" rel="noopener noreferrer nofollow">https://personal-library.freecodecamp.rocks/</a>. 可以採用下面的任意一種方式完成這個挑戰：
|
||||
構建一個 JavaScript 全棧應用，在功能上與 <a href="https://personal-library.freecodecamp.rocks/" target="_blank" rel="noopener noreferrer nofollow">https://personal-library.freecodecamp.rocks/</a> 類似。 可以採用下面的任意一種方式完成這個挑戰：
|
||||
|
||||
- Clone <a href="https://github.com/freeCodeCamp/boilerplate-project-library" target="_blank" rel="noopener noreferrer nofollow">this GitHub repo</a> and complete your project locally.
|
||||
- Use <a href="https://replit.com/github/freeCodeCamp/boilerplate-project-library" target="_blank" rel="noopener noreferrer nofollow">our Replit starter project</a> to complete your project.
|
||||
- 克隆<a href="https://github.com/freeCodeCamp/boilerplate-project-library" target="_blank" rel="noopener noreferrer nofollow">這個 GitHub 倉庫</a>，並在本地完成你的項目。
|
||||
- 使用<a href="https://replit.com/github/freeCodeCamp/boilerplate-project-library" target="_blank" rel="noopener noreferrer nofollow">我們在 Replit 上的初始化項目</a>來完成你的項目
|
||||
- 使用一個你喜歡的站點生成器來完成項目。 需要確定包含了我們 GitHub 倉庫的所有文件。
|
||||
|
||||
完成本項目後，請將一個正常運行的 demo（項目演示）託管在可以公開訪問的平臺。 然後在 `Solution Link` 框中提交你的項目 URL。 此外，還可以將項目的源碼提交到 `GitHub Link` 中。
|
||||
|
||||
@@ -8,10 +8,10 @@ dashedName: sudoku-solver
|
||||
|
||||
# --description--
|
||||
|
||||
Build a full stack JavaScript app that is functionally similar to this: <a href="https://sudoku-solver.freecodecamp.rocks/" target="_blank" rel="noopener noreferrer nofollow">https://sudoku-solver.freecodecamp.rocks/</a>. 可以採用下面的任意一種方式完成這個挑戰：
|
||||
構建一個 JavaScript 全棧應用，在功能上與 <a href="https://sudoku-solver.freecodecamp.rocks/" target="_blank" rel="noopener noreferrer nofollow">https://sudoku-solver.freecodecamp.rocks/</a> 類似。 可以採用下面的任意一種方式完成這個挑戰：
|
||||
|
||||
- Clone <a href="https://github.com/freecodecamp/boilerplate-project-sudoku-solver" target="_blank" rel="noopener noreferrer nofollow">this GitHub repo</a> and complete your project locally.
|
||||
- Use <a href="https://replit.com/github/freeCodeCamp/boilerplate-project-sudoku-solver" target="_blank" rel="noopener noreferrer nofollow">our Replit starter project</a> to complete your project.
|
||||
- 克隆<a href="https://github.com/freecodecamp/boilerplate-project-sudoku-solver" target="_blank" rel="noopener noreferrer nofollow">這個 GitHub 倉庫</a>，並在本地完成你的項目。
|
||||
- 使用<a href="https://replit.com/github/freeCodeCamp/boilerplate-project-sudoku-solver" target="_blank" rel="noopener noreferrer nofollow">我們在 Replit 上的初始化項目</a>來完成你的項目。
|
||||
- 使用一個你喜歡的站點生成器來完成項目。 需要確定包含了我們 GitHub 倉庫的所有文件。
|
||||
|
||||
完成本項目後，請將一個正常運行的 demo（項目演示）託管在可以公開訪問的平臺。 然後在 `Solution Link` 框中提交你的項目 URL。 此外，還可以將項目的源碼提交到 `GitHub Link` 中。
|
||||
@@ -270,7 +270,7 @@ async (getUserInput) => {
|
||||
};
|
||||
```
|
||||
|
||||
If the object submitted to `/api/check` is missing `puzzle`, `coordinate` or `value`, the returned value will be `{ error: 'Required field(s) missing' }`
|
||||
如果提交給 `/api/check` 的對象缺失 `puzzle`、`coordinate` 或 `value`，那麼返回的值將是 `{ error: 'Required field(s) missing' }`。
|
||||
|
||||
```js
|
||||
async (getUserInput) => {
|
||||
@@ -324,7 +324,7 @@ async (getUserInput) => {
|
||||
};
|
||||
```
|
||||
|
||||
If the `value` submitted to `/api/check` is not a number between 1 and 9, the returned value will be `{ error: 'Invalid value' }`
|
||||
如果提交給 `/api/check` 的 `value` 不是一個介於 1 到 9 之間的數字，則返回的值將是 `{ error: 'Invalid value' }`。
|
||||
|
||||
```js
|
||||
async (getUserInput) => {
|
||||
@@ -371,7 +371,7 @@ async (getUserInput) => {
|
||||
};
|
||||
```
|
||||
|
||||
所有 14 項功能測試都已完成並通過。 See `/tests/2_functional-tests.js` for the expected functionality you should write tests for.
|
||||
所有 14 項功能測試都已完成並通過。 請參閱 `/tests/2_functional-tests.js` 來了解你應該編寫的測試的功能。
|
||||
|
||||
```js
|
||||
async (getUserInput) => {
|
||||
|
||||
@@ -14,7 +14,7 @@ dashedName: files-as-a-sequence
|
||||
|
||||
更多資源：
|
||||
|
||||
\- <a href="https://www.youtube.com/watch?v=il1j4wkte2E" target="_blank" rel="noopener noreferrer nofollow">Exercise</a>
|
||||
\- <a href="https://www.youtube.com/watch?v=il1j4wkte2E" target="_blank" rel="noopener noreferrer nofollow">練習</a>
|
||||
|
||||
# --question--
|
||||
|
||||
|
||||
@@ -14,9 +14,9 @@ dashedName: intermediate-expressions
|
||||
|
||||
更多資源：
|
||||
|
||||
\- <a href="https://youtu.be/t_4DPwsaGDY" target="_blank" rel="noopener noreferrer nofollow">Exercise 1</a>
|
||||
\- <a href="https://youtu.be/t_4DPwsaGDY" target="_blank" rel="noopener noreferrer nofollow">練習 1</a>
|
||||
|
||||
\- <a href="https://youtu.be/wgkC8SxraAQ" target="_blank" rel="noopener noreferrer nofollow">Exercise 2</a>
|
||||
\- <a href="https://youtu.be/wgkC8SxraAQ" target="_blank" rel="noopener noreferrer nofollow">練習 2</a>
|
||||
|
||||
# --question--
|
||||
|
||||
|
||||
@@ -18,9 +18,9 @@ dashedName: introduction-why-program
|
||||
|
||||
更多資源：
|
||||
|
||||
\- <a href="https://youtu.be/F7mtLrYzZP8" target="_blank" rel="noopener noreferrer nofollow">Install Python on Windows</a>
|
||||
\- <a href="https://youtu.be/F7mtLrYzZP8" target="_blank" rel="noopener noreferrer nofollow">在 Windows 上安裝 Python</a>
|
||||
|
||||
\- <a href="https://youtu.be/wfLnZP-4sZw" target="_blank" rel="noopener noreferrer nofollow">Install Python on MacOS</a>
|
||||
\- <a href="https://youtu.be/wfLnZP-4sZw" target="_blank" rel="noopener noreferrer nofollow">在 MacOS 上安裝 Python</a>
|
||||
|
||||
# --question--
|
||||
|
||||
|
||||
@@ -14,7 +14,7 @@ dashedName: iterations-more-patterns
|
||||
|
||||
更多資源：
|
||||
|
||||
\- <a href="https://www.youtube.com/watch?v=kjxXZQw0uPg" target="_blank" rel="noopener noreferrer nofollow">Exercise</a>
|
||||
\- <a href="https://www.youtube.com/watch?v=kjxXZQw0uPg" target="_blank" rel="noopener noreferrer nofollow">練習</a>
|
||||
|
||||
# --question--
|
||||
|
||||
|
||||
@@ -14,11 +14,11 @@ dashedName: networking-web-scraping-with-python
|
||||
|
||||
更多資料：
|
||||
|
||||
\- <a href="https://www.youtube.com/watch?v=dWLdI143W-g" target="_blank" rel="noopener noreferrer nofollow">Exercise: socket1</a>
|
||||
\- <a href="https://www.youtube.com/watch?v=dWLdI143W-g" target="_blank" rel="noopener noreferrer nofollow">練習：socket1</a>
|
||||
|
||||
\- <a href="https://www.youtube.com/watch?v=8yis2DvbBkI" target="_blank" rel="noopener noreferrer nofollow">Exercise: urllib</a>
|
||||
\- <a href="https://www.youtube.com/watch?v=8yis2DvbBkI" target="_blank" rel="noopener noreferrer nofollow">練習：urllib</a>
|
||||
|
||||
\- <a href="https://www.youtube.com/watch?v=g9flPDG9nnY" target="_blank" rel="noopener noreferrer nofollow">Exercise: urllinks</a>
|
||||
\- <a href="https://www.youtube.com/watch?v=g9flPDG9nnY" target="_blank" rel="noopener noreferrer nofollow">練習：urllinks</a>
|
||||
|
||||
# --question--
|
||||
|
||||
|
||||
@@ -22,11 +22,11 @@ dashedName: page-view-time-series-visualizer
|
||||
|
||||
使用數據完成以下任務：
|
||||
|
||||
- 使用 Pandas 從 “fcc-forum-pageviews.csv” 導入數據。 Set the index to the `date` column.
|
||||
- 使用 Pandas 從 “fcc-forum-pageviews.csv” 導入數據。 將索引設置爲 `date` 列。
|
||||
- 通過過濾掉頁面瀏覽量位於數據集前 2.5% 或數據集後 2.5% 的日期來清理數據。
|
||||
- 創建一個 `draw_line_plot` 函數，該函數使用 Matplotlib 繪製類似於“examples/Figure_1.png”的折線圖。 The title should be `Daily freeCodeCamp Forum Page Views 5/2016-12/2019`. The label on the x axis should be `Date` and the label on the y axis should be `Page Views`.
|
||||
- 創建一個 `draw_bar_plot` 函數，用於繪製類似於“examples/Figure_2.png”的條形圖。 它應該顯示按年份分組的每個月的平均每日頁面瀏覽量。 The legend should show month labels and have a title of `Months`. On the chart, the label on the x axis should be `Years` and the label on the y axis should be `Average Page Views`.
|
||||
- 創建一個 `draw_box_plot` 函數，該函數使用 Seaborn 繪製兩個相鄰的箱形圖，類似於“examples/Figure_3.png”。 這些箱線圖應顯示值在給定年份或月份內的分佈情況以及隨時間推移的比較情況。 The title of the first chart should be `Year-wise Box Plot (Trend)` and the title of the second chart should be `Month-wise Box Plot (Seasonality)`. Make sure the month labels on bottom start at `Jan` and the x and y axis are labeled correctly. 樣板文件包括準備數據的命令。
|
||||
- 創建一個 `draw_line_plot` 函數，該函數使用 Matplotlib 繪製類似於“examples/Figure_1.png”的折線圖。 標題應爲 `Daily freeCodeCamp Forum Page Views 5/2016-12/2019`。 x 軸上的標籤應爲 `Date`，y 軸上的標籤應爲 `Page Views`。
|
||||
- 創建一個 `draw_bar_plot` 函數，用於繪製類似於“examples/Figure_2.png”的條形圖。 它應該顯示按年份分組的每個月的平均每日頁面瀏覽量。 圖例應顯示月份標籤並具有 `Months` 標題。 在圖表上，x 軸上的標籤應爲 `Years`，y 軸上的標籤應爲 `Average Page Views`。
|
||||
- 創建一個 `draw_box_plot` 函數，該函數使用 Seaborn 繪製兩個相鄰的箱形圖，類似於“examples/Figure_3.png”。 這些箱線圖應顯示值在給定年份或月份內的分佈情況以及隨時間推移的比較情況。 第一個圖表的標題應爲 `Year-wise Box Plot (Trend)`，第二個圖表的標題應爲 `Month-wise Box Plot (Seasonality)`。 確保底部的月份標籤從 `Jan` 開始，並且 x 和 y 軸標記正確。 樣板文件包括準備數據的命令。
|
||||
|
||||
對於每個圖表，請確保使用數據框的副本。 單元測試是在 `test_module.py` 下爲你編寫的。
|
||||
|
||||
|
||||
@@ -23,10 +23,10 @@ dashedName: sea-level-predictor
|
||||
使用數據完成以下任務：
|
||||
|
||||
- 使用 Pandas 從 `epa-sea-level.csv` 導入數據。
|
||||
- Use matplotlib to create a scatter plot using the `Year` column as the x-axis and the `CSIRO Adjusted Sea Level` column as the y-axix.
|
||||
- 使用 matplotlib 創建散點圖，使用 `Year` 列作爲 x 軸，將 `CSIRO Adjusted Sea Level` 列作爲 y 軸。
|
||||
- 使用 `scipy.stats` 中的 `linregress` 函數來獲得最佳擬合線的斜率和 y 截距。 在散點圖的頂部繪製最佳擬合線。 使線穿過 2050 年以預測 2050 年的海平面上升。
|
||||
- 僅使用數據集中從 2000 年到最近一年的數據繪製一條新的最佳擬合線。 如果上升速度繼續與 2000 年一樣，則使該線也經過 2050 年以預測 2050 年的海平面上升。
|
||||
- The x label should be `Year`, the y label should be `Sea Level (inches)`, and the title should be `Rise in Sea Level`.
|
||||
- x 標籤應爲 `Year`，y 標籤應爲 `Sea Level (inches)`，標題應爲 `Rise in Sea Level`。
|
||||
|
||||
單元測試是在 `test_module.py` 下爲你編寫的。
|
||||
|
||||
@@ -46,7 +46,7 @@ dashedName: sea-level-predictor
|
||||
|
||||
## 數據源
|
||||
|
||||
<a href="https://datahub.io/core/sea-level-rise" target="_blank" rel="noopener noreferrer nofollow">Global Average Absolute Sea Level Change</a>, 1880-2014 from the US Environmental Protection Agency using data from CSIRO, 2015; NOAA, 2015.
|
||||
<a href="https://datahub.io/core/sea-level-rise" target="_blank" rel="noopener noreferrer nofollow">全球平均絕對海平面變化</a>，1880 - 2014 年，來自美國環境保護局，數據來源：CSIRO, 2015; NOAA, 2015。
|
||||
|
||||
|
||||
# --hints--
|
||||
|
||||
@@ -15,7 +15,7 @@ dashedName: state-name-puzzle
|
||||
|
||||
Write a function to solve the challenge for a given array of actual U.S. state names, and for fictional state names.
|
||||
|
||||
The function should return an array. Each element should be an object in this form: `{"from":[],"to":[]}`. The `"from"` array should contain the original names and the `"to"` array should contain the resultant names.
|
||||
The function should return an array. Each element should be an object in this form: `{"from":[],"to":[]}`. The `from` array should contain the original names and the `to` array should contain the resultant names.
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
@@ -8,29 +8,29 @@ dashedName: book-recommendation-engine-using-knn
|
||||
|
||||
# --description--
|
||||
|
||||
You will be <a href="https://colab.research.google.com/github/freeCodeCamp/boilerplate-book-recommendation-engine/blob/master/fcc_book_recommendation_knn.ipynb" target="_blank" rel="noopener noreferrer nofollow">working on this project with Google Colaboratory</a>.
|
||||
你將<a href="https://colab.research.google.com/github/freeCodeCamp/boilerplate-book-recommendation-engine/blob/master/fcc_book_recommendation_knn.ipynb" target="_blank" rel="noopener noreferrer nofollow">使用 Google Colaboratory 來完成這個項目</a>。
|
||||
|
||||
After going to that link, create a copy of the notebook either in your own account or locally. Once you complete the project and it passes the test (included at that link), submit your project link below. If you are submitting a Google Colaboratory link, make sure to turn on link sharing for "anyone with the link."
|
||||
進入該鏈接後，在你自己的賬戶或本地創建一個筆記本的副本。 一旦你完成項目並通過測試（包括在該鏈接），請在下面提交你的項目鏈接。 如果你提交的是 Google Colaboratory 的鏈接，請確保打開鏈接共享時選擇 “anyone with the link”。
|
||||
|
||||
We are still developing the interactive instructional content for the machine learning curriculum. For now, you can go through the video challenges in this certification. You may also have to seek out additional learning resources, similar to what you would do when working on a real-world project.
|
||||
我們仍在開發機器學習課程的交互式課程部分。 現在，你可以通過這個認證中的視頻挑戰。 你可能還需要尋找額外的學習資源，類似於你在真實世界項目中的工作。
|
||||
|
||||
# --instructions--
|
||||
|
||||
In this challenge, you will create a book recommendation algorithm using **K-Nearest Neighbors**.
|
||||
在這個挑戰中，你將使用 **K-Nearest Neighbors** 創建一個圖書推薦算法。
|
||||
|
||||
You will use the <a href="http://www2.informatik.uni-freiburg.de/~cziegler/BX/" target="_blank" rel="noopener noreferrer nofollow">Book-Crossings dataset</a>. This dataset contains 1.1 million ratings (scale of 1-10) of 270,000 books by 90,000 users.
|
||||
你將使用 <a href="http://www2.informatik.uni-freiburg.de/~cziegler/BX/" target="_blank" rel="noopener noreferrer nofollow">Book-Crossings 數據集</a>。 該數據集包括 90,000 名用戶對 270,000 冊書籍的 110 萬份評分（評分從 1 至 10）。
|
||||
|
||||
After importing and cleaning the data, use `NearestNeighbors` from `sklearn.neighbors` to develop a model that shows books that are similar to a given book. The Nearest Neighbors algorithm measures the distance to determine the “closeness” of instances.
|
||||
導入並清理數據後，使用 `sklearn.neighbors` 中的 `NearestNeighbors` 開發一個模型，顯示與給定書籍相似的書籍。 最近鄰算法測量距離以確定實例的“接近度”。
|
||||
|
||||
Create a function named `get_recommends` that takes a book title (from the dataset) as an argument and returns a list of 5 similar books with their distances from the book argument.
|
||||
創建一個名爲 `get_recommends` 的函數，它將書名（來自數據集）作爲參數，並返回 5 本書的列表以及它們與書參數的距離。
|
||||
|
||||
This code:
|
||||
這個代碼：
|
||||
|
||||
```py
|
||||
get_recommends("The Queen of the Damned (Vampire Chronicles (Paperback))")
|
||||
```
|
||||
|
||||
should return:
|
||||
應該返回：
|
||||
|
||||
```py
|
||||
[
|
||||
@@ -45,15 +45,15 @@ should return:
|
||||
]
|
||||
```
|
||||
|
||||
Notice that the data returned from `get_recommends()` is a list. The first element in the list is the book title passed into the function. The second element in the list is a list of five more lists. Each of the five lists contains a recommended book and the distance from the recommended book to the book passed into the function.
|
||||
請注意，從 `get_recommends()` 返回的數據是一個列表。 列表中的第一個元素是傳遞給函數的書名。 列表中的第二個元素是另外五個列表的列表。 五個列表中的每一個都包含一本推薦書以及從推薦書到傳遞給函數的書的距離。
|
||||
|
||||
If you graph the dataset (optional), you will notice that most books are not rated frequently. To ensure statistical significance, remove from the dataset users with less than 200 ratings and books with less than 100 ratings.
|
||||
如果你繪製數據集的圖表（可選），你會注意到大多數書籍的評價並不頻繁。 爲了確保統計學上的顯著性，從數據集中刪除評分低於 200 的用戶和評分低於 100 的書籍。
|
||||
|
||||
The first three cells import libraries you may need and the data to use. The final cell is for testing. Write all your code in between those cells.
|
||||
前三個單元格導入你可能需要的庫和要使用的數據。 最後一個單元用於測試。 在這些單元格之間寫下所有代碼。
|
||||
|
||||
# --hints--
|
||||
|
||||
It should pass all Python tests.
|
||||
它應該通過所有的 Python 測試。
|
||||
|
||||
```js
|
||||
|
||||
|
||||
@@ -8,21 +8,21 @@ dashedName: cat-and-dog-image-classifier
|
||||
|
||||
# --description--
|
||||
|
||||
You will be <a href="https://colab.research.google.com/github/freeCodeCamp/boilerplate-cat-and-dog-image-classifier/blob/master/fcc_cat_dog.ipynb" target="_blank" rel="noopener noreferrer nofollow">working on this project with Google Colaboratory</a>.
|
||||
你將<a href="https://colab.research.google.com/github/freeCodeCamp/boilerplate-cat-and-dog-image-classifier/blob/master/fcc_cat_dog.ipynb" target="_blank" rel="noopener noreferrer nofollow">使用 Google Colaboratory 來完成這個項目</a>。
|
||||
|
||||
After going to that link, create a copy of the notebook either in your own account or locally. Once you complete the project and it passes the test (included at that link), submit your project link below. If you are submitting a Google Colaboratory link, make sure to turn on link sharing for "anyone with the link."
|
||||
進入該鏈接後，在你自己的賬戶或本地創建一個筆記本的副本。 一旦你完成項目並通過測試（包括在該鏈接），請在下面提交你的項目鏈接。 如果你提交的是 Google Colaboratory 的鏈接，請確保打開鏈接共享時選擇 “anyone with the link”。
|
||||
|
||||
We are still developing the interactive instructional content for the machine learning curriculum. For now, you can go through the video challenges in this certification. You may also have to seek out additional learning resources, similar to what you would do when working on a real-world project.
|
||||
我們仍在開發機器學習課程的交互式課程部分。 現在，你可以通過這個認證中的視頻挑戰。 你可能還需要尋找額外的學習資源，類似於你在真實世界項目中的工作。
|
||||
|
||||
# --instructions--
|
||||
|
||||
For this challenge, you will complete the code to classify images of dogs and cats. You will use TensorFlow 2.0 and Keras to create a convolutional neural network that correctly classifies images of cats and dogs at least 63% of the time. (Extra credit if you get it to 70% accuracy!)
|
||||
在這個挑戰中，你將完成代碼，對狗和貓的圖像進行分類。 你將使用 Tensorflow 2.0 和 Keras 創建一個卷積神經網絡，該網絡至少 63% 的時間可以正確分類貓和狗的圖像。 (如果你能達到 70% 的準確率，可以加分！）
|
||||
|
||||
Some of the code is given to you but some code you must fill in to complete this challenge. Read the instruction in each text cell so you will know what you have to do in each code cell.
|
||||
有些代碼是給你的，但有些代碼你必須填寫才能完成這個挑戰。 閱讀每個文本單元中的指令，你就會知道你在每個代碼單元中要做什麼。
|
||||
|
||||
The first code cell imports the required libraries. The second code cell downloads the data and sets key variables. The third cell is the first place you will write your own code.
|
||||
第一個代碼單元導入所需的庫。 第二個代碼單元下載數據並設置關鍵變量。 第三個單元格是你要寫自己代碼的第一個地方。
|
||||
|
||||
The structure of the dataset files that are downloaded looks like this (You will notice that the test directory has no subdirectories and the images are not labeled):
|
||||
下載的數據集文件的結構看起來是這樣的（你會注意到，測試目錄沒有子目錄，圖像也沒有標示）。
|
||||
|
||||
```py
|
||||
cats_and_dogs
|
||||
@@ -35,20 +35,20 @@ cats_and_dogs
|
||||
|__ test: [1.jpg, 2.jpg ...]
|
||||
```
|
||||
|
||||
You can tweak epochs and batch size if you like, but it is not required.
|
||||
如果你願意，你可以調整歷時和批次大小，但這不是必須的。
|
||||
|
||||
The following instructions correspond to specific cell numbers, indicated with a comment at the top of the cell (such as `# 3`).
|
||||
下面的指令對應於特定的單元格編號，在單元格的頂部用註釋表示（如 `# 3`）。
|
||||
|
||||
## Cell 3
|
||||
|
||||
Now it is your turn! Set each of the variables in this cell correctly. (They should no longer equal `None`.)
|
||||
現在輪到你了！ 正確設置此單元格中的每個變量。 （它們不應再等於 `None`。）
|
||||
|
||||
Create image generators for each of the three image data sets (train, validation, test). Use `ImageDataGenerator` to read / decode the images and convert them into floating point tensors. Use the `rescale` argument (and no other arguments for now) to rescale the tensors from values between 0 and 255 to values between 0 and 1.
|
||||
爲三個圖像數據集（訓練、驗證、測試）中的每一個創建圖像生成器。 使用 `ImageDataGenerator` 讀取/解碼圖像並將它們轉換爲浮點張量。 使用 `rescale` 參數（目前沒有其他參數）將張量從 0 到 255 之間的值重新縮放到 0 到 1 之間的值。
|
||||
|
||||
For the `*_data_gen` variables, use the `flow_from_directory` method. Pass in the batch size, directory, target size (`(IMG_HEIGHT, IMG_WIDTH)`), class mode, and anything else required. `test_data_gen` will be the trickiest one. For `test_data_gen`, make sure to pass in `shuffle=False` to the `flow_from_directory` method. This will make sure the final predictions stay is in the order that our test expects. For `test_data_gen` it will also be helpful to observe the directory structure.
|
||||
對於 `*_data_gen` 變量，使用 `flow_from_directory` 方法。 傳入批處理大小、目錄、目標大小（`(IMG_HEIGHT, IMG_WIDTH)`）、類模式以及其他所需的內容。 `test_data_gen` 將是最棘手的一個。 對於 `test_data_gen`，確保將 `shuffle=False` 傳遞給 `flow_from_directory` 方法。 這將確保最終預測保持在我們的測試預期的順序。 對於 `test_data_gen`，觀察目錄結構也很有幫助。
|
||||
|
||||
|
||||
After you run the code, the output should look like this:
|
||||
運行代碼後，輸出應如下所示：
|
||||
|
||||
```py
|
||||
Found 2000 images belonging to 2 classes.
|
||||
@@ -58,51 +58,51 @@ Found 50 images belonging to 1 class.
|
||||
|
||||
## Cell 4
|
||||
|
||||
The `plotImages` function will be used a few times to plot images. It takes an array of images and a probabilities list, although the probabilities list is optional. This code is given to you. If you created the `train_data_gen` variable correctly, then running this cell will plot five random training images.
|
||||
`plotImages` 函數將多次用於繪製圖像。 它需要一個圖像數組和一個概率列表，儘管概率列表是可選的。 此代碼已提供給你。 如果你正確地創建了 `train_data_gen` 變量，那麼運行這個單元將繪製五個隨機訓練圖像。
|
||||
|
||||
## Cell 5
|
||||
|
||||
Recreate the `train_image_generator` using `ImageDataGenerator`.
|
||||
使用 `ImageDataGenerator` 重新創建 `train_image_generator`。
|
||||
|
||||
Since there are a small number of training examples, there is a risk of overfitting. One way to fix this problem is by creating more training data from existing training examples by using random transformations.
|
||||
由於訓練樣本數量很少，因此存在過度擬合的風險。 解決此問題的一種方法，是通過使用隨機變換，從現有訓練示例創建更多訓練數據。
|
||||
|
||||
Add 4-6 random transformations as arguments to `ImageDataGenerator`. Make sure to rescale the same as before.
|
||||
添加 4-6 個隨機變換作爲 `ImageDataGenerator` 的參數。 確保重新縮放與以前相同。
|
||||
|
||||
## Cell 6
|
||||
|
||||
You don't have to do anything for this cell. `train_data_gen` is created just like before but with the new `train_image_generator`. Then, a single image is plotted five different times using different variations.
|
||||
你無需爲此單元做任何事情。 `train_data_gen` 與以前一樣創建，但使用新的 `train_image_generator`。 然後，使用不同的變化對單個圖像進行五次不同的繪製。
|
||||
|
||||
## Cell 7
|
||||
|
||||
In this cell, create a model for the neural network that outputs class probabilities. It should use the Keras Sequential model. It will probably involve a stack of Conv2D and MaxPooling2D layers and then a fully connected layer on top that is activated by a ReLU activation function.
|
||||
在此單元格中，爲輸出類別概率的神經網絡創建一個模型。 它應該使用 Keras Sequential 模型。 它可能會涉及一堆 Conv2D 和 MaxPooling2D 層，然後是一個由 ReLU 激活函數激活的全連接層。
|
||||
|
||||
Compile the model passing the arguments to set the optimizer and loss. Also pass in `metrics=['accuracy']` to view training and validation accuracy for each training epoch.
|
||||
編譯模型並傳遞參數以設置優化器和損失。 同時傳入 `metrics=['accuracy']` 以查看每個訓練週期的訓練和驗證精度。
|
||||
|
||||
## Cell 8
|
||||
|
||||
Use the `fit` method on your `model` to train the network. Make sure to pass in arguments for `x`, `steps_per_epoch`, `epochs`, `validation_data`, and `validation_steps`.
|
||||
使用 `model` 上的 `fit` 方法來訓練網絡。 確保爲 `x`、`steps_per_epoch`、`epochs`、`validation_data` 和 `validation_steps` 傳入參數。
|
||||
|
||||
## Cell 9
|
||||
|
||||
Run this cell to visualize the accuracy and loss of the model.
|
||||
運行這個單元來觀察模型的準確性和損失。
|
||||
|
||||
## Cell 10
|
||||
|
||||
Now it is time to use your model to predict whether a brand new image is a cat or a dog.
|
||||
現在是時候使用你的模型，來預測一個全新的圖像，是貓還是狗了。
|
||||
|
||||
In this cell, get the probability that each test image (from `test_data_gen`) is a dog or a cat. `probabilities` should be a list of integers.
|
||||
在此單元格中，獲取每個測試圖像（來自 `test_data_gen`）是狗或貓的概率。 `probabilities` 應該是一個整數列表。
|
||||
|
||||
Call the `plotImages` function and pass in the test images and the probabilities corresponding to each test image.
|
||||
調用 `plotImages` 函數並傳入測試圖像和每個測試圖像對應的概率。
|
||||
|
||||
After you run the cell, you should see all 50 test images with a label showing the percentage of "sure" that the image is a cat or a dog. The accuracy will correspond to the accuracy shown in the graph above (after running the previous cell). More training images could lead to a higher accuracy.
|
||||
在你運行該單元后，你應該看到所有 50 張測試圖像，並有一個標籤顯示該圖像是貓還是狗的“確定”百分比。 準確度將對應於上圖中顯示的準確度（在運行上一個單元格之後）。 更多的訓練圖像可能會導致更高的準確性。
|
||||
|
||||
## Cell 11
|
||||
|
||||
Run this final cell to see if you passed the challenge or if you need to keep trying.
|
||||
運行這個最後的單元格，看看你是否通過了挑戰，或者你是否需要繼續努力。
|
||||
|
||||
# --hints--
|
||||
|
||||
It should pass all Python tests.
|
||||
它應該通過所有的 Python 測試。
|
||||
|
||||
```js
|
||||
|
||||
|
||||
@@ -8,33 +8,33 @@ dashedName: linear-regression-health-costs-calculator
|
||||
|
||||
# --description--
|
||||
|
||||
You will be <a href="https://colab.research.google.com/github/freeCodeCamp/boilerplate-linear-regression-health-costs-calculator/blob/master/fcc_predict_health_costs_with_regression.ipynb" target="_blank" rel="noopener noreferrer nofollow">working on this project with Google Colaboratory</a>.
|
||||
你將<a href="https://colab.research.google.com/github/freeCodeCamp/boilerplate-linear-regression-health-costs-calculator/blob/master/fcc_predict_health_costs_with_regression.ipynb" target="_blank" rel="noopener noreferrer nofollow">使用 Google Colaboratory 來完成這個項目</a>。
|
||||
|
||||
After going to that link, create a copy of the notebook either in your own account or locally. Once you complete the project and it passes the test (included at that link), submit your project link below. If you are submitting a Google Colaboratory link, make sure to turn on link sharing for "anyone with the link."
|
||||
進入該鏈接後，在你自己的賬戶或本地創建一個筆記本的副本。 一旦你完成項目並通過測試（包括在該鏈接），請在下面提交你的項目鏈接。 如果你提交的是 Google Colaboratory 的鏈接，請確保打開鏈接共享時選擇 “anyone with the link”。
|
||||
|
||||
We are still developing the interactive instructional content for the machine learning curriculum. For now, you can go through the video challenges in this certification. You may also have to seek out additional learning resources, similar to what you would do when working on a real-world project.
|
||||
我們仍在開發機器學習課程的交互式課程部分。 現在，你可以通過這個認證中的視頻挑戰。 你可能還需要尋找額外的學習資源，類似於你在真實世界項目中的工作。
|
||||
|
||||
# --instructions--
|
||||
|
||||
In this challenge, you will predict healthcare costs using a regression algorithm.
|
||||
在這個挑戰中，你將使用迴歸算法預測醫療費用。
|
||||
|
||||
You are given a dataset that contains information about different people including their healthcare costs. Use the data to predict healthcare costs based on new data.
|
||||
你會得到一個數據集，其中包含不同人的信息，包括他們的醫療費用。 用數據來預測基於新數據的醫療費用。
|
||||
|
||||
The first two cells of this notebook import libraries and the data.
|
||||
此筆記本的前兩個單元格導入庫和數據。
|
||||
|
||||
Make sure to convert categorical data to numbers. Use 80% of the data as the `train_dataset` and 20% of the data as the `test_dataset`.
|
||||
確保將分類數據轉換爲數字。 將 80% 的數據用作 `train_dataset`，將 20% 的數據用作 `test_dataset`。
|
||||
|
||||
`pop` off the "expenses" column from these datasets to create new datasets called `train_labels` and `test_labels`. Use these labels when training your model.
|
||||
使用 `pop` 從這些數據集中移出“費用”列中，來創建名爲 `train_labels` 和 `test_labels` 的新數據集。 訓練模型時使用這些標籤。
|
||||
|
||||
Create a model and train it with the `train_dataset`. Run the final cell in this notebook to check your model. The final cell will use the unseen `test_dataset` to check how well the model generalizes.
|
||||
創建一個模型並使用 `train_dataset` 對其進行訓練。 運行本筆記本中的最後一個單元來檢查你的模型。 最後一個單元格將使用看不見的 `test_dataset` 來檢查模型的泛化程度。
|
||||
|
||||
To pass the challenge, `model.evaluate` must return a Mean Absolute Error of under 3500. This means it predicts health care costs correctly within $3500.
|
||||
要通過挑戰，`model.evaluate` 必須返回低於 3500 的平均絕對誤差。 這意味着它可以正確地預測醫療保健費用在 3500 美元以內。
|
||||
|
||||
The final cell will also predict expenses using the `test_dataset` and graph the results.
|
||||
最後一個單元格還將使用 `test_dataset` 預測費用並繪製結果圖。
|
||||
|
||||
# --hints--
|
||||
|
||||
It should pass all Python tests.
|
||||
它應該通過所有 Python 測試。
|
||||
|
||||
```js
|
||||
|
||||
|
||||
@@ -8,25 +8,25 @@ dashedName: neural-network-sms-text-classifier
|
||||
|
||||
# --description--
|
||||
|
||||
You will be <a href="https://colab.research.google.com/github/freeCodeCamp/boilerplate-neural-network-sms-text-classifier/blob/master/fcc_sms_text_classification.ipynb" target="_blank" rel="noopener noreferrer nofollow">working on this project with Google Colaboratory</a>.
|
||||
你將<a href="https://colab.research.google.com/github/freeCodeCamp/boilerplate-neural-network-sms-text-classifier/blob/master/fcc_sms_text_classification.ipynb" target="_blank" rel="noopener noreferrer nofollow">使用 Google Colaboratory 來完成這個項目</a>。
|
||||
|
||||
After going to that link, create a copy of the notebook either in your own account or locally. Once you complete the project and it passes the test (included at that link), submit your project link below. If you are submitting a Google Colaboratory link, make sure to turn on link sharing for "anyone with the link."
|
||||
進入該鏈接後，在你自己的賬戶或本地創建一個筆記本的副本。 一旦你完成項目並通過測試（包括在該鏈接），請在下面提交你的項目鏈接。 如果你提交的是 Google Colaboratory 的鏈接，請確保打開鏈接共享時選擇 “anyone with the link”。
|
||||
|
||||
We are still developing the interactive instructional content for the machine learning curriculum. For now, you can go through the video challenges in this certification. You may also have to seek out additional learning resources, similar to what you would do when working on a real-world project.
|
||||
我們仍在開發機器學習課程的交互式課程部分。 現在，你可以通過這個認證中的視頻挑戰。 你可能還需要尋找額外的學習資源，類似於你在真實世界項目中的工作。
|
||||
|
||||
# --instructions--
|
||||
|
||||
In this challenge, you need to create a machine learning model that will classify SMS messages as either "ham" or "spam". A "ham" message is a normal message sent by a friend. A "spam" message is an advertisement or a message sent by a company.
|
||||
在這個挑戰中，你需要創建一個機器學習模型，將短信分類爲 “ham” 或 “spam”。 “ham” 消息是朋友發送的正常消息。 “spam” 是一個公司發送的廣告或信息。
|
||||
|
||||
You should create a function called `predict_message` that takes a message string as an argument and returns a list. The first element in the list should be a number between zero and one that indicates the likeliness of "ham" (0) or "spam" (1). The second element in the list should be the word "ham" or "spam", depending on which is most likely.
|
||||
你應該創建一個名爲 `predict_message` 的函數，該函數接收一個消息字符串作爲參數並返回一個列表。 列表中的第一個元素應該是一個介於 0 和 1 之間的數字，表示 “ham”（0）或 “spam”（1）的可能性。 列表中的第二個元素應該是單詞 “ham” 或 “spam”，這取決於哪個最有可能。
|
||||
|
||||
For this challenge, you will use the <a href="http://www.dt.fee.unicamp.br/~tiago/smsspamcollection/" target="_blank" rel="noopener noreferrer nofollow">SMS Spam Collection</a> dataset. The dataset has already been grouped into train data and test data.
|
||||
對於這個挑戰，你將使用 <a href="http://www.dt.fee.unicamp.br/~tiago/smsspamcollection/" target="_blank" rel="noopener noreferrer nofollow">SMS Spam Collection 數據集</a>。 數據集已經被分組爲訓練數據和測試數據。
|
||||
|
||||
The first two cells import the libraries and data. The final cell tests your model and function. Add your code in between these cells.
|
||||
前兩個單元導入庫和數據。 最後一個單元測試你的模型和功能。 在這些單元格之間添加你的代碼。
|
||||
|
||||
# --hints--
|
||||
|
||||
It should pass all Python tests.
|
||||
它應該通過所有的 Python 測試。
|
||||
|
||||
```js
|
||||
|
||||
|
||||
@@ -8,57 +8,57 @@ dashedName: rock-paper-scissors
|
||||
|
||||
# --description--
|
||||
|
||||
For this challenge, you will create a program to play Rock, Paper, Scissors. A program that picks at random will usually win 50% of the time. To pass this challenge your program must play matches against four different bots, winning at least 60% of the games in each match.
|
||||
在這個挑戰中，你將創建一個程序來玩石頭、剪刀、布。 一個隨機選取的程序通常會有 50% 的時間獲勝。 要通過這一挑戰，你的程序必須與四個不同的機器人進行對戰，並達到至少 60% 勝率。
|
||||
|
||||
You will be <a href="https://replit.com/github/freeCodeCamp/boilerplate-rock-paper-scissors" target="_blank" rel="noopener noreferrer nofollow">working on this project with our Replit starter code</a>.
|
||||
你將使用<a href="https://replit.com/github/freeCodeCamp/boilerplate-rock-paper-scissors" target="_blank" rel="noopener noreferrer nofollow">我們在 Replit 的初始化項目</a>來完成這個項目。
|
||||
|
||||
We are still developing the interactive instructional part of the machine learning curriculum. For now, you will have to use other resources to learn how to pass this challenge.
|
||||
我們仍在開發機器學習課程的交互式課程部分。 現在，你需要使用其他資源來學習如何通過這一挑戰。
|
||||
|
||||
# --instructions--
|
||||
|
||||
In the file `RPS.py` you are provided with a function called `player`. The function takes an argument that is a string describing the last move of the opponent ("R", "P", or "S"). The function should return a string representing the next move for it to play ("R", "P", or "S").
|
||||
在文件 `RPS.py` 中，你會看到一個名爲 `player` 的函數。 該函數接受一個參數，該參數是一個字符串，描述了對手的最後一步（“R”、“P” 或 “S”）。 該函數應返回一個字符串，表示它要播放的下一步動作（“R”、“P”或“S”）。
|
||||
|
||||
A player function will receive an empty string as an argument for the first game in a match since there is no previous play.
|
||||
玩家函數將接收一個空字符串作爲比賽中第一場比賽的參數，因爲之前沒有比賽。
|
||||
|
||||
The file `RPS.py` shows an example function that you will need to update. The example function is defined with two arguments (`player(prev_play, opponent_history = [])`). The function is never called with a second argument so that one is completely optional. The reason why the example function contains a second argument (`opponent_history = []`) is because that is the only way to save state between consecutive calls of the `player` function. You only need the `opponent_history` argument if you want to keep track of the opponent_history.
|
||||
文件 `RPS.py` 顯示了一個你需要更新的示例函數。 示例函數使用兩個參數定義（`player(prev_play, opponent_history = [])`）。 該函數從不使用第二個參數調用，因此它是完全可選的。 示例函數包含第二個參數（`opponent_history = []`）的原因，是因爲這是在連續調用 `player` 函數之間保存狀態的唯一方法。 如果你想跟蹤對手歷史，你只需要 `opponent_history` 參數。
|
||||
|
||||
*Hint: To defeat all four opponents, your program may need to have multiple strategies that change depending on the plays of the opponent.*
|
||||
*提示：爲了打敗所有四個對手，你的程序可能需要有多種策略，這些策略會根據對手的棋局而改變。*
|
||||
|
||||
## Development
|
||||
## 開發
|
||||
|
||||
Do not modify `RPS_game.py`. Write all your code in `RPS.py`. For development, you can use `main.py` to test your code.
|
||||
不要修改 `RPS_game.py`。 在 `RPS.py` 中編寫所有代碼。 對於開發，你可以使用 `main.py` 來測試你的代碼。
|
||||
|
||||
`main.py` imports the game function and bots from `RPS_game.py`.
|
||||
`main.py` 從 `RPS_game.py` 導入遊戲功能和機器人。
|
||||
|
||||
To test your code, play a game with the `play` function. The `play` function takes four arguments:
|
||||
要測試你的代碼，請使用 `play` 函數玩遊戲。 `play` 函數有四個參數：
|
||||
|
||||
- two players to play against each other (the players are actually functions)
|
||||
- the number of games to play in the match
|
||||
- an optional argument to see a log of each game. Set it to `True` to see these messages.
|
||||
- 兩個玩家互相對戰（玩家實際上是函數）
|
||||
- 比賽的比賽場數
|
||||
- 一個可選參數來查看每場比賽的日誌。 將其設置爲 `True` 以查看這些消息。
|
||||
|
||||
```py
|
||||
play(player1, player2, num_games[, verbose])
|
||||
```
|
||||
|
||||
For example, here is how you would call the function if you want `player` and `quincy` to play 1000 games against each other and you want to see the results of each game:
|
||||
例如，如果你希望 `player` 和 `quincy` 互相對戰 1000 場比賽，並且你想查看每場比賽的結果，你將這樣調用該函數：
|
||||
|
||||
```py
|
||||
play(player, quincy, 1000, verbose=True)
|
||||
```
|
||||
|
||||
Click the "run" button and `main.py` will run.
|
||||
單擊“運行”按鈕，`main.py` 將運行。
|
||||
|
||||
## Testing
|
||||
## 測試
|
||||
|
||||
The unit tests for this project are in `test_module.py`. We imported the tests from `test_module.py` to `main.py` for your convenience. If you uncomment the last line in `main.py`, the tests will run automatically whenever you hit the "run" button.
|
||||
這個項目的單元測試在 `test_module.py` 中。 爲了你的方便，我們將測試從 `test_module.py` 導入到 `main.py`。 如果你移除 `main.py` 中最後一行的註釋，則只要你點擊“運行”按鈕，測試就會自動運行。
|
||||
|
||||
## Submitting
|
||||
## 提交
|
||||
|
||||
Copy your project's URL and submit it below.
|
||||
複製項目的 URL 並在下面提交。
|
||||
|
||||
# --hints--
|
||||
|
||||
It should pass all Python tests.
|
||||
它應該通過所有的 Python 測試。
|
||||
|
||||
```js
|
||||
|
||||
|
||||
@@ -14,7 +14,7 @@ dashedName: neural-networks-activation-functions
|
||||
|
||||
## --text--
|
||||
|
||||
Which activation function squishes values between -1 and 1?
|
||||
哪個激活函數將值轉換爲在 -1 和 1 之間？
|
||||
|
||||
## --answers--
|
||||
|
||||
|
||||
@@ -7,7 +7,7 @@ dashedName: step-5
|
||||
|
||||
# --description--
|
||||
|
||||
在 `.header` 元素下面，創建一個 `class` 設置爲 `"gallery"` 的 `div` 元素。 這個 `div` 將作爲相冊的容器。
|
||||
Below your `.header` element, create a new `div` element and assign it a `class` of `gallery`. 這個 `div` 將作爲相冊的容器。
|
||||
|
||||
在該 `.gallery` 元素中，創建九個 `img` 元素。
|
||||
|
||||
|
||||
@@ -17,7 +17,7 @@ You should use compound assignment to add the string `Right! You win 20 gold!` t
|
||||
assert.match(pick.toString(), /text\.innerText\s*\+=\s*('|")Right! You win 20 gold!\1/);
|
||||
```
|
||||
|
||||
You should use compound assignment add `20` to the value of `gold`.
|
||||
You should use compound assignment to add `20` to the value of `gold`.
|
||||
|
||||
```js
|
||||
assert.match(pick.toString(), /gold\s*\+=\s*20/);
|
||||
|
||||
@@ -11,12 +11,12 @@ dashedName: escape-sequences-in-strings
|
||||
|
||||
引号不是字符串中唯一可以被转义（<dfn>escaped</dfn>）的字符。 使用转义字符有两个原因：
|
||||
|
||||
1. To allow you to use characters you may not otherwise be able to type out, such as a newline.
|
||||
1. 首先是可以让你使用无法输入的字符，例如换行。
|
||||
2. 其次是可以让你在一个字符串中表示多个引号，而不会出错。
|
||||
|
||||
我们在之前的挑战中学到了这个。
|
||||
|
||||
<table class='table table-striped'><thead><tr><th>代码</th><th>输出</th></tr></thead><tbody><tr><td><code>\'</code></td><td>单引号</td></tr><tr><td><code>\"</code></td><td>双引号</td></tr><tr><td><code>\\</code></td><td>反斜杠</td></tr><tr><td><code>\n</code></td><td>换行符</td></tr><tr><td><code>\t</code></td><td>tab</td></tr><tr><td><code>\r</code></td><td>carriage return</td></tr><tr><td><code>\b</code></td><td>退格</td></tr><tr><td><code>\f</code></td><td>换页符</td></tr></tbody></table>
|
||||
<table class='table table-striped'><thead><tr><th>代码</th><th>输出</th></tr></thead><tbody><tr><td><code>\'</code></td><td>单引号</td></tr><tr><td><code>\"</code></td><td>双引号</td></tr><tr><td><code>\\</code></td><td>反斜杠</td></tr><tr><td><code>\n</code></td><td>换行符</td></tr><tr><td><code>\t</code></td><td>制表符</td></tr><tr><td><code>\r</code></td><td>回车</td></tr><tr><td><code>\b</code></td><td>退格</td></tr><tr><td><code>\f</code></td><td>换页符</td></tr></tbody></table>
|
||||
|
||||
*请注意，必须对反斜杠本身进行转义，它才能显示为反斜杠。*
|
||||
|
||||
|
||||
@@ -71,7 +71,7 @@ assert(
|
||||
);
|
||||
```
|
||||
|
||||
Global variables should not be used to cache the array.
|
||||
不应使用全局变量来缓存数组。
|
||||
|
||||
```js
|
||||
countdown(1)
|
||||
|
||||
@@ -56,7 +56,7 @@ assert.deepStrictEqual(rangeOfNumbers(6, 9), [6, 7, 8, 9]);
|
||||
assert.deepStrictEqual(rangeOfNumbers(4, 4), [4]);
|
||||
```
|
||||
|
||||
Global variables should not be used to cache the array.
|
||||
不应使用全局变量来缓存数组。
|
||||
|
||||
```js
|
||||
rangeOfNumbers(1, 3)
|
||||
|
||||
@@ -12,9 +12,9 @@ ES6 提供了一个新的创建对象的语法，使用关键字 <dfn>class</dfn
|
||||
|
||||
值得注意的是，`class` 只是一个语法糖，它并不像 Java、Python 或者 Ruby 这一类的语言一样，严格履行了面向对象的开发规范。
|
||||
|
||||
In ES5, an object can be created by defining a `constructor` function and using the `new` keyword to instantiate the object.
|
||||
在 ES5 里面，我们通常会定义一个函数 `constructor`，然后使用 `new` 关键字来实例化一个对象。
|
||||
|
||||
In ES6, a `class` declaration has a `constructor` method that is invoked with the `new` keyword. If the `constructor` method is not explicitly defined, then it is implicitly defined with no arguments.
|
||||
在 ES6 里，`class` 声明有一个 `constructor` 方法，与 `new` 关键字一起被调用。 如果 `constructor` 方法没有明确定义，那么它就被含蓄地定义为没有参数。
|
||||
|
||||
```js
|
||||
// Explicit constructor
|
||||
|
||||
@@ -42,7 +42,7 @@ assert.deepEqual(steamrollArray([1, {}, [3, [[4]]]]), [1, {}, 3, 4]);
|
||||
assert(!code.match(/\.\s*flat\s*\(/) && !code.match(/\.\s*flatMap\s*\(/));
|
||||
```
|
||||
|
||||
Global variables should not be used.
|
||||
不应使用全局变量。
|
||||
|
||||
```js
|
||||
steamrollArray([1, {}, [3, [[4]]]])
|
||||
|
||||
@@ -8,7 +8,7 @@ dashedName: build-a-25--5-clock
|
||||
|
||||
# --description--
|
||||
|
||||
**Objective:** Build an app that is functionally similar to this: <a href="https://25--5-clock.freecodecamp.rocks" target="_blank" rel="noopener noreferrer nofollow">https://25--5-clock.freecodecamp.rocks</a>.
|
||||
**目标：** 构建一个应用，功能和 <a href="https://25--5-clock.freecodecamp.rocks" target="_blank" rel="noopener noreferrer nofollow">https://25--5-clock.freecodecamp.rocks</a> 类似。
|
||||
|
||||
完成以下需求，并且通过所有测试。 可以使用你需要的任何库或 API。 赋予它你自己的个人风格。
|
||||
|
||||
|
||||
@@ -8,7 +8,7 @@ dashedName: build-a-drum-machine
|
||||
|
||||
# --description--
|
||||
|
||||
**Objective:** Build an app that is functionally similar to this: <a href="https://drum-machine.freecodecamp.rocks/" target="_blank" rel="noopener noreferrer nofollow">https://drum-machine.freecodecamp.rocks/</a>.
|
||||
**目标：** 构建一个应用，功能和 <a href="https://drum-machine.freecodecamp.rocks/" target="_blank" rel="noopener noreferrer nofollow">https://drum-machine.freecodecamp.rocks/</a> 类似。
|
||||
|
||||
完成以下需求，并且通过所有测试。 可以使用你需要的任何库或 API。 赋予它你自己的个人风格。
|
||||
|
||||
|
||||
@@ -8,7 +8,7 @@ dashedName: build-a-javascript-calculator
|
||||
|
||||
# --description--
|
||||
|
||||
**Objective:** Build an app that is functionally similar to this: <a href="https://javascript-calculator.freecodecamp.rocks/" target="_blank" rel="noopener noreferrer nofollow">https://javascript-calculator.freecodecamp.rocks/</a>.
|
||||
**目标：** 构建一个应用，功能和 <a href="https://javascript-calculator.freecodecamp.rocks/" target="_blank" rel="noopener noreferrer nofollow">https://javascript-calculator.freecodecamp.rocks/</a> 类似。
|
||||
|
||||
完成以下需求，并且通过所有测试。 可以使用你需要的任何库或 API。 赋予它你自己的个人风格。
|
||||
|
||||
|
||||
@@ -8,7 +8,7 @@ dashedName: build-a-markdown-previewer
|
||||
|
||||
# --description--
|
||||
|
||||
**Objective:** Build an app that is functionally similar to this: <a href="https://markdown-previewer.freecodecamp.rocks/" target="_blank" rel="noopener noreferrer nofollow">https://markdown-previewer.freecodecamp.rocks/</a>.
|
||||
**目标：** 构建一个应用，功能和 <a href="https://markdown-previewer.freecodecamp.rocks/" target="_blank" rel="noopener noreferrer nofollow">https://markdown-previewer.freecodecamp.rocks/</a> 类似。
|
||||
|
||||
完成以下需求，并且通过所有测试。 可以使用你需要的任何库或 API。 赋予它你自己的个人风格。
|
||||
|
||||
|
||||
@@ -8,7 +8,7 @@ dashedName: build-a-random-quote-machine
|
||||
|
||||
# --description--
|
||||
|
||||
**Objective:** Build an app that is functionally similar to this: <a href="https://random-quote-machine.freecodecamp.rocks/" target="_blank" rel="noopener noreferrer nofollow">https://random-quote-machine.freecodecamp.rocks/</a>.
|
||||
**目标：** 构建一个应用，功能和 <a href="https://random-quote-machine.freecodecamp.rocks/" target="_blank" rel="noopener noreferrer nofollow">https://random-quote-machine.freecodecamp.rocks/</a> 类似。
|
||||
|
||||
完成以下需求，并且通过所有测试。 可以使用你需要的任何库或 API。 赋予它你自己的个人风格。
|
||||
|
||||
|
||||
@@ -18,7 +18,7 @@ dashedName: learn-how-script-tags-and-document-ready-work
|
||||
|
||||
在 `script` 标签中添加代码 `$(document).ready(function() {`。 然后在后面（仍在该 `script` 标签内）用 `});` 闭合它。
|
||||
|
||||
稍后将详细介绍 `functions`， 现在需要知道的是，只要浏览器加载页面，`function` 中放入的代码就会运行。
|
||||
稍后将详细介绍 `functions`， 重要的是要知道，在浏览器加载页面后，你放入此 `function` 的代码将立即运行。
|
||||
|
||||
有一点很重要，如果没有 `document ready function`，代码将在 HTML 页面呈现之前运行，这可能会导致错误。
|
||||
|
||||
|
||||
@@ -10,7 +10,7 @@ dashedName: authentication-strategies
|
||||
|
||||
策略是认证用户的一种方式。 如果你让用户在注册时填写了用户信息，那你就可以基于这些信息进行验证。或者也可以引入第三方登录，如 Google 或者 Github。 在这个项目中，我们将使用 Passport 中间件。 Passport 提供了一套全面的策略，支持使用用户名和密码、GitHub、谷歌等进行认证。
|
||||
|
||||
`passport-local@~1.0.0` has already been added as a dependency, so add it to your server as follows: `const LocalStrategy = require('passport-local');`
|
||||
已经引入 `passport-local@~1.0.0` 作为依赖，将它添加到服务器，就像这样：`const LocalStrategy = require('passport-local');`
|
||||
|
||||
然后，需要让 passport **使用**一个实例化的 LocalStrategy 对象，这个对象的一些设置已完成。 请注意，接下来的所有代码都应写在连接数据库的回调中，因为它们的执行都依赖数据库。
|
||||
|
||||
|
||||
@@ -10,7 +10,7 @@ dashedName: authentication-with-socket-io
|
||||
|
||||
目前，你还无法确定连接到服务器的用户身份。 虽然 `req.user` 包含用户信息，但这个只在用户直接与服务器交互时产生。当用户通过 web socket 与服务器连接时，由于不存在 `req` 对象，我们就无法获取用户数据。 解决这个问题的方法之一是通过读取和解析请求中包含 passport session 的 cookie，然后反序列化，进而获取用户信息对象。 幸运的是，NPM 上有可以让这个复杂的流程简单化的库。
|
||||
|
||||
`passport.socketio@~3.7.0`, `connect-mongo@~3.2.0`, and `cookie-parser@~1.4.5` have already been added as dependencies. Require them as `passportSocketIo`, `MongoStore`, and `cookieParser` respectively. Also, we need to initialize a new memory store, from `express-session` which we previously required. It should look like this:
|
||||
`passport.socketio@~3.7.0`、`connect-mongo@~3.2.0` 和 `cookie-parser@~1.4.5` 已经被添加为依赖项。 分别请求它们为 `passportSocketIo`、`MongoStore` 和 `cookieParser`。 同时，我们需要从之前引入的 `express-session` 中初始化新的内存。 就像这样：
|
||||
|
||||
```js
|
||||
const MongoStore = require('connect-mongo')(session);
|
||||
@@ -65,7 +65,7 @@ console.log('user ' + socket.request.user.name + ' connected');
|
||||
|
||||
它将在服务器控制台记录已连接的用户！
|
||||
|
||||
完成以上要求后，请提交你的页面链接。 If you're running into errors, you can check out the project up to this point <a href="https://gist.github.com/camperbot/1414cc9433044e306dd7fd0caa1c6254" target="_blank" rel="noopener noreferrer nofollow">https://gist.github.com/camperbot/1414cc9433044e306dd7fd0caa1c6254</a>.
|
||||
完成以上要求后，请提交你的页面链接。 如果你遇到了问题，可以参考 <a href="https://gist.github.com/camperbot/1414cc9433044e306dd7fd0caa1c6254" target="_blank" rel="noopener noreferrer nofollow">https://gist.github.com/camperbot/1414cc9433044e306dd7fd0caa1c6254</a>。
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
@@ -26,7 +26,7 @@ module.exports = function (app, myDataBase) {
|
||||
|
||||
现在，我们来把 server.js 中与验证相关的代码分离到 auth.js 中，例如序列化，设置验证策略等。 请正确添加依赖，并在 server.js 中调用 `auth(app, myDataBase)`。
|
||||
|
||||
完成上述要求后，请提交你的页面链接。 If you're running into errors, you can <a href="https://gist.github.com/camperbot/2d06ac5c7d850d8cf073d2c2c794cc92" target="_blank" rel="noopener noreferrer nofollow">check out an example of the completed project</a>.
|
||||
完成上述要求后，请提交你的页面链接。 如果你在运行时遇到错误，你可以<a href="https://gist.github.com/camperbot/2d06ac5c7d850d8cf073d2c2c794cc92" target="_blank" rel="noopener noreferrer nofollow">查看已执行项目的当前进度</a>。
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
@@ -38,7 +38,7 @@ socket.on('user count', function(data) {
|
||||
|
||||
现在你可以尝试启动你的 app 并登录，你会看到在客户端的控制台打印出了 “1”，这就表示目前连接到服务器的用户数为 1。 你可以试着通过打开多个 app 来验证数量是否会增加。
|
||||
|
||||
完成上述要求后，请提交你的页面链接。 If you're running into errors, you can <a href="https://gist.github.com/camperbot/28ef7f1078f56eb48c7b1aeea35ba1f5" target="_blank" rel="noopener noreferrer nofollow">check out the project completed up to this point</a>.
|
||||
完成上述要求后，请提交你的页面链接。 如果你在运行时遇到错误，你可以<a href="https://gist.github.com/camperbot/28ef7f1078f56eb48c7b1aeea35ba1f5" target="_blank" rel="noopener noreferrer nofollow">查看已执行项目的当前进度</a>。
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
@@ -31,7 +31,7 @@ app
|
||||
});
|
||||
```
|
||||
|
||||
完成上述要求后，请提交你的页面链接。 If you're running into errors, you can <a href="https://gist.github.com/camperbot/ae49b8778cab87e93284a91343da0959" target="_blank" rel="noopener noreferrer nofollow">check out the project completed up to this point</a>.
|
||||
完成上述要求后，请提交你的页面链接。 如果你在运行时遇到错误，你可以<a href="https://gist.github.com/camperbot/ae49b8778cab87e93284a91343da0959" target="_blank" rel="noopener noreferrer nofollow">查看已执行项目的当前进度</a>。
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
@@ -22,7 +22,7 @@ socket.on('disconnect', () => {
|
||||
|
||||
**注意：**和 `'disconnect'` 类似，所有 socket 可以发送到服务器的事件，我们都应该在有 “socket” 定义的连接监听器里处理。
|
||||
|
||||
完成上述要求后，请提交你的页面链接。 If you're running into errors, you can <a href="https://gist.github.com/camperbot/ab1007b76069884fb45b215d3c4496fa" target="_blank" rel="noopener noreferrer nofollow">check out the project completed up to this point</a>.
|
||||
完成上述要求后，请提交你的页面链接。 如果你在运行时遇到错误，你可以<a href="https://gist.github.com/camperbot/ab1007b76069884fb45b215d3c4496fa" target="_blank" rel="noopener noreferrer nofollow">查看已执行项目的当前进度</a>。
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
@@ -10,7 +10,7 @@ dashedName: hashing-your-passwords
|
||||
|
||||
回过头来看信息安全，你也许记得在数据库中存储明文密码是*绝对*禁止的。 现在，我们需要引入 BCrypt 来解决这个问题。
|
||||
|
||||
`bcrypt@~5.0.0` has already been added as a dependency, so require it in your server. 你需要在两个步骤中使用哈希运算：注册和保存新账户，以及登录时检查密码是否正确。
|
||||
`bcrypt@~5.0.0` 已被添加为依赖项，在你的服务器中请求它。 你需要在两个步骤中使用哈希运算：注册和保存新账户，以及登录时检查密码是否正确。
|
||||
|
||||
目前处理注册的路由中，我们是这样把密码添加到数据库的：`password: req.body.password`。 保存哈希值的一个简单方式是在数据库逻辑中添加 `const hash = bcrypt.hashSync(req.body.password, 12);`，然后把 `req.body.password` 替换为 `password: hash`。
|
||||
|
||||
@@ -24,7 +24,7 @@ if (!bcrypt.compareSync(password, user.password)) {
|
||||
|
||||
当你需要存储密码时，这样做可以有效地提升网站的安全性。
|
||||
|
||||
完成上述要求后，请提交你的页面链接。 If you're running into errors, you can <a href="https://gist.github.com/camperbot/dc16cca09daea4d4151a9c36a1fab564" target="_blank" rel="noopener noreferrer nofollow">check out the project completed up to this point</a>.
|
||||
完成上述要求后，请提交你的页面链接。 如果你在运行时遇到错误，你可以<a href="https://gist.github.com/camperbot/dc16cca09daea4d4151a9c36a1fab564" target="_blank" rel="noopener noreferrer nofollow">查看已执行项目的当前进度</a>。
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
@@ -24,7 +24,7 @@ h2.center#welcome Welcome, #{username}!
|
||||
a(href='/logout') Logout
|
||||
```
|
||||
|
||||
完成上述要求后，请提交你的页面链接。 If you're running into errors, you can <a href="https://gist.github.com/camperbot/136b3ad611cc80b41cab6f74bb460f6a" target="_blank" rel="noopener noreferrer nofollow">check out the project completed up to this point</a>.
|
||||
完成上述要求后，请提交你的页面链接。 如果你在运行时遇到错误，你可以<a href="https://gist.github.com/camperbot/136b3ad611cc80b41cab6f74bb460f6a" target="_blank" rel="noopener noreferrer nofollow">查看已执行项目的当前进度</a>。
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
@@ -18,7 +18,7 @@ dashedName: how-to-use-passport-strategies
|
||||
|
||||
这时，由于我们还没有实现注册功能，如果你在表单里输入了用户名和密码，路由将会重定向到主页 `/`，在服务端将会打印 `'User {USERNAME} attempted to log in.'`。
|
||||
|
||||
完成上述要求后，请提交你的页面链接。 If you're running into errors, you can <a href="https://gist.github.com/camperbot/7ad011ac54612ad53188b500c5e99cb9" target="_blank" rel="noopener noreferrer nofollow">check out the project completed up to this point</a>.
|
||||
完成上述要求后，请提交你的页面链接。 如果你在运行时遇到错误，你可以<a href="https://gist.github.com/camperbot/7ad011ac54612ad53188b500c5e99cb9" target="_blank" rel="noopener noreferrer nofollow">查看已执行项目的当前进度</a>。
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user