1
00:00:00,000 --> 00:00:03,388
>> [音楽再生]

2
00:00:03,388 --> 00:00:09,196

3
00:00:09,196 --> 00:00:10,180
>> DAVID J.マラン：こんにちは。

4
00:00:10,180 --> 00:00:12,600
それではを散策してみましょう
問題セット8マッシュアップ、

5
00:00:12,600 --> 00:00:15,880
にあなたに挑戦しようとしている
Googleマップのための要素に頼る

6
00:00:15,880 --> 00:00:20,905
Googleニュースやマッシュからの要素を持つ
そのWebアプレットにそれらを一緒

7
00:00:20,905 --> 00:00:24,150
ユーザーが検索することができます
ローカルニュースのマップ

8
00:00:24,150 --> 00:00:26,780
具体的な町へ、
都市、および郵便番号。

9
00:00:26,780 --> 00:00:31,040
これを行うために、我々はするつもりだ
、いくつかのHTML、CSS、PHP、SQLを統合

10
00:00:31,040 --> 00:00:34,390
JavaScript、および技術
一般的にするためにAJAXとして知られている

11
00:00:34,390 --> 00:00:36,850
この没入型を作成する
ユーザーエクスペリエンス。

12
00:00:36,850 --> 00:00:38,920
>> 初のGoogleマップ自体にしましょう​​。

13
00:00:38,920 --> 00:00:41,220
もちろん、これは、おそらくある
使い慣れたインターフェイス。

14
00:00:41,220 --> 00:00:45,070
しかし、それはことが判明したGoogleマップ
またAPI--アプリケーションを提供しています

15
00:00:45,070 --> 00:00:48,360
これを介してinterface--プログラミング
あなたはGoogleマップの要素を取ることができます

16
00:00:48,360 --> 00:00:50,740
とにそれらを統合する
独自のアプリケーション。

17
00:00:50,740 --> 00:00:52,650
実際、この全体
プロセス、あなたが行っている

18
00:00:52,650 --> 00:00:55,140
URLのカップルを見つけるために
その特に便利

19
00:00:55,140 --> 00:00:57,820
に記載されている
問題セットの8のための仕様、

20
00:00:57,820 --> 00:01:00,980
特にこの入門
ガイドや開発者ガイド

21
00:01:00,980 --> 00:01:07,640
Google Maps APIのバージョン3のためにも
GoogleマップのJavaScript APIなど

22
00:01:07,640 --> 00:01:10,260
あるV3の参照、
読みもう少し難解な

23
00:01:10,260 --> 00:01:14,600
しかし、実際には低いレベルのすべてを持ってい
何の関数やメソッドの詳細

24
00:01:14,600 --> 00:01:18,220
そしてオブジェクトとプロパティと
イベントは、実際にAPIが付属して、

25
00:01:18,220 --> 00:01:20,720
精神が非常に似て
[聞こえない]のページへ。

26
00:01:20,720 --> 00:01:23,480
>> 今、私たちは見てみると
Googleニュースで、あなたはよ

27
00:01:23,480 --> 00:01:25,370
おそらくここで使い慣れたインターフェイスを参照してください。

28
00:01:25,370 --> 00:01:29,350
しかし、それはあなたにも検索することができますが判明
特定の地域のためのGoogleニュース

29
00:01:29,350 --> 00:01:32,000
ジオと呼ばれるHTTPパラメータ経由。

30
00:01:32,000 --> 00:01:35,100
実際、私はズームインするとき、
ここに、あなたがいることがわかります

31
00:01:35,100 --> 00:01:41,672
私はにいる
news.google.com/news/section?geo=02138。

32
00:01:41,672 --> 00:01:43,630
そして、確かに、私はズームした場合
アウト、あなたは私がいることがわかります

33
00:01:43,630 --> 00:01:47,090
の全体の束でページを見ている
ケンブリッジ、マサチューセッツ約ビュー。

34
00:01:47,090 --> 00:01:50,620
>> 一方、私は実際に変更された場合
URLは、このような郵便番号ではないと

35
00:01:50,620 --> 00:01:55,580
しかし、何か少しメシエ
ケンブリッジ、+マサチューセッツ州のように、

36
00:01:55,580 --> 00:02:00,740
プラスは、あなたがエンコード方法です
URL内の空白文字と入力してEnterキーを押し、

37
00:02:00,740 --> 00:02:02,907
あなたは、私が実際にいることがわかります
ほぼ同じニュースを参照してください。

38
00:02:02,907 --> 00:02:05,489
多分それは少し違う
実際にケンブリッジ理由

39
00:02:05,489 --> 00:02:06,910
複数の郵便番号を有している。

40
00:02:06,910 --> 00:02:09,410
今どのように私はそれを知っているとなり、
実際には、どのように何とか私でし

41
00:02:09,410 --> 00:02:12,940
タイの都市や町
ケースIにおける郵便番号へ

42
00:02:12,940 --> 00:02:15,064
ユーザーを許可したい
どちらルックアップする？

43
00:02:15,064 --> 00:02:17,480
まあ、それはそこだと判明
そこに呼ばれるウェブサイト

44
00:02:17,480 --> 00:02:20,060
geonames.orgこれは
持っているためのイニシアチブ

45
00:02:20,060 --> 00:02:23,760
すべての自由に利用可能なデータベース
地理情報の種類、

46
00:02:23,760 --> 00:02:27,040
私たちのためだけでなく、
他の国のためにも同様。

47
00:02:27,040 --> 00:02:30,430
実際に、私は、ここにこのURLに行けばいる
また、問題の集合に記載されている

48
00:02:30,430 --> 00:02:34,510
仕様、あなたがそれ3が表示されます
zipファイルの全体の束のリスト

49
00:02:34,510 --> 00:02:36,400
そのうちのいずれかがあなたによってダウンロードすることができます。

50
00:02:36,400 --> 00:02:39,900
実際には、この問題のために設定され
あなたがus.zipダウンロードするつもりだ。

51
00:02:39,900 --> 00:02:43,790
今、このファイル内で、全体で
テキスト形式のデータの束。

52
00:02:43,790 --> 00:02:47,760
ファイルは、と非常によく似ています
CSV--カンマ区切り値file--

53
00:02:47,760 --> 00:02:51,294
それが実際に使用してい
タブはフィールドを画定する。

54
00:02:51,294 --> 00:02:53,710
さて、その間、あなたが見れば
ここで私は強調したもので、

