[音樂播放] ROGER ZURAWICKI：嗨，我 名字是羅傑Zurawicki， 我將涵蓋 在CS50流星研討會。 流星是一個新的框架 致力於新種類的網絡的， 不是PHP發出請求 來回種類 網絡，我們在PHPP集看到， 但更多的動態JavaScript 份纖維網的。 流星的事情可以做 包括現場更新 並立即溝通 同一個網站的用戶之間。 對於本次研討會，我們有 代碼託管在GitHub上我。 你可以去這個網址並下載。 如果你知道如何使用Git的， 您可以克隆存儲庫。 如果你不知道如何使用 Git的或沒有使用GitHub上， 這是完全沒問題。 我真的會迅速告訴你 我們如何可以去GitHub上， 並有一個選項 下載一個ZIP就在那裡。 一旦你下載這個目錄，你 可以開始使用我們的代碼打。 

有關流星的更多信息 可以在meteor.com找到。 在研討會的文件夾，其實我 有一些流星的項目，我們可以使用。 一個我們在文件夾我們 研討會項目是待辦事項應用程序。 所以，如果我走了進去我， 已安裝流星。 因此，要運行它，我只需要鍵入 流星，流星和將安裝。 正如你所看到的，我們必須要 確保我們安裝流星。 所以我只是要 運行一次 確保流星 正確安裝。 

雖然我有流星 安裝，我可以告訴你 流星網站的一些現場演示 去住，現在在互聯網上。 我有我們的應用程序的演示。 您可以在以下網址訪問它。 這是做應用程序，我們 在我們的講座目錄。 該網址是 rozu-rabbit.meteor.com。 你會看到流星居然會 承載您的流星項目是免費的。 並在研討會結束時， 你就可以做到這一點。 

這是一個待辦事項應用程序。 你可以登錄，創建 帳戶，並添加任務。 您可以創建一個帳戶，像這樣。 而現在，一旦你有一個 帳戶，您可以添加任務。 例如，其中一項任務我 可能需要去拿起我的衣服。 如果你對這個 網站在線，你會 其實看到這個任務 您的計算機實時的。 

我可以告訴你一個快速演示 這種通過打開rozu兔 在相同的URL另一個選項卡。 而且我們看到，同樣的數據出現。 我們也可以在運行它 不同的瀏覽器。 說我在Safari瀏覽器中運行它。 這樣，我們沒有登錄。 因此，我們有相同的流星 應用程序，一旦它加載， 我們將看到同樣的數據 我們做的第一個。 正如你所看到的，我不記錄在這裡了。 並且當觀眾的檢查數據， 它更新的所有瀏覽器 同時。 這是真的1 很酷的功能有關流星。 幾乎沒有工作，你 有一個實時更新的應用程序 這對所有的變化 您的設備一次。 

如果我在這裡選中的複選框 在我做的名單，我們都會有， 我的其他的Chrome瀏覽器， 該項目勾掉。 而這種情況在瞬間。 行。 所以它看起來像流星 安裝已準備就緒。 所以，現在讓我們回到 待辦事項應用程序在本地運行此。 

如果你有一個流星的項目，你可以 只是用命令流星運行它。 一旦你這樣做，流星 會做一些準備工作 以確保所有的 你的代碼是在檢查。 然後它會告訴你， 項目準備送達。 您可能需要讓你的 防火牆，如果你的電腦，你的塊。 

那麼，什麼流星告訴我 現在的問題是，在這個網站 本地到我的電腦，我可以看到 這是什麼流星項目。 需要注意的是，現在，我的應用程序是 不能訪問到互聯網。 我們將討論如何把你的流星 應用到直播現場有點以後。 所以我只是要複製此 URL現在​​進入谷歌Chrome瀏覽器。 

這就是做 從這個例子列出。 你可以看到他們實施 一些更多的功能在這裡。 我們有不同的選項卡中，我們 具有相同的帳戶功能， 我們可以添加新的列表。 現在，一個真正的 關於流星很酷的功能 是，這不僅可以 在您的網頁瀏覽器中， 但你也可以創建 原生iPhone和Android 通過一個名為PhoneGap的應用程序的工具。 

因此，一些項目會 預先配置為運行 在iOS上，這樣的待辦事項應用程序。 因此，所有我需要做的iOS中運行 類型是流星，運行，然後的iOS。 當我這樣做，流星 將再次準備包。 然後，一旦它準備好，它會 加載在我的命令的iOS模擬器。 注意你只能運行iOS應用 如果你有一台Mac電腦。 你可以運行你的應用程序 Android的所有平台上。 

所以，現在你可以看到我的iPhone 模擬器來到了我的屏幕上。 並在短短的一瞬間， 它會加載的應用程序。 如果我們只是有點 小以適應屏幕上， 我們可以看到，我們有我們的iPhone應用程序。 而只是讓我們不這樣做 感到困惑，讓我們 相信大家都在同一個 網站，本地主機3000。 

所以這裡有一個例子 流星的應用程序我有， 在待辦事項應用程序，無論是運行 電話和網絡瀏覽器。 當我改變的東西 在網絡瀏覽器， 立刻去了電話。 我可以刪除手機上的東西， 和它的變化，在網絡瀏覽器。 