55
00:02:53,710 --> 00:02:56,459
このファイル内のフィールドをしようとしている
国コードのようなものであるためには、

56
00:02:56,459 --> 00:02:58,980
郵便番号、地名、
その後、何らかの形で

57
00:02:58,980 --> 00:03:04,230
またはその他、州や郡、
地域社会、そしてより多くの。

58
00:03:04,230 --> 00:03:06,630
実際に、私はすでにました
事前にこのファイルをダウンロードした。

59
00:03:06,630 --> 00:03:09,750
私が先に行くと、それを開いてみましょうhere--
確かに、あなたはよ、us.text--と

60
00:03:09,750 --> 00:03:16,660
私は16792行目にスクロールダウンしている場合を参照してください。
あなたは、ケンブリッジのためのいくつかのレコードが表示されます

61
00:03:16,660 --> 00:03:19,120
マサチューセッツ州とその様々な郵便番号。

62
00:03:19,120 --> 00:03:22,150
あなたも見るもの郡があり、
私は本当にないいくつかの数字

63
00:03:22,150 --> 00:03:24,500
理解するだけでなく、すべての
右の方法、

64
00:03:24,500 --> 00:03:27,170
いくつかのGPS coordinates--
緯度と経度。

65
00:03:27,170 --> 00:03:30,440
これは素晴らしいですの1理由
Google Maps APIの機能

66
00:03:30,440 --> 00:03:33,670
検出する能力がある
あなたが地理的にどこ

67
00:03:33,670 --> 00:03:36,850
GPS座標の観点。

68
00:03:36,850 --> 00:03:40,210
>> それでは、どのように把握し始めてみましょう
これらのことを一緒に結ぶ開始。

69
00:03:40,210 --> 00:03:42,900
私たちはあなたの全体を与えてくれた
流通コードの束、

70
00:03:42,900 --> 00:03:44,970
だけでなく、MySQLデータベース。

71
00:03:44,970 --> 00:03:49,100
私が引く場合、実際には、phpMyAdminは持つ
すでにインポート、あなたはすぐにするように、

72
00:03:49,100 --> 00:03:54,800
pset8.SQL、あなたはそのMySQLのテーブルが表示されます
このようになり、IDフィールド、国

73
00:03:54,800 --> 00:03:57,400
コー​​ド、郵便番号、地名など。

74
00:03:57,400 --> 00:04:00,490
それらのすべての種類
私は単純に導出列

75
00:04:00,490 --> 00:04:03,870
readme.textを読んで
指定されたことをここにファイル

76
00:04:03,870 --> 00:04:07,330
フィールドが整数であるかどうか、
またはvarcharなど。

77
00:04:07,330 --> 00:04:10,510
>> だから我々はそのテーブルのを作成しました
あなたとあなたのSQLコマンドを与えられた

78
00:04:10,510 --> 00:04:12,770
それを作成するために実行する
独自のデータベース内のテーブル、

79
00:04:12,770 --> 00:04:15,290
しかし、それにはデータがまだ実際にありません。

80
00:04:15,290 --> 00:04:19,600
むしろ、あなたがする必要があるとしている
us.zipダウンロードしたり、任意の国の郵便番号

81
00:04:19,600 --> 00:04:21,500
そこそのURLからファイル。

82
00:04:21,500 --> 00:04:24,940
そして、あなたが書く必要があるとしている
だPHPのコマンドラインスクリプト

83
00:04:24,940 --> 00:04:28,420
そのテキストを開くに行く
ファイルには、その行に対して繰り返し、

84
00:04:28,420 --> 00:04:31,180
その後のそれぞれについて
これらの行は、挿入を行う

85
00:04:31,180 --> 00:04:34,940
それは、テーブルを配置へ
あなたのMySQLデータベースで。

86
00:04:34,940 --> 00:04:37,880
このプロセスの終わりに、あなたはよそう
最終的にそのスクリプトを実行した

87
00:04:37,880 --> 00:04:39,610
一度だけ理論的には。

88
00:04:39,610 --> 00:04:41,780
現実には、おそらくよ
回の束それを実行

89
00:04:41,780 --> 00:04:45,460
さまざまなバグを修正しようとしているとき。

90
00:04:45,460 --> 00:04:48,440
>> 最終的には、必要があるとしている
何千もの本当に大きなデータベース

91
00:04:48,440 --> 00:04:50,139
と地理数千行。

92
00:04:50,139 --> 00:04:52,930
その後、そのインポートを置くつもりだ
スクリプトはさておき、それは働いてたら

93
00:04:52,930 --> 00:04:55,140
そして、あなたのデータベースがいいです
その後、正しい、と

94
00:04:55,140 --> 00:04:58,880
あなたが実際にに移動するつもりだ
マッシュそれ自体を実装する。

95
00:04:58,880 --> 00:05:01,670
マッシュアップは見に行くされている
このような少し何か。

96
00:05:01,670 --> 00:05:05,165
mashup.cs50.netで、我々
スタッフのソリューションを持っている

97
00:05:05,165 --> 00:05:06,990
それは、このような小さなものになります。

98
00:05:06,990 --> 00:05:11,070
実際、私はこの新聞をクリックした場合
ケンブリッジ、マサチューセッツ州、のアイコン

99
00:05:11,070 --> 00:05:13,300
あなたはスピニングが表示されます
簡潔にして、アイコン

100
00:05:13,300 --> 00:05:16,370
順序付きリスト、A
記事の箇条書きリスト

101
00:05:16,370 --> 00:05:18,280
ケンブリッジ、マサチューセッツ州に関連する。

102
00:05:18,280 --> 00:05:20,352
私はチャールズタウンをクリックすると、
マサチューセッツ州、

103
00:05:20,352 --> 00:05:21,685
私はその町に同じが表示されます。

104
00:05:21,685 --> 00:05:24,174
そして、私は上をクリックした場合
ウォータータウン、マサチューセッツ州、

105
00:05:24,174 --> 00:05:26,090
どんな存在しない可能性があります
ウォータータウンからのニュース、

106
00:05:26,090 --> 00:05:28,630
だから、何かが表示されます
遅いニュース日のよう。

107
00:05:28,630 --> 00:05:32,140
>> さて、一方で、左上にある
いくつかの見慣れたGoogleマップのコントロール

108
00:05:32,140 --> 00:05:34,980
ズームアウトできるようにするには、パン
上、下、左、右、

109
00:05:34,980 --> 00:05:37,360
だけでなく、私たちはそこに置か検索ボックス。

110
00:05:37,360 --> 00:05:40,910
だから私は率直に言って、検索する場合には、
私が知っている唯一の他の郵便番号、

111
00:05:40,910 --> 00:05:45,020
90210、私たちは実際に表示されます
ビバリーヒルズ、カリフォルニア州。

112
00:05:45,020 --> 00:05:48,550
クリックしたとき、それはに私をリード
カリフォルニア州と全体の束

113
00:05:48,550 --> 00:05:50,369
ビバリーヒルズについてのニュースの。

114
00:05:50,369 --> 00:05:51,910
今、そこに何が起こったのか、あまりにも、気づく。

115
00:05:51,910 --> 00:05:57,040
でも02138またはのために、私の場合、このタイムサーチ
ケンブリッジコンママサチューセッツ州または一部

116
00:05:57,040 --> 00:06:00,300
その変異体は、あなたが得る
少しオートコンプリートドロップダウン。

117
00:06:00,300 --> 00:06:03,840
さて、これはプラグインを使用しています
jQueryのと呼ばれるライブラリのために、

118
00:06:03,840 --> 00:06:05,732
とそのプラグインが先行入力と呼ばれている。

119
00:06:05,732 --> 00:06:07,440
私たちは、単に読み
ドキュメンテーション、

120
00:06:07,440 --> 00:06:13,150
.jsファイルの統合をダウンロード
あなたように分配コードに

121
00:06:13,150 --> 00:06:16,900
最終的にコードを書くことができます
自動でそのドロップダウンメニューを埋め

122
00:06:16,900 --> 00:06:19,350
選択または自動提案。

123
00:06:19,350 --> 00:06:23,820
>> 今流通コード、しかし、その
あなたはほぼ同じくらい行いません受け取った。

124
00:06:23,820 --> 00:06:26,860
あなたが埋め込まれたGoogleマップを取得し、
あなたは、一番上の左のコントロールを取得

125
00:06:26,860 --> 00:06:28,240
あなたが検索ボックスを取得する。

126
00:06:28,240 --> 00:06:32,760
しかし、私は次のように入力した場合
02138は、全く場所はまだ見つかっていません。

127
00:06:32,760 --> 00:06:34,730
だから、になるだろう
ここに私たちの目標の一つ。

128
00:06:34,730 --> 00:06:37,430
また、あなたは手順を取る場合
背中やマップ自体を見て、

129
00:06:37,430 --> 00:06:38,950
全くニュースはありません。

130
00:06:38,950 --> 00:06:41,780
私は、クリックしてもと
ドラッグ、実際に無マーカー

131
00:06:41,780 --> 00:06:45,560
そのため、ニュースに対して表示され
課題は、同様にあなたのために残されている。

132
00:06:45,560 --> 00:06:48,490
>> それでは、次に見てみましょう
流通コードで。

133
00:06:48,490 --> 00:06:51,460
あなたがダウンロードしたら
pset8.zipは、それを解凍した

134
00:06:51,460 --> 00:06:54,430
あなたのバーチャルホストディレクトリに
CS50アプライアンスで、

135
00:06:54,430 --> 00:06:56,550
あなたはこれらが表示されます
ここで内部ディレクトリ。

136
00:06:56,550 --> 00:07:00,200
一般の略Bin--
実行ファイルprograms--のバイナリ

137
00:07:00,200 --> 00:07:04,870
pset7のように、含まれる、いくつかのPHP
他のファイルが含まれるファイル、

138
00:07:04,870 --> 00:07:06,710
あるパブリック、
必要なファイル

139
00:07:06,710 --> 00:07:09,369
パブリックにアクセスすることが
ブラウザでユーザーに。

140
00:07:09,369 --> 00:07:11,410
それではで見てみましょう
binディレクトリに、私たちはよ

141
00:07:11,410 --> 00:07:13,890
ファイルがあることを参照してください。
すでにインポートそこに呼ばれる。

142
00:07:13,890 --> 00:07:17,591
我々はgeditのでこれを開くと、我々が表示されます
それは、残念ながら、多くはありません

143
00:07:17,591 --> 00:07:18,090
そこ。

144
00:07:18,090 --> 00:07:20,250
すべてのことは、しかし、があります
上部のシバンです

145
00:07:20,250 --> 00:07:23,410
これを指定する
この場合、interpreter-- PHP--

146
00:07:23,410 --> 00:07:25,759
実際に使用されるべきである
このファイルを実行します。

147
00:07:25,759 --> 00:07:27,550
しかし、それは言う場所
あなたはどこTODOです

148
00:07:27,550 --> 00:07:31,130
いくつかのコードを記述する必要があるとして
それはおそらく、設定が必要です

149
00:07:31,130 --> 00:07:35,820
含まれるディレクトリ内のファイル
私たちは、PHPファイルを前にやったように。

150
00:07:35,820 --> 00:07:38,180
そして、あなたはするつもりだ
何とか開放する必要が

151
00:07:38,180 --> 00:07:41,920
us.textいるおそらくあなた
既に解凍した。

152
00:07:41,920 --> 00:07:44,690
その後、必要があるとしている
そのファイル内の行を反復処理する、

153
00:07:44,690 --> 00:07:47,800
おそらく機能のいくつかを使用して
仕様で提案されている。

154
00:07:47,800 --> 00:07:51,390
次に、これらのそれぞれを挿入
MySQLデータベースへのライン

155
00:07:51,390 --> 00:07:54,940
クエリ関数を使用することにより、その
我々は再びwith--あなたを提供してきました

156
00:07:54,940 --> 00:07:58,010
または少なくともバリアント
そののfunctions.phpで、

157
00:07:58,010 --> 00:07:59,560
その我々だけで一瞬で表示されます。

158
00:07:59,560 --> 00:08:04,430
>> 今度は、輸入を閉じて、バックに行こう
私たちのディレクトリとこの時間に入る

159
00:08:04,430 --> 00:08:05,300
含まれています。

160
00:08:05,300 --> 00:08:09,210
私はそこにはlsをすれば、あなたはわかります
かなり問題セット7のような三つのファイル。

161
00:08:09,210 --> 00:08:13,760
そして、それでは簡単に見てみましょう、
例えば、config.phpのでは。

162
00:08:13,760 --> 00:08:16,730
そこでは、より少ない行です
以前より、それ

163
00:08:16,730 --> 00:08:20,712
このファイルが含まれているよう
constants.phpとのfunctions.php。