現在，常以創建本地 手機應用程序適用於iOS或Android， 你需要知道Java或 客觀C.技術流星用途 要允許JavaScript作為運行 您的應用程序被稱為PhoneGap的。 你有什麼本質上的應用程序 是一個網頁瀏覽器。 和流星處理所有 所涉及的棘手的部分 用於使該Web瀏覽器來 你的iPhone或Android設備。 你可以看到， 用戶界面是光滑的， 和它的外觀和感覺很 很像一個本機應用程序。 請注意，如果我去家裡 屏幕現在，我也得到一個圖標。 這並不像一個網站 你會發現在Safari瀏覽器。 這是它自己的應用程序。 您可以安裝和 刪除它，如果你願意的話​​。 

我們可以簡單地告訴你什麼碼 對於這種待辦事項應用程序看起來像。 如果你看一下在待辦事項文件夾中， 你會看到有很多的文件夾。 但過度的過程中 在研討會中，我們將 了解每個文件夾的用途。 讓我們去到終端，所以我們 可以看到文件的好一點。 

我要按下Control C停止服務器， 現在我回到了待辦事項應用程序。 我有不同的文件夾位置，如 客戶端文件夾，服務器文件夾。 這些文件夾只是意味著 一切都在客戶端文件夾 在Web瀏覽器中被執行。 在服務器文件夾中的一切 在服務器上被執行。 

我想點 的是，我們有什麼 當我們有我們的電話和運行 我們的網絡瀏覽器，這些都是客戶。 但是，什麼是在運行中 終端，這就是服務器。 我們還有其他的文件夾，如 lib中，這是庫代碼， 喜歡你的幫手 功能，您可以 使用客戶端和服務器上。 然後你有一個公共 文件夾和資源 需要獲取文件夾 您的圖像和其他CSS加載。 

如果您已經安裝了流星，我們將 繼續教程流星。 你可以去這個網址， meteor.com/install， 獲取命令行，我 表明您安裝流星。 我們將通過第一 幾個步驟，以獲得更好 感覺如何安裝流星。 

但首先，我認為這是非常重要的 我們回顧了JavaScript的一點點。 向您展示如何一些例子 我們的C知識，可以翻譯 JavaScript的，我已經 創建了幾個例子。 它們是在js目錄。 因此，如果在研討會文件夾，你 你看，有一個名為JS的文件夾。 並且在這裡，我們有幾個例子。 

讓我們打開了第一 例如，看到非常快。 我們看到的是你的標準 世界您好命令。 您會注意到在C中，你 有不少行。 而作為CS50的學生都知道， 我們需要一個主要功能， 我們必須包括標準 I / O，以調用printf庫。 

讓我們來看看如何JavaScript的比較。 我要開ex1.js. 註釋掉是什麼 C代碼會是什麼樣子， 和下方的線是所有 需要在節點中運行。 你並不需要一個main函數，你 不需要包括任何文件， 你不需要返回。 您只要致電的console.log。 這是你的printf的等價物。 

它採用相同的 爭論的printf會。 而為了運行它， 而不是運行使EX1， 你只需要調用節點ex1.js. 你寫的節點，然後 該文件，它就會被運行。 它不會編譯。 JavaScript是一種解釋型語言。 所以它並不需要是 它的運行之前編譯。 如果我想跑ex1.c中， 我要讓它首先， 然後我可以運行可執行文件 以得到相同的輸出。 

讓我們迅速覆蓋了一些 其他JavaScript概念。 讓我們來看看例子2。 在ex2.js，在ex2.c，我們可以 看到我們有一些代碼。 讓我趕快去 一個更好的文本編輯器 這將顯示這些 新的生產線會好一點。 行。 在這裡，我們有例如2.C. 在這裡，我們有不同類型的 我們要打印出來。 正如我們所知，printf的需要 不同的參數百分比 訪問不同的數據片段。 如果我們想打印 一個字符串，我們稱之為％S。 如果我們要調用一個浮動 點編號，我們叫做％F。 有沒有簡單的方法來調用 其真或假值布爾值。 但是如果你使用％D，就可以得到 0或1的虛假和真實的。 

JavaScript是我們的一個位更好。 在JavaScript中，讓我們來看看幾個 差異，我們在這個文件中。 首先，您會注意到，在C，我們必須 初始化一個類型的每個變量。 S是一個char明星。 這是一個字符串，它 不能是任何其它類型。 N是一個浮動。 B是一個布爾值。 

但在JavaScript中， 也有動態的類型。 這意味著，你不這樣做 需要告訴的JavaScript 什麼類型的變量會。 你剛才說VAR的變量名 的變量，然後將其值的。 所以無功真的可以什麼。 它可以是一個字符串。 它可以是一個浮點數。 它可以是一個字符。 它可以是一個布爾值。 和控制台日誌作品有點不同。 如果你要打印 一個數字，你叫％D。 但大多數值可以 打印字符串就好了。 

讓我們在節點運行此 看看會發生什麼。 我可以打電話節點ex2.js， 我們得到的printf 與價值觀CS50，N為 浮點數， 然後B作為布爾 轉換為字符串真。 怎麼樣，如果我們做了榜樣2.C？ 好了，我們還是有一定的 更多的煩惱與printf的。 注意，浮點 一些必須正確格式化， 和布爾不能簡單 顯示為真或假。 行。 現在，讓我們來看看例子3。 在例3中，我們展示 你將如何使用for循環。 事實上，這是非常簡單的。 一對好東西 JavaScript是它是基於C的。 這意味著，你的很多 代碼看起來非常相似 感覺大同小異。 在fo​​r循環中，唯一 已真的在這裡改變 是不是int我，我們有變種我。 我們仍然可以將它的價值 零，檢查它的不足五， 並加一 與++運算符。 我們呼籲我的console.log，而且 將打印我們許多與每一行。 讓我們快速運行它真的 看看它輸出。 我們得到每行一個新的號碼。 另一件事，我想你 用的console.log注意 是你沒有寫 反斜杠n表示新的生產線。 CONSOLE.LOG將打印 一切都在自己的路線。 這是一個不錯的功能 的JavaScript給了我們。 