164
00:08:20,712 --> 00:08:23,670
私たちは、わずかに異なるを使用している
テクニックを実際に周りのこの時間

165
00:08:23,670 --> 00:08:30,910
これらのファイルが相対的であることを指定する
カレントディレクトリに_ DIR__

166
00:08:30,910 --> 00:08:35,280
どのようなディレクトリこれを表し
ファイル、config.phpには、それ自体である。

167
00:08:35,280 --> 00:08:37,600
だから、これはもっとある
指定の明示的な方法

168
00:08:37,600 --> 00:08:40,100
あなたが必要とするようにしたい他のどのファイル。

169
00:08:40,100 --> 00:08:44,020
>> 今私は、このファイルを閉じている場合
代わりにconstants.phpを開く、

170
00:08:44,020 --> 00:08:47,430
あなたは非常に連想させるファイルが表示されます
問題セット7のにも同様に、とはいえ

171
00:08:47,430 --> 00:08:50,050
pset8と呼ばれる別のデータベースを持つ。

172
00:08:50,050 --> 00:08:54,020
最後に、のfunctions.phpで、
私たちは一つの機能が表示されます

173
00:08:54,020 --> 00:08:55,942
クエリと呼ばれるこの時間。

174
00:08:55,942 --> 00:08:59,150
これは、我々が扱う除いてほぼ同じである
少し周りのエラーがこの時間を

175
00:08:59,150 --> 00:09:02,860
異なったが、それは使用法ですそれは
問題と同じでは7に設定してください。

176
00:09:02,860 --> 00:09:08,090
>> 今度は、私たちのpset8に戻りましょう
ディレクトリには、公的に入ると、そこに

177
00:09:08,090 --> 00:09:14,420
私はLSをすれば、あなたはthis--表示されます
articles.php、index.htmlを、search.php、

178
00:09:14,420 --> 00:09:16,940
と、すべてのファイルをupdate.php--。

179
00:09:16,940 --> 00:09:22,010
そして、CSSのフォント、IMG、および
かなりpset7のようなJSディレクトリ。

180
00:09:22,010 --> 00:09:24,660
>> それでは見てみましょう
あるindex.htmlを、

181
00:09:24,660 --> 00:09:27,290
本当にになるだろう
smashupへのエントリポイント。

182
00:09:27,290 --> 00:09:31,820
今のindex.htmlに、あなたは、全体が表示されます
頭の中でリンク要素の束、

183
00:09:31,820 --> 00:09:36,540
具体的には、私たち自身のためのブートストラップ用
スクリプトの全体の束に続くCSS

184
00:09:36,540 --> 00:09:41,520
地図、APIのようなもののためのタグ
自体、ラベルを持つ特別なマーカー

185
00:09:41,520 --> 00:09:44,950
我々はに記載されているユーティリティ
仕様では、あなたに利用可能である

186
00:09:44,950 --> 00:09:48,420
jQueryの自体、ブートストラップ
それ自体、別のライブラリー

187
00:09:48,420 --> 00:09:50,990
アンダースコアが呼び出さ
我々は仕様での話。

188
00:09:50,990 --> 00:09:57,031
jquery.jsのようなUnderscore.js
JavaScriptライブラリです

189
00:09:57,031 --> 00:10:00,280
それは、機能の全体の束を持って
その世界の願いで多くの人々

190
00:10:00,280 --> 00:10:02,020
JavaScriptの自体に存在していた。

191
00:10:02,020 --> 00:10:04,560
したがって、これらのすべては
実際には非常に人気がある。

192
00:10:04,560 --> 00:10:07,140
我々はまた、先行入力言及した
ライブラリがあるもの

193
00:10:07,140 --> 00:10:11,180
そのオートコンプリートドロップダウンを行い、
最終的に私たち自身のJavaScriptへのリンク。

194
00:10:11,180 --> 00:10:13,880
>> 一方、おそらく
ありがたいことに、このマッシュアップ

195
00:10:13,880 --> 00:10:17,550
比較的少ないによって駆動される
ここでは一番下のHTMLダウン。

196
00:10:17,550 --> 00:10:22,330
我々はDIVを指定したことに注目してください
クラスコンテナ流体の私たちの体。

197
00:10:22,330 --> 00:10:24,610
ブートストラップのあたり。この、
ドキュメンテーション、ちょうど

198
00:10:24,610 --> 00:10:29,840
このDIVが埋めるために起こっていることを意味します
ビューポートまたはブラウザのウィンドウに完全に。

199
00:10:29,840 --> 00:10:33,020
>> 一方、その下に、我々はdiv要素を持っている
それが開かれ、すぐに閉じただ

200
00:10:33,020 --> 00:10:34,790
マップキャンバスのユニークなIDを持つ。

201
00:10:34,790 --> 00:10:37,400
これは今のGoogleからのものである
地図ドキュメンテーション

202
00:10:37,400 --> 00:10:42,490
そのAPIのために、それによって私は単純にする必要が
注入するに空のdivを持っている、

203
00:10:42,490 --> 00:10:44,470
最終的に、実際のGoogleマップ。

204
00:10:44,470 --> 00:10:46,310
少しだけのものではなく、より多くの。

205
00:10:46,310 --> 00:10:48,850
>> 最後に、フォームがあります
ここでの内部が

206
00:10:48,850 --> 00:10:52,930
テキストボックスまでの左上に実装
検索するための我々のインタフェースで。

207
00:10:52,930 --> 00:10:54,730
我々が使用したことに注目してください
ブートストラップのビット

208
00:10:54,730 --> 00:10:57,670
ここのようなものをtoo--
フォームインラインとフォーム·グループ。

209
00:10:57,670 --> 00:11:00,080
私たちは、かつてのを与えてくれた
フォームの固有のID。

210
00:11:00,080 --> 00:11:04,510
そして、最終的に、私は実際に持っている
かなりよく知られている入力タイプ、

211
00:11:04,510 --> 00:11:06,440
Qは、そのIDです。

212
00:11:06,440 --> 00:11:07,230
ちょうど大会。

213
00:11:07,230 --> 00:11:09,234
query--が持っている可能性があるため、Q
何と呼ばれて。

214
00:11:09,234 --> 00:11:11,400
そして、プレースホルダ、
一方、都市、状態であり、

215
00:11:11,400 --> 00:11:16,200
そしてあなたが思い出すかもしれません郵便番号
デモ以前の私たちのマッシュアップで見て。

216
00:11:16,200 --> 00:11:17,980
では、このファイルを閉じてみましょう。

217
00:11:17,980 --> 00:11:24,460
>> 今ではPHPファイルを見てみましょう
待って、次にJavaScriptファイル。

218
00:11:24,460 --> 00:11:27,700
私たちのPHPファイルでは、我々はしました
既にあなたのために実装され、

219
00:11:27,700 --> 00:11:29,960
例えば、アップデート。

220
00:11:29,960 --> 00:11:35,060
私たちは巨大なを費やすことはありませんUpdate.php--
一言で言えばhere--上の時間

221
00:11:35,060 --> 00:11:38,400
その私たちのファイルがある
JavaScriptコードが起こっている

222
00:11:38,400 --> 00:11:41,610
AJAXを経由していることを連絡する
非同期技術者

223
00:11:41,610 --> 00:11:45,980
だこれらの日は、J​​avaScriptに組み込まれて
私たちはupdate.phpを尋ねることができるようにしよう

224
00:11:45,980 --> 00:11:47,410
詳細については。

225
00:11:47,410 --> 00:11:50,045
>> 具体的には、いつでも
ユーザは、地図をドラッグ

226
00:11:50,045 --> 00:11:53,310
またはジャンプ検索を実行する
別の場所にユーザ

227
00:11:53,310 --> 00:11:55,250
私たちのJavaScriptコード、
我々はすぐにわかりますように、ある

228
00:11:55,250 --> 00:11:59,610
update.phpを呼ぶことにし
そして10かそこらのマーカーを求める

229
00:11:59,610 --> 00:12:02,630
ベースのビューポート内
GPS座標に

230
00:12:02,630 --> 00:12:06,510
上部と下部の
そのマップのコーナー。

231
00:12:06,510 --> 00:12:10,520
次に、現在、そのマップを再設定することができます
ユーザは、順番に画面を移動している

232
00:12:10,520 --> 00:12:14,210
10はおそらく新見るために
別の町のマーカー。

233
00:12:14,210 --> 00:12:18,340
一方、このファイルは、最終的です
SQLクエリを実行しようとして

234
00:12:18,340 --> 00:12:21,680
私達のデータベースに対して
テーブルと呼ばれる場所にいる

235
00:12:21,680 --> 00:12:26,380
それらを返すために起こっている
10以下の場所。

236
00:12:26,380 --> 00:12:32,620
>> 一方、articles.phpで、別のある
私たちは、その全体が書かれているファイル。

237
00:12:32,620 --> 00:12:35,820
それは、精神において非常によく似ています
問題セット7の検索機能、

238
00:12:35,820 --> 00:12:39,450
これはあなたのためにヤフーファイナンスに連絡した。

239
00:12:39,450 --> 00:12:43,710
このファイルの連絡先Googleニュース
あなたのために、最終的につかむ

240
00:12:43,710 --> 00:12:46,050
機械可読な
何かにversion--

241
00:12:46,050 --> 00:12:49,720
ニュースのRSS format--と呼ばれる
ケンブリッジやビバリーヒルズのために

242
00:12:49,720 --> 00:12:52,880
または何町あなたが検索した
そのgeoparameterをもとにしています。

243
00:12:52,880 --> 00:12:57,250
私達はちょうどであることRSSを解析する
XMLと呼ばれるマークアップ言語の種類、

244
00:12:57,250 --> 00:13:00,740
実際にし、我々
お使いのブラウザにそれを返す

245
00:13:00,740 --> 00:13:03,570
とJavaScriptコードに、
具体的には、形式で呼び出さ

246
00:13:03,570 --> 00:13:06,097
JSON、JavaScriptオブジェクト表記。

247
00:13:06,097 --> 00:13:08,180
今、あなたが表示されます
specification--私たちはあなたを指す

248
00:13:08,180 --> 00:13:10,720
あなたが実際に見ることができる方法で、
JSON来るback--の一部

249
00:13:10,720 --> 00:13:15,210
最終的にはこの機能がその
そのように、これらのポップアップメニューを取り込むことができます

250
00:13:15,210 --> 00:13:16,960
あなたがクリックしたときに、その
マップ内のマーカーに

251
00:13:16,960 --> 00:13:19,430
あなたが実際に全体の束を参照してください。
弾丸の、各々の

252
00:13:19,430 --> 00:13:21,020
記事へのリンク。

253
00:13:21,020 --> 00:13:25,000
>> 今度は、最後の1を見てみましょう
幸いなことに、しない、PHPファイル

254
00:13:25,000 --> 00:13:27,970
ずっとon--行くしている
ただかなり大きなTODO。

255
00:13:27,970 --> 00:13:32,170
今のところ、このファイルには、宣言して
アレイは、場所を呼んだ。

256
00:13:32,170 --> 00:13:35,980
そして、最終的にプリント
JSONでその配列format--

257
00:13:35,980 --> 00:13:38,720
それはちょうどそのようにかなり印刷する
物事は、デバッグが容易です。

258
00:13:38,720 --> 00:13:41,480
残念ながら、中
真ん中のこのTODOがある、

259
00:13:41,480 --> 00:13:46,890
そのあなたが検索するための呼び出し
一致する場所のためのデータベースのジオHTTP

260
00:13:46,890 --> 00:13:47,490
パラメータ。

261
00:13:47,490 --> 00:13:49,865
>> そして、確かに、これがために起こっている
あなたのchallenges--の一つである

262
00:13:49,865 --> 00:13:54,240
ここでこの機能を実装するには
あなたはこのファイルを連絡したときにそのように

263
00:13:54,240 --> 00:14:00,610
検索のようなURL。 PHP？ジオ=何か、
あなたのコードでは、最終的にJSONを返す。

264
00:14:00,610 --> 00:14:05,020
あなたの中の場所のすべての配列
その入力に一致するデータベーステーブル。

265
00:14:05,020 --> 00:14:08,960
ケンブリッジでのユーザーのタイプはもしそうであれば、
ここにあなたのファイルsearch.php

266
00:14:08,960 --> 00:14:12,680
最終的にJSON配列を返す必要があります
ケンブリッジのためのマッチのすべてのために、

267
00:14:12,680 --> 00:14:16,990
マサチューセッツ州にあるかもしれないもの
それでもどこか他の可能性があります。

268
00:14:16,990 --> 00:14:21,040
>> 最後に、の2を見てみましょう
静的なファイルultimately--