現在，讓我們打開了榜樣4。 在例4，先在C， 我們要求的一些功能。 請注意，我們要聲明 功能之前，我們使用他們在主。 如果我們有主要的第一和 再加入再高，製作， 鏗鏘，或將GCC 給我們一個錯誤說 它不知道什麼是高。 它不知道什麼補充的是。 因此，在C，你必須要挑剔 為了在你打電話的功能。 

讓我們來看看你怎麼能 在JavaScript中做到這一點。 我們有不同的文件，因為有 有幾種不同的方式來做到這一點。 一種方法是非常 直接翻譯。 因為在C函數 返回類型和JavaScript 並不知道也不關心 關於什麼類型的返回， 你不寫一個類型。 相反，你只需要 寫功能， 一切是相當 很多以前一樣。 

當你有一個變量，像 加上，我們只需要編寫x和y。 我們不需要說x是一個int。 我們不需要說y是一個int。 我們返回與相同的語法。 對於高，我們與它聲明 函數而不是無效。 請注意，無論是 它是無效或不空， 它仍然是所有相同的功能。 我們根本不把 在括號什麼， 它看起來非常像C代碼。 以下，我們可以在下面調用它。 

如果我們看一下例子4b中，我們注意到 我已經改變了一些東西。 我唯一​​改變的 真的，雖然是訂單。 我們有相同的 的功能，但現在他們 他們在使用後宣布 的console.log和高上線18，19。 如果您在C中這樣做， 使會拋出一個錯誤。 在這裡，這工作得很好。 我可以展示給你 調用節點上的4B的例子。 

我們可以調用函數的另一種方式 是通過保存作為變量。 就像我說的，一個變量 可以具有任何類型。 一種類型的可變 可以有一個函數。 所以，如果你看一下例子 4C，我已經改變了 這裡是VAR增加而不是函數添加。 現在等於增加功能。 此功能在這裡是匿名的。 它沒有名字，所以它只是 功能，然後在括號中。 之後，該語法 不改變，但你 確實要記住， 你有你的變量 存儲所述函數到添加，和一個 那你存儲成高變量。 

由於添加高現在變量 而不是功能，就有點變味了。 這是我看到了一個共同的錯誤 很多人的JavaScript的， 有什麼東西要牢記。 當我運行這一點，讓我們看看會發生什麼。 我得到一個錯誤。 它說未定義在這一點上。 所以它說它 不知道什麼補充的是。 

因為現在加的是不是一個 功能中，添加是一個變量。 而你還沒有真正給 添加一個值然而，當你使用它。 這給我們帶來了例如4D，如果在那裡 要使用變量的函數， 你只需要確保他們 獲得的價值，他們正在使用之前。 

讓我們繼續以例五則。 在這裡，我們談論 在結構C.在C，結構 有這樣的固定結構，它們 因為你必須聲明它們 你使用它之前，和 你說我有一個學生， 和每一個學生都有完全相同 一個名字，一年一種性別。 它有讓所有的人。 它不能有任何其他的價值， 並且他們必須是特定類型。 

然後，我們可以初始化 結構在這個漂亮的語法 因為它知道的順序。 所以它知道羅傑是一個名字。 它知道，2016年是一個 年和M是性別 因為我們告訴它這 列表是一個結構的學生。 然後你就可以打印 它，訪問s.name。 讓我們來看看我們將如何 將其轉換為JavaScript。 請注意，s是現在 可變的，而且也沒有類型。 這只是一個變種了。 因為它並不重要，如果這件事 這個變量的類型是一個指針， 它是一個結構，或其他任何東西。 我們有一個稍微不同的語法。 這個語法是對象語法。 

你可能已經看到它在JSON。 JSON實際上代表的 JavaScript對象符號。 這是你如何定義 在JavaScript對象。 我們有一個密鑰，它是 值，如姓名。 我們給它的值 結腸的另一側。 還有一件事要記住的就是你 不需要有一個名字和一個年 和性別的對象。 一個對象可以沒有價值。 它可以有很多，只要你願意。 

我們可以在剛剛使用這些對象 同樣的方法，我們會用一個結構，s.name。 我們可以快速運行真的 這樣做節點例如5.c. 我們不能真正運行節點C文件。 它不知道什麼C是。 它只知道的JavaScript。 當我們運行ex5.js，我們得到 的價值，這是我們的預期。 

讓我們轉移到例如6。 在這裡，我只想談一點 更多一點關於JavaScript數組 因為他們是有點 比你有什麼不同 用於在C數組的記譜， 不與支架像C， 用大括號，括號內卻。 你可以有一個空數組， 喜歡改編四線。 你可以有數組 有多個值。 你訪問它們 只是在C以同樣的方式 

截至七號線，一切 似乎很簡單。 一個微小的差別就在這裡，在第10行。 途中你得到的長度 陣列僅僅是通過調用.length。 一個數組其實是可以 就像一個對象處理， 而這個對象有一個length屬性 你打電話來獲得它的長度。 注意，這是不同的 在C，因為在C中你 必須知道的長度 提前你的對象。 

有關陣列使另一個好處 是，你可以有不同的類型。 如果您在C數組，有 是一個特定的值的陣列， 無論是結構指針 或浮或[聽不清]。 在這裡，你可以有不同的價值觀。 我第一次有一個浮點數， 再一個布爾值，然後又整數。 而實際上，他們可以改變的類型了。 看16行。 陣列二是被改變 數，為整數，為字符串。 

有關陣列的另一個好處是這裡 在第19行，它們具有無限的大小。 你可以說我想要的百 元件為字符串合法的。 而這似乎並沒有使 有道理的，因為該數組只 有空間三個要素， 所以到底應該是兩個。 但是，當你做到這一點，讓我們 看到三個變成什麼陣。 我們將很快運行這個 與節點例如six.js. 我們得到這個很長 數組，會發生什麼 在我們最初的幾個要素 然後一堆空白 直到我們得到我們的字符串。 JavaScript的填寫 數組作為它的需要。 

讓我們終於進入我們的最後一個例子。 在這裡，我們有一個列表 不同的學生。 我想談一點 一些好的方面位 對在JavaScript中循環。 在C語言中，for循環是一種限制。 他們有一個固定的結構，在那裡你 有一個變量，你有一個條件， 然後你做什麼 在循環的結束。 當然還有這部作品在JavaScript中， 正如我們在前面的例子中看到的。 但我們也有更好的方法 對這樣做在JavaScript中。 這就是所謂的foreach循環。 

對不起，讓我們回到 例7這裡。 我們也可以說部分是一個列表。 所以給我的每i或 各項指標在該列表中。 然後，我們可以得到學生 通過只調用了我部分。 因此，所有的設置我的代碼 等於零，並確保我 小於長度和 每次添加一個到我，這是 照顧你，而 很好地與這個foreach循環。 

不僅foreach循環 在列表或陣列工作， 他們還工作的對象， 這也是很好的。 你可以得到的名稱 每個屬性，只需服用 字典或一個對象，像學生， 然後只是說給我的每一個關鍵。 一個關鍵是這些 性質，名稱或房子。 那麼什麼會發生在這裡的是， 我們打印出第一名稱，然後 每個學生的家。 

我可以在節點運行此 真的很快給你看。 我們得到的第一個C風格的for循環，其中 我們得到的每一個對象被打印出來。 然後，我們有JavaScript的 風格，在那裡你可以 打印出的每個關鍵 和獨立的價值。 

行。 現在，我們已經介紹了Node.js的，我覺得 我們已經準備好開始使用流星。 就像我說的，流星的表現非常出色 中寫一些現成的例子 對你，你可以探索通過 本教程或研討會文件夾。 但在這裡，我想 開始從頭越。 

讓我們創建一個簡單的做應用。 這是什麼樣的的作為鹼的 做應用程序，我剛才向您展示的。 在本教程中， 會看到有 命令流星創建到 創建一個新的流星的項目。 你需要調用這個以 運行流星的項目，因為它 將運行命令 創建流星 為您的項目文件的必要。 

如果你去到終端，我們可以 進入所謂的第一步的文件夾。 並加強人會對應 在本教程的第一步。 注意事項有文件夾，一步 1，步驟2，一路5。 而且每一個對應 在本教程中的一個步驟。 我要打開它 在這裡我的文本編輯器 所以我們可以看到一點點被創造的。 我們注意到，有 有四個主要部分。 有一個流星目錄，.meteor。 那你平時 不需要觸摸。 流星需要照顧 該文件夾，它只是 確保你的 項目將正常工作。 

我們也有三個文件，HTML文件， JavaScript文件和CSS文件。 讓我們先開始與HTML文件。 乍一看，這看起來 象正常的HTML文檔。 但是請注意，有 有一些不同之處。 之一，這是不實際 一個完整的HTML文檔。 我們缺少的HTML標籤。 這是正常的。 在流星，你不期望 創造這些HTML標籤。 這樣做了你。 你想，如果你begin-- 要創建一個網站， 你只需要啟動 用頭標籤， 定義，然後 定義body標籤。 

但是，如果你在這個通知 HTML文件中，我們有一個新的標籤。 我們有模板標籤。 這是不正常的HTML。 這是HTML的一個特殊版本 該流星向您提供。 這就是所謂的空間吧。 您可以定義模板少 模塊，有點像輔助功能， 在C或JavaScript代碼。 這個模板會 有一個叫任務的名稱。 你可以看到這裡就行 13，你可以調用這些模板。 什麼流星會做的就是 填寫這些任務給你。 

你可能會注意到的另一件事是一個 有點不同的是這每一個功能。 每次將變量 種任務，並通過它去 在fo​​reach循環我們 例如7中看到的。 這個每個人都可以拿一本字典 或列表，對象或列表， 它會只是去通過所有的 就像一個foreach循環值會。 因此，如果我們有一大堆的任務，這 將調用每個任務的模板。 

讓我們運行的流星項目 剛看到這種情況的發生。 我運行流星項目 只是流星或流星運行。 現在流星只是需要 迅速準備項目， 啟動數據庫如必要， 然後在本地發布的應用程序。 我們可以到我們的網頁瀏覽器了。 我們會看到，我們 有一個很簡單的應用程序。 所以，我們看到出現了竟是 在步驟1，步驟1的文件。 

讓我們繼續前進到第二步，只是因為 我認為它會達到同樣的目的。 我只是要改變 到步驟2的目錄 並再次運行流星，所以我們可以看到 模板，我們只是工作與。 是的，一個問題嗎？ 

觀眾：如果我們要得到許可 否認是that--什麼是它 要求是什麼？ ROGER ZURAWICKI：如果 你正在運行的流星跑， 你有權限 否認，某些文件 可能沒有合適的權限集。 所以，你必須要檢查的地方 權限關閉。 他們可以被關閉 您流星的項目， 或者也可以在離開 流星文件本身。 