269
00:14:21,040 --> 00:14:23,680
あなたのCSSファイルとJavaScriptファイル。

270
00:14:23,680 --> 00:14:26,779
私は、私たちのCSSディレクトリに移動した場合は、
ファイルの全体の束が、そこにあります

271
00:14:26,779 --> 00:14:28,070
それらのほとんどはライブラリーである。

272
00:14:28,070 --> 00:14:31,530
私は見てみるつもりだ、
具体的には、styles.cssをで、

273
00:14:31,530 --> 00:14:35,440
これだ私たち自身の世界的なCSSです
この全体のマッシュアップを型にはめるつもり。

274
00:14:35,440 --> 00:14:38,840
私が通って読むことあなたにそれを残しておきます
コメントここに、しかし、一言で言えば、

275
00:14:38,840 --> 00:14:43,490
これは私たちのことを確実にCSSです
マッシュアップ、箱から出して、デフォルトでは、

276
00:14:43,490 --> 00:14:46,950
我々はit--を望むとおりに見える
ビューポートを埋めマップ付き

277
00:14:46,950 --> 00:14:49,720
と検索で
左上にアップするボックス。

278
00:14:49,720 --> 00:14:52,870
我々はまたの自由を撮影した
その先行入力ドロップダウンをstylizing

279
00:14:52,870 --> 00:14:55,170
メニューは少しも同様。

280
00:14:55,170 --> 00:14:58,030
>> 最も重要なファイル
おそらく設定されたこの問題のために

281
00:14:58,030 --> 00:15:01,070
この最後の1、scripts.jsです。

282
00:15:01,070 --> 00:15:03,800
あなたのJSディレクトリの内側
でも、複数のファイルである。

283
00:15:03,800 --> 00:15:08,090
それらのすべては、ライブラリファイルです
この1を除いて、scripts.js。

284
00:15:08,090 --> 00:15:11,460
私たちはこれを開くと、私たちのしてみましょう
その機能はを通して最終ツアー

285
00:15:11,460 --> 00:15:13,820
このファイルに組み込まれている
あなたのためにと注意を喚起

286
00:15:13,820 --> 00:15:16,200
待ち受けているTODOのに。

287
00:15:16,200 --> 00:15:19,110
>> このファイルの先頭に、
3グローバル変数です。

288
00:15:19,110 --> 00:15:22,910
しようとしているマップ、の一つ
私たちのグーグルマップを参照してください。

289
00:15:22,910 --> 00:15:25,510
あなたはそれを考えることができます
ポインタとしての一種。

290
00:15:25,510 --> 00:15:27,710
一方、我々は持っている
別のグローバル変数

291
00:15:27,710 --> 00:15:31,500
であるように見えると呼ば情報、
呼び出しの戻り値を格納する

292
00:15:31,500 --> 00:15:34,170
新しいgoogle.maps.InfoWindowへ。

293
00:15:34,170 --> 00:15:37,835
JavaScriptはオブジェクトをサポートする
Strutsの精神において非常によく似ています。

294
00:15:37,835 --> 00:15:40,250
そして、何のためにこの行
私たちの目的は、やっている

295
00:15:40,250 --> 00:15:42,820
新しい情報を作成している
メモリ内のウィンドウとその後

296
00:15:42,820 --> 00:15:46,330
参照の周りに保つ
情報と呼ばれる変数で、これ。

297
00:15:46,330 --> 00:15:48,330
そして、それらの間で、
その間、表示されるものです。

298
00:15:48,330 --> 00:15:51,060
空のJavaScriptをすべき
配列はマーカーと呼ばれる。

299
00:15:51,060 --> 00:15:55,392
これらの新聞アイコンのすべて、またはあなた
完全に別のアイコンを選択するかもしれないが、

300
00:15:55,392 --> 00:15:57,350
格納されようとしている
最終的にこの配列の

301
00:15:57,350 --> 00:16:01,570
我々は非常に簡単に追加できるように、
マップとマップからそれらを削除。

302
00:16:01,570 --> 00:16:03,990
>> それでは、下にスクロールしてみましょう
少しと達人

303
00:16:03,990 --> 00:16:07,690
になるだろう、コードを
DOMまたはドキュメントとすぐに実行

304
00:16:07,690 --> 00:16:10,480
オブジェクトモデルまたは
ページ自体は準備ができています。

305
00:16:10,480 --> 00:16:12,942
この構文ことを思い出してください
ここで簡単に指定

306
00:16:12,942 --> 00:16:14,900
次のコードはその
のみ実行されるべき

307
00:16:14,900 --> 00:16:17,840
ブラウザが終了したとき
他のすべてをロードする。

308
00:16:17,840 --> 00:16:19,750
>> 私たちは、最初に宣言
スタイルの全体の束、

309
00:16:19,750 --> 00:16:22,410
stylizingに終わるもの
仕様に従ってマップ。

310
00:16:22,410 --> 00:16:24,790
私たちは、その後宣言する
オプションの全体の束、

311
00:16:24,790 --> 00:16:28,630
さらにグーグルをカスタマイズした
我々は埋め込むしようとしているマップ。

312
00:16:28,630 --> 00:16:32,090
次に、jQueryコードのビットを使用し、
もう少し詳細に説明されている

313
00:16:32,090 --> 00:16:35,000
スペックで、グラブへ
その要素、マップキャンバス

314
00:16:35,000 --> 00:16:36,980
私たちはそのように一意に識別すること。

315
00:16:36,980 --> 00:16:40,640
そして、この行はここにある
魔法のように私たちを与えると思われるもの

316
00:16:40,640 --> 00:16:43,560
内部のグーグルマップ
私たち自身のアプリケーション、

317
00:16:43,560 --> 00:16:47,020
これらへの参照を保存する
その変数と呼ばれるマップに。

318
00:16:47,020 --> 00:16:50,550
>> 最後に、ダウンここでは登録
リスナー何と呼ばれています。

319
00:16:50,550 --> 00:16:54,690
back--道を考えて、道
CS50で週にゼロにback--

320
00:16:54,690 --> 00:16:57,430
我々はスクラッチで見たときと
ウォークスルーのサポート

321
00:16:57,430 --> 00:16:59,935
と呼ばれるもののために通って
イベントやブロードキャスト。

322
00:16:59,935 --> 00:17:01,810
あなたが使用されていない可能性があります
それ自身が、それはだ

323
00:17:01,810 --> 00:17:03,900
メカニズムにより、
この場合、ブラウザ