聽眾：如果我下載剛才 從GitHub上，那麼我該怎麼辦 [聽不清]？ 

ROGER ZURAWICKI：如果你想 以確保您可以訪問它， 還有，你可以運行一個命令。 讓我趕緊寫出來 所以其他人可以看到它。 我要在這裡打開一個新標籤 並進入我的研討會文件夾。 CHMOD就是命令 更改權限， 你可以說r表示做 遞歸地為每個文件。 和權限，你可以嘗試0755 為確保您有充分的機會， 和其他人可以閱讀。 如果你只是運行 這個命令，它會令 確保權限是在 檢查整個目錄。 運行LS-L可以告訴你的 更詳細的權限。 這看起來OK。 

什麼是最重要的 你有三個 RWX中的所有文件 研討會目錄。 這是否解決了問題嗎？ 

觀眾：它說失踪 操作性[聽不清]。 [聽不清] ROGER ZURAWICKI：您 要確保你 有一個點在你的命令的末尾。 觀眾：[聽不清]。 ROGER ZURAWICKI：好的。 讓我們趕緊回去 本地主機，應用程序，我們有。 你會看到，我們有一個 這裡幾個任務，符合市場預期。 我們有一大堆的CSS，這 你不必擔心。 流星教程 只是給這個給你 讓你的待辦事項清單一看 位比普通的HTML更好。 我們有JavaScript文件，其中 我會更詳細一點後， 但它只是提供了這些任務。 這是任務之一。 這是任務二。 這是任務三種。 因此，這是該數據流星的獲得。 

涼爽的事情之一是流星 該變化可以自動發生。 如果我想改變 第一個任務的名稱， 所以它會說這是不是 任務之一，我保存它， 然後當我去到Web 瀏覽器，你可以刷新它， 它會自動說 這不是任務之一。 你可以做同樣的事情 在這些文件中。 做出改變，而不是做 列表中，我將是我做的名單。 

還有一件事你剛才注意到， 我甚至沒有刷新。 令人耳目一新的想法是怎麼樣 的幫你解決了與流星。 當它檢測到文件的變化， 它會加載改變你。 這適用於所有的文件，無論是 它的HTML，CSS或JavaScript。 給大家展示一下這個程序會是什麼樣 就像沒有CSS，我可以將其刪除所有。 而當它重新加載，你現在有 一個沒有好看的待辦事項清單。 讓我們把這些內容背。 ，肯定不夠， 刷新，我們的CSS又回來了。 大。 

現在，我們可以用教程繼續前進。 讓我們來談談第二步，模板。 這就是我們剛才看到 與不同的任務。 流星會向你解釋什麼 模板和如何邏輯的工作。 但是，讓我們只是看代碼 看看我們是否能有意義出來。 

在非常簡單的應用程序， 像我們在簡單 這樣做，第一步，第二步，一步 3，第四步，第五步， 我們沒有任何文件夾。 我們沒有足夠的服務器 文件夾中我提到。 我們沒有客戶端 提到該文件夾。 所以流星將運行中的所有文件。 它會在運行它既 客戶端，服務器上。 

如果你想你的JavaScript的部分 代碼只在客戶端上運行， 他們需要確保你有 if語句，有點像什麼 我們有我們的JavaScript文件在這裡。 所以流星，只有當 它的客戶端，那麼我 要定義一個模板 所謂輔助性任務。 這是什麼代碼真的 所做的就是它說有 一個叫做對象模板 該流星提供。 我們要添加一個幫手。 傭工這些任務， 這些東西就像任務。 

你會看到，如果我們回到 HTML文件，我們叫上各自的任務。 任務未在HTML中定義。 它是在JavaScript中定義的。 和流星需要知道哪些任務是 當我們進入此處的JavaScript。 任務是這樣的幫手。 幫手，你能想到的 它作為模板變量。 又是什麼任務呢？ 嗯，它返回值的列表。 因為它是一個列表， 我們可以在它調用每個。 所以這就是為什麼我們呼籲每一個任務上。 現在我們有任務。 

是什麼任務呢？ 那麼，它有這個箭頭 在此之後的花括號。 該裝置的任務是一個模板。 這不是一個幫手， 像我們剛才看到的。 這是我們定義的模板。 哪裡有我們定義它？ 我們定義它下面的就在這裡。 

所有這些模板所做的是使 列表項，並且調用文本。 現在，文本似乎是一個 幫手，但我會告訴你 這其實還是 任務的數據成員。 當你調用每一個，它進入 數據結構一點點。 像foreach循環，現在只是看起來 在我們的對象的第一個元素。 我們看到，文字 這裡定義我們的對象。 因此，流星是聰明，知道 我們談論這段文字， 不叫文字的幫手。 它只是讓這種價值 文字在這裡，它顯示為HTML， 這就是如何將數據變 從JavaScript來的HTML。 

上移動，雖然，在本實施例 我們硬編碼這些值。 流星做兩真 好東西給我們。 除了現場的刷新，我們 結果顯示，它也負責管理我們的數據庫。 如果你有使用PHP工作， 你不得不配置的phpMyAdmin。 你必須確保你的 表都在檢查。 你不得不做大量的工作，使 確保您的數據格式正確， 和PHP可以與它進行通信。 

現在，流星採用了新的範例。 這是一個更現代的方式 處理的數據庫。 這是一個名為MongoDB的技術。 就像在JavaScript中，我們看到了它 沒有關係是什麼類型的數據了。 一切都是一個變種。 這不是一個charstar。 這不是一個int。 這不是一個結構。 這只是這個變種，該變​​種。 