324
00:17:03,900 --> 00:17:07,940
それはだとき私たちの注意を得ることができます
実際にいくつかのコードを実行する準備ができて。

325
00:17:07,940 --> 00:17:12,170
この場合には、聞くために起こっている
アイドルと呼ばれるイベント用のマップへ。

326
00:17:12,170 --> 00:17:14,930
これはブラウザがあることを意味
グーグルマップをロードが終了。

327
00:17:14,930 --> 00:17:18,380
この時点で、関数が呼び出さ
設定する必要があり、最終的に

328
00:17:18,380 --> 00:17:19,339
実行される。

329
00:17:19,339 --> 00:17:22,510
この関数は、構成し、
私たちは私たちによって書かれている、表示されます。

330
00:17:22,510 --> 00:17:24,550
>> 今、ダウンここに関数である
その、残念ながら、

331
00:17:24,550 --> 00:17:25,871
ただTODOはマーカーを追加されている。

332
00:17:25,871 --> 00:17:28,620
スペックパー。あなたが必要になるだろう
実際にコードを書くために

333
00:17:28,620 --> 00:17:32,840
それが見えるかどうかmarker--が追加されます
新聞、または親指タックのように、

334
00:17:32,840 --> 00:17:35,360
か何かは、Googleマップにelse--。

335
00:17:35,360 --> 00:17:37,720
ここでは、今その関数である
のconfigureと呼ばれる。

336
00:17:37,720 --> 00:17:40,390
私は読むことあなたにそれを残しておきます
より詳細にはこの貫通、

337
00:17:40,390 --> 00:17:42,600
我々は追加することを実現する
たくさんのリスナー

338
00:17:42,600 --> 00:17:46,620
ときに我々は、コードを実行できるように、
ユーザーは、上のクリックし、マップをドラッグする。

339
00:17:46,620 --> 00:17:50,730
我々はまた、ここでその内のコードを持っている
その先行入力プラグインを初期化する

340
00:17:50,730 --> 00:17:53,120
そのため、ドロップダウン
メニューには、実際に動作する。

341
00:17:53,120 --> 00:17:55,690
>> しかし、ちょうどに集中しましょう
ここに場所のカップル。

342
00:17:55,690 --> 00:17:57,590
具体的には、ここにすることができません。

343
00:17:57,590 --> 00:18:00,410
私がオンラインに延期するだろう
ドキュメントと仕様

344
00:18:00,410 --> 00:18:02,530
このTODOを埋める方法について。

345
00:18:02,530 --> 00:18:05,890
しかし、一言で言えば、このライブラリ
入力補完では、通過することを可能にする

346
00:18:05,890 --> 00:18:09,790
一般的にテンプレートとして知られているもので、
いくつかの変数のプレースホルダを持っている

347
00:18:09,790 --> 00:18:13,690
printfのの％に精神に非常に似ています。* S。

348
00:18:13,690 --> 00:18:16,030
しかし、この場合には、
スペックごとのテンプレート

349
00:18:16,030 --> 00:18:18,760
あなたが指定することができます
あなたが望むものの変数

350
00:18:18,760 --> 00:18:24,880
来ているデータから注入する
バックPHPのようなものから

351
00:18:24,880 --> 00:18:29,810
あなたが書いたファイル
つまり、JSON出力を放出している。

352
00:18:29,810 --> 00:18:35,170
>> 今、ダウンここで私たちがあることを理解
先行入力の選択のリスニング

353
00:18:35,170 --> 00:18:38,050
ときに、ユーザーが実際に行って
検索と値を選択する。

354
00:18:38,050 --> 00:18:40,270
これは、我々が実際にしている方法です
そのために聞くつもり

355
00:18:40,270 --> 00:18:42,250
その結果、いくつかのコードを実行する。

356
00:18:42,250 --> 00:18:45,300
その後、我々は設定していき
マッシュアップは少しだけ。

357
00:18:45,300 --> 00:18:48,000
そして、最終的に、私たちは呼んで
この機能の更新。

358
00:18:48,000 --> 00:18:49,640
これは、画面上のマーカーを更新します。

359
00:18:49,640 --> 00:18:51,529
一瞬でその上にもっと。

360
00:18:51,529 --> 00:18:53,570
一方、少数があります
ここで小さな関数。

361
00:18:53,570 --> 00:18:56,820
の一つはhideInfoある
単に情報ウィンドウを閉じます。

362
00:18:56,820 --> 00:19:00,020
ここでは別の機能、最終的に
マーカーを削除する、長すぎることはありません。

363
00:19:00,020 --> 00:19:03,580
つまり、元に戻すために起こっている何でも
あなたのアドオンのマーカー機能がない。

364
00:19:03,580 --> 00:19:04,960
そして、ダウンここに検索がある。

365
00:19:04,960 --> 00:19:08,610
我々ので、この1つは興味深いです
のJavaScriptコードを書かれている

366
00:19:08,610 --> 00:19:13,490
上search.phpに話をするつもり
サーバーといくつかの応答を取り戻す。

367
00:19:13,490 --> 00:19:16,110
>> あなたは、もちろん、まだ意志
sea​​rch.phpを実装する必要があり、

368
00:19:16,110 --> 00:19:18,310
しかし、我々は実装しました
JavaScriptのコードです

369
00:19:18,310 --> 00:19:22,480
実際に実行を処理するだろう
そのテキストボックスから検索します。

370
00:19:22,480 --> 00:19:25,340
特に、予告
ここでこの機能すること、

371
00:19:25,340 --> 00:19:29,160
検索は、search.phpを呼ぶん
と呼ばれる方法によって

372
00:19:29,160 --> 00:19:31,072
私たちは講義で見たJSONを取得。

373
00:19:31,072 --> 00:19:32,780
そして、ここ構文
少し異なっている

374
00:19:32,780 --> 00:19:37,110
講義からその中で私たちは使用している
jQueryのいわゆる約束インターフェイス。

375
00:19:37,110 --> 00:19:38,479
スペックのものの詳細。

376
00:19:38,479 --> 00:19:40,520
これは単に私たちのための手段
今、そこに目的

377
00:19:40,520 --> 00:19:43,870
二つの特別な機能があり、私たち
ドット表記で呼び出す必要が

378
00:19:43,870 --> 00:19:46,230
ここですぐにJSONを取得する呼び出した後。

379
00:19:46,230 --> 00:19:47,510
Oneが行わ呼ばれています。

380
00:19:47,510 --> 00:19:49,870
一つは失敗すると呼ばれている。

381
00:19:49,870 --> 00:19:51,790
あなたはこれらを考えることができます
成功ハンドラとして

382
00:19:51,790 --> 00:19:54,960
とエラーハンドラだけ
場合に何かがうまくいかない。

383
00:19:54,960 --> 00:19:57,760
>> それでは、最後に見てみましょう
このファイル内の関数のカップル。

384
00:19:57,760 --> 00:20:00,180
ここでダウン機能がある
と呼ばれるSHOWINFO、その

385
00:20:00,180 --> 00:20:03,090
それらのいずれかで情報を示しています
少し情報ウィンドウこと

386
00:20:03,090 --> 00:20:05,380
ユーザーがマーカーをクリックしたときにポップアップ表示されます。

387
00:20:05,380 --> 00:20:08,470
ダウンここに遠い
その更新機能

388
00:20:08,470 --> 00:20:10,510
私たちはあなたのために実装されていること。

389
00:20:10,510 --> 00:20:15,250
これは、マップの境界を決定します。

390
00:20:15,250 --> 00:20:19,360
そののGPS座標は何ですか
ここに北東と南西の角。

391
00:20:19,360 --> 00:20:22,780
我々はいくつかのHDPパラメータを用意しました
ここで、その後、最終的にそれらを渡す

392
00:20:22,780 --> 00:20:26,160
我々は済ませた、update.phpをする
またあなたのために実装されています。

393
00:20:26,160 --> 00:20:31,390
つまり、最終的にいくつかのJSONを取り戻す
update.phpをというファイルから

394
00:20:31,390 --> 00:20:34,050
その後いずれかを削除します
画面上のマーカー

395
00:20:34,050 --> 00:20:36,650
その後反復処理
戻ってくるのデータ

396
00:20:36,650 --> 00:20:40,350
update.phpを、からの
もう一度だけでJSON配列です。

397
00:20:40,350 --> 00:20:45,130
そしてそれは、最終的マーカーのが追加され
それらの場所のそれぞれ、障害対応

398
00:20:45,130 --> 00:20:47,750
または非常によく起こる可能性のあるエラー。

399
00:20:47,750 --> 00:20:51,550
>> 今だけあなたにどのようにあなたの味を与えるために
このプロジェクトのデバッグについては行くかもしれない、

400
00:20:51,550 --> 00:20:55,420
私は年にオープンしたことを実現
このURLに、ここでは、このタブを進める、

401
00:20:55,420 --> 00:21:01,320
pset8 / articles.php？ジオ= 02138。

402
00:21:01,320 --> 00:21:04,050
約今、再び、記事
私たちはあなたのための実装PHP

403
00:21:04,050 --> 00:21:06,320
これはそんなにいない
あなたは何を使用することがあります

404
00:21:06,320 --> 00:21:08,190
デバッグ、むしろ技術に関する。

405
00:21:08,190 --> 00:21:10,590
私が検索したお知らせ
ここでケンブリッジの郵便番号、

406
00:21:10,590 --> 00:21:15,260
そして私は、確かに、戻ってJSONを得ている
その内部JSONオブジェクトの配列

407
00:21:15,260 --> 00:21:17,640
2 keys--リンクとタイトルです。

408
00:21:17,640 --> 00:21:19,860
>> だから、この機能
あなたのためにすでに動作します。

409
00:21:19,860 --> 00:21:24,330
しかし、手動でのこの技術は行く
のようなもののために、このようなURLへ

410
00:21:24,330 --> 00:21:31,710
sea​​rch.php？ジオ=ケンブリッジまたは02138または
ユーザーがすべきで入力した何でも

411
00:21:31,710 --> 00:21:35,770
あなたは、あなた自身が、試してとして非常に貴重証明する
正確にどうか理由を把握する

412
00:21:35,770 --> 00:21:38,510
sea​​rch.phpは仕事やされていません。

413
00:21:38,510 --> 00:21:41,720
>> 最終的には、その後、あなたが持っている
あなたの前にいくつかのTODOの。

414
00:21:41,720 --> 00:21:44,250
あなたが最初に実装するつもりだ
そのインポートスクリプトこと

415
00:21:44,250 --> 00:21:46,520
あなたのデータベースにus.textに読み込みます。

416
00:21:46,520 --> 00:21:48,760
その後、必要になるだろう
sea​​rch.phpを実装する

417
00:21:48,760 --> 00:21:51,320
指定されたそれが正確に動作するようにします。

418
00:21:51,320 --> 00:21:54,170
その後、するつもりだ
scripts.jsに焦点を当てる

419
00:21:54,170 --> 00:21:57,520
そして最終的に実装します
TODOののそれらのカップル、

420
00:21:57,520 --> 00:21:59,950
の設定を含めた
とそのテンプレート、

421
00:21:59,950 --> 00:22:03,220
、マーカーを追加するマーカーを削除し、
その後、最後の、ではなく、少なくとも、1

422
00:22:03,220 --> 00:22:04,330
個人的なタッチ。

423
00:22:04,330 --> 00:22:07,477
>> あなたは、あなたのマッシュアップの作業を取得したら
手元に非常に私たちのような、目標

424
00:22:07,477 --> 00:22:09,560
あなたが個人的なを追加するためのものです
あなたのマッシュアップに触れ、

425
00:22:09,560 --> 00:22:11,290
それは美的または機能だかどうか。

426
00:22:11,290 --> 00:22:13,950
今までのでマッシュアップしてください
少し次のレベルへ。

427
00:22:13,950 --> 00:22:18,330
だから、限り、あなたは超えて自分自身をプッシュとして
スペック自体であなたの精通

428
00:22:18,330 --> 00:22:20,840
と一技法を拾う
新しい、それだけだ場合でも、

429
00:22:20,840 --> 00:22:25,610
変化のような美的なもの
あなたが使用しているマップのレイアウト、

430
00:22:25,610 --> 00:22:28,070
私たちが期待する範囲
満足されます。

431
00:22:28,070 --> 00:22:30,260
つまり、その後問題セット8マッシュアップです。

432
00:22:30,260 --> 00:22:33,070
でより多くのをお楽しみに
仕様と最高の幸運

433
00:22:33,070 --> 00:22:36,400
このタックル、あなたの最後の
CS50の問題がこれまでに設定してください。

434
00:22:36,400 --> 00:22:39,750
>> [音楽再生]

435
00:22:39,750 --> 00:22:43,542