MongoDB的作品種方式相同。 你不必定義你的表。 你不必多說表 有一個名字，它有一個int。 它有，我不知道，一 元，這是一個小數。 這只是這些JavaScript對象， 所有這些增值經銷商，從根本上。 這是一個真正強大 辦法原型您的應用程序。 這就是為什麼流星 利用了這一優勢。 

如果我們去到第三步， 讓我們來看看發生了什麼變化。 如果我們看一下待辦事項HTML，沒有太大的。 CSS並沒有任何變化。 但小的變化，我們在看到HTML 是我們改變了任務的定義。 任務現在是一個函數。 這意味著，每 一次，我們想要得到的任務， 我們要運行這個功能。 它不返回 函數為一個值。 

流星是明智的實際運行 函數來看看我們出去。 並返回這個東西叫做任務。 我們已經在行一個定義的任務， 這是一個蒙戈集合。 蒙戈是指 數據庫流星使用， 而這個新的意思只是讓我們做 一個新的集合，稱之為任務。 在MySQL中，這將相當於 找表稱為任務。 蒙戈具有收藏，不表。 因此，這只是看起來的任務。 

現在，模板中我們 助手在模板中，所有的 我們要做的，讓所有的 任務是此功能，找到 而這個空括號。 這是更特別蒙戈語法。 有大量的 在線文檔如何 你可以高效， 真正有用的蒙戈查詢。 但是，這樣的事情是好的 足以讓剛剛找到的所有數據。 

現在，其中一個問題，你可能會看到 是，我們從來沒有真正添加數據。 所以會發生什麼，當我們 實際運行第三步？ 讓我們快速進入 步驟3和運行流星。 請注意，我有另外的流星 項目運行別的地方， 所以流星不喜歡這一點。 我只是要迅速接近 其他流星與控制C， 進入第三步， 並再次運行流星。 請注意它的開始 MongoDB的，因為MongoDB的 是每一個流星的項目的一部分。 

所以說，我的申請有錯誤。 這是一個不錯的功能流星了。 它確保您的 HTML是很好的驗證。 讓我們趕緊來看看這可能是為什麼。 看來我得小心 抄錯HTML代碼。 如果我保存它，現在，流星 自動重啟服務器， 現在的應用程序正在運行預期。 請注意，以解決這個問題，你可以運行 步驟2相同的HTML文件， 它複製到第三步。 

我們可以回到我們的本地主機。 現在我們看到，我們有我們做的名單。 偉大的，但它是空的。 我們實際上沒有任何 在我們的數據庫中蒙哥任務。 因此，讓我們來談談一個 幾個方面，我們可以做到這一點。 如果我們回到碼頭，我們 可以將其關閉並運行流星蒙戈。 

如果你熟悉 與流星是如何工作的， 這實際上給你訪問 充分的MongoDB的流星。 請注意，您必須運行 第一次流星這個工作。 所以，如果我跑這一個新的標籤，我 可以回到同一目錄中。 現在流星工作得很好。 這是一個提示。 讓我有點 更大，所以我們可以看到。 這看起來比有點不同 你可能會用於向您 並不真正需要使用蒙戈。 我的整點這裡 這樣您就可以使用JavaScript。 但是，如果你很好奇， 蒙戈API不 使用SQL，結構化查詢語言。 它使用自己的語言 看起來很像的JavaScript。 很快，我們就可以找到 經由db.tasks表。 它在告訴我 事實證明，如果我們運行發現， 一種類似於我們曾與 流星，我們可以加載所有的元素。 問題是，我們不 實際上有定義的任何任務。 所以不能讓他們。 

我們可以插入，但。 因此，我們可以運行插入 使用命令插入。 我們只是給它 一個對象，我們只是 確保格式是我們所期望的。 如果我們看第二步， 我們看到，每一個任務 為一個對象與文本 作為密鑰和任何 你做的項目是作為一個變量。 所以，我們可以做的東西在這裡。 

我們可以把它插入任務 叫我來自蒙戈。 我們按Enter鍵，它運行。 我們可以再次運行發現，我們 看到，有一個對象在這裡。 蒙戈它分配一個ID，你 並不需要擔心。 數據什麼是重要的是你是 你把，是你出的數據。 

讓我們回到我們的網站， 哎，我們的任務加載。 你可以看到， 由於流星是非常聰明的 始終刷新你，我 沒有觸及頁面。 它會自動加載。 

讓我們來運行一些代碼 雖然JavaScript的做到這一點。 像我們有節點在後面 最終執行了JavaScript的， 我們也可以運行JavaScript 直接在我們的瀏覽器。 您可以通過一個功能做到這一點 所謂的檢查元素。 如果我右鍵點擊一個 頁面的部分中， 還有一個選項 所謂的檢查元素。 如果你正在運行的 瀏覽器Safari瀏覽器一樣，你 可能需要啟用您的開發 之前，你的工具得到這個功能。 

我們關心的是控制台。 所以，我們只是去了 控制台在底部。 現在，我們可以運行任何JavaScript 這裡，如JavaScript的 文件顯示，我在js的例子。 但是，現在讓我們來看看任務。 我們可以運行我們的命令。 並希望我能做出 它有點大，所以我們都可以看到。 

如果我們運行tasks.find，你會 看，這是完全一樣的代碼 該JavaScript文件的用途 在第三步，這task.find。 我們可以運行同樣的事情， 現在我們得到了一些奇怪的東西。 我們如何真正得到的數據？ 好了，我們要運行這個 命令稱取。 

這對於調試是非常有用的。 你這裡是什麼 一個光標，而這是 一個很好的方式，有流星 優化取數據。 此光標擁有所有的功能 現場更新和刷新頁面 當事情發生了變化。 但它不會讓我們的數據。 我們可以通過獲取數據。 你看，我們有一個對象， 這就像我們曾在蒙戈， 有ID和文字，我們把英寸 

那麼，如何才能插入流星的項目？ 好了，我們只是有任務。 然後我們就可以運行 同樣的插入命令， 給一個字典或對象 具有相同的格式，文本 然後我來自控制台。 拿上面看看，因為當我 做到這一點，它顯示了在網站上 自動。 

注意，你可以把任何東西 你想在這些項目。 它不必 有一個固定的結構。 我可以有一個等於所述 排名第三和b等於假。 而這一切的作品。 我甚至可以選擇不 包括所有的文本。 這僅僅是不推薦 但因為那時流星 不知道要顯示的內容。 但是在每一種情況下，我們 獲得一個ID，這是 可以使用對象的ID。 

隨著我們繼續 第四步和第五步， 本教程將告訴你如何說 您可以通過創建UI元素 你知道的HTML 創建不同的任務。 讓我們來看看第四步真的很快。 我們會看到，我們增加 一節有關的事件。 模板可以具有 幫手，這讓我們的數據。 但它也可以稱之為事件。 而這正是東西 變得很有用，因為事件 當您點擊會發生什麼 在您的網站不同的事情。 

在這裡，我們的代碼是告訴 我們添加這個事件。 添加它，當你已經提交 一些與一流的新任務。 你在這裡是一個CSS選擇器。 因此，這只是尋找一​​個HTML 元素具有一流的新任務。 它看起來的事件，如提交。 其他活動包括： 點擊，懸停，雙擊， 類似於您在普通HTML搞定。 

現在你給它在這裡是一個函數。 你可以有你 在該功能的代碼。 這個功能是什麼最終得到 所謂當您提交這項新任務。 讓我們來看看HTML只是讓我們 明白這是什麼新的任務。 我們在這裡增加了一個表格 與一流的新任務。 並且它有一個輸入端，取文本。 而這正是我們 將增加我們的新任務。 

讓我們在運行第四步 網站上看到是什麼樣子。 我們可以退出先出 在MongoDB中，我們有 從我們以往的 例如與控制C. 讓我們把它變成 步驟4目錄。 我們將再次運行流星 啟動服務器。 不幸的是，我有流星 在另一個終端上運行。 所以我只是要 確保這一關。 讓我們離開這一點，並改變 第四部分，第四步。 好不好。 

現在我們的流星代碼運行。 你可以看到，它更新，而不 我們甚至無需刷新頁面。 現在這裡有什麼改變的是 我們沒有任何任務， 但我們有一個表格在這裡，這 文本框，增加我們的新任務。 我們可以在這裡鍵入我們的任務。 我來自HTML頁面。 當我按下Enter鍵，它得到了提交。 

我們可以看到發生了什麼的 由JavaScript代碼中定義。 這是什麼功能做的是 從形式上採取文字， 然後就被稱為tasks.insert， 像我們一樣在控制​​台中。 他們也選擇了加createdAt日期。 這是你會如何 指定當前時刻。 之後，它通過使清除的形式 確保值是空字符串。 

然後調用返回false來 確保沒有什麼事情發生。 當您從返回false 活動的形式，即停止執行。 說形式有一個動作， 就像提交到PHP頁面。 如果你還沒有回來 假的，你會返回true。 這將最終使這一請求。 假攔截它， 它停在那裡。 

所以這是關於一個小演示 流星是如何工作的，我們已經 一直跟隨本教程一段時間。 你可以請隨時 自由地繼續這樣做。 有豐富的資源， 和教程實際上只是 很不錯的關於解釋 這是怎麼回事。 我現在要告訴你，在 我們已經離開了幾分鐘， 什麼是一些 流星冷卻器的特點， 什麼是一些 更有用的包。 一個關於流星的偉大的事情 是，你有一個包系統。 您可以輕鬆地將代碼 許多成千上萬的開發者 采寫全球 到流星的項目。 這方面的一個例子是，你可能 做的教程，其中第九步 您要添加帳戶 您流星的項目。 如果我們有一個CS50 PHP 項目中，我們將有 依靠框架 或者我們自​​己的代碼，以使 確保我們安全地處理 密碼和用戶名 並存儲在數據庫 和所有的這一點。 

原來，流星有一些 包為你做的， 而做到這一點很容易。 我們所能做的就是添加了幾包。 因此，讓我們做正確的 現在在我們的控制台。 我要退出該項目， 現在進入簡單待辦事項。 現在，簡單待辦事項是 該項目你 將正在做後 與步驟11或步驟12中， 在本教程結束。 讓我們再看一下，看看 有哪些不同的特點，我們有。 我們只是要確保它的運行。 有時，它需要一段時間 刷新，但在這裡它是。 

我們有選擇隱藏 完成任務，我們可以登錄。 這是與完成 流星包。 這很棒。 現在，我們已經用戶名 和密碼請登錄。 但是，如果我們想添加 另一種登錄機制？ 比方說，我想記錄 在我的流星賬戶。 我要運行流星加，而這 是語法加包。 我可以說的帳戶，並accounts.meteor。 這將現在發現 包並加載它。 你可以看到，我沒有 找到了合適的包名。 

那麼，你如何了解包？ 那麼有一個偉大的網站，做 可用的流星人， 所謂atmospherejs.com。 Atmospherejs，一個字，點 COM，是一個偉大的庫 尋找所有的流星 包存儲庫中。 我可以搜索帳戶，然後 它會告訴我所有的東西有關， 所有包與該帳戶的名稱。 

而加載，我們可以嘗試 加入一些其他的包。 也許流星包不工作 現在，我可以添加Facebook的。 我可以添加的帳戶，然後 再次運行流星項目。 一旦開始，讓我們來看看 什麼網站上發生變化。 您可以see--我可能 要在這裡刷新。 

我有一個按鈕， 配置Facebook登錄。 在這裡，我把所有 說明流星 已經為你準備的 建立一個Facebook應用程序。 你可以使用 信息的添加您的ID。 一旦這樣做了，你就會有 Facebook登錄在你的應用程序工作。 

我只是要得到 一個應用程序ID和秘密， 只是為了顯示你如何可能會奏效。 您將需要一個Facebook帳戶 使用Facebook開發者選項。 讓我很快找到 流星密鑰所必需。 我還有一個流星的項目 我要去使用， 而我只是要帶 鑰匙從該文件。 

一旦我找到它，我就可以 這些鍵複製到我的Facebook。 因此，這裡是一個關鍵。 這是秘密。 你不應該 與人分享這些。 然後你給它您的應用程序的秘密。 這是如此的Facebook 知道你是你。 你保存配置。 

我覺得在這個過程中我 已經停止我的流星應用程序。 所以，我只是想 確保它仍然存在。 OK，讓我們確保我們的流星服務器 運行，以便該網頁正在運行。 請注意，如果我們停止流星 服務器，頁面仍然存在。 它只是不會再更新。 流星服務器是必要的 為確保該頁面是活的。 

OK，我已經提交了，現在 我可以簽署旅遊。 現在它只是一個問題 有一個Facebook的彈出 並把您的帳戶 在信息和記錄。 一旦你做到這一點，Facebook的可能 老馬你一些更安全。 所以，我們就就此打住。 問題是，當你完成 就這樣，你就會有Facebook登錄。 

流星有一堆 其他包為好。 您可以通過Google+登錄。 您可以GitHub上登錄。 您可以與Twitter登錄。 或者，如果你搜索，你會 發現很多其他的事情 像Meetup網站，LinkedIn， 和流星開發。 所以流星開發是 包我一直在尋找。 流星添加帳戶，流星開發商。 在此期間，我 也想推薦 一些其他的包為您的項目。 它可能證明是有益的 包括jQuery的包。 這使您可以使用 jQuery的在你的客戶。 你可能只是做一個路線， 流星會確保你最新的 jQuery的。 我還建議休斯頓：管理員。 

這有點像一個phpMyAdmin的 這種工具為您的MongoDB。 這使您可以編輯 您的數據很容易 而不必去到蒙戈外殼， 就像我早先在研討會上做了。 所以，現在說的運行，讓我們運行 再次流星，看看我們能做些什麼。 

您會注意到添加一些包 可能有他們提出了一些警告。 您將不必擔心 關於與休斯敦。 所以，我們現在可以有選擇 配置流星管理。 他們給你方向 如果你想設置了起來。 

我們也可以現在去/管理。 這是贊助商 由休斯頓包。 這是流星管理界面。 你只需創建一個 管理員帳戶，像這樣。 如果你刷新頁面，則可能 有一些收藏品顯示出來。 

這是一個非常有用的工具， 我強烈推薦它。 你可以看到，因為 休斯頓是給一些錯誤， 我們沒有任何收藏 顯示了現在。 你會用火箭的方式是 確保這一功能得到 叫你簡單待辦事項。 所以火箭不 知道我的任務。 

我們建立了一個蒙戈 收集所謂的任務。 讓我們進入簡單待辦事項和公正 確保在JavaScript中， 我們增加了任務，我們的產品系列。 現在，我們已經保存，它的建設 該應用程序，令人耳目一新。 讓我們來看看。 現在我們有一些任務。 我們可以添加一些新的任務。 但是，如果我們想要添加的任務， 讓我們做它的應用程序本身。 

現在，我們可以添加一些數據。 嗨，這是一個任務。 這似乎有點怪 我們沒有看到任何任務。 我們可能要檢查，如果我們有任何 這裡的錯誤，或者其他地方。 如果我們去管理，這似乎有些奇怪。 如果你拉庫 本次研討會後， 我會確保 簡單待辦事項工程與休斯敦。 不幸的是，它似乎並沒有 是在這個非常時刻的工作。 

是否有任何其他的問題嗎？ 休斯頓通常是 工具，工作得非常好。 休斯頓特別是有點 比其他的buggier， 但我推薦它時，它的工作原理。 是啊。 

聽眾：你能做些什麼 與Facebook包 一旦用戶已登錄 在他們的Facebook？ 

ROGER ZURAWICKI：一旦 用戶的登錄， 您可以撥打電話到Facebook的API。 很多擺在更加 如何Facebook的開放他們的API。 流星，請確保您 有連接。 但在那之後一切問題 學習如何使用Facebook的API。 觀眾：[聽不清]。 ROGER ZURAWICKI：好的。 非常感謝您的 這CS50研討會流星。 如果你有任何問題， 你可以給我發電子郵件 我的電子郵件地址 下面列出了研討會。 我會很高興的 回答你的問題。 我也可以在 CS50黑客馬拉松應 你需要與你的流星的項目提供幫助。 感謝您的收看。