1 00:00:00,000 --> 00:00:11,470 2 00:00:11,470 --> 00:00:12,764 >> Sprecher 1: All, gleich wieder begrüßen zu dürfen. 3 00:00:12,764 --> 00:00:14,140 Dies ist CS50. 4 00:00:14,140 --> 00:00:16,800 Und dies ist der Beginn der neunten Woche. 5 00:00:16,800 --> 00:00:19,960 Und dies ist der Beginn der Rest Ihre Zeit in CS50, in denen wir 6 00:00:19,960 --> 00:00:23,170 Übergang nun endlich auf die Bahn Aspekt des Kurses, wo es 7 00:00:23,170 --> 00:00:26,200 feststellen, dass viele der Grundlagen, die wir haben seit Wochen exportieren 8 00:00:26,200 --> 00:00:29,270 noch wieder zu besuchen, oder verfolgen, uns. 9 00:00:29,270 --> 00:00:33,440 Aber jetzt, werden Sie feststellen, dass es ein Größenordnung leichter 10 00:00:33,440 --> 00:00:36,540 bestimmte Aufgaben zu erfüllen und bestimmte Probleme zu lösen - 11 00:00:36,540 --> 00:00:41,050 so sehr, dass selbst wenn Sie dachten, bestimmtes Problem Sets waren in ihren Spaß 12 00:00:41,050 --> 00:00:44,200 eigenen Weg, ich denke, dass Sie finden dass p 7, 8 gesetzt p, und dann, 13 00:00:44,200 --> 00:00:47,990 Letztlich wird das endgültige Projekt sein Umso erfreulicher, weil man sonst 14 00:00:47,990 --> 00:00:51,830 feststellen, dass wir für selbstverständlich halten, beginnen jetzt Dinge wie Speicherverwaltung und 15 00:00:51,830 --> 00:00:54,190 Zeiger und was los ist auf unterhalb der Haube. 16 00:00:54,190 --> 00:00:57,310 Und wieder, thematische, alle während der Semester war diese Schichtung 17 00:00:57,310 --> 00:00:58,030 und Schichtung. 18 00:00:58,030 --> 00:01:00,530 Und jetzt sind wir irgendwie bis hier steht auf der 19 00:01:00,530 --> 00:01:01,930 Schultern Wochen Vergangenheit. 20 00:01:01,930 --> 00:01:05,360 >> Jetzt, vom letzten Mal erinnern, dass wir sprach darüber, wie das Internet funktioniert. 21 00:01:05,360 --> 00:01:08,120 Und das war vielleicht ein Vereinfachung, aber denken Sie daran, dass 22 00:01:08,120 --> 00:01:12,960 jeder Computer in der Welt, hat eine IP anzusprechen, aber das ist ein bisschen ein 23 00:01:12,960 --> 00:01:14,570 Vereinfachung still. 24 00:01:14,570 --> 00:01:18,180 Und diese Adressen sind eindeutig verwendet Maschinen zu identifizieren, so dass 25 00:01:18,180 --> 00:01:22,010 wenn Sie Informationen senden, oder Pakete, so zu sprechen, können sie einen Ursprung 26 00:01:22,010 --> 00:01:24,000 Adresse und eine Zieladresse. 27 00:01:24,000 --> 00:01:27,830 Und die gleiche IP-Adressen verwendet werden sowohl für gute als auch für das Böse, 28 00:01:27,830 --> 00:01:29,270 Sie verfolgen, zum Beispiel. 29 00:01:29,270 --> 00:01:32,200 In der Tat, jeder von euch mit einem Laptop Jetzt öffnen, oder ein Telefon in Ihrer 30 00:01:32,200 --> 00:01:35,070 Tasche, eine IP-Adresse auf Harvard-Netzwerk. 31 00:01:35,070 --> 00:01:39,120 Und es ist gar nicht so schwer zu korrelieren, dass, wer und wo Sie 32 00:01:39,120 --> 00:01:40,180 sind in diesen Tagen. 33 00:01:40,180 --> 00:01:42,090 Aber mehr dazu vielleicht in der Zukunft. 34 00:01:42,090 --> 00:01:46,510 >> Jetzt dachte ich, ich bring back einige Erinnerungen an [? verbessern?] und geben Sie 35 00:01:46,510 --> 00:01:49,360 ein weiterer Clip aus einer Show, die Sie Vielleicht finden Sie vertraut. 36 00:01:49,360 --> 00:01:52,710 Wenn wir könnten die Beleuchtung dimmen nur für ein paar Sekunden. 37 00:01:52,710 --> 00:01:53,960 Die Serie Numb3rs. 38 00:01:53,960 --> 00:01:57,510 39 00:01:57,510 --> 00:02:00,540 >> Sprecher 2: Es ist ein 32-Bit-IPP4 Adresse. 40 00:02:00,540 --> 00:02:01,610 >> SPEAKER 3: IPP, wie im Internet? 41 00:02:01,610 --> 00:02:02,968 >> Sprecher 2: Privates Netzwerk. 42 00:02:02,968 --> 00:02:04,960 Um Amita privaten Netzwerk. 43 00:02:04,960 --> 00:02:16,930 44 00:02:16,930 --> 00:02:19,602 Sie ist so erstaunlich. 45 00:02:19,602 --> 00:02:21,030 >> SPEAKER 3: Komm schon, Charlie. 46 00:02:21,030 --> 00:02:21,490 >> Sprecher 2: Es ist. 47 00:02:21,490 --> 00:02:22,470 Ein Spiegel IP-Adresse. 48 00:02:22,470 --> 00:02:27,680 Sie ist, dass Sie uns sehen, was sie in Echtzeit tun. 49 00:02:27,680 --> 00:02:30,930 >> Sprecher 1: OK, so ein paar Dinge, mit diesem Bild falsch. 50 00:02:30,930 --> 00:02:32,920 So ein, und dieser ist akzeptabel, das ist eigentlich 51 00:02:32,920 --> 00:02:34,400 keine gültige IP-Adresse. 52 00:02:34,400 --> 00:02:38,190 Eine gültige IP-Adresse verfügt, um Zahlen der Form w.x.y.z, wobei jede 53 00:02:38,190 --> 00:02:40,000 diese Schreiben ist von 0 bis 255. 54 00:02:40,000 --> 00:02:42,330 Aber das ist, weil genau wie die feine Filme, in denen sie gefälschte Telefonnummern 55 00:02:42,330 --> 00:02:43,520 sie fälschen IP-Adressen. 56 00:02:43,520 --> 00:02:45,230 Sie nicht wirklich realen Servern getroffen. 57 00:02:45,230 --> 00:02:46,760 >> Aber wohlgemerkt, dies ist ein Browser. 58 00:02:46,760 --> 00:02:50,760 Und Browsern nicht starten Ausgeben Computer Code wie diesen. 59 00:02:50,760 --> 00:02:54,230 Und wenn wir ein wenig tiefer blicken, bemerken dass die Sprache, die sie sehen 60 00:02:54,230 --> 00:02:57,040 Auf dem Bildschirm ist eine Sprache namens Objective-C, die die Sprache in 61 00:02:57,040 --> 00:02:59,520 dem iPhone Apps geschrieben werden, vor allem diejenigen, denen 62 00:02:59,520 --> 00:03:03,540 Buntstifte, wie man aus sehen der Quellcode hier. 63 00:03:03,540 --> 00:03:06,600 64 00:03:06,600 --> 00:03:07,560 >> OK, dachte ich, das war lustig. 65 00:03:07,560 --> 00:03:12,240 Also das Code-Snippet hat absolut nichts mit was auch immer dies zu tun 66 00:03:12,240 --> 00:03:13,940 bestimmten Folge ging. 67 00:03:13,940 --> 00:03:17,590 Also der Witz ist eine Art auf die Leute wobei für diese gewährt. 68 00:03:17,590 --> 00:03:20,220 Aber das ist nicht alles, was schwer zu bekommen diese technischen Details recht. 69 00:03:20,220 --> 00:03:21,980 Und ich möchte Sie ermutigen. 70 00:03:21,980 --> 00:03:25,530 Und tatsächlich, vielleicht 50 sehr gut verwöhnen eine Menge von TV-Shows und Filme, oder Sie 71 00:03:25,530 --> 00:03:27,320 weil du wirst feststellen, dass es nur nicht möglich, was sie sind 72 00:03:27,320 --> 00:03:28,630 dabei auf dem Bildschirm. 73 00:03:28,630 --> 00:03:31,750 Aber in der Tat ist dies der Code, den Sie könnte es in einer iPhone-Applikation sehen 74 00:03:31,750 --> 00:03:33,640 oder Mac OS-Anwendung. 75 00:03:33,640 --> 00:03:35,685 Es hat überhaupt nichts mit Sicherheit zu tun. 76 00:03:35,685 --> 00:03:38,610 So halten Sie ein Auge für mehr so viel Spaß Dinge. 77 00:03:38,610 --> 00:03:42,720 >> Aber heute haben wir damit beginnen, in wirklich tauchen tief zu einer ganzen Reihe von Sprachen. 78 00:03:42,720 --> 00:03:45,410 Ein in der Tat, eines der übergreifenden Mitnehmen dieses Teils der 79 00:03:45,410 --> 00:03:51,815 Natürlich ist nicht zu lernen, wie man programmiert in PHP, SQL, nicht per se zu lernen, nicht 80 00:03:51,815 --> 00:03:58,100 JavaScript per se zu lernen, sondern sich selbst beibringen, wie man lehren 81 00:03:58,100 --> 00:04:02,030 selbst neue Sprachen, weil, ja, beginnen wir nun die Übernahme 82 00:04:02,030 --> 00:04:06,020 Stützräder aus, so dass nach natürlich das Ende, erwarten Sie nicht eine 20 83 00:04:06,020 --> 00:04:08,890 Seite Spezifikation Ihnen sagen, wie um etwas umzusetzen. 84 00:04:08,890 --> 00:04:12,970 Sie haben genug Zutaten in Ihrer Geist und genügend Werkzeuge im Werkzeugkasten 85 00:04:12,970 --> 00:04:15,750 Kit, mit dem Bau beginnen Lösungen für Probleme von Interesse 86 00:04:15,750 --> 00:04:19,130 Sie für einige Studenten-Gruppe, für einige Forschungsprojekt, oder wirklich alles 87 00:04:19,130 --> 00:04:20,140 für Sie von Interesse. 88 00:04:20,140 --> 00:04:24,150 >> So in Richtung zu diesem Ende, daran erinnern, dass dies das Bild, das wir letztes Mal zog es. 89 00:04:24,150 --> 00:04:27,620 Und das ist zwei Computer, Client und trennen, miteinander zu reden. 90 00:04:27,620 --> 00:04:31,130 Und das Protokoll, der Sprache, so zu sprechen, dass diese beiden Computern passieren 91 00:04:31,130 --> 00:04:33,220 zu sprechen heißt HTTP. 92 00:04:33,220 --> 00:04:37,730 Und das ist nur das verwendete Protokoll von Computern, um Informationen über übertragen 93 00:04:37,730 --> 00:04:38,710 das world wide web. 94 00:04:38,710 --> 00:04:41,770 Die Bahn, ist natürlich nur ein Service das läuft auf der Oberseite des 95 00:04:41,770 --> 00:04:43,000 sogenannte Internet. 96 00:04:43,000 --> 00:04:48,660 Was ist ein weiterer Dienst auf Spitze des Internet in diesen Tagen? 97 00:04:48,660 --> 00:04:51,600 Einige andere Protokoll oder - was ist das? 98 00:04:51,600 --> 00:04:52,300 >> ZUSCHAUER: FTP. 99 00:04:52,300 --> 00:04:52,790 >> Sprecher 1: FTP. 100 00:04:52,790 --> 00:04:54,630 So File Transfer Protocol ist eine andere. 101 00:04:54,630 --> 00:04:56,050 Die meisten von euch haben wahrscheinlich nicht daran gewöhnt. 102 00:04:56,050 --> 00:04:58,830 Aber die meisten von euch haben wahrscheinlich verwendet Dinge wie GChat oder Instant 103 00:04:58,830 --> 00:05:00,970 Messaging allgemein sicherlich E-Mail. 104 00:05:00,970 --> 00:05:04,470 Und die sind auch Dienste, die auf laufen Spitze des Internet, da bei der 105 00:05:04,470 --> 00:05:08,180 Ende des Tages, das Internet selbst wirklich einfach nur Daten von Punkt A nach 106 00:05:08,180 --> 00:05:12,480 Punkt B Und es wird eine Reihe von Teilchen selbst, einer von ihnen oder zwei 107 00:05:12,480 --> 00:05:17,340 von denen die meisten allgemein als TCP / IP, Das ist zu sagen, dass ein Computer, auf 108 00:05:17,340 --> 00:05:19,960 das Internet kann tatsächlich tun, verschiedene Dinge, E-Mail, 109 00:05:19,960 --> 00:05:20,980 Web, und so weiter. 110 00:05:20,980 --> 00:05:22,220 Google hat eine Menge davon. 111 00:05:22,220 --> 00:05:26,310 Also, wie sind diese Dienste eindeutig identifiziert, haben wir gesagt, auf einem Computer 112 00:05:26,310 --> 00:05:29,080 das könnte tatsächlich tun, mehrere Dinge? 113 00:05:29,080 --> 00:05:29,860 >> Die Port-Nummer. 114 00:05:29,860 --> 00:05:34,180 Und das sind nur willkürliche menschliche Konventionen wie 80 ist Web, ist 443. 115 00:05:34,180 --> 00:05:36,580 verschlüsselte Web ist 25 email. 116 00:05:36,580 --> 00:05:38,230 Und es gibt ein Bündel anderer. 117 00:05:38,230 --> 00:05:41,860 Und diese Zahlen sind einfach in inbegriffen diese Pakete von Informationen, diese 118 00:05:41,860 --> 00:05:46,230 virtuellen Umschlag, die tatsächlich enthielt eine Anfrage oder eine Antwort. 119 00:05:46,230 --> 00:05:51,300 >> Also, wenn Sie wieder eine Antwort von der Web, in der Regel, die Sie nicht sehen, jede 120 00:05:51,300 --> 00:05:54,780 Zahlen auch immer in Bezug auf die Statuscode der Antwort. 121 00:05:54,780 --> 00:05:56,770 Sie nicht wirklich sehen, die Innenleben der 122 00:05:56,770 --> 00:05:58,090 Pakete, die wieder kommen. 123 00:05:58,090 --> 00:05:59,860 Aber in der Tat 200 OK bedeuten. 124 00:05:59,860 --> 00:06:01,530 Und das bedeutet, alles ist gut. 125 00:06:01,530 --> 00:06:02,870 Man könnte eine Menge von diesen gesehen haben. 126 00:06:02,870 --> 00:06:05,710 Welches ist wahrscheinlich die häufigste Sie haben auf dem Netz gesehen? 127 00:06:05,710 --> 00:06:05,980 >> 404. 128 00:06:05,980 --> 00:06:07,330 Es bedeutet nur, Datei nicht gefunden. 129 00:06:07,330 --> 00:06:08,270 Es bedeutet, dass jemand vermasselt. 130 00:06:08,270 --> 00:06:11,450 Sie haben durch die URL Tippfehler, oder jemand anderes tat, indem Sie ein 131 00:06:11,450 --> 00:06:15,100 ungültige URL, oder sie die gelöschte Datei und die URL ist immer noch 132 00:06:15,100 --> 00:06:16,130 von Menschen verwendet. 133 00:06:16,130 --> 00:06:19,670 So eine Reihe von Gründen erklären können warum eine Datei nicht gefunden wird. 134 00:06:19,670 --> 00:06:22,990 Und Sie werden sehen, in den kommenden Wochen, diese anderen Fehlercodes, und du wirst 135 00:06:22,990 --> 00:06:24,195 nutzen einige von ihnen. 136 00:06:24,195 --> 00:06:25,760 Das Schlimmste ist 500. 137 00:06:25,760 --> 00:06:29,820 Wenn Sie eine 500-Fehlermeldung in Code, den Sie haben geschrieben, daran zu denken als eine Art der 138 00:06:29,820 --> 00:06:33,290 Analog der seg Fehler in der Welt der Web-Programmierung. 139 00:06:33,290 --> 00:06:34,560 Es ist nicht ganz so düster. 140 00:06:34,560 --> 00:06:36,660 Aber es bedeutet nur, dass irgendwo, Sie vermasselt. 141 00:06:36,660 --> 00:06:38,260 Freuen Sie sich also auf diese. 142 00:06:38,260 --> 00:06:39,910 >> Aber lasst uns sehen, ob wir sehen diese im Kontext. 143 00:06:39,910 --> 00:06:43,460 Lassen Sie mich mit einem Browser gehen Sie hier und folgendes tun. 144 00:06:43,460 --> 00:06:45,710 Also das ist Chrome, was passiert in dem Gerät installiert werden. 145 00:06:45,710 --> 00:06:49,410 Aber die meisten in diesen Tagen jeder Browser hat einige gleichwertige Funktionalität. 146 00:06:49,410 --> 00:06:52,610 Ich werde gehen die Chrome-Menü, und gehen Sie auf Extras, und ich werde gehen 147 00:06:52,610 --> 00:06:53,990 zu Developer Tools. 148 00:06:53,990 --> 00:06:57,040 Und Sie werden sehen, dass diese kleine Platte öffnet sich im unteren Teil des Fensters. 149 00:06:57,040 --> 00:07:00,190 Eine weitere Verknüpfung, um ehrlich zu sein, dass ich Normalerweise verwende mich ist die rechte Maustaste 150 00:07:00,190 --> 00:07:04,370 oder Control-klicken Sie irgendwo auf dem Web Seite und gehen Sie einfach auf Inspect Element. 151 00:07:04,370 --> 00:07:07,440 Und das wird nicht nur öffnen dies für Sie. 152 00:07:07,440 --> 00:07:10,230 Es wird auch geöffnet, und zwar Die Elemente, der auf 153 00:07:10,230 --> 00:07:11,430 auf der linken Seite. 154 00:07:11,430 --> 00:07:12,460 >> So sind wir natürlich sehen Google. 155 00:07:12,460 --> 00:07:13,930 Sie änderten ihre logo heute. 156 00:07:13,930 --> 00:07:20,200 Aber wenn ich nach unten scrollen bis hier bemerken dass unter Elements finden Sie 157 00:07:20,200 --> 00:07:23,460 was heißt HTML, Hypertext Markup Sprache, und dies ist die Sprache, 158 00:07:23,460 --> 00:07:26,000 dass diese und alle Web-Seiten, wirklich, geschrieben in. 159 00:07:26,000 --> 00:07:28,950 Aber es ist tatsächlich formatiert uns so viel mehr lesbar 160 00:07:28,950 --> 00:07:29,970 als es normalerweise ist. 161 00:07:29,970 --> 00:07:34,810 In der Tat, wenn ich verkleinern, und ich statt nur der rechten Maustaste oder Steuerelement klicken 162 00:07:34,810 --> 00:07:39,630 Klicken Sie auf der Seite, und dann gehen Sie zu Ansicht Seite Quelle, das ist buchstäblich, was 163 00:07:39,630 --> 00:07:42,150 Google herabgesandt meinem Browser. 164 00:07:42,150 --> 00:07:46,480 >> So manche Person oder Personen, schrieb Google.com mit diesen Quellcode. 165 00:07:46,480 --> 00:07:47,790 Das meiste davon ist nicht HTML. 166 00:07:47,790 --> 00:07:49,340 Es ist eigentlich eine Sprache namens JavaScript, das 167 00:07:49,340 --> 00:07:50,880 wir am Mittwoch kommen. 168 00:07:50,880 --> 00:07:55,580 Aber was Chrome, und was jeder Browser für uns tun kann, ist eine Art zu sehen 169 00:07:55,580 --> 00:07:59,610 Vergangenheit all der Ablenkungen der verrückt Syntax und setzen Leerraum 170 00:07:59,610 --> 00:08:02,940 für uns, und auch Syntax-Highlighting, oder einfärben Dinge für uns. 171 00:08:02,940 --> 00:08:06,470 So werden Sie feststellen, dass diese sogenannten Entwickler-Tools in Browsern gebaut 172 00:08:06,470 --> 00:08:10,830 wird Ihr Leben so, so viel einfacher machen da kann man erkunden, über dieses Menü 173 00:08:10,830 --> 00:08:13,940 Schnittstelle, genau das, was die zugrunde liegende Quellcode ist für 174 00:08:13,940 --> 00:08:15,750 jede Seite im Internet. 175 00:08:15,750 --> 00:08:19,070 Und in der Tat ist dies eine der am meisten effektivsten Wege, um zu lernen, wie zu tun 176 00:08:19,070 --> 00:08:22,860 etwas Neues, zumindest, wenn die Seite ist nicht so komplex wie zu überwältigen, wird 177 00:08:22,860 --> 00:08:26,700 zu starten stochern es HTML ist, schauen an seinem sogenannten CSS, die wir kommen 178 00:08:26,700 --> 00:08:30,310 einem Bit als auch, um sich einen Verständnis dafür, wie die Programmierer 179 00:08:30,310 --> 00:08:33,480 implementiert einige besondere Funktion der Seite. 180 00:08:33,480 --> 00:08:36,530 >> Aber technisch interessant rechts nun, es wird das sein. 181 00:08:36,530 --> 00:08:39,429 Wenn ich gehe auf die Registerkarte Netzwerk Lassen Sie uns jetzt klar, dass dies. 182 00:08:39,429 --> 00:08:43,429 Ich werde den kleinen klicken Kreuz-Symbol hier, und dann 183 00:08:43,429 --> 00:08:45,630 gehen zu einer anderen Website. 184 00:08:45,630 --> 00:08:48,430 Und ich werde einfach zu tippen in Facebook.com. 185 00:08:48,430 --> 00:08:51,940 Kein HTTP, HTTPS nicht, kein WWW. 186 00:08:51,940 --> 00:08:53,850 Lasst uns sehen, was passiert eigentlich hier. 187 00:08:53,850 --> 00:08:55,030 >> Enter. 188 00:08:55,030 --> 00:08:58,480 Jetzt bemerken eine ganze Reihe von Sachen nur erschien in dieser Bodenplatte, in 189 00:08:58,480 --> 00:09:00,285 Neben der Web-Seite erscheinen in der Spitze. 190 00:09:00,285 --> 00:09:04,890 Ich werde wieder nach oben in die Registerkarte Netzwerk hier, und ich bin zu gehen 191 00:09:04,890 --> 00:09:06,080 Klicken Sie auf die erste Zeile. 192 00:09:06,080 --> 00:09:10,580 Was dieses Tool wird uns verraten ist jeder, der HTTP-Anfragen 193 00:09:10,580 --> 00:09:13,550 dass schnell ging einfach zurück und her zwischen meinem Browser 194 00:09:13,550 --> 00:09:14,930 und Facebook-Server. 195 00:09:14,930 --> 00:09:17,830 Und so jede dieser Zeilen stellt einen solchen Antrag oder 196 00:09:17,830 --> 00:09:20,970 Reaktion eines oder mehrerer diejenigen virtuellen Umschlag. 197 00:09:20,970 --> 00:09:24,080 Oder eher beiläufig, es ist wie ein Mensch wie eine Person, ein Kunde in ein 198 00:09:24,080 --> 00:09:26,710 Restaurant, um etwas bittet wieder und wieder, und wieder. 199 00:09:26,710 --> 00:09:29,400 Und der Kellner hält bringen wieder ein zu einer Zeit. 200 00:09:29,400 --> 00:09:33,850 >> So, jetzt, wenn ich vergrößern Auf dieser Bekanntmachung und dies wird der Art der Sache sein 201 00:09:33,850 --> 00:09:36,600 dass Sie zu begrüßen und ermutigt , um mit Ihrer eigenen zu spielen, weil wir 202 00:09:36,600 --> 00:09:38,150 nicht durch alles gehen im Detail. 203 00:09:38,150 --> 00:09:40,070 Aber feststellen, es ist ein wenige sub Tabs hier - 204 00:09:40,070 --> 00:09:43,700 Headers, Preview, Response Cookies und Timing. 205 00:09:43,700 --> 00:09:48,280 Ich werde einfach auf Header aussehen für jetzt, weil diese wenig 206 00:09:48,280 --> 00:09:53,600 Zutaten innerhalb der Umhüllung, die Hilfe von Daten zu und von den Plätzen zu erhalten. 207 00:09:53,600 --> 00:09:57,590 >> Also lassen Sie mich zunächst auf diese, anzeigen Quelle neben anfordern Headers. 208 00:09:57,590 --> 00:10:01,910 Es ist der Wunsch, dass mein Browser, Chrom, in diesem Fall gesendet Innenseite 209 00:10:01,910 --> 00:10:02,910 dass virtuelle Umschlag. 210 00:10:02,910 --> 00:10:04,800 Sie werden sich erinnern, letzte Woche habe ich manuell eingegeben, während 211 00:10:04,800 --> 00:10:06,380 vorgibt, ein Browser sein. 212 00:10:06,380 --> 00:10:09,980 Dann erinnerte den Server, es ist auf der Suche nach dem Host-Namen 213 00:10:09,980 --> 00:10:10,835 Facebook.com. 214 00:10:10,835 --> 00:10:13,630 Und dann ist da noch ein bisschen mehr obskure Informationen, die wir winken 215 00:10:13,630 --> 00:10:14,830 unsere Hände für jetzt. 216 00:10:14,830 --> 00:10:18,640 >> Aber wenn ich beginnen, blättern Sie nach unten jetzt in Dieses Fenster, lassen Sie mich das bekommen 217 00:10:18,640 --> 00:10:19,980 Response-Header. 218 00:10:19,980 --> 00:10:23,270 Das war, was in der virtuellen Umschlag, der zurück kam 219 00:10:23,270 --> 00:10:24,095 Facebook.com. 220 00:10:24,095 --> 00:10:27,390 Und wenn ich auf Quelle nur anzeigen um den reinen Text von ihm zu sehen, 221 00:10:27,390 --> 00:10:28,400 ein paar Dinge beachten. 222 00:10:28,400 --> 00:10:32,130 One, Facebook spricht auch die gleiche Protokoll, Version 1.1 davon. 223 00:10:32,130 --> 00:10:33,390 Also das ist schön. 224 00:10:33,390 --> 00:10:36,820 Aber Status-Code 301, dauerhaft verlegt. 225 00:10:36,820 --> 00:10:38,880 >> Nun, wo der Mist Facebook gehen? 226 00:10:38,880 --> 00:10:40,430 Was hat das versucht uns zu vermitteln? 227 00:10:40,430 --> 00:10:44,310 Nun, bemerken hier unten gibt es einen anderen Header namens Location. 228 00:10:44,310 --> 00:10:51,050 Also, warum ist Facebook erzählte mir, dass sie bewegt dauerhaft zu dieser URL 229 00:10:51,050 --> 00:10:53,580 neben Location? 230 00:10:53,580 --> 00:10:54,962 Ich habe das www. 231 00:10:54,962 --> 00:10:56,250 >> So das war meine Wahl. 232 00:10:56,250 --> 00:11:00,450 In der Tat, die meisten von uns nur selten, wahrscheinlich, Geben www.whatever.com in diesen Tagen. 233 00:11:00,450 --> 00:11:03,390 Aber es stellt sich heraus, einen Systemadministrator, wie Facebooks können 234 00:11:03,390 --> 00:11:06,800 Konfigurieren der Server so dass entweder Facebook.com arbeitet, oder 235 00:11:06,800 --> 00:11:12,450 www.Facebook.com funktioniert, oder wirklich, solche Präfix vor ihrer 236 00:11:12,450 --> 00:11:13,210 Domain-Namen. 237 00:11:13,210 --> 00:11:14,500 Also haben sie das für uns getan. 238 00:11:14,500 --> 00:11:16,910 Und sie werden umgeleitet uns, wahrscheinlich für einige technische, 239 00:11:16,910 --> 00:11:18,100 einige Marketing-Gründen. 240 00:11:18,100 --> 00:11:21,570 Sie wollen nur canonicalize auf www.Facebook.com. 241 00:11:21,570 --> 00:11:24,040 >> Aber das ist es nicht ganz. 242 00:11:24,040 --> 00:11:28,560 Wenn ich hier unten scrollen, lasst sehen, was passiert. 243 00:11:28,560 --> 00:11:30,810 Das sagt mir, wir bewegt dauerhaft 244 00:11:30,810 --> 00:11:33,450 http://www.Facebook.com. 245 00:11:33,450 --> 00:11:36,620 Lassen Sie uns also bei der zweiten Anfrage aussehen dass mein Browser sendet. 246 00:11:36,620 --> 00:11:40,070 Leider sieht es so aus Facebook wieder, weil der zweite bewegt 247 00:11:40,070 --> 00:11:44,420 Anfrage, indem Sie diese URL statt, sagt, dass auch bewegt 248 00:11:44,420 --> 00:11:45,010 dauerhaft. 249 00:11:45,010 --> 00:11:48,140 Und lassen Sie mich hier unten scrollen auf die Response-Header. 250 00:11:48,140 --> 00:11:51,530 Wo hat Facebook jetzt weg? 251 00:11:51,530 --> 00:11:52,680 >> So HTTPS. 252 00:11:52,680 --> 00:11:56,130 So, jetzt Facebook hat damit begonnen, insbesondere im Lichte der aktuellen 253 00:11:56,130 --> 00:11:59,750 Ereignisse in den letzten Monaten, vor allem und auch in den letzten paar Jahren 254 00:11:59,750 --> 00:12:03,670 um alle ihre Benutzer zu zwingen, in einem guten Weise, HTTPS zu verwenden, das ist mehr 255 00:12:03,670 --> 00:12:06,210 zu sichern, wenn auch nicht ganz sicher. 256 00:12:06,210 --> 00:12:10,000 Und nun meine Seite, mein Browser gehen, um diese dritte URL anzufordern. 257 00:12:10,000 --> 00:12:14,710 Und jetzt, endlich, so erhalten wir die sonst unsichtbaren 200 OK. 258 00:12:14,710 --> 00:12:18,830 >> So was in der Welt oder alle diese anderen Zeilen hier unten. 259 00:12:18,830 --> 00:12:22,630 Ich habe buchstäblich eine Sache eingegeben, und mein Browser scheint wie angefordert haben 260 00:12:22,630 --> 00:12:23,840 20 einige merkwürdige Dinge. 261 00:12:23,840 --> 00:12:24,640 Was ist das? 262 00:12:24,640 --> 00:12:25,810 >> ZUSCHAUER: Scripts? 263 00:12:25,810 --> 00:12:28,460 >> Sprecher 1: Skripte, so dass andere Dateien geschrieben in einer Sprache namens 264 00:12:28,460 --> 00:12:30,780 JavaScript, die, wieder, wir sehen ein bisschen am Mittwoch. 265 00:12:30,780 --> 00:12:32,760 Was sonst noch? 266 00:12:32,760 --> 00:12:33,390 Style Sheets. 267 00:12:33,390 --> 00:12:36,350 So etwas in einer Sprache namens CSS, die wir ein bisschen sehen kannst. 268 00:12:36,350 --> 00:12:40,690 GIF, JPEG und PNG-Dateien und Bilder, und Filmdateien - was eine Web-Seite 269 00:12:40,690 --> 00:12:43,280 hat am wahrscheinlichsten in die Form einer Datei. 270 00:12:43,280 --> 00:12:46,750 Und so, was wir auf der linken Seite zu sehen Seite gibt es alle Dateien 271 00:12:46,750 --> 00:12:50,280 dass Chrome hatte herunterzuladen, rekursiv, wenn man so will, um 272 00:12:50,280 --> 00:12:52,430 komponieren die Gesamtheit der Seite. 273 00:12:52,430 --> 00:12:56,210 >> Also, was wir sahen, vor einem Augenblick mit Google, wenn ich auf die Elemente klicken 274 00:12:56,210 --> 00:13:00,470 Registerkarte, dieses, sicher ist das HTML, das Sprache, die diese Seite komponiert. 275 00:13:00,470 --> 00:13:01,890 Aber es gibt Trauben von anderen Dingen. 276 00:13:01,890 --> 00:13:02,640 Es gibt ein Logo. 277 00:13:02,640 --> 00:13:04,680 Es gibt diejenigen, blau-ish Symbole drüben. 278 00:13:04,680 --> 00:13:07,610 Und es gibt noch andere Elemente auf die Seite, die sich möglicherweise 279 00:13:07,610 --> 00:13:08,610 separate Dateien. 280 00:13:08,610 --> 00:13:11,860 >> Also, was ist schön, über ein Browser ist, dass sieht es bei der Sprache werden wir 281 00:13:11,860 --> 00:13:14,690 mit dem Schreiben beginnen, oder haben Sie schon begonnen schriftlich in P Satz 7, Zahlen 282 00:13:14,690 --> 00:13:17,970 heraus, wo diese Dateien zu leben, und geht und packt sie als gut. 283 00:13:17,970 --> 00:13:21,010 Und ich kann nicht genug betonen, auch obwohl einige dieser aussehen könnte ein bisschen 284 00:13:21,010 --> 00:13:24,820 Arkan oder überwältigend auf den ersten Blick Lernen, wie man programmieren 285 00:13:24,820 --> 00:13:28,500 Anwendungen für das Web, ist es von unschätzbarem Wert zu verstehen, wie diese 286 00:13:28,500 --> 00:13:29,410 kleinen Werkzeugen zu arbeiten. 287 00:13:29,410 --> 00:13:33,830 Das sind ein bisschen wie GDB wie Werkzeuge, aber viel einfacher, letztlich zu bedienen - 288 00:13:33,830 --> 00:13:37,690 und gibt Sie wirklich, was in den Augen haben wir für selbstverständlich genommen für 289 00:13:37,690 --> 00:13:39,170 geraumer Zeit. 290 00:13:39,170 --> 00:13:42,270 >> Also, was können wir jetzt tun mit diese Informationen? 291 00:13:42,270 --> 00:13:44,875 Nun, lasst uns tatsächlich einen Blick auf die zugrunde liegenden Konzepte HTML. 292 00:13:44,875 --> 00:13:49,025 Und wir verschieben, da wir bereits haben, um Abschnitte in dieser Woche, um das Problem 293 00:13:49,025 --> 00:13:53,260 Satz 7 Spezifikation, um einige der mehr Angaben dieser Sprachen. 294 00:13:53,260 --> 00:13:57,020 Aber lasst uns sehen, ob wir nicht malen kann ein Bild von dem, was Sie verstehen sollten, 295 00:13:57,020 --> 00:13:57,940 insgesamt hier. 296 00:13:57,940 --> 00:14:02,280 >> So HTML, Hypertext Markup Language, ist keine Programmiersprache. 297 00:14:02,280 --> 00:14:03,520 Was bedeutet das eigentlich? 298 00:14:03,520 --> 00:14:05,690 So HTML sieht wie folgt aus. 299 00:14:05,690 --> 00:14:06,810 Und einige von euch bereits wissen. 300 00:14:06,810 --> 00:14:08,130 Einige von euch getan haben diese für einige Zeit. 301 00:14:08,130 --> 00:14:10,270 Aber lasst uns sehen, ob wir nicht füllen können in einigen Rohlingen als gut. 302 00:14:10,270 --> 00:14:11,760 So bemerkt ein paar Dinge hier. 303 00:14:11,760 --> 00:14:13,030 One, es ist nur Text. 304 00:14:13,030 --> 00:14:15,960 Also, es ist wie in Quellcode C oder eine andere Sprache. 305 00:14:15,960 --> 00:14:17,750 >> Beachten Sie, dass es scheint, um hier ein Muster sein. 306 00:14:17,750 --> 00:14:20,870 Es gibt Einzug, aber technisch die Vertiefung ist nur ein Mensch 307 00:14:20,870 --> 00:14:21,205 Konvention. 308 00:14:21,205 --> 00:14:24,980 Ein Browser ist es egal, ob es neue Linien und Registerkarten wie wir sehen es. 309 00:14:24,980 --> 00:14:27,410 Aber beachten Sie, dass es Symmetrien hier. 310 00:14:27,410 --> 00:14:31,180 Es ist, was ich rufe, an der Spitze der Diese Datei, die offen-Tag oder der Beginn 311 00:14:31,180 --> 00:14:33,030 tag, als HTML. 312 00:14:33,030 --> 00:14:36,800 Und dann, unten, perfekt ausgekleidet up, ähnlich wie wir mit geschweiften Klammern, 313 00:14:36,800 --> 00:14:40,910 wir sehen, Klammer, vorwärts Schrägstrich, HTML, Klammer zu. 314 00:14:40,910 --> 00:14:44,610 Also das ist die entsprechende Nähe tag oder End-Tag, für diese Sache. 315 00:14:44,610 --> 00:14:47,990 >> Gemeinsam alles innerhalb der sogenannte offene tag und in der Nähe tag 316 00:14:47,990 --> 00:14:50,440 komponieren, was wir ein Element nennen. 317 00:14:50,440 --> 00:14:53,910 Und wir werden sehen, in einem Moment, es ist mag ein Knoten in einem Bäumen. 318 00:14:53,910 --> 00:14:57,470 Denn wenn Sie darüber nachdenken, jetzt die Einbuchtung, die hier die stillschweigende, Sie 319 00:14:57,470 --> 00:15:00,780 Art haben, wie, ein Großelternteil Knoten namens HTML. 320 00:15:00,780 --> 00:15:06,870 Wie viele Kinder könnte man sagen, basierend auf diesem Bild hat das HTML-Element? 321 00:15:06,870 --> 00:15:07,720 >> Also wahrscheinlich zwei. 322 00:15:07,720 --> 00:15:10,240 Ein Element ist der Kopf, anscheinend. 323 00:15:10,240 --> 00:15:11,710 Und eines ist das body-Element. 324 00:15:11,710 --> 00:15:12,555 Und warum zwei Kinder? 325 00:15:12,555 --> 00:15:15,840 Nun, ich bin nur irgendwie folgern, dass, wenn Ich habe einen offenen Kopf tag und dann ein 326 00:15:15,840 --> 00:15:17,820 close head-Tag, das ist ein Element. 327 00:15:17,820 --> 00:15:21,200 Und dann, wenn es eine weitere offene Stelle tag und ein enger body-Tag, das ist wie 328 00:15:21,200 --> 00:15:22,340 ein weiteres Element. 329 00:15:22,340 --> 00:15:26,000 Also in dem Sinne, dass, wenn ich irgendwie drehen das Bild auf seiner Seite, es ist 330 00:15:26,000 --> 00:15:29,910 wie mit einem HTML-Tag, und dann ein head-Tag, und dann ein Body-Tag, und 331 00:15:29,910 --> 00:15:34,290 dann einige Text, hallo Welt, baumelt Ausschalten des Body-Tag selber. 332 00:15:34,290 --> 00:15:36,620 >> So können wir ein Bild zu zeichnen, dass könnte wie folgt aussehen. 333 00:15:36,620 --> 00:15:38,020 Die Formen sind beliebig. 334 00:15:38,020 --> 00:15:40,870 Aber beachten Sie, dass ich eine Art verwendet Ellipse an der Spitze zur Vertretung 335 00:15:40,870 --> 00:15:41,860 dokumentieren sich. 336 00:15:41,860 --> 00:15:45,980 Es stellt sich heraus, es gibt andere Sachen sein können innerhalb einer Web-Seite, die ich nicht 337 00:15:45,980 --> 00:15:46,940 hier gezeichnet. 338 00:15:46,940 --> 00:15:50,800 So werden wir sogar hängen Sie den HTML Knoten aus einer so genannten Dokument Knoten. 339 00:15:50,800 --> 00:15:53,730 Und dann haben wir den Kopf und Körper und Titel, Bekanntmachung, 340 00:15:53,730 --> 00:15:55,360 die weiter verschachtelt. 341 00:15:55,360 --> 00:15:58,650 Ich habe nicht die Mühe, setzen zusätzliche Zeile Pausen innerhalb der Titel-Tag. 342 00:15:58,650 --> 00:16:02,710 Es fühlte sich einfach, wie es immer war ein wenig zu ausführlich. 343 00:16:02,710 --> 00:16:07,000 Also ließ ich es in einer Zeile gibt, mit Open-Titel, hallo Welt, in der Nähe Titel. 344 00:16:07,000 --> 00:16:09,380 Und dann haben wir einen Text baumelten von hier. 345 00:16:09,380 --> 00:16:12,200 >> Also das Bild wird wieder zum uns, wenn wir in JavaScript zu tauchen. 346 00:16:12,200 --> 00:16:15,110 Und Verständnis, dass, wenn Sie HTML schreiben wie diese, was 347 00:16:15,110 --> 00:16:16,250 ist ein Browser tun? 348 00:16:16,250 --> 00:16:19,290 Nun, wir haben nicht zu befürchten wie es dies zu tun, oder mit dem, was 349 00:16:19,290 --> 00:16:23,090 Algorithmus, aber am Ende des Tages, wenn ein Browser empfängt HTML wie 350 00:16:23,090 --> 00:16:27,510 dass aus Facebook oder Google, analysiert er es, so zu sprechen, liest er es, 351 00:16:27,510 --> 00:16:31,160 mit so etwas wie fread, von oben nach unten, von links nach rechts, und da es 352 00:16:31,160 --> 00:16:36,300 merkt, oh, offene tag, und schließen Sie dann tag, beginnt es zu malloc, so zu sprechen, 353 00:16:36,300 --> 00:16:37,800 ein Knoten in einem Baum. 354 00:16:37,800 --> 00:16:41,130 Und wenn es trifft, wie wir stillschweigend hier mit dem Einzug, ein 355 00:16:41,130 --> 00:16:45,400 untergeordneten Knoten, mallocs es einen Knoten für die und angebracht, dass der Baum. 356 00:16:45,400 --> 00:16:49,150 >> Also die Baumstrukturen, binären Bäumen, ternären Bäume und größere Bäume, dass 357 00:16:49,150 --> 00:16:53,380 wir einen Blick auf ein oder zwei Wochen vor Ankündigung dass das gleiche Prinzip ist 358 00:16:53,380 --> 00:16:54,220 kommt zu uns zurück. 359 00:16:54,220 --> 00:16:57,590 Und wer umgesetzt, was auch immer Chrome Team tat, hatte vermutlich 360 00:16:57,590 --> 00:17:00,800 eine Art Baumstruktur implementieren unter der Haube. 361 00:17:00,800 --> 00:17:05,329 Und das ist wahrscheinlich selbst in ein Sprache wie C oder C + +, oder eine niedere 362 00:17:05,329 --> 00:17:08,540 Level-Sprache, dass wir werden jetzt oben auf dem Web verwenden. 363 00:17:08,540 --> 00:17:11,200 >> So, jetzt, vielleicht, wird diese mehr Sinn machen. 364 00:17:11,200 --> 00:17:15,420 Tatsächliche Tattoo von irgendeinem Kerl, der vielleicht bereue es schließlich, der Art der. 365 00:17:15,420 --> 00:17:17,359 OK, alles in Ordnung, so dass eine Menge von Web-Humor. 366 00:17:17,359 --> 00:17:18,599 Es ist nicht wirklich über so gut heute. 367 00:17:18,599 --> 00:17:19,560 So werden wir weitermachen. 368 00:17:19,560 --> 00:17:20,180 In Ordnung. 369 00:17:20,180 --> 00:17:22,760 >> Werfen wir also einen Blick jetzt ein paar Beispiele. 370 00:17:22,760 --> 00:17:24,660 Die einfachste Möglichkeit was könnte dies sein. 371 00:17:24,660 --> 00:17:29,170 Ich werde weitermachen und eröffnen in gedit eine Datei namens hello.php. 372 00:17:29,170 --> 00:17:31,730 373 00:17:31,730 --> 00:17:36,330 Und innerhalb von hier, ich bin zu schnell gehen nur dies tun, printf, zitieren 374 00:17:36,330 --> 00:17:38,590 unquote, "Hallo Welt." 375 00:17:38,590 --> 00:17:42,460 >> So Ankündigung, und ich werde mein Backslash n tun, Ich habe nicht die Mühe zu erklären, main. 376 00:17:42,460 --> 00:17:45,310 Es stellt sich heraus, in php, und eine Menge Sprachen, die Sie nicht brauchen einen Haupt- 377 00:17:45,310 --> 00:17:46,090 Funktion per se. 378 00:17:46,090 --> 00:17:47,720 Sie können nur mit dem Schreiben beginnen Ihr Programm. 379 00:17:47,720 --> 00:17:51,210 Nun, wenn ich diese Datei speichern, merke ich bin zu haben, um die folgenden Schritte. 380 00:17:51,210 --> 00:17:55,360 Ich werde nicht zu bedienen zu machen, und ich bin nicht werde clang weil PHP nutzen, im Gegensatz zu 381 00:17:55,360 --> 00:17:57,400 C ist nicht eine kompilierte Sprache. 382 00:17:57,400 --> 00:18:01,400 Es ist, was heißt eine interpretierte Sprache, was bedeutet, dass Sie es ausführen 383 00:18:01,400 --> 00:18:04,650 als eine Eingabe durch ein anderes Programm rief einen Dolmetscher. 384 00:18:04,650 --> 00:18:08,150 Und das Programm liest es, von oben nach unten, von links nach rechts, und tut 385 00:18:08,150 --> 00:18:09,290 was Sie sagen, es zu tun. 386 00:18:09,290 --> 00:18:12,920 >> Also in diesem Fall habe ich hier eine Linie, die printf sagt. 387 00:18:12,920 --> 00:18:17,990 Also, wenn ich diesen Quellcode ausführen, hello.php, wenn ein Programm, das 388 00:18:17,990 --> 00:18:22,830 geschieht, bequem, genannt werden PHP, dass PHP-Programm wird gelesen 389 00:18:22,830 --> 00:18:26,120 Diese Datei, von oben nach unten, von links nach rechts, und es wird zu tun, was ich 390 00:18:26,120 --> 00:18:30,110 sagen, es zu tun - die Ausführung von Code, und wenn erkennt es nicht etwas, nur 391 00:18:30,110 --> 00:18:31,320 spuckt es aus. 392 00:18:31,320 --> 00:18:34,940 Also werde ich weitermachen und PHP laufen von hello.php. 393 00:18:34,940 --> 00:18:37,110 Enter. 394 00:18:37,110 --> 00:18:39,690 >> Und das ist nicht ganz das, was ich wollte. 395 00:18:39,690 --> 00:18:40,530 Nun, warum ist das so? 396 00:18:40,530 --> 00:18:43,910 Nun, das ist eine Sprache, die PHP eigentlich entwickelt, um recht sein 397 00:18:43,910 --> 00:18:46,150 verflochten mit dem Web. 398 00:18:46,150 --> 00:18:50,460 Bei der Web-Seiten mit dieser Sprache PHP, wie wir bald sehen werden, werden wir 399 00:18:50,460 --> 00:18:54,560 wollen, so etwas wie Druck zu tun aus Zeilen wie diese. 400 00:18:54,560 --> 00:18:55,940 >> Also werde ich, dies zu tun. 401 00:18:55,940 --> 00:19:00,810 Offene Klammer, Fragezeichen, PHP, und jetzt bin ich gerade dabei Gedankenstrich, nur um 402 00:19:00,810 --> 00:19:01,960 Dinge schön. 403 00:19:01,960 --> 00:19:04,910 Und jetzt werde ich eine Frage zu tun Klammer zu markieren. 404 00:19:04,910 --> 00:19:06,270 Also gibt es ein bisschen Asymmetrie hier. 405 00:19:06,270 --> 00:19:07,490 Sie tun dies nicht. 406 00:19:07,490 --> 00:19:10,530 Und Sie müssen nicht einen Schrägstrich, so PHP ist ein wenig anders. 407 00:19:10,530 --> 00:19:14,610 >> Aber jetzt, wenn ich erneut dieses Programm, PHP hello.php, jetzt habe ich 408 00:19:14,610 --> 00:19:16,090 tatsächlich bekommen Hallo Welt. 409 00:19:16,090 --> 00:19:17,750 Und wir werden sehen, warum das so ist wertvoll. 410 00:19:17,750 --> 00:19:20,960 One, es erlaubt mir, um anzugeben, Super explizit ist 411 00:19:20,960 --> 00:19:22,480 Code, führen diese. 412 00:19:22,480 --> 00:19:25,480 Und das ist in der Tat, was diese spezielle Tags bedeuten hier. 413 00:19:25,480 --> 00:19:30,330 >> Aber es bedeutet auch, dass, wenn ich nur tun so etwas wie mein Ziel hier, dass 414 00:19:30,330 --> 00:19:34,000 Mittel, die, buchstäblich, das wird nur ohne die Notwendigkeit zu druckenden 415 00:19:34,000 --> 00:19:36,850 tatsächlich printf nennen, oder Druck, oder eine ähnliche Funktion. 416 00:19:36,850 --> 00:19:39,445 So kommen wir zurück zu, dass in nur einem Augenblick. 417 00:19:39,445 --> 00:19:40,470 >> Zuerst lassen Sie uns dies tun. 418 00:19:40,470 --> 00:19:43,950 Im Inneren des Gerätes haben wir eine Verzeichnis namens Vhosts, für virtuelle 419 00:19:43,950 --> 00:19:47,000 Gastgeber, Schrägstrich lokalen Host, Schrägstrich Öffentlichkeit. 420 00:19:47,000 --> 00:19:50,240 So ist es ein bisschen ausführlicher, aber lange Geschichte Kurz gesagt, ist das Gerät nicht ausgelegt 421 00:19:50,240 --> 00:19:53,770 nur unterstützen C. Es ist auch entwickelt, um PHP unterstützen. 422 00:19:53,770 --> 00:19:57,440 Aber es ist auch entworfen, um eine Web-sein Server und eine Datenbank-Server. 423 00:19:57,440 --> 00:20:00,230 Und es ist so konzipiert, konfiguriert und wirklich, zu erinnern an einem 424 00:20:00,230 --> 00:20:04,230 kommerziellen Web-Hosting-Unternehmen, dass Sie könnte $ 5 pro Monat bezahlen, 425 00:20:04,230 --> 00:20:05,040 $ 100 pro Monat für. 426 00:20:05,040 --> 00:20:08,200 Was auch immer der Service ist, ist es konfiguriert sehr ähnlich zu sein, um eine 427 00:20:08,200 --> 00:20:10,170 realen Welt Produktions-Server. 428 00:20:10,170 --> 00:20:13,485 >> Und was das bedeutet, ist, dass die auf das Gerät ist Web-Server-Software. 429 00:20:13,485 --> 00:20:15,060 Es passiert genannt Apache werden. 430 00:20:15,060 --> 00:20:17,790 Es ist nur kostenlos und Open Source, und sehr beliebt. 431 00:20:17,790 --> 00:20:23,260 Und wir haben Apache konfiguriert zu wissen dass, wenn ich eine bestimmte URL zu besuchen, mit 432 00:20:23,260 --> 00:20:28,060 Chrome-Browser oder in der Gerät, um in dieses Verzeichnis schauen 433 00:20:28,060 --> 00:20:31,030 für die Dateien, die das Benutzer anfordert. 434 00:20:31,030 --> 00:20:32,790 >> In anderen Worten, lassen Sie mich gehen Sie vor und tun dies. 435 00:20:32,790 --> 00:20:36,890 Innerhalb meiner öffentlichen Verzeichnis, ich werde gehen Sie vor und erstellen Sie eine Datei 436 00:20:36,890 --> 00:20:39,580 index.html. 437 00:20:39,580 --> 00:20:41,000 Das gibt mir die Registerkarte hier. 438 00:20:41,000 --> 00:20:44,210 Und ich werde sehr schnell gehen und gehen Sie vor und bang 439 00:20:44,210 --> 00:20:45,010 dieses Programm hier. 440 00:20:45,010 --> 00:20:48,410 Doctype HTML, die für jetzt, nur Angenommen, Sie haben zu tippen. 441 00:20:48,410 --> 00:20:53,490 Es ist nur eine obskure tag, das ist nicht wirklich ein HTML-Tag, das angibt, dass 442 00:20:53,490 --> 00:20:55,050 hier kommt einige HTML. 443 00:20:55,050 --> 00:20:57,400 >> Ich werde weitermachen und neu was wir vorhin gesehen haben. 444 00:20:57,400 --> 00:20:58,650 Hier ist der Kopf der Seite. 445 00:20:58,650 --> 00:21:01,170 Im Inneren des Kopfes war der - 446 00:21:01,170 --> 00:21:01,890 so Titel. 447 00:21:01,890 --> 00:21:04,340 Also werden wir sagen, hallo, Welt. 448 00:21:04,340 --> 00:21:06,570 Und dann hier unten war der Body-Tag. 449 00:21:06,570 --> 00:21:08,580 Lassen Sie mich schließen Sie das body-Tag. 450 00:21:08,580 --> 00:21:12,280 Und dann werde ich hier auch sagen, nur für Klarheit, hallo Welt. 451 00:21:12,280 --> 00:21:14,770 >> Also das ist wohl die einfachste möglichen Web-Seite, die Sie 452 00:21:14,770 --> 00:21:15,770 machen können, das ist gültig. 453 00:21:15,770 --> 00:21:17,030 Es ist syntaktisch gültig. 454 00:21:17,030 --> 00:21:18,620 Alles, was ist geöffnet geschlossen ist. 455 00:21:18,620 --> 00:21:20,910 Alles ist schön in gestylt und eingerückt. 456 00:21:20,910 --> 00:21:23,600 Also mal sehen, wie ich jetzt auf diese Datei zugreifen. 457 00:21:23,600 --> 00:21:25,540 >> Nun, lassen Sie mich zu Chrome hier. 458 00:21:25,540 --> 00:21:35,050 Und lassen Sie mich zu gehen http://localhost/index.html. 459 00:21:35,050 --> 00:21:36,200 Also, was ist lokalen Host? 460 00:21:36,200 --> 00:21:39,400 Nun, fast jeder Computer der Welt, Linux, Mac OS, Windows, hat einen Spitznamen 461 00:21:39,400 --> 00:21:40,680 genannt lokalen Host. 462 00:21:40,680 --> 00:21:42,900 Also, wenn Sie schon immer einmal reden auf den eigenen Rechner - 463 00:21:42,900 --> 00:21:45,140 wenn auch, seltsam reflexartig - 464 00:21:45,140 --> 00:21:47,080 Sie nennen sich lokalen Host. 465 00:21:47,080 --> 00:21:50,390 Egal, was Ihre tatsächlichen Computer genannt, ob es David MacBook ist 466 00:21:50,390 --> 00:21:52,490 Air, oder etwas mehr verbose so. 467 00:21:52,490 --> 00:21:57,760 >> So wird diese URL anscheinend zu verwendenden der HTTP an den lokalen Host zu sprechen, 468 00:21:57,760 --> 00:22:00,800 derselbe Computer, das Gerät, und es geht um zu bitten, nehmen Sie nur eine 469 00:22:00,800 --> 00:22:02,570 erraten, welche Datei? 470 00:22:02,570 --> 00:22:04,460 Index.html. 471 00:22:04,460 --> 00:22:08,650 Also das Gerät konfiguriert wurde in vorrücken zu wissen, dass, wenn ich frage 472 00:22:08,650 --> 00:22:13,460 für so etwas wie index.html, sucht in einem Ordner namens Vhosts, in ein 473 00:22:13,460 --> 00:22:17,950 Ordner namens localhost, in einem Ordner darin genannt Öffentlichkeit. 474 00:22:17,950 --> 00:22:20,400 Das ist, wo alle meine öffentlichen Dateien sein werden. 475 00:22:20,400 --> 00:22:22,610 Also ich bin jetzt zu Enter drücken. 476 00:22:22,610 --> 00:22:27,100 >> Und verdammt, es ist, dass verbotene Nachricht, sonst wie 403, der bekannt 477 00:22:27,100 --> 00:22:28,490 Zahlencode für sie. 478 00:22:28,490 --> 00:22:30,130 Also, was ist hier falsch? 479 00:22:30,130 --> 00:22:33,210 Nun, es ist nicht genug, nur setzen die Datei in meiner Ordner. 480 00:22:33,210 --> 00:22:35,790 Ich muss tatsächlich die folgenden. 481 00:22:35,790 --> 00:22:40,210 >> Lassen Sie mich in mein Vhosts Verzeichnis gehen, in localhost, in öffentlichen und lassen 482 00:22:40,210 --> 00:22:41,680 mir tun ls dash l. 483 00:22:41,680 --> 00:22:44,510 Und es gibt ein paar andere Dinge hier für die heutigen Zwecke. 484 00:22:44,510 --> 00:22:50,540 Aber auf der linken Seite bemerken, die nächste index.html, wir sehen nur eine RW. 485 00:22:50,540 --> 00:22:53,560 Und in der Vergangenheit, was hat RW stand? 486 00:22:53,560 --> 00:22:54,240 >> Nur lesen oder schreiben. 487 00:22:54,240 --> 00:22:58,000 Die Tatsache, dass es rw sagt auf der linken Seite bedeutet, dass ich, der Besitzer dieser Datei können 488 00:22:58,000 --> 00:22:59,020 lesen oder schreiben. 489 00:22:59,020 --> 00:23:05,010 Aber ich brauche, damit alle Menschen in der Welt lesen, aber nicht schreiben. 490 00:23:05,010 --> 00:23:09,650 Also werde ich, um den Modus der Änderung Datei chmod, alle zzgl. r zu geben 491 00:23:09,650 --> 00:23:13,910 jeder Leserechte auf die Datei namens index.html. 492 00:23:13,910 --> 00:23:18,040 >> Und wenn ich jetzt retype ls dash l, Bekanntmachung dass hier, einige weitere 493 00:23:18,040 --> 00:23:19,160 R haben auftauchte. 494 00:23:19,160 --> 00:23:21,090 Und jetzt geht das spec in mehr Detail. 495 00:23:21,090 --> 00:23:24,450 Für P Satz 7, das bedeutet nur jeder können nun diese Datei lesen. 496 00:23:24,450 --> 00:23:27,790 Wenn ich zurück in meinem Browser jetzt und laden, voila. 497 00:23:27,790 --> 00:23:28,750 Hallo Welt. 498 00:23:28,750 --> 00:23:32,260 >> Und ich kann sogar öffne meine Chrome-Tools und sehen, wie mit Google und 499 00:23:32,260 --> 00:23:34,590 Facebook, dass es meine HTML, formatiert ein wenig 500 00:23:34,590 --> 00:23:35,930 unterschiedlich eingefärbt. 501 00:23:35,930 --> 00:23:40,450 Wenn ich mit dem Netzwerk Reiter und laden die Seite, feststellen, dass es das bekommen 502 00:23:40,450 --> 00:23:42,900 verlangen, dass Chrome sendet mit dem Gerät. 503 00:23:42,900 --> 00:23:46,020 Es ist die 200 für die bestimmte Datei. 504 00:23:46,020 --> 00:23:49,340 Also kurz gesagt, ist dies, wie alle diese verschiedene Stücke zusammen kommen. 505 00:23:49,340 --> 00:23:53,530 Es passiert einfach so, dass der Web-Server wir gerade verwenden, ist nicht fern, 506 00:23:53,530 --> 00:23:54,210 wie Facebook. 507 00:23:54,210 --> 00:23:58,330 Es ist buchstäblich auf dem gleichen Computer, Das ist völlig in Ordnung. 508 00:23:58,330 --> 00:24:00,590 >> Also, was können wir noch in einer Web-Seite zu tun? 509 00:24:00,590 --> 00:24:03,110 Nun, nur, lasst Brise durch ein paar von diesen Dingen. 510 00:24:03,110 --> 00:24:07,860 Aber lassen Sie mich gehen und öffnen Gedit mit index.html. 511 00:24:07,860 --> 00:24:13,980 Und lassen Sie mich gehen und sagen hallo CS50, speichern Sie diese Datei, gehen Sie zurück zu der 512 00:24:13,980 --> 00:24:16,260 Browser, wirklich berauschend Veränderung. 513 00:24:16,260 --> 00:24:19,130 >> Aber was, wenn wir wollen eigentlich Verknüpfung jetzt etwas? 514 00:24:19,130 --> 00:24:23,480 So stellt sich heraus, dass wir das haben Links in HTML-Tags, die sind einfach 515 00:24:23,480 --> 00:24:24,140 sich. 516 00:24:24,140 --> 00:24:27,320 Es passiert genannt werden Anker-Tag. a href gleich 517 00:24:27,320 --> 00:24:33,190 https://www.cs50.net, www.cs50.net close Zitat, Klammer zu. 518 00:24:33,190 --> 00:24:35,230 Und jetzt wollen wir mal sehen, was anders als nächstes kommt. 519 00:24:35,230 --> 00:24:36,500 >> Ich habe den Tag eröffnet. 520 00:24:36,500 --> 00:24:38,990 Ich muss jetzt, es aufzugeben ein Satz wie CS50. 521 00:24:38,990 --> 00:24:40,600 Lassen Sie mich schließen mit dem Tag. 522 00:24:40,600 --> 00:24:42,010 Und ein paar Dinge beachten. 523 00:24:42,010 --> 00:24:45,270 Auch wenn es diese kryptische Sache hier, ich habe es nicht wiederholt werden, wenn Sie 524 00:24:45,270 --> 00:24:46,010 schließen Sie den Tag. 525 00:24:46,010 --> 00:24:48,230 Sie schließen Sie einfach das tag mit seinem Namen allein. 526 00:24:48,230 --> 00:24:50,940 Und das ist, was als bekannt ein Attribut mit einem Wert. 527 00:24:50,940 --> 00:24:56,070 Attribute nur das Verhalten ändern einiger Tag innerhalb einer Seite. 528 00:24:56,070 --> 00:24:59,150 >> Das ist also die Angabe, dass die hyper Referenz, die andere Art zu sagen die 529 00:24:59,150 --> 00:25:03,660 URL für diesen Anker, für diese Link sollte CS50.net sein. 530 00:25:03,660 --> 00:25:07,440 Und der Text, den wir wollen das zeigen Benutzer ist nicht, dass rohe URL, sondern 531 00:25:07,440 --> 00:25:08,730 das Wort CS50. 532 00:25:08,730 --> 00:25:13,710 >> Also, wenn ich jetzt neu zu laden, lassen Sie mich den Zoomfaktor für Klarheit, lassen Sie mich die Seite neu laden, 533 00:25:13,710 --> 00:25:16,460 feststellen, dass wir diesen alten Schule haben blau unterstrichenen Link. 534 00:25:16,460 --> 00:25:20,000 Und wenn ich mit der Maus über sie, und es wird hart zu sein, um zu sehen, in der unteren linken 535 00:25:20,000 --> 00:25:23,690 Ecke des Bildschirms, bemerken dass es sagt, die URL, auf die 536 00:25:23,690 --> 00:25:24,430 Ich werde gehen. 537 00:25:24,430 --> 00:25:27,940 Und wenn ich es klicken, voila, jetzt bin ich Web-Seiten. 538 00:25:27,940 --> 00:25:30,140 Und wir haben uns geführt auf der Homepage. 539 00:25:30,140 --> 00:25:32,670 >> Aber beachten Sie, welches Potential dies bietet uns. 540 00:25:32,670 --> 00:25:34,890 Sicherheit ist sehr viel in Mode in diesen Tagen. 541 00:25:34,890 --> 00:25:41,210 Was ist, wenn ich stattdessen etwas sagen wie: , und ich statt zu gehen, sagen wir, wir 542 00:25:41,210 --> 00:25:42,460 sehen fakeCS50.net. 543 00:25:42,460 --> 00:25:44,660 544 00:25:44,660 --> 00:25:46,360 Diese Seite neu laden. 545 00:25:46,360 --> 00:25:50,180 >> OK, so merkt es sieht immer noch wie ich bin werde CS50, es sei denn, einer klugen Auge 546 00:25:50,180 --> 00:25:51,560 bemerken, dass ich mich zu fälschen CS50 gehen. 547 00:25:51,560 --> 00:25:54,550 Ich vermute, diese Domain nicht gemacht. 548 00:25:54,550 --> 00:25:55,960 OK, es ist also nicht vorhanden. 549 00:25:55,960 --> 00:25:56,600 Also das ist gut. 550 00:25:56,600 --> 00:25:57,900 Niemand hat eigentlich diese Domäne. 551 00:25:57,900 --> 00:26:00,380 >> Aber lassen Sie uns ein wenig mehr bösartige weil das ziemlich blöd ist. 552 00:26:00,380 --> 00:26:02,240 Was, wenn wir dies ändern zu Paypal. 553 00:26:02,240 --> 00:26:09,960 Und was ist, wenn wir das nennen, wie, www.paypal.badguy.com, 554 00:26:09,960 --> 00:26:12,070 unabhängig von der Domäne ist. 555 00:26:12,070 --> 00:26:13,700 Das wahrscheinlich existiert. 556 00:26:13,700 --> 00:26:16,260 So, jetzt lassen Sie mich die Seite neu laden. 557 00:26:16,260 --> 00:26:22,890 Und hier haben wir eine Art von Phishing Angriff, P-H-I-S-H-I-N-G, die das ist 558 00:26:22,890 --> 00:26:26,760 dumme Wort für einen Angriff gegeben, dass versucht, Fische Informationen, oder besser 559 00:26:26,760 --> 00:26:30,450 noch, Geld von Menschen durch Tricks sie in die Bereitstellung von Informationen, die 560 00:26:30,450 --> 00:26:31,990 sie könnten nicht anders. 561 00:26:31,990 --> 00:26:33,500 Das sieht total echt, nicht wahr? 562 00:26:33,500 --> 00:26:34,930 Ich muß hier einen Link zu Paypal.com. 563 00:26:34,930 --> 00:26:37,700 564 00:26:37,700 --> 00:26:40,430 In Fairness, wenn ich sexed es mit einigen Grafiken, können wir lassen es so aussehen 565 00:26:40,430 --> 00:26:41,310 mehr wie PayPal. 566 00:26:41,310 --> 00:26:41,510 Right? 567 00:26:41,510 --> 00:26:43,815 Denn ich konnte, als beiseite, Ich könnte Paypal.com gehen. 568 00:26:43,815 --> 00:26:47,110 Und wir haben gerade gesehen, wie ich kann, sehen alle ihre HTML. 569 00:26:47,110 --> 00:26:50,560 Ich konnte einfach kopieren und erstellen die Ästhetik Paypal, anstatt zu gehen 570 00:26:50,560 --> 00:26:51,490 alten Schule hier. 571 00:26:51,490 --> 00:26:55,010 Aber beachten Sie, natürlich, und es ist ein wenig kleine noch, nur in der unteren 572 00:26:55,010 --> 00:26:59,190 linken Ecke, in wie ein 10-Punkte- Schriftart, siehst du, was du bist URL 573 00:26:59,190 --> 00:27:01,310 tatsächlich zu geführt werden. 574 00:27:01,310 --> 00:27:06,580 >> Und so, wenn Sie jemals bekommen haben Spam sagen gehen Sie vor, und du bist angemeldet 575 00:27:06,580 --> 00:27:07,420 kompromittiert wurde. 576 00:27:07,420 --> 00:27:10,615 Bitte klicken Sie auf diesen Link und lassen Sie uns wissen vergessen, damit wir sicherstellen können, du bist 577 00:27:10,615 --> 00:27:13,010 Sie, nicht immer tun. 578 00:27:13,010 --> 00:27:14,180 Diese Dinge sollte eine Selbstverständlichkeit sein. 579 00:27:14,180 --> 00:27:17,670 Aber es ist wunderbar amüsant und tragisch, wie jedes Jahr scheint dies 580 00:27:17,670 --> 00:27:19,660 passieren zu einigen Nicht-Null- Anzahl der Personen. 581 00:27:19,660 --> 00:27:21,400 >> Und das ist das Schöne von Phishing-Angriffen. 582 00:27:21,400 --> 00:27:23,160 Hier können Sie sich eine Million E-Mails. 583 00:27:23,160 --> 00:27:27,720 Und selbst wenn 0,01% der Menschen tatsächlich Klicken Sie auf Paypal und geben Sie Ihre 584 00:27:27,720 --> 00:27:31,040 vergessen, das ist immer noch ein Nicht-Null-Nummer von Menschen, die nur geben haben 585 00:27:31,040 --> 00:27:32,200 Sie ihr Geld. 586 00:27:32,200 --> 00:27:36,170 Und Senden von E-Mails ist natürlich ganz einfach und im Wesentlichen frei 587 00:27:36,170 --> 00:27:36,970 in diesen Tagen. 588 00:27:36,970 --> 00:27:40,410 >> So lange Rede kurzer Sinn, wunderbar schöne Idee, nicht wahr? 589 00:27:40,410 --> 00:27:44,620 Vor Jahren war dies die früheste Web, so dass ein Netz von 590 00:27:44,620 --> 00:27:46,330 Hyperlinks zwischen den Ressourcen. 591 00:27:46,330 --> 00:27:49,520 Aber so schnell kann es sein, verwendet für kranke Zwecke. 592 00:27:49,520 --> 00:27:54,100 Und E-Mail, es genügt zu sagen, diese Tagen haben in HTML eingebettet. 593 00:27:54,100 --> 00:27:55,410 >> Nun, lassen Sie mich nur eine andere Sache. 594 00:27:55,410 --> 00:27:58,640 Und wir werden weitgehend verschieben, um in Abschnitt Problem stellte sieben, damit Sie 595 00:27:58,640 --> 00:28:00,000 erkunden Sie die Angaben. 596 00:28:00,000 --> 00:28:01,990 Aber lassen Sie mich gehen Sie vor und ein paar Dinge tun hier. 597 00:28:01,990 --> 00:28:04,840 Ich werde gehen und erklären, in was heißt ein div oder 598 00:28:04,840 --> 00:28:06,080 Teilung, von der Seite. 599 00:28:06,080 --> 00:28:07,770 Lassen Sie mich schließen, dass die div-Tag. 600 00:28:07,770 --> 00:28:11,460 >> Und ich werde sagen, bis hier nach oben. 601 00:28:11,460 --> 00:28:14,940 Und dann darunter, werde ich tun etwas wie ein anderes div, schließen Sie diese 602 00:28:14,940 --> 00:28:17,800 tag und tun unten auf der Seite. 603 00:28:17,800 --> 00:28:18,840 Und lassen Sie es speichern. 604 00:28:18,840 --> 00:28:21,040 >> So, jetzt gehen wir zurück zu meiner Datei. 605 00:28:21,040 --> 00:28:22,120 Sehr berauschend. 606 00:28:22,120 --> 00:28:25,520 Aber was ist für die Division verwendet, unter der Haube, ist es eigentlich 607 00:28:25,520 --> 00:28:26,920 ein schönes Strukturelement. 608 00:28:26,920 --> 00:28:30,300 Es hat keine Ästhetik soweit wir sehen können, außer, es scheint, 609 00:28:30,300 --> 00:28:31,890 die Dinge auf neue Linien. 610 00:28:31,890 --> 00:28:36,290 >> Beachten Sie aber, als beiseite, gerade schlagen Geben Sie nicht schneiden Sie es in HTML, wie es 611 00:28:36,290 --> 00:28:39,840 ist in C. Man könnte denken, dass das ist gehen, um eine schöne große Lücke zwischen setzen 612 00:28:39,840 --> 00:28:41,300 oben und unten auf der Seite. 613 00:28:41,300 --> 00:28:43,420 Aber es ignoriert. 614 00:28:43,420 --> 00:28:48,040 Leerraum wird im Wesentlichen in ignoriert Web-Seiten außer der ersten 615 00:28:48,040 --> 00:28:51,530 Leertaste Charakter oder Wagenrücklauf Sie treffen auf der Tastatur. 616 00:28:51,530 --> 00:28:55,370 Wenn Sie mehr Zeilenumbrüche Sie müssen angeben it yourself. 617 00:28:55,370 --> 00:28:59,080 >> Also werde ich ein paar Dinge zu tun hier zu zeigen, was los ist. 618 00:28:59,080 --> 00:29:02,700 Ich werde ein Attribut hinzufügen, dass Und wieder gibt es, die Art und Weise lernen Sie 619 00:29:02,700 --> 00:29:07,110 welche Attribute existieren, welche Tags existieren, wirklich, ist Online-Artikeln. 620 00:29:07,110 --> 00:29:09,750 HTML ist die Art von Sprache - es ist keine Programmiersprache. 621 00:29:09,750 --> 00:29:12,460 Es ist eine Markup-Sprache -, dass nach einer gute halbe Stunde, vielleicht eine Stunde mit 622 00:29:12,460 --> 00:29:15,930 es, werden Sie sicherlich verstehen, die meisten wahrscheinlich, die Grundidee. 623 00:29:15,930 --> 00:29:20,350 Und dann eine Google-Suche entfernt ist alles die möglichen Tags, die Sie vielleicht 624 00:29:20,350 --> 00:29:21,170 interessieren 625 00:29:21,170 --> 00:29:24,290 Und nach der Spezifikation, das ist ganz willkommen und ermutigte hier. 626 00:29:24,290 --> 00:29:26,120 >> So, jetzt lassen Sie mich gehen Sie vor und etwas tun. 627 00:29:26,120 --> 00:29:28,690 Hintergrund-Farbe. 628 00:29:28,690 --> 00:29:32,060 Und jetzt werde ich etwas tun wie rot, Semikolon. 629 00:29:32,060 --> 00:29:33,970 Und Sie können diese in tun ein paar verschiedene Möglichkeiten. 630 00:29:33,970 --> 00:29:36,770 Ich bin nur eine Art der Eingabe ist es als Super explizit wie möglich. 631 00:29:36,770 --> 00:29:41,960 >> Aber es stellt sich heraus, dass dieser Wert ist hier was heißt CSS, Cascading Style 632 00:29:41,960 --> 00:29:43,700 Sheets, die eine andere ist Sprache überhaupt. 633 00:29:43,700 --> 00:29:46,770 CSS hat nichts damit zu tun, Tags öffnen und schließen Tags. 634 00:29:46,770 --> 00:29:48,230 Es hat mit Eigenschaften zu tun. 635 00:29:48,230 --> 00:29:52,660 >> Und Eigenschaften sind einfach Schlüssel-Wert Paare, die nur ein Wort bedeutet, 636 00:29:52,660 --> 00:29:54,680 Doppelpunkt, und dann einige andere Wort. 637 00:29:54,680 --> 00:29:57,940 Und wenn Sie mehrere diejenigen, oder einfach nur man hier, können Sie es mit einem Ende 638 00:29:57,940 --> 00:29:59,390 Semikolon, nur für Klarheit. 639 00:29:59,390 --> 00:30:01,370 Aber auch das wird hier zu arbeiten. 640 00:30:01,370 --> 00:30:02,500 >> Nun, was ist das jetzt tun? 641 00:30:02,500 --> 00:30:03,610 Sie können sich wahrscheinlich vorstellen. 642 00:30:03,610 --> 00:30:05,930 Lassen Sie mich gehen Sie vor und laden Sie diese Seite. 643 00:30:05,930 --> 00:30:07,300 Und jetzt ist es wirklich mitkommen. 644 00:30:07,300 --> 00:30:09,150 Also ganz oben auf meiner Seite ist rot. 645 00:30:09,150 --> 00:30:12,380 Aber was ist der Schlüssel hier ist, dass habe ich erwähnt, früher gibt, dass div Sie 646 00:30:12,380 --> 00:30:13,220 ein Geschäftsbereich der Seite. 647 00:30:13,220 --> 00:30:14,410 Und das ist in der Tat, was sie tut. 648 00:30:14,410 --> 00:30:17,920 Im Wesentlichen teilt die Seite in ein Rechteck, dass man dann 649 00:30:17,920 --> 00:30:18,720 manipulieren. 650 00:30:18,720 --> 00:30:22,330 >> Und diese Vorstellung von Rechtecken ist eine Art überzeugend, dass, wenn Sie denken 651 00:30:22,330 --> 00:30:26,410 fast jeder Website, gibt es wahrscheinlich einige Struktur zu. 652 00:30:26,410 --> 00:30:29,620 Die meisten von euch haben wahrscheinlich selten gesehen Facebook Homepage, wenn Sie angemeldet sind 653 00:30:29,620 --> 00:30:30,440 in all der Zeit. 654 00:30:30,440 --> 00:30:33,920 >> Aber auf Facebook Homepage, gibt es eine Art div entlang der Oberseite. 655 00:30:33,920 --> 00:30:36,140 Und könnte es nicht so einfach sein als ein div, aber es gibt eine 656 00:30:36,140 --> 00:30:37,560 rechteckige Region gibt. 657 00:30:37,560 --> 00:30:40,290 Der Rest der Seite ist wie eine riesige div, wie ein viel 658 00:30:40,290 --> 00:30:41,910 größeren rechteckigen Bereich. 659 00:30:41,910 --> 00:30:44,540 So lange Rede kurzer Sinn, nur, indem er diese kleinen Bausteine, die 660 00:30:44,540 --> 00:30:49,250 Fähigkeit zur Modellierung Dinge wie Rechtecke, ob breit oder schmal, können Sie auch 661 00:30:49,250 --> 00:30:53,680 Spalten machen potenziell ermöglicht es Ihnen, Gestalten der Seiten, wirklich, aber Sie 662 00:30:53,680 --> 00:30:54,100 möchte. 663 00:30:54,100 --> 00:30:56,170 Wir sind wirklich nur ein Bruchteil die Oberfläche hier. 664 00:30:56,170 --> 00:30:59,820 >> In der Tat, wenn ich eine andere, lassen Sie mich gehen Sie vor und tun Stil, 665 00:30:59,820 --> 00:31:05,410 background-color, tun wir etwas wie blau, close Anführungszeichen. 666 00:31:05,410 --> 00:31:06,620 Lasst uns neu laden. 667 00:31:06,620 --> 00:31:08,260 So, jetzt ist es immer noch hässlicher. 668 00:31:08,260 --> 00:31:11,520 Aber jetzt kann ich Art vorzuführen meine P stellte fünf Fähigkeiten, nicht wahr? 669 00:31:11,520 --> 00:31:12,690 Red. 670 00:31:12,690 --> 00:31:15,640 Es erinnert mich an RGB, Rot Grün Blau verdreifacht. 671 00:31:15,640 --> 00:31:19,330 Nun stellt sich heraus, in Web-Programmierung, oder Web-Design, das ist, haben wir 672 00:31:19,330 --> 00:31:21,650 noch nichts programmiert per se, kann man eigentlich 673 00:31:21,650 --> 00:31:22,880 haben hexadezimalen Code. 674 00:31:22,880 --> 00:31:26,480 So etwas etwas, etwas etwas, etwas etwas. 675 00:31:26,480 --> 00:31:30,650 So können Sie sechs hexadezimalen Zeichen oder drei, in einigen Fällen, 676 00:31:30,650 --> 00:31:33,480 und jede dieser Fragezeichen hat zu einer Hexadezimalstellen sein, 677 00:31:33,480 --> 00:31:34,985 Null bis f. 678 00:31:34,985 --> 00:31:41,000 >> Wenn ich will, um eine Menge von roten zu haben, und kein Grün und kein Blau, was ist das 679 00:31:41,000 --> 00:31:43,740 Gegenteil von Null bei der Verwendung von Hex? 680 00:31:43,740 --> 00:31:44,480 Es ist f. 681 00:31:44,480 --> 00:31:51,130 Also kann ich tun, ff, Null Null, Null Null, speichern Sie diese, und jetzt hier runter kommen. 682 00:31:51,130 --> 00:31:52,700 Und ich weiß nicht wirklich sehen eine Veränderung. 683 00:31:52,700 --> 00:31:56,230 So zitieren unquote "rot" ist offenbar Synonym für alle rot, 684 00:31:56,230 --> 00:31:57,610 kein Grün, kein Blau. 685 00:31:57,610 --> 00:31:59,960 Inzwischen lassen absichtlich ändern dieses etwas sein 686 00:31:59,960 --> 00:32:01,210 zufällig, wie ABCDF. 687 00:32:01,210 --> 00:32:03,790 688 00:32:03,790 --> 00:32:05,860 >> Mal sehen, was das ist. 689 00:32:05,860 --> 00:32:08,530 Es ist ein wirklich schönes blau, tatsächlich, blau Baby. 690 00:32:08,530 --> 00:32:11,820 Alles klar, so sind gerade jetzt etwas beliebige Kombinationen von 691 00:32:11,820 --> 00:32:12,210 Zeichen. 692 00:32:12,210 --> 00:32:13,410 So werden wir nicht verzetteln in hier. 693 00:32:13,410 --> 00:32:15,930 Aber noch einmal, spricht dies für die Präzision dass Sie beginnen können, um 694 00:32:15,930 --> 00:32:19,090 gelten - auch wenn Sie sehr sind überwältigt durch die Ästhetik. 695 00:32:19,090 --> 00:32:21,750 In der Tat, wenn Sie wirklich wollen sein beeindruckt, lass mich gehen und ändern 696 00:32:21,750 --> 00:32:23,500 die Schriftgröße, zum Beispiel. 697 00:32:23,500 --> 00:32:25,960 Und bemerken Sie das Semikolon, die Es ist notwendig. 698 00:32:25,960 --> 00:32:29,570 >> Schriftgröße, können wir einfach nur lächerlich hier, 96 Punkt. 699 00:32:29,570 --> 00:32:31,280 Speichern dass. 700 00:32:31,280 --> 00:32:33,670 Wow, das ist ein großer Schriftgröße. 701 00:32:33,670 --> 00:32:35,490 Alles klar, also ist es sehr einfach. 702 00:32:35,490 --> 00:32:38,260 Und tatsächlich, Sie sehen im Wesentlichen die ersten Web-Seite, die ich gemacht 703 00:32:38,260 --> 00:32:40,060 Jahren, als ich zum ersten Mal gelernt dieses Zeug. 704 00:32:40,060 --> 00:32:42,190 Es ist sehr einfach zu sehr machen abscheulichen Dinge schnell. 705 00:32:42,190 --> 00:32:46,115 >> Und wenn Sie nicht vertraut sind mit der Wayback Maschine auf archive.org, Sie 706 00:32:46,115 --> 00:32:48,210 können alle meine scheußlich finden undergrad Webseiten. 707 00:32:48,210 --> 00:32:50,090 Man hatte Kermit der Frosch auf der Vorderseite. 708 00:32:50,090 --> 00:32:53,150 Ich ging durch eine Phase, wo ich dachte es war cool, den Hintergrund nehmen 709 00:32:53,150 --> 00:32:56,320 ein roter Vorhang, wenn ich, wie Sie gelernt Fliesen können Bilder wieder und wieder, und 710 00:32:56,320 --> 00:32:59,540 wieder, um eine Seite mit füllen eine große klebrige rote Vorhang. 711 00:32:59,540 --> 00:33:03,120 Und dann, am Anfang dieser, war eine Ikone Sie musste auf meinem Haus betreten 712 00:33:03,120 --> 00:33:04,960 Seite, denn das war sehr en vogue. 713 00:33:04,960 --> 00:33:08,870 >> Und dann meine erste Programm, das ich je geschrieben habe nicht in PHP, aber in einer Sprache, 714 00:33:08,870 --> 00:33:12,260 Perle genannt, schrieb ein Gästebuch, das ist eine wirklich coole Sache, dass ein 715 00:33:12,260 --> 00:33:14,250 Viele Menschen erwarten, dass Sie auf eine Homepage haben. 716 00:33:14,250 --> 00:33:17,510 Wenn Sie zu der Seite zu bekommen, wollen sie dich sich anmelden und sagen, wer Sie sind, 717 00:33:17,510 --> 00:33:18,720 und warum sind Sie da. 718 00:33:18,720 --> 00:33:21,320 Dies ist sehr Stil der 1990er Jahre Web-Design. 719 00:33:21,320 --> 00:33:24,130 >> Aber in diesen Tagen, sicherlich, wir haben kommen viel weiter. 720 00:33:24,130 --> 00:33:27,560 Und Sie werden sehen, im Schnitt, und sogar in dem Problem stellte sieben von 721 00:33:27,560 --> 00:33:31,570 Nutzung Bibliotheken in diesen Tagen, es ist so viel einfacher zu machen 722 00:33:31,570 --> 00:33:33,400 hübscher Dinge schnell. 723 00:33:33,400 --> 00:33:36,550 Wirklich hier, wir sind nur Kratzer die Oberfläche von dem, was Sie tun können 724 00:33:36,550 --> 00:33:37,400 stilistisch. 725 00:33:37,400 --> 00:33:41,660 >> Und in der Tat schon, möchte ich betonen, dass dies bereits immer hässlich, nicht 726 00:33:41,660 --> 00:33:46,030 nur ästhetisch, sondern in Bezug auf der Stil von meinem Code, oder die 727 00:33:46,030 --> 00:33:47,260 Design von meinem Code. 728 00:33:47,260 --> 00:33:52,350 Ich habe momentan HTML, welche comingled ist die grünlich offenen Tags gibt, mit 729 00:33:52,350 --> 00:33:55,160 CSS-Eigenschaften, die ist völlig legitim. 730 00:33:55,160 --> 00:33:57,200 Das ist wirklich, wo die Sprache hatte ihren Ursprung. 731 00:33:57,200 --> 00:34:01,030 >> Aber im Interesse der sauberen Entwurf, ähnlich wie wir angefangen Factoring Sachen 732 00:34:01,030 --> 00:34:05,370 aus C-Dateien in. h-Dateien, lassen mich tatsächlich praktizieren diese Art von 733 00:34:05,370 --> 00:34:07,990 Prinzip und fangen diese statt. 734 00:34:07,990 --> 00:34:13,280 Lassen Sie mich einen Stil tag hier oben, die existiert auch in HTML, und lassen Sie mich 735 00:34:13,280 --> 00:34:15,330 Folgendes festlegen. 736 00:34:15,330 --> 00:34:16,360 Lassen Sie mich diese löschen. 737 00:34:16,360 --> 00:34:18,110 Hintergrundfarbe wird rot sein. 738 00:34:18,110 --> 00:34:19,800 Ich werde dieses komplett löschen. 739 00:34:19,800 --> 00:34:22,580 Ich werde, um loszuwerden, den Stil zuschreiben, und ich bin eindeutig zu gehen 740 00:34:22,580 --> 00:34:24,620 Identifizierung dieses div mit einem Wort - 741 00:34:24,620 --> 00:34:28,750 willkürlich, aber vernünftigerweise, Zitat unquote "top". Und ID ist eine spezielle 742 00:34:28,750 --> 00:34:32,530 Attribut, die eindeutig eine bestimmte HTML-Element 743 00:34:32,530 --> 00:34:33,850 als mit, dass id. 744 00:34:33,850 --> 00:34:37,969 >> Wenn ich jetzt will stilisierten es, hier in der Kopf auf meiner Seite, innerhalb der 745 00:34:37,969 --> 00:34:41,730 Stil tag, feststellen, dass Ich kann tun Hash top. 746 00:34:41,730 --> 00:34:45,300 Und dann kann ich tat ein paar lockige Hosenträger, erinnert an C, und dann lassen 747 00:34:45,300 --> 00:34:47,130 mich in dieser Stilisierung fügen. 748 00:34:47,130 --> 00:34:49,929 Und lassen Sie mich gehen hier und erwarten wo ich mit diesem gehe. 749 00:34:49,929 --> 00:34:53,380 Lassen Sie mich auch eines erstellen für die untere div. 750 00:34:53,380 --> 00:34:58,010 Lassen Sie mich greifen diese häßlichen Code von unten hier, steckte es in hier, und ich werde sein 751 00:34:58,010 --> 00:35:00,770 ein wenig mehr anal jetzt und stilisierte sie nur darum, Dinge auf ihre eigene 752 00:35:00,770 --> 00:35:02,540 Linie und endet mit einem Semikolon. 753 00:35:02,540 --> 00:35:04,430 Lassen Sie mich loswerden der Stil-Tags. 754 00:35:04,430 --> 00:35:05,320 >> Aber ich bin noch nicht fertig. 755 00:35:05,320 --> 00:35:07,406 Ich brauche, um eine andere Sache zu tun. 756 00:35:07,406 --> 00:35:10,070 Ja, gleich id Zitat unquote, "unten", oder was auch immer ich will id 757 00:35:10,070 --> 00:35:11,740 geben dieses Element. 758 00:35:11,740 --> 00:35:13,420 Jetzt lassen Sie mich wieder hier. 759 00:35:13,420 --> 00:35:14,360 Und das ist grauenhaft. 760 00:35:14,360 --> 00:35:15,805 Ich kann nicht mit 96 Punkt befassen. 761 00:35:15,805 --> 00:35:16,960 Lassen Sie uns 24 Punkt. 762 00:35:16,960 --> 00:35:18,320 Oder Sie könnten genauer zu sein. 763 00:35:18,320 --> 00:35:21,800 Sie können tatsächlich Pixel, Pixel, so dass Sie wirklich feineres Korn 764 00:35:21,800 --> 00:35:23,220 Kontrolle über die Seite. 765 00:35:23,220 --> 00:35:26,860 >> Nebenbei, das ist nicht unbedingt das Beste, wenn die Benutzer, für 766 00:35:26,860 --> 00:35:29,650 Zugänglichkeit Gründen wollen können Größen zu erhöhen. 767 00:35:29,650 --> 00:35:32,650 So klar, dass es Wege gibt, dies zu tun Dinge, die nicht unbedingt 768 00:35:32,650 --> 00:35:34,230 hart codieren alles. 769 00:35:34,230 --> 00:35:37,220 >> Alles klar, also es ist größer, 24 Punkt, als was der Standard ist. 770 00:35:37,220 --> 00:35:38,630 Aber jetzt ist es ein wenig sauberer. 771 00:35:38,630 --> 00:35:40,230 Und lassen Sie mich noch einen Schritt weiter zu gehen. 772 00:35:40,230 --> 00:35:47,220 Genau wie die Idee der Header-Dateien, bemerken wir einen Schritt näher an die. 773 00:35:47,220 --> 00:35:52,000 Ich habe ausgeklammert, aber immer noch links, Innenseite meiner Seite, diese CSS-Regeln. 774 00:35:52,000 --> 00:35:56,200 Warum sollte ich wollen noch einen Schritt nehmen weiter, entfernen Sie diese zusammen, und 775 00:35:56,200 --> 00:35:59,860 legen Sie sie in einer separaten Datei? 776 00:35:59,860 --> 00:36:01,070 >> So kann ich es wiederverwenden, nicht wahr? 777 00:36:01,070 --> 00:36:03,155 Dies ist nur eine Art von Intuition zeigen. 778 00:36:03,155 --> 00:36:06,340 Vor, behauptete ich, dass es nur immer hässlich mit dem Stil 779 00:36:06,340 --> 00:36:08,480 Attribute innerhalb der DIVS sich. 780 00:36:08,480 --> 00:36:09,750 Aber nur irgendwie denken, dass durch. 781 00:36:09,750 --> 00:36:13,560 Wie die Seite wird immer länger und länger, wenn Sie setzen hier und hier, und 782 00:36:13,560 --> 00:36:18,350 hier und hier, all diese unterschiedlichen Farben und Schriftgrößen und andere solche 783 00:36:18,350 --> 00:36:22,550 Attribute, ist die Seite sehr schnell gehen zu unhandlich für Sie. 784 00:36:22,550 --> 00:36:24,570 >> Wenn jemand kommt zu Ihnen und sagt, oh, weißt du was? 785 00:36:24,570 --> 00:36:28,070 Ich würde wirklich gerne, um die Schriftgröße verändern durch zwei zusätzliche Punkte, Sie 786 00:36:28,070 --> 00:36:31,275 Möglicherweise müssen Sie gehen und suchen und ersetzen eine Vielzahl von Code-Zeilen. 787 00:36:31,275 --> 00:36:35,170 Es ist viel mehr zwingend zu zentralisieren alle solche Ästhetik hier. 788 00:36:35,170 --> 00:36:38,850 Aber wenn Sie möchten, um die Wiederverwendung Ästhetik in mehreren Web-Seiten, alle 789 00:36:38,850 --> 00:36:41,100 umso zwingender, um für So erstellen Sie eine Datei 790 00:36:41,100 --> 00:36:45,290 callte mit diesen Inhalten distanziert. 791 00:36:45,290 --> 00:36:46,680 >> Und lassen Sie mich dies tun. 792 00:36:46,680 --> 00:36:51,150 793 00:36:51,150 --> 00:36:51,920 Speichern Sie diese Datei. 794 00:36:51,920 --> 00:36:55,580 Ich sage styles.css, willkürlich, als konventionell. 795 00:36:55,580 --> 00:36:58,770 Ich werde es in John Harvard zu Hause setzen Jetzt Einfachheit Verzeichnis. 796 00:36:58,770 --> 00:37:03,880 Und was kann ich in meiner Web-Seite zu tun ist, erhalten Befreien Sie sich von dem Stil tag zusammen, 797 00:37:03,880 --> 00:37:08,270 und etwas unintuitively, verwenden Sie einen Link tag, die nicht geben Ihnen einen Link in 798 00:37:08,270 --> 00:37:13,140 der Hyperlink, anklickbare Sinne, sondern wo ich sage Link, href gleich 799 00:37:13,140 --> 00:37:15,120 styles.css. 800 00:37:15,120 --> 00:37:20,050 Und die Beziehung, dass dieses Element hat mit der Webseite ist es, so dienen 801 00:37:20,050 --> 00:37:21,280 seine Stylesheet. 802 00:37:21,280 --> 00:37:22,670 >> So, wie habe ich das wissen? 803 00:37:22,670 --> 00:37:25,950 Eine, die Sie gerade lesen Sie das Handbuch, oder Sie Google um, und Sie 804 00:37:25,950 --> 00:37:27,000 Blick auf verschiedene Ressourcen. 805 00:37:27,000 --> 00:37:30,520 Ich meine, das ist wirklich, wie Sie abholen Techniken wie diese, und im Einklang 806 00:37:30,520 --> 00:37:34,720 Mit dieser Idee des Unterrichts sich neue Sprachen, wieder, werden Sie feststellen, dass 807 00:37:34,720 --> 00:37:38,830 es gibt nur eine begrenzte Anzahl von Dingen zu jeder Sprache, die, sobald man 808 00:37:38,830 --> 00:37:41,310 sie, werden Sie feststellen, dass es geht schneller und schneller zu schreiben. 809 00:37:41,310 --> 00:37:44,180 In der Tat, das Erlernen einer neuen Programmiersprache Sprache ist so viel schneller als eine neue 810 00:37:44,180 --> 00:37:47,380 gesprochene Sprache, weil diese Dinge viel kleiner und viel mehr 811 00:37:47,380 --> 00:37:48,820 genau definiert. 812 00:37:48,820 --> 00:37:51,590 >> Aber ich habe ein bisschen hervorgehoben einer Anomalie hier. 813 00:37:51,590 --> 00:37:57,750 Warum habe ich diese hervorgehoben vorwärts hier Schrägstrich? 814 00:37:57,750 --> 00:37:59,420 Weil ich den Tag zu schließen haben. 815 00:37:59,420 --> 00:38:00,530 Ich sollte in der Nähe der tag. 816 00:38:00,530 --> 00:38:02,750 Und finden Sie unzählige Ressourcen online, die nicht tun, 817 00:38:02,750 --> 00:38:04,080 unbedingt nahe Tags. 818 00:38:04,080 --> 00:38:08,770 Und realistisch gesehen, ist es nicht unbedingt erforderlichen technischen und es gibt 819 00:38:08,770 --> 00:38:11,950 Aus Gründen der Wirklichkeit sind nur Browser ziemlich tolerant von Fehlern in Web 820 00:38:11,950 --> 00:38:14,360 Seiten, zum Besseren oder zum Schlechteren, aber meistens schlimmer. 821 00:38:14,360 --> 00:38:18,830 >> Also das hier ist nur ein sauberer Weg etwas zu sagen dumm wie dieses, 822 00:38:18,830 --> 00:38:22,330 wo, wenn Sie wollen, um den Link zu öffnen tag aber schließen, gibt es wirklich keine Ahnung 823 00:38:22,330 --> 00:38:23,720 der Inhalt für einen Link-Tag. 824 00:38:23,720 --> 00:38:26,000 Es bedeutet nur, laden Sie diese Datei und legen Sie sie hier. 825 00:38:26,000 --> 00:38:30,610 Es ist wie scharfe include in C. Sie können öffnen und schließen einen Tag auf einmal 826 00:38:30,610 --> 00:38:31,660 innerhalb der gleichen tag. 827 00:38:31,660 --> 00:38:33,520 Und es gibt andere Beispiele dafür. 828 00:38:33,520 --> 00:38:37,280 Dies ist nicht die Art und Weise, dies zu tun, aber das br-Tag für Zeilenumbrüche, wenn ich 829 00:38:37,280 --> 00:38:41,780 wirklich erreichen wollte, was ich war versuchen, bevor durch Drücken der Eingabetaste, wenn 830 00:38:41,780 --> 00:38:45,380 Ich ausdrücklich sagen, Zeilenumbruch, Zeilenumbruch, Zeilenumbruch, Zeilenumbruch, und 831 00:38:45,380 --> 00:38:49,100 dann laden Sie diese Seite, jetzt werden Sie feststellen, dass unten auf der Seite ist, 832 00:38:49,100 --> 00:38:51,940 in der Tat, viel weiter unten in die unten auf der Seite. 833 00:38:51,940 --> 00:38:55,840 Aber auch das kann noch viel mehr getan werden sauber mit CSS und mit Margen, 834 00:38:55,840 --> 00:38:58,120 und mit anderen solchen ästhetischen Techniken. 835 00:38:58,120 --> 00:38:59,940 >> So jetzt sind die Imbissbuden diese. 836 00:38:59,940 --> 00:39:02,320 In HTML, haben wir diese Dinge genannt Tags. 837 00:39:02,320 --> 00:39:04,830 In CSS, haben wir diese Dinge Eigenschaften genannt. 838 00:39:04,830 --> 00:39:08,700 Wir können comingle diese zwei Sprachen, entweder mit dem style-Attribut, 839 00:39:08,700 --> 00:39:14,240 oder die Style-Tag, oder am besten noch, Factoring es ganz, wie wir es tun 840 00:39:14,240 --> 00:39:17,270 Problem in 7 eingestellt. 841 00:39:17,270 --> 00:39:23,820 Fragen, dann über die konzeptionelle Grundlagen hier? 842 00:39:23,820 --> 00:39:24,740 >> ZUSCHAUER: Ich habe eine Frage. 843 00:39:24,740 --> 00:39:25,630 >> Sprecher 1: Oh, sorry. 844 00:39:25,630 --> 00:39:28,880 >> ZUSCHAUER: Warum war es nicht farbig - 845 00:39:28,880 --> 00:39:31,410 >> Sprecher 1: Oh, in der anderen Registerkarte? 846 00:39:31,410 --> 00:39:32,232 Das hier? 847 00:39:32,232 --> 00:39:33,482 >> ZUSCHAUER: Nein, es ist wie die - 848 00:39:33,482 --> 00:39:35,330 849 00:39:35,330 --> 00:39:39,480 >> Sprecher 1: Oh, das ist, weil Ich wurde schlampig. 850 00:39:39,480 --> 00:39:41,350 Ich habe die Datei in der falschen Stelle. 851 00:39:41,350 --> 00:39:47,840 Also, wenn ich tatsächlich legte sie hier, und ich chmod es, alle + r für styles.css und 852 00:39:47,840 --> 00:39:52,050 Jetzt die Seite neu laden, jetzt sind wir erhalten die Stilisierung zurück. 853 00:39:52,050 --> 00:39:54,530 Und weil die Schriftgrößen sind anders, sehen wir nicht ganz so viel 854 00:39:54,530 --> 00:39:55,010 Leerraum. 855 00:39:55,010 --> 00:39:58,240 Wir stattdessen sehen, was die Standardmäßig ist statt. 856 00:39:58,240 --> 00:40:00,050 Gute Frage. 857 00:40:00,050 --> 00:40:00,846 Ja? 858 00:40:00,846 --> 00:40:02,630 >> ZUSCHAUER: Warum ist der Link tag in der Kopf? 859 00:40:02,630 --> 00:40:06,270 >> Sprecher 1: Warum ist die Links Tag in der Kopfzeile - 860 00:40:06,270 --> 00:40:07,650 kurze Antwort, einfach nur so. 861 00:40:07,650 --> 00:40:08,930 Das ist, was beschlossen wurde. 862 00:40:08,930 --> 00:40:10,720 Das ist, wo die Link-Tags beim gehen Sie haben, was heißt ein 863 00:40:10,720 --> 00:40:13,650 externes Stylesheet. 864 00:40:13,650 --> 00:40:16,430 Weitere Fragen? 865 00:40:16,430 --> 00:40:17,770 >> Alles klar, lasst uns dies tun. 866 00:40:17,770 --> 00:40:20,500 Wir haben so viel Spaß vor uns heute. 867 00:40:20,500 --> 00:40:22,480 Das ist nur ein Bruchteil die Oberfläche der CSS. 868 00:40:22,480 --> 00:40:23,010 Lassen Sie uns dies tun. 869 00:40:23,010 --> 00:40:25,980 Werfen wir einen Fünf Minuten Pause hier weil nach meiner E-Mail, wir hängen in 870 00:40:25,980 --> 00:40:27,200 dort bis 02.30 Uhr-ish heute. 871 00:40:27,200 --> 00:40:28,540 Aber wenn Sie zu tun haben, um lassen, das ist in Ordnung. 872 00:40:28,540 --> 00:40:30,380 Aber wir forcieren nach fünf Minuten Pause. 873 00:40:30,380 --> 00:40:35,930 Und wir lernen, ein wenig etwas über PHP, MySQL, und vieles mehr. 874 00:40:35,930 --> 00:40:44,520 >> Alles klar, also lassen Sie uns versuchen, jetzt, eine Krawatte Einige dieser Ideen zusammen und machen, 875 00:40:44,520 --> 00:40:46,180 sagen, unsere eigene Suchmaschine. 876 00:40:46,180 --> 00:40:48,570 Ich bemerkte, eher neugierig, der folgende. 877 00:40:48,570 --> 00:40:52,610 Wenn Sie bei Google.com sind, sind Sie typischerweise bei einer URL wie dieser hier 878 00:40:52,610 --> 00:40:54,870 mit nichts nach der dot com. 879 00:40:54,870 --> 00:40:59,760 Aber wenn ich etwas Dummes wie suchen Katzen, und drücken Sie die Eingabetaste, dann bekommen wir - nicht 880 00:40:59,760 --> 00:41:01,300 dumm, aber Sie wissen. 881 00:41:01,300 --> 00:41:05,410 >> OK, so bemerken, die am oberen Rand der Seite, Jetzt hat die URL natürlich verändert. 882 00:41:05,410 --> 00:41:07,190 Und das ist nicht alles neu in jedem von uns. 883 00:41:07,190 --> 00:41:09,290 Sie klicken auf Links und Zeug geschieht über das Internet. 884 00:41:09,290 --> 00:41:11,420 Aber was ist interessant hier ist die folgende. 885 00:41:11,420 --> 00:41:14,500 Es gibt eine ganze Menge Unordnung, aber wir mich wegwerfen Sachen, die ich nicht tun 886 00:41:14,500 --> 00:41:16,600 ganz verstehen oder nicht sehen wirklich relevant. 887 00:41:16,600 --> 00:41:18,490 >> Lassen Sie mich diese loszuwerden. 888 00:41:18,490 --> 00:41:20,030 Lassen Sie mich diese loszuwerden. 889 00:41:20,030 --> 00:41:22,630 Und lassen Sie mich nur loswerden all dies. 890 00:41:22,630 --> 00:41:28,840 Und nun feststellen, dass Katzen in der URL ist, folgte mit einem q, dann eine gleiche 891 00:41:28,840 --> 00:41:29,710 Anmeldung vor ihm. 892 00:41:29,710 --> 00:41:32,110 So stellt sich heraus, das ist, wie die So funktioniert es, wenn es darum geht, 893 00:41:32,110 --> 00:41:33,360 die Eingabe und Ausgabe. 894 00:41:33,360 --> 00:41:37,510 >> Wir haben lange darüber gesprochen black boxes, nicht wahr? 895 00:41:37,510 --> 00:41:41,650 Also, wenn es sich um eine Funktion implementiert hier als Black Box, dauert es Eingang 896 00:41:41,650 --> 00:41:45,290 und erzeugt eine Ausgabe, na ja, das bedeutet, mit denen Sie Input für eine 897 00:41:45,290 --> 00:41:49,270 Website ist durch, oft ihrer URLs. 898 00:41:49,270 --> 00:41:52,850 Sie einfach ein Fragezeichen und dann eine Taste gleich Wert. 899 00:41:52,850 --> 00:41:56,740 Und dann vielleicht ein kaufmännisches und dann ein weiterer wichtiger Wert ist gleich, dann vielleicht 900 00:41:56,740 --> 00:41:58,810 eine andere kaufmännische, Istgleichtaste Wert. 901 00:41:58,810 --> 00:42:03,030 Das ist, wie Sie in Schlüssel übergeben und Werte-Paare von Eingängen. 902 00:42:03,030 --> 00:42:07,050 >> Also, wenn ich jetzt Enter drücken, ist das, was Interessant ist, dass alle Google 903 00:42:07,050 --> 00:42:10,420 die Unordnung Ich löschte nicht angezeigt zu sein, unbedingt erforderlich ist. 904 00:42:10,420 --> 00:42:15,120 Alles was ich brauche, um zu Google senden Frage Marke q gleich Katzen zu bekommen 905 00:42:15,120 --> 00:42:16,160 wieder einige Katzen. 906 00:42:16,160 --> 00:42:20,160 Nun, die Implikation, dass dann, ist, wenn ich gedit ziehen, habe ich begonnen 907 00:42:20,160 --> 00:42:24,360 meine eigenen Suchmaschine hier in einer Datei namens seach0.html. 908 00:42:24,360 --> 00:42:26,750 >> Und lassen Sie mich gehen und löschen eine weitere Linie, die Sie 909 00:42:26,750 --> 00:42:27,910 waren eigentlich nicht zu sehen. 910 00:42:27,910 --> 00:42:31,070 Und jetzt lassen Sie mich in meinen eigenen Browser zu gehen, so nicht zu Google, und gehen Sie zu 911 00:42:31,070 --> 00:42:34,900 http://localhost. 912 00:42:34,900 --> 00:42:36,220 Und das geht bis in die Quere kommen. 913 00:42:36,220 --> 00:42:43,240 Also sind wir zu haben, um auf Wiedersehen zu sagen dass für jetzt, verschieben Sie diese hier, 914 00:42:43,240 --> 00:42:46,270 oh, jetzt sind wir zu haben, um Abschied von dieser Datei. 915 00:42:46,270 --> 00:42:51,700 >> Immer wenn Sie eine Datei namens index.html oder index.php in eine 916 00:42:51,700 --> 00:42:54,980 Verzeichnis, wenn der Web-Server konfiguriert auf diese Weise, was Sie 917 00:42:54,980 --> 00:42:59,600 sehen, standardmäßig ist der Inhalt, dass Datei statt einer Auflistung der 918 00:42:59,600 --> 00:43:02,330 Verzeichnis, wie ich hier wollte. 919 00:43:02,330 --> 00:43:03,750 Mehr dazu in der spec. 920 00:43:03,750 --> 00:43:04,610 Sie haben es nicht sehen. 921 00:43:04,610 --> 00:43:06,360 >> Also das ist, was ich eigentlich wollte. 922 00:43:06,360 --> 00:43:08,810 Aber einen Moment vor, es war ein Datei in diesem Ordner namens 923 00:43:08,810 --> 00:43:11,290 index.html und index.php. 924 00:43:11,290 --> 00:43:13,380 Und so war der Webserver zeigt mir diese Dateien. 925 00:43:13,380 --> 00:43:15,900 Stattdessen möchte ich dieses Verzeichnis Auflistung hier. 926 00:43:15,900 --> 00:43:18,340 >> Also werde ich in zu gehen CSS und search0 gehen. 927 00:43:18,340 --> 00:43:21,770 Und ich behaupte, dass dies es zu gehen der Beginn meiner eigenen Wettbewerbsposition 928 00:43:21,770 --> 00:43:22,490 Suchmaschinen. 929 00:43:22,490 --> 00:43:27,630 Und um dies zu tun, werde ich gehen in hier, in CSS, und öffnen Sie mit 930 00:43:27,630 --> 00:43:30,190 gedit, Suche 0. 931 00:43:30,190 --> 00:43:32,280 Aber leider gibt es nicht viel los hier. 932 00:43:32,280 --> 00:43:35,690 Alles, was ich tat, war mit einem Überschrift-Tag, die passiert genannt h1 werden, die 933 00:43:35,690 --> 00:43:38,180 bedeutet im Wesentlichen, groß und fett, und das ist es. 934 00:43:38,180 --> 00:43:40,810 Aber die Mittel, mit denen wir bieten Eingänge sind über diese 935 00:43:40,810 --> 00:43:42,180 Dinge genannt Formen. 936 00:43:42,180 --> 00:43:46,040 >> Also lassen Sie mich gehen Sie vor und öffnen und schließen, präventiv ein form-Tag gibt. 937 00:43:46,040 --> 00:43:48,060 Und lassen Sie mich gehen Sie vor und tun etwas wie dieses. 938 00:43:48,060 --> 00:43:51,430 Eingang, Typ gleich Text. 939 00:43:51,430 --> 00:43:56,320 Und dann wollen wir schließen den Tag im die Klammern selbst. 940 00:43:56,320 --> 00:43:58,800 Ich brauche, um ein Textfeld zu starten und stoppen Sie ein Textfeld. 941 00:43:58,800 --> 00:44:01,080 Es ist einfach, dort zu sein oder nicht. 942 00:44:01,080 --> 00:44:06,210 >> Und dann darunter, lass es uns tun input type gleich einreichen. 943 00:44:06,210 --> 00:44:06,870 Speichern Sie diese. 944 00:44:06,870 --> 00:44:08,630 Und nun lasst uns einfach tun ein praktischen Vernunft zu überprüfen. 945 00:44:08,630 --> 00:44:09,820 Lasst uns neu zu laden. 946 00:44:09,820 --> 00:44:10,890 >> OK, es ist nicht schlecht. 947 00:44:10,890 --> 00:44:13,260 Es ist nicht die Google-Stil, aber es ist ziemlich nahe. 948 00:44:13,260 --> 00:44:13,920 Es ist ein Textfeld. 949 00:44:13,920 --> 00:44:17,190 Ich kann ein paar Sachen in eingeben, Enter drücken, aber nichts passiert noch. 950 00:44:17,190 --> 00:44:21,090 Und das ist, weil ich nicht angegeben haben eine Aktion für diese Form, so zu sprechen. 951 00:44:21,090 --> 00:44:23,860 Also, wenn ich gehe zurück zum Formular-Element, es stellt sich heraus, und ich weiß, dieses nur 952 00:44:23,860 --> 00:44:27,460 aus dem Lesen der Dokumentation, dass die form-Tag nimmt ein Attribut 953 00:44:27,460 --> 00:44:31,880 genannt Aktion, die die URL der Webseite, auf die Sie 954 00:44:31,880 --> 00:44:34,790 wollen, um das Formular zu senden. 955 00:44:34,790 --> 00:44:37,610 >> Ich glaube nicht wirklich, dass wir Zeit haben, um Umsetzung des gesamten Back-End für eine 956 00:44:37,610 --> 00:44:38,570 Suchmaschine heute. 957 00:44:38,570 --> 00:44:41,900 Daher freuen wir uns gerade sagen, eh, Geh zu google.com / search. 958 00:44:41,900 --> 00:44:43,450 Und jetzt lassen Sie mich schließe meine Zitate. 959 00:44:43,450 --> 00:44:46,070 Und lassen Sie mich weiter zu spezifizieren, dass die Methode zu verwenden, wird 960 00:44:46,070 --> 00:44:47,120 genannt zu werden. 961 00:44:47,120 --> 00:44:50,650 >> Lange Rede kurzer Sinn, es gibt zwei Möglichkeiten, um least, die Sie einreichen können Informationen 962 00:44:50,650 --> 00:44:51,880 vom Browser zum Server. 963 00:44:51,880 --> 00:44:55,340 Man ist zu bekommen, und für die heutigen Zwecke, Das bedeutet nur in der URL. 964 00:44:55,340 --> 00:44:58,730 Sie sehen genau die Fragezeichen, die Gleichheitszeichen und kaufmännische dass 965 00:44:58,730 --> 00:44:59,780 sahen wir früher. 966 00:44:59,780 --> 00:45:02,890 Oder gibt es eine Alternative genannt Pfosten. 967 00:45:02,890 --> 00:45:06,490 Denn jetzt wissen, dass Post wird häufig verwendet, wenn Sie Dateien hochladen möchten, wie 968 00:45:06,490 --> 00:45:09,820 Bilder und so weiter, oder wenn Sie wollen, einreichen Kreditkarten-Informationen oder 969 00:45:09,820 --> 00:45:13,810 Passwörter, alles, was es nicht wirklich Sinn, konzeptionell oder 970 00:45:13,810 --> 00:45:18,020 Sicherheit klug, um am Ende in der URL Ihrem Browser, wo Snooping Eltern, 971 00:45:18,020 --> 00:45:21,520 oder Mitbewohnern, oder jemand mit Zugang auf Ihrem Computer sehen könnte. 972 00:45:21,520 --> 00:45:23,110 >> Also lasst uns das hier sparen. 973 00:45:23,110 --> 00:45:24,480 Und ich muss noch eine andere Sache zu tun. 974 00:45:24,480 --> 00:45:27,250 Es genügt nicht, nur um sagen mir ein Textfeld. 975 00:45:27,250 --> 00:45:29,850 Ich muss zu geben, dass Feldes schätzen einen Namen. 976 00:45:29,850 --> 00:45:34,500 Also lassen Sie mich ausleihen Google die Wahl der Namen, q, und geben Sie diese zweite 977 00:45:34,500 --> 00:45:38,150 schreibe ich nicht wirklich interessieren der Name der Schaltfläche Senden. 978 00:45:38,150 --> 00:45:40,890 Alles, was ich interessiert, ist die Einreichung was der Benutzer eingibt in. 979 00:45:40,890 --> 00:45:41,940 >> Und jetzt ist dies Art von hässlich. 980 00:45:41,940 --> 00:45:42,820 Es sagt nur, einzureichen. 981 00:45:42,820 --> 00:45:46,350 Es stellt sich heraus, und ich weiß, dass dies von der Dokumentation, kann ich wirklich sagen, 982 00:45:46,350 --> 00:45:51,710 Wert gleich Zitat unquote "CS50 Suchanfrage, "close zitieren. 983 00:45:51,710 --> 00:45:53,030 Dann lass uns wieder neu zu laden. 984 00:45:53,030 --> 00:45:57,020 Also ich schlagen immer Befehlstaste-R oder Strg-R auf meiner Tastatur zu laden. 985 00:45:57,020 --> 00:45:58,605 >> Jetzt haben wir eine weitere interessante Suchmaschinen. 986 00:45:58,605 --> 00:46:00,340 Es ist nicht ganz so aussehen Google noch, though. 987 00:46:00,340 --> 00:46:04,100 Also lasst uns gehen in hier und ein wenig Zeilenumbruch. 988 00:46:04,100 --> 00:46:06,066 >> OK, so jetzt haben wir Google. 989 00:46:06,066 --> 00:46:08,260 Wir haben eigentlich fast nicht haben Google. 990 00:46:08,260 --> 00:46:10,460 Und was jetzt passieren wird? 991 00:46:10,460 --> 00:46:12,220 Ich werde in etwas geben wie Katzen. 992 00:46:12,220 --> 00:46:16,570 Und der Browser wird analysiert dass Form, die ich definiert. 993 00:46:16,570 --> 00:46:19,470 Und es wird zu senden der Benutzer auf diese URL. 994 00:46:19,470 --> 00:46:23,420 Also dieser Zeit, aus irgendeinem Grund, neugierig, Ich habe mehr Informationen über Aktien 995 00:46:23,420 --> 00:46:24,410 als über die tatsächliche Katzen. 996 00:46:24,410 --> 00:46:30,580 Aber das ist in Ordnung, weil wir noch bemerken, hier gelandet, gleich q Katzen. 997 00:46:30,580 --> 00:46:35,200 >> So lange Rede, kurzer Sinn, es scheint ziemlich trivial einer Eingabe durch den Benutzer zu erhalten. 998 00:46:35,200 --> 00:46:38,190 Und um fair zu sein, gibt es Trauben von anderen Arten von Formularfeldern. 999 00:46:38,190 --> 00:46:41,510 Es gibt Kontrollkästchen, und wenig gegenseitig exklusive Radio-Buttons, und 1000 00:46:41,510 --> 00:46:42,960 Drop-Down-Menüs, und vieles mehr. 1001 00:46:42,960 --> 00:46:46,160 Aber all das sind als relativ leicht als umgesetzt 1002 00:46:46,160 --> 00:46:48,040 dieser Text Feld war. 1003 00:46:48,040 --> 00:46:52,050 Und schließlich müssen wir einfach machen dass jemand an der anderen hören 1004 00:46:52,050 --> 00:46:56,490 Ende der Zeile, um das zu bekommen Informationen verarbeitet, irgendwie, und 1005 00:46:56,490 --> 00:46:58,440 geben uns unsere Katzen. 1006 00:46:58,440 --> 00:47:00,840 >> Lassen Sie uns zu einem etwas aussehen mehr beteiligt Beispiel. 1007 00:47:00,840 --> 00:47:06,020 Lassen Sie mich in meinem Vhost das Verzeichnis gehen, in lokalen Host, Öffentlichkeit, und wo ich 1008 00:47:06,020 --> 00:47:06,980 legte heute den Quellcode. 1009 00:47:06,980 --> 00:47:09,800 All dies wird auf dem Kurs der sein Website für Sie zu basteln. 1010 00:47:09,800 --> 00:47:15,420 Und wenn ich in froshims gehen, lassen Sie mich offen bis diese Datei jetzt froshim0.php. 1011 00:47:15,420 --> 00:47:18,460 Das hier ist ein wenig ausführlicher, so werden wir nicht schreiben von Grund auf. 1012 00:47:18,460 --> 00:47:21,970 Aber gerade jetzt feststellen, ein paar etwas Eigenschaften vertraut. 1013 00:47:21,970 --> 00:47:24,550 >> One, Form-Tag, andere Aktion. 1014 00:47:24,550 --> 00:47:25,670 Es ist nicht eine vollständige URL. 1015 00:47:25,670 --> 00:47:29,930 Jetzt ist es offenbar in eine Datei namens register0.php weil in einem Augenblick, 1016 00:47:29,930 --> 00:47:32,660 Ich werde zu lehren mich ein wenig etwas über PHP, eine Programmiersprache 1017 00:47:32,660 --> 00:47:37,360 Sprache, weil PHP verwendet werden können umzusetzen, was Google als umgesetzt 1018 00:47:37,360 --> 00:47:39,650 das hintere Ende der Suchmaschinen. 1019 00:47:39,650 --> 00:47:42,890 >> Google, in der Realität wahrscheinlich verwendet einige Python, einige C + +, und 1020 00:47:42,890 --> 00:47:44,230 Trauben von anderen Sprachen. 1021 00:47:44,230 --> 00:47:48,230 Aber wir könnten sicherlich umsetzen Suche Ergebnisse mit PHP, wenn wir wollten. 1022 00:47:48,230 --> 00:47:49,610 Aber jetzt werden wir es einfach halten. 1023 00:47:49,610 --> 00:47:53,320 Und dies ist tatsächlich erinnert an eine der anderen ersten Websites, die ich 1024 00:47:53,320 --> 00:47:54,490 vor Jahren gemacht. 1025 00:47:54,490 --> 00:47:58,160 >> Zurück in meinem Tag, registriert Sie für intramuralen Sport als Neuling durch 1026 00:47:58,160 --> 00:48:00,880 Ausfüllen ein Stück Papier, Wandern über den Hof, und Ablegen in 1027 00:48:00,880 --> 00:48:04,890 die Mailbox eines Proctor in Wigglesworth, und das war, wie Sie 1028 00:48:04,890 --> 00:48:05,460 registriert. 1029 00:48:05,460 --> 00:48:09,650 Und so mein Projekt kurz nach CS50, war zu setzen, dass die macht den Meister 1030 00:48:09,650 --> 00:48:13,460 Sinn, auf die Bahn, die war nicht wie in der Mode dann, wie es jetzt ist. 1031 00:48:13,460 --> 00:48:17,510 Aber alles, was wir tun mussten, war zu erstellen, Wesentlichen ein HTML-Formular. 1032 00:48:17,510 --> 00:48:19,640 >> Und das sah Form ungefähr so. 1033 00:48:19,640 --> 00:48:22,480 Ich hatte einen Eingang für die Neuling Namen. 1034 00:48:22,480 --> 00:48:27,780 Ich hatte ein anderes Kontrollkästchen ob oder nicht, sie wollten Kapitän, was sein 1035 00:48:27,780 --> 00:48:30,400 ihr Geschlecht war, und was ihrem Wohnheim war. 1036 00:48:30,400 --> 00:48:33,370 Und dann habe ich hart in Sachen codiert wie Apley Court und Canaday, 1037 00:48:33,370 --> 00:48:34,880 Grau, und so weiter. 1038 00:48:34,880 --> 00:48:36,300 >> Also noch einmal, neue Tags. 1039 00:48:36,300 --> 00:48:39,820 Haben diese nicht gesehen, neue Attribute, aber recht zugänglich. 1040 00:48:39,820 --> 00:48:42,360 Sobald Sie ein Beispiel sehen, können Sie Art von leihen diese Idee und machen einen Tropfen 1041 00:48:42,360 --> 00:48:43,820 down-Menü für die meisten nichts. 1042 00:48:43,820 --> 00:48:46,350 Aber was ist Schlüssel ist, dass jeder diese Dinge haben Namen. 1043 00:48:46,350 --> 00:48:49,720 Und am Ende des Formulars gibt es ein Submit-Button, dessen Etikett, 1044 00:48:49,720 --> 00:48:51,510 oder Wert ist das Register. 1045 00:48:51,510 --> 00:48:52,670 >> Lassen Sie uns also auf diese Seite zu gehen. 1046 00:48:52,670 --> 00:48:55,050 Lassen Sie mich gehen zurück in die Verzeichnisliste. 1047 00:48:55,050 --> 00:48:59,410 Lassen Sie mich in froshims gehen, und froshim0.php gehen. 1048 00:48:59,410 --> 00:49:01,150 So ist es scheußlich, um fair zu sein. 1049 00:49:01,150 --> 00:49:03,950 So konnte ich definitiv stilisieren diese mit einigen CSS, konnte ich einige 1050 00:49:03,950 --> 00:49:06,890 Grafiken, vielleicht fügen Sie einige Farben, und machen dieses hübscher. 1051 00:49:06,890 --> 00:49:10,530 Aber funktional, würde ich argumentieren, dass diese ist eigentlich ziemlich komplett. 1052 00:49:10,530 --> 00:49:15,190 >> Leider, wenn ich füllen diese aus, David, Kapitän, Männlich, wählen wir, 1053 00:49:15,190 --> 00:49:20,510 sagen wir Matthews, Register, alles, was passiert, ist folgendes. 1054 00:49:20,510 --> 00:49:21,910 Aber beachten Sie ein paar Imbissbuden. 1055 00:49:21,910 --> 00:49:27,130 Einer kehrte welche Datei die Ergebnisse, offenbar? 1056 00:49:27,130 --> 00:49:29,470 So ist es in der Tat register0.php. 1057 00:49:29,470 --> 00:49:34,570 Also die Tatsache, dass wir diese Aktion sah Wert vor einem Augenblick für register0, diese 1058 00:49:34,570 --> 00:49:37,500 bestätigt, dass wir in der Tat beendet bis zu diesem bestimmten Datei. 1059 00:49:37,500 --> 00:49:39,040 >> Nun ist dies nur hässlich Text. 1060 00:49:39,040 --> 00:49:42,810 Aber beachten Sie, dass dieser Text ist aus lokalen Host 1061 00:49:42,810 --> 00:49:44,170 das aus dem Gerät. 1062 00:49:44,170 --> 00:49:46,350 Denken Sie an das Gerät nun als nur ein Webserver, der in der sein könnte 1063 00:49:46,350 --> 00:49:46,910 Science Center. 1064 00:49:46,910 --> 00:49:48,060 Es könnte auf dem tatsächlichen Web. 1065 00:49:48,060 --> 00:49:49,850 So ist es öffentlich zugänglich. 1066 00:49:49,850 --> 00:49:55,480 >> So klar, es gibt eine Möglichkeit der Weitergabe Formularfeld Eingänge zu einem Server 1067 00:49:55,480 --> 00:49:56,840 so dass es etwas mit ihnen zu tun. 1068 00:49:56,840 --> 00:49:59,020 Leider register0 ist ziemlich dumm. 1069 00:49:59,020 --> 00:50:01,870 Alles, was sie tut, ist Ausdruck eines Arrays das sieht so aus. 1070 00:50:01,870 --> 00:50:04,790 Und es ist nicht ein Array in der Sinne, dass wir sie kennen. 1071 00:50:04,790 --> 00:50:08,760 Es stellte sich heraus, dass PHP und eine Menge Sprachen, haben nicht nur numerisch 1072 00:50:08,760 --> 00:50:12,350 indizierte Arrays, deren erste Index Null ist, dann eins, dann zwei, dann dot, 1073 00:50:12,350 --> 00:50:13,780 Punkt, Punkt, n minus 1. 1074 00:50:13,780 --> 00:50:16,400 >> Dies ist, was heißt ein assoziatives Array. 1075 00:50:16,400 --> 00:50:21,150 Ein assoziatives Array ist, in dem Sie speichern können Schlüssel-Wert-Paaren, wo 1076 00:50:21,150 --> 00:50:23,160 der Schlüssel ist nicht unbedingt eine Nummer. 1077 00:50:23,160 --> 00:50:25,580 Es könnte in der Tat ein String, ein Wort sein. 1078 00:50:25,580 --> 00:50:28,230 Und so kann dies realisiert werden, unter der Haube, stellt sich heraus, 1079 00:50:28,230 --> 00:50:31,896 Verwendung einer Datenstruktur als eine bekannte? 1080 00:50:31,896 --> 00:50:33,600 Dachte, etwas Dramatisches war zu geschehen - 1081 00:50:33,600 --> 00:50:34,840 Hash-Tabelle. 1082 00:50:34,840 --> 00:50:38,955 >> So eine Hash-Tabelle, Rückruf, diejenigen von Ihnen wer es getan hat für P Satz 6 oder sogar erinnern 1083 00:50:38,955 --> 00:50:44,110 es zumindest, auch wenn Sie einen Versuch haben, eine Hash-Tabelle, in unsere Nutzungsbedingungen, wurde verwendet 1084 00:50:44,110 --> 00:50:45,090 speichern nur Worte. 1085 00:50:45,090 --> 00:50:47,980 Aber wirklich, Sie waren Speichern Schlüssel und Werte. 1086 00:50:47,980 --> 00:50:51,940 Wenn Sie implementiert eine Hash-Tabelle für P Satz 6 Wörterbuch, waren die Schlüssel der 1087 00:50:51,940 --> 00:50:56,890 Wörter selbst, und die Werte waren effektiv wahr oder falsch. 1088 00:50:56,890 --> 00:51:00,190 Ja, hier, oder implizit, nein, nicht hier. 1089 00:51:00,190 --> 00:51:02,140 >> Nun, wir können die Idee verallgemeinern. 1090 00:51:02,140 --> 00:51:06,230 Und wir könnten eine sehr ähnliche Daten Struktur nicht die Zeichenfolge speichern 1091 00:51:06,230 --> 00:51:10,180 sich allein in Ihrem Hash-Tabelle, aber annehmen, dass in jeder Ihrer Hash 1092 00:51:10,180 --> 00:51:11,130 Tabelle Knoten. 1093 00:51:11,130 --> 00:51:14,210 Und man konnte dies sogar in einem Versuch anstatt einfach nur einen bool. 1094 00:51:14,210 --> 00:51:15,350 Sie hätten etwas anderes. 1095 00:51:15,350 --> 00:51:19,590 Was ist, wenn der Schlüssel nicht maxwell, für So aber Zitat unquote "name" oder 1096 00:51:19,590 --> 00:51:22,900 zitieren unquote "Kapitän." Und innerhalb von Ihre C-Datenstruktur, setzen Sie ein 1097 00:51:22,900 --> 00:51:26,170 Wert, nicht nur ein Boolean, aber der Wert Zitat unquote wie "David" oder 1098 00:51:26,170 --> 00:51:28,690 "M" oder "Matthews," und so weiter. 1099 00:51:28,690 --> 00:51:33,170 >> Also die gleichen Datenstrukturen verwendeten wir offenbar in anderen Sprachen existieren. 1100 00:51:33,170 --> 00:51:37,650 Und ich würde behaupten, sie sind eigentlich viel, viel einfacher, hier zuzugreifen. 1101 00:51:37,650 --> 00:51:40,300 Lassen Sie uns in der Tat einen Blick jetzt irgendwann wie Syntax. 1102 00:51:40,300 --> 00:51:43,120 >> Ich werde in eine PHP Verzeichnis. 1103 00:51:43,120 --> 00:51:48,390 Und ich werde zu öffnen, eine bessere Version von hallo-0 aus der Zeit vor. 1104 00:51:48,390 --> 00:51:50,270 Beachten Sie, dass alles, was ich tat, war fügen Sie einige Kommentare. 1105 00:51:50,270 --> 00:51:52,530 So können wir loswerden, dass Ablenkung. 1106 00:51:52,530 --> 00:51:57,610 >> Und dieses Programm tatsächlich druckt hallo, weil ich angegeben zwischen 1107 00:51:57,610 --> 00:52:01,420 Tags, die ich möchte, dass Code ausgeführt werden. 1108 00:52:01,420 --> 00:52:03,380 Nun werden wir in einem Moment sehen warum dies sinnvoll ist. 1109 00:52:03,380 --> 00:52:05,630 Aber lassen Sie öffnen ein weiteres Beispiel. 1110 00:52:05,630 --> 00:52:10,430 Lassen Sie mich gehen Sie vor und eröffnen sagen, gedit Bedingungen einer. 1111 00:52:10,430 --> 00:52:12,970 >> Dies ist Weg zurück in Zeit. 1112 00:52:12,970 --> 00:52:16,320 Aber Wochen, glaube ich, in einer Woche oder Woche zwei, hatten wir ein Beispiel genannt 1113 00:52:16,320 --> 00:52:18,470 conditions1.c. 1114 00:52:18,470 --> 00:52:22,050 Und ich beschloss, es in PHP reimplementieren, nur um Art betonen, dass 1115 00:52:22,050 --> 00:52:26,500 PHP, syntaktisch, ist fast identisch zu C. Dies ist nicht ein großer Sprung 1116 00:52:26,500 --> 00:52:27,840 aus der vergangenen Woche auf diese. 1117 00:52:27,840 --> 00:52:31,230 >> Beachten Sie an der Spitze dieses Programms, das beginnt, nach wie vor mit einigen 1118 00:52:31,230 --> 00:52:34,260 Kommentare, die ich loswerden werde der als Ablenkung. 1119 00:52:34,260 --> 00:52:37,410 Beachten Sie, dass ich in PHP bin Modus in dieser Datei. 1120 00:52:37,410 --> 00:52:40,160 Also in diesem Code, wir werden sehen, ausgeführt zu werden. 1121 00:52:40,160 --> 00:52:42,670 Beachten Sie, dass es readline, das ist wahrscheinlich die 1122 00:52:42,670 --> 00:52:46,230 Analog in PHP von getstring. 1123 00:52:46,230 --> 00:52:47,390 Beachten Sie, es ist ein wenig anders. 1124 00:52:47,390 --> 00:52:51,410 Sie geben tatsächlich eine Aufforderung zur Funktion aufgerufen lesen Linie, und das ist 1125 00:52:51,410 --> 00:52:52,180 was der Benutzer sieht. 1126 00:52:52,180 --> 00:52:53,520 So müssen Sie nicht haben, um printf manuell. 1127 00:52:53,520 --> 00:52:54,860 Aber das ist keine große Sache. 1128 00:52:54,860 --> 00:52:59,150 Ich werde zu speichern, innerhalb von $ n, die Rückgabewert dieser, so unabhängig von der 1129 00:52:59,150 --> 00:53:00,490 Benutzer in ist ihre int. 1130 00:53:00,490 --> 00:53:01,660 Und hier ist eine andere Neugier. 1131 00:53:01,660 --> 00:53:05,810 Es stellt sich heraus, in PHP, keine variable nur muss vorangestellt werden 1132 00:53:05,810 --> 00:53:06,970 mit einem Dollarzeichen. 1133 00:53:06,970 --> 00:53:08,110 Es ist ein wenig ärgerlich. 1134 00:53:08,110 --> 00:53:10,870 Aber beachten Sie, was ich nicht in PHP getan. 1135 00:53:10,870 --> 00:53:13,980 Was ist von der linken Hand fehlt Seite des Gleichheitszeichen? 1136 00:53:13,980 --> 00:53:15,430 >> Keine Erwähnung des Typs. 1137 00:53:15,430 --> 00:53:19,400 Das ist also verschieden von C. Zur besseren oder zum Schlechten, ist PHP eine lose 1138 00:53:19,400 --> 00:53:20,550 typisierte Sprache. 1139 00:53:20,550 --> 00:53:22,010 Es hat Zahlen. 1140 00:53:22,010 --> 00:53:23,240 Es hat Saiten. 1141 00:53:23,240 --> 00:53:24,015 Es hat Booleans. 1142 00:53:24,015 --> 00:53:26,220 Und es hat ein paar anderen Datentypen. 1143 00:53:26,220 --> 00:53:30,570 Aber du, der Programmierer, in der Regel müssen nicht um sie kümmern. 1144 00:53:30,570 --> 00:53:34,010 Der Vorteil davon ist, dass es macht es ein wenig einfacher zu programmieren. 1145 00:53:34,010 --> 00:53:35,380 Sie können ein bisschen weniger zu denken. 1146 00:53:35,380 --> 00:53:39,840 Der Nachteil ist, sie eröffnet auch Sie bis zu potenzielle Fehler, wenn Sie versehentlich 1147 00:53:39,840 --> 00:53:43,080 behandeln eine Zahl als Zeichenfolge, einer Zeichenfolge als eine Zahl, die möglicherweise, aber auch 1148 00:53:43,080 --> 00:53:46,150 dann, PHP, und eine Menge von Sprachen, sind ziemlich tolerant. 1149 00:53:46,150 --> 00:53:49,050 Sie werden verwendet, was heißt implizites Casting. 1150 00:53:49,050 --> 00:53:55,220 Und wenn Sie versuchen, n im Kontext verwenden eines numerischen Situation wird es 1151 00:53:55,220 --> 00:53:58,040 konvertieren, was hier los ist, ein sein String, denn wenn der Benutzer Arten 1152 00:53:58,040 --> 00:54:01,570 etwas, und Sie erhalten das Ergebnis, wie bei readline oder den String, 1153 00:54:01,570 --> 00:54:02,910 das wird eine Zeichenfolge zurück. 1154 00:54:02,910 --> 00:54:07,360 >> Beachten Sie aber, ein paar Zeilen später, ich überprüfen, wenn n größer als null ist. 1155 00:54:07,360 --> 00:54:13,370 So PHP wird implizit warf meine "String" 123, oder was auch immer der Benutzer 1156 00:54:13,370 --> 00:54:14,860 Typen in in einen int. 1157 00:54:14,860 --> 00:54:18,730 Also kurz gesagt, Zeug funktioniert einfach viel mehr intuitiv. 1158 00:54:18,730 --> 00:54:23,410 Also haben wir jetzt damit beginnen, ein paar der Entspannung Dinge, die wir in der Vergangenheit getan haben. 1159 00:54:23,410 --> 00:54:24,780 >> Eine Menge von diesem Zeug ist das gleiche, though. 1160 00:54:24,780 --> 00:54:26,340 Sie haben noch gleich gleich. 1161 00:54:26,340 --> 00:54:30,350 Nebenbei PHP hat auch gleich gleich gleich, aber mehr dazu vielleicht in 1162 00:54:30,350 --> 00:54:30,850 die Zukunft. 1163 00:54:30,850 --> 00:54:31,150 Das war eine. 1164 00:54:31,150 --> 00:54:35,660 Tippfehler, sondern zwei Gleichheitszeichen bedeutet das gleiche Sache nach wie vor für den Vergleich. 1165 00:54:35,660 --> 00:54:37,060 printf bedeutet dasselbe wie vorher. 1166 00:54:37,060 --> 00:54:39,160 Backslash n bedeutet die gleiche Sache wie zuvor. 1167 00:54:39,160 --> 00:54:40,390 >> Also wie kann ich dieses Programm? 1168 00:54:40,390 --> 00:54:44,400 Nun, nach wie vor, wenn ich PHP, conditions1.php, und geben Sie in 1169 00:54:44,400 --> 00:54:46,560 eine Zahl wie 123. 1170 00:54:46,560 --> 00:54:47,720 Das ist eine positive Zahl ist. 1171 00:54:47,720 --> 00:54:49,510 Wenn ich in 0 geben, nehme ich 0. 1172 00:54:49,510 --> 00:54:53,700 Und wenn ich schreibe in negativen 123, bekomme ich Sichern einer negativen Zahl, die nur 1173 00:54:53,700 --> 00:54:59,050 zu sagen, syntaktisch, PHP ist super, super ähnlich. 1174 00:54:59,050 --> 00:55:03,250 >> Also, warum ist dies nun nützlich in einem Web-Kontext? 1175 00:55:03,250 --> 00:55:06,710 Nun, gehen wir zurück zu diesem froshims Beispiel, das sah, 1176 00:55:06,710 --> 00:55:08,600 wieder, wie dieses hier. 1177 00:55:08,600 --> 00:55:11,580 Und lasst uns tatsächlich ziehen die Web-Seite wieder, sah das so. 1178 00:55:11,580 --> 00:55:14,930 Was können wir tun, mit dem Daten Das ist eingereicht? 1179 00:55:14,930 --> 00:55:18,770 >> Nun, lassen Sie mich eröffnen eine neuere Version davon. 1180 00:55:18,770 --> 00:55:20,920 Und Sie werden sehen, dass das Problem Sätze Spezifikation führt Sie 1181 00:55:20,920 --> 00:55:22,850 durch ein paar von ihnen. 1182 00:55:22,850 --> 00:55:29,610 Anstatt mit Null beginnen, schauen wir uns froshims3, 1183 00:55:29,610 --> 00:55:31,410 was tut ein bisschen mehr. 1184 00:55:31,410 --> 00:55:34,780 >> Unsere erste, tatsächlich, wir öffnen bis 0, was war, so dass Sie sehen 1185 00:55:34,780 --> 00:55:37,170 Register 0, was war. 1186 00:55:37,170 --> 00:55:40,040 Beachten Sie, was Register 0 tat. 1187 00:55:40,040 --> 00:55:41,730 Eines habe ich Kommentare an der Spitze. 1188 00:55:41,730 --> 00:55:43,900 Löschen Sie diese und konzentrieren uns nur auf diese. 1189 00:55:43,900 --> 00:55:48,730 Die meisten Inhalte register0.php sind natürlich welcher Sprache? 1190 00:55:48,730 --> 00:55:49,980 Nur roh PHP. 1191 00:55:49,980 --> 00:55:53,430 >> So Bekanntmachung ist diese Datei nicht starten mit, in dem Moment, Klammer, 1192 00:55:53,430 --> 00:55:54,970 Fragezeichen, PHP. 1193 00:55:54,970 --> 00:55:59,800 PHP ermöglicht es Ihnen, vermischen PHP-Code mit HTML-Tags. 1194 00:55:59,800 --> 00:56:04,130 Aber ich habe festgestellt, dass hier im Inneren getan auf der Seite hier. 1195 00:56:04,130 --> 00:56:08,180 >> Jetzt wieder, würden Sie nur wissen dies aus Nachdem ich im Handbuch sah. print_r, 1196 00:56:08,180 --> 00:56:13,410 es stellt sich heraus, ist print_recursive. _recursive Und das ist nur ein handliches 1197 00:56:13,410 --> 00:56:16,780 Utility-Funktion, die nur druckt, rekursiv, was Sie geben es. 1198 00:56:16,780 --> 00:56:18,760 Wenn Sie übergeben ein Array, es wird ein Array ausdrucken. 1199 00:56:18,760 --> 00:56:20,180 Wenn Sie geben es eine Reihe, es wird eine Reihe gedruckt. 1200 00:56:20,180 --> 00:56:21,570 Gib es einen String, wird es drucken Sie eine Zeichenfolge. 1201 00:56:21,570 --> 00:56:24,500 Wenn Sie es übergeben eine Hash-Tabelle, es druckt eine Hash-Tabelle. 1202 00:56:24,500 --> 00:56:26,730 Sie müssen nicht alles schreiben dieser Code selbst. 1203 00:56:26,730 --> 00:56:29,490 >> Jetzt bemerken, dass ich die Eingabe PHP-Modus hier. 1204 00:56:29,490 --> 00:56:32,070 Ich bin PHP-Modus verlassen hier. 1205 00:56:32,070 --> 00:56:35,950 Also, wenn der Web-Server liest diese Datei von oben nach unten, von links nach rechts, weil 1206 00:56:35,950 --> 00:56:40,750 es endet in einem Dateinamen aufgerufen. php, was ist nicht in der PHP-Tags 1207 00:56:40,750 --> 00:56:42,820 gerade dabei, sein Spieß heraus, wie rohes HTML. 1208 00:56:42,820 --> 00:56:43,630 Keine große Sache. 1209 00:56:43,630 --> 00:56:49,280 Aber sobald der Webserver bemerkt dies, es geht zu sagen, sollte ich nicht 1210 00:56:49,280 --> 00:56:51,850 ausspucken, buchstäblich, print_r der Post. 1211 00:56:51,850 --> 00:56:54,910 Ich hätte führen Sie den folgenden Codezeile. 1212 00:56:54,910 --> 00:56:59,850 >> Also die letzte Frage, dann dieser Datei ist, na ja, was zum Teufel ist das? 1213 00:56:59,850 --> 00:57:00,530 Nehmen Sie eine Vermutung. 1214 00:57:00,530 --> 00:57:04,230 Was ist $ _POST, wahrscheinlich? 1215 00:57:04,230 --> 00:57:07,070 >> ZUSCHAUER: [unverständlich] 1216 00:57:07,070 --> 00:57:08,830 >> Sprecher 1: Ja, die bereitgestellten Daten. 1217 00:57:08,830 --> 00:57:11,350 Recall, lasst uns zurück blättern in Zeit nur für einen Augenblick. 1218 00:57:11,350 --> 00:57:13,165 froshim0 wieder so aussah. 1219 00:57:13,165 --> 00:57:15,640 Ein Super-Mehrheit ist dies nur HTML. 1220 00:57:15,640 --> 00:57:18,410 Auch einige Tags, die Sie haben nicht noch nicht gesehen, oder mit denen 1221 00:57:18,410 --> 00:57:19,360 Sie sind bereits vertraut. 1222 00:57:19,360 --> 00:57:21,990 Aber das Interessante war. 1223 00:57:21,990 --> 00:57:27,270 Dieser Linie ist das, was wirklich verbindet es um unsere register0.php Datei. 1224 00:57:27,270 --> 00:57:29,200 Ich bin über Verfahren nach Einreichung. 1225 00:57:29,200 --> 00:57:33,130 Und das bedeutet, dass die Parameter der Benutzer nicht in 1226 00:57:33,130 --> 00:57:35,150 zu Ende gehen, wo. 1227 00:57:35,150 --> 00:57:36,175 >> Sie werden nicht zu zeigen sich in der URL. 1228 00:57:36,175 --> 00:57:39,020 Sie werden immer noch von der gesendet werden Client über den Browser, um die 1229 00:57:39,020 --> 00:57:42,080 Server, sondern nur über einen anderen Mechanismus, dass wir unsere Hände verzichten 1230 00:57:42,080 --> 00:57:44,330 bei für heute, aber es ist nicht in der URL. 1231 00:57:44,330 --> 00:57:47,630 Aber beachten Sie die Beziehung jetzt mit Post, die per Konvention ist 1232 00:57:47,630 --> 00:57:49,160 Kleinbuchstaben hier. 1233 00:57:49,160 --> 00:57:54,090 >> Aber wenn ich eröffnen register0.php, Ich bin anscheinend Drucken Sie diese. 1234 00:57:54,090 --> 00:57:56,450 Also das ist eine seltsame Art von Namenskonvention. 1235 00:57:56,450 --> 00:58:01,430 Aber was ist schön, in PHP ist, dass wenn Verwendung von PHP in einer Web-Kontext, nicht ein 1236 00:58:01,430 --> 00:58:04,480 Befehlszeile wie ich vor einem Augenblick, wenn Sie tatsächlich der Verwendung in einer Web- 1237 00:58:04,480 --> 00:58:10,580 Seite, in einem Vhost Verzeichnis wie wir sind, PHP automatisch füllen diese 1238 00:58:10,580 --> 00:58:15,560 Sache, die ein assoziatives Array ist, sozusagen eine Hash-Tabelle, mit 1239 00:58:15,560 --> 00:58:17,290 alles, was der Benutzer eingegeben in. 1240 00:58:17,290 --> 00:58:22,000 >> In kurzen, $ _POST in Großbuchstaben ist ein globale Variable, dass PHP nur 1241 00:58:22,000 --> 00:58:25,050 zaubert für Sie, wenn Verwendung von PHP in einer Web-Kontext. 1242 00:58:25,050 --> 00:58:29,160 Und es bringt in der es alle die Namen von Parametern in der Form, dass 1243 00:58:29,160 --> 00:58:33,200 wurde auf diese Datei und alle eingereichten die Werte, die der Benutzer eingegeben in. 1244 00:58:33,200 --> 00:58:37,790 Also es reicht Ihnen, was der Benutzer getippt in dieser Form. 1245 00:58:37,790 --> 00:58:42,210 >> Also, bevor, wir haben wirklich dumm Ausgang nur zu sehen, weil alles, was ich tat 1246 00:58:42,210 --> 00:58:44,400 wurde rekursiv drucken Array. 1247 00:58:44,400 --> 00:58:46,060 Der Schlüssel ist der Name, der Wert David. 1248 00:58:46,060 --> 00:58:46,980 Der Schlüssel ist Kapitän. 1249 00:58:46,980 --> 00:58:47,970 Der Wert ist. 1250 00:58:47,970 --> 00:58:52,300 Und der Doppelpfeil und der Winkel Halterung gibt, ist dies nur willkürlich. 1251 00:58:52,300 --> 00:58:53,270 Dies ist nicht Code. 1252 00:58:53,270 --> 00:58:57,690 Dies ist nur PHP den Weg zu zeigen Sie was den Wert von einem Schlüssel ist. 1253 00:58:57,690 --> 00:59:03,000 >> Aber jetzt lassen Sie mich schlagen vor, dass in froshIMs3, ist es fast identisch 1254 00:59:03,000 --> 00:59:04,950 außer es macht auf diese Datei. 1255 00:59:04,950 --> 00:59:08,570 Und wieder sind wir Art gehen nur Blick auf diese, um nur einige zu sehen 1256 00:59:08,570 --> 00:59:12,040 Syntax, aber bemerken, was Diese Datei enthält. 1257 00:59:12,040 --> 00:59:14,930 Nehmen Sie eine Vermutung nur auf den Linien der Basis Code, der wohl aussehen tun 1258 00:59:14,930 --> 00:59:17,410 Griechischen, zu einem gewissen Grad, offenbar tut. 1259 00:59:17,410 --> 00:59:20,580 1260 00:59:20,580 --> 00:59:23,110 >> Diese Datei wird irgendwie verwandt um E-Mail, E-Mail. 1261 00:59:23,110 --> 00:59:24,770 Also, was ist dieses Programm zu tun? 1262 00:59:24,770 --> 00:59:28,740 In dieser Version, wenn ich tatsächlich füllen Sie dieses Formular aus - und lassen Sie mich zu gehen 1263 00:59:28,740 --> 00:59:30,760 froshIMs3, nicht froshIMs0 - 1264 00:59:30,760 --> 00:59:33,280 1265 00:59:33,280 --> 00:59:34,540 die Form gleich aussieht. 1266 00:59:34,540 --> 00:59:37,980 David, Kapitän, männlich, Wohnheim, Matthews. 1267 00:59:37,980 --> 00:59:42,980 Aber wenn ich diese einreichen, wird diese Datei gehen, um register3.php gehen. 1268 00:59:42,980 --> 00:59:46,330 >> Und ich behaupte, indem du es ist Quellcode, es zu gehen 1269 00:59:46,330 --> 00:59:47,650 irgendwie beinhalten E-Mail. 1270 00:59:47,650 --> 00:59:49,620 Lassen Sie mich gehen, und öffnen Sie diese in einem größeren Fenster, so dass wir 1271 00:59:49,620 --> 00:59:51,030 kann es sauber zu sehen. 1272 00:59:51,030 --> 00:59:57,220 Wir sind in Vhosts, lokalen Host Öffentlichkeit, froshims. 1273 00:59:57,220 --> 00:59:58,680 Ich werde zu öffnen, eine unterschiedliche Programm, nur damit wir 1274 00:59:58,680 --> 01:00:00,160 kann mehr auf einmal zu sehen. 1275 01:00:00,160 --> 01:00:03,100 >> So, jetzt hier, ein paar Dinge beachten. 1276 01:00:03,100 --> 01:00:06,530 Am Anfang der Datei steht Klammer, Fragezeichen, PHP. 1277 01:00:06,530 --> 01:00:08,920 Dann gibt es noch eine Reihe von Kommentaren, die wir ignorieren können, ist 1278 01:00:08,920 --> 01:00:10,450 uninteressant für jetzt. 1279 01:00:10,450 --> 01:00:11,300 >> Jetzt gibt es diese. 1280 01:00:11,300 --> 01:00:14,200 Es stellt sich heraus, PHP hat eine Menge von Code aufgerufen erfordern. 1281 01:00:14,200 --> 01:00:19,110 Es ist sehr ähnlich in Geist zu Cs umfassen die folgenden Hash, der 1282 01:00:19,110 --> 01:00:21,980 Wesentlichen packt den Inhalt einiger andere Datei und nur plumpst sie hier 1283 01:00:21,980 --> 01:00:22,930 so kann man sie verwenden. 1284 01:00:22,930 --> 01:00:27,060 In diesem Fall hat das Gerät, vorinstalliert, eine Bibliothek, kostenlos und 1285 01:00:27,060 --> 01:00:29,900 Open-Source-Bibliothek namens PHP Mailer, dass kann jeder 1286 01:00:29,900 --> 01:00:30,770 aus dem Internet herunterladen. 1287 01:00:30,770 --> 01:00:32,000 Wir haben es für Sie. 1288 01:00:32,000 --> 01:00:36,130 Und das bedeutet, ich habe jetzt per E-Mail Funktionalität zu meiner Verfügung. 1289 01:00:36,130 --> 01:00:38,170 >> Jetzt, ein paar Dinge beachten. 1290 01:00:38,170 --> 01:00:41,120 Ich werde das überprüfen Formulars Vorlage. 1291 01:00:41,120 --> 01:00:45,980 Stellt sich heraus, PHP, einer hat Ausrufezeichen Punkte für die Betreiber nicht, wie 1292 01:00:45,980 --> 01:00:49,810 C. Aber PHP hat auch eine Funktion genannt leer. 1293 01:00:49,810 --> 01:00:53,920 >> Leere nur zurückgibt, wenn der Wert true der Sache, die Sie geben es in 1294 01:00:53,920 --> 01:00:57,190 Klammern ist leer, wie die Benutzer nicht geben alles in. 1295 01:00:57,190 --> 01:01:02,680 Also das ist zu sagen, und beachten Sie die Syntax, erinnert sehr an C, wenn die 1296 01:01:02,680 --> 01:01:07,730 Namen drücken, so dass das Feld in der Form, Welches war per Post eingereicht, von 1297 01:01:07,730 --> 01:01:13,010 der Benutzer ist nicht leer und ihre Geschlecht ist nicht in der Form, wie leer 1298 01:01:13,010 --> 01:01:15,980 gut, und ihrem Wohnheim ist nicht leer - 1299 01:01:15,980 --> 01:01:19,980 aber ich merke nicht über Captain kümmern, dann, was sollen wir tun? 1300 01:01:19,980 --> 01:01:21,990 >> Ich werde ausführen Diese Codezeile. 1301 01:01:21,990 --> 01:01:24,100 Und Sie können diese Art von denken wie malloc, aber es ist ein wenig 1302 01:01:24,100 --> 01:01:24,800 schicker als die. 1303 01:01:24,800 --> 01:01:29,200 Aber jetzt gibt mir eine besondere struct vom Typ PHP Mailer. 1304 01:01:29,200 --> 01:01:31,410 Aber ignorieren das Stichwort neue für heute. 1305 01:01:31,410 --> 01:01:35,670 >> Jetzt werde ich eine Funktion namens nennen IsSMTP, die sagt, verwenden SMTP. 1306 01:01:35,670 --> 01:01:39,380 Dies ist Port 25, ebenso wie die Video- letzte Woche, als die Sache warf 1307 01:01:39,380 --> 01:01:40,710 E-Mails in der Firewall. 1308 01:01:40,710 --> 01:01:42,440 Port 25 ist SMTP. 1309 01:01:42,440 --> 01:01:44,410 SMTP bedeutet den Mail-Server. 1310 01:01:44,410 --> 01:01:46,215 Welches, können wir Harvard SMTP.fas.harvard.edu. 1311 01:01:46,215 --> 01:01:48,850 1312 01:01:48,850 --> 01:01:51,590 >> Wir können von der Adresse eingestellt John Harvard sein. 1313 01:01:51,590 --> 01:01:55,090 Wenn ich weiter nach unten scrollen, kann ich die Empfängeradresse, nur 1314 01:01:55,090 --> 01:01:56,840 willkürlich, um John sein Harvard ist so gut. 1315 01:01:56,840 --> 01:01:59,210 Also, er wird sein E-Mail selber. 1316 01:01:59,210 --> 01:02:01,600 >> Jetzt kann ich das Thema eingestellt erfasst werden. 1317 01:02:01,600 --> 01:02:03,700 Und ich kann den Körper gesetzt der E-Mail wie folgt. 1318 01:02:03,700 --> 01:02:06,500 Diese Zeile sieht ein wenig kryptisch, aber das ist nur, weil es eine Menge 1319 01:02:06,500 --> 01:02:07,450 der darin enthaltenen Informationen. 1320 01:02:07,450 --> 01:02:10,670 One gibt es eine Punkt-Operator. 1321 01:02:10,670 --> 01:02:14,510 Jemand muss schon wissen, was der Punkt-Operator tut. 1322 01:02:14,510 --> 01:02:15,436 Es ist Verkettung. 1323 01:02:15,436 --> 01:02:19,240 Also, wenn Sie wollen, um eine Zeichenfolge in PHP zu nehmen, und fügen Sie es, oder sie voranzustellen, um 1324 01:02:19,240 --> 01:02:23,500 andere Zeichenfolge in PHP, Gott sei Dank müssen nicht strcopy und malloc verwenden, 1325 01:02:23,500 --> 01:02:25,490 und das alles nicht mehr. 1326 01:02:25,490 --> 01:02:28,765 >> Wenn Sie zwei Strings verketten, wer kümmert sich um den Speicher. 1327 01:02:28,765 --> 01:02:30,850 Lassen PHP Figur, die für Sie heraus. 1328 01:02:30,850 --> 01:02:35,200 Was PHP wird mit dem Punkt-Operator zu tun hier wird nur einen großen Satz aus 1329 01:02:35,200 --> 01:02:37,900 dieser Linie, diese Linie, diese Linie, diese Linie. 1330 01:02:37,900 --> 01:02:40,460 Und jetzt Ankündigung, es geht in Werte werden Einstecken. 1331 01:02:40,460 --> 01:02:43,680 So, dass die E-Mail John Harvard geht zu empfangen ist buchstäblich sagen wollte 1332 01:02:43,680 --> 01:02:49,450 Name, Doppelpunkt, etwas eher, dann haben wir schließen Sie die Zeichenfolge verketten und auf 1333 01:02:49,450 --> 01:02:52,220 was der Benutzer eingegeben in, dann eine neue Zeile. 1334 01:02:52,220 --> 01:02:54,570 >> Dann wird auf der nächsten Zeile von John Harvard E-Mail, es geht zu sagen, 1335 01:02:54,570 --> 01:02:55,910 Kapitän, Auf oder Nichts. 1336 01:02:55,910 --> 01:02:57,810 Es geht um Gender sagen, männlich oder weiblich. 1337 01:02:57,810 --> 01:02:59,680 Wohnheim wird Matthews sein in meinem Fall. 1338 01:02:59,680 --> 01:03:03,400 Und dann bemerken vertraut Semikolon ganz am Ende. 1339 01:03:03,400 --> 01:03:07,830 Und dann hier unten, Kündigung, etwas kryptischen noch, aber wieder, nach einer 1340 01:03:07,830 --> 01:03:12,730 Muster, das sich mehr vertraut wird nach P-Satz 7, wenn das Senden der Mail 1341 01:03:12,730 --> 01:03:16,610 false zurückgibt, dann gehen Sie vor und sterben. 1342 01:03:16,610 --> 01:03:19,610 >> So PHP hat eine Funktion namens sterben, die, buchstäblich, tötet nur die 1343 01:03:19,610 --> 01:03:22,830 Website und nur druckt, was auch immer Sie sagen es - seine im Sterben 1344 01:03:22,830 --> 01:03:24,280 Worte, so zu sprechen. 1345 01:03:24,280 --> 01:03:28,310 Und das, in dem Fall wird es zu drucken heraus, was der Fehler ist für info 1346 01:03:28,310 --> 01:03:29,860 Was auch immer passiert, falsch zu gehen. 1347 01:03:29,860 --> 01:03:34,490 So lange Geschichte kurz hier, was wir haben, ist ein Beispiel, wenn der Benutzer 1348 01:03:34,490 --> 01:03:39,150 das Formular abschickt, froshim0, froshims3.php, geht es zu 1349 01:03:39,150 --> 01:03:40,760 register3.php. 1350 01:03:40,760 --> 01:03:45,290 Aber register3.php geht dann , um alle diese Zeilen auszuführen. 1351 01:03:45,290 --> 01:03:46,620 >> So gibt es ein paar Imbiss hier. 1352 01:03:46,620 --> 01:03:50,380 Eines ist es offenbar ziemlich leicht, programmatisch, um E-Mails zu senden, 1353 01:03:50,380 --> 01:03:50,830 was gut ist. 1354 01:03:50,830 --> 01:03:53,500 Wenn Benutzer für Ihre Website registrieren, in In diesem Fall, wenn sie für Ihre registrieren 1355 01:03:53,500 --> 01:03:56,220 sport, können Sie per E-Mail den Neuling Proctor, oder John 1356 01:03:56,220 --> 01:03:57,650 Harvard, in diesem Fall. 1357 01:03:57,650 --> 01:04:01,630 >> Aber es bedeutet auch, Sie können tun, was? 1358 01:04:01,630 --> 01:04:03,970 Senden Sie E-Mails von jedermann zu jedermann. 1359 01:04:03,970 --> 01:04:05,430 Und das ist sehr wahr. 1360 01:04:05,430 --> 01:04:08,580 Dies ist nicht so einfach möglich, wenn Sie zur Verwendung von Google Mail verwendet. 1361 01:04:08,580 --> 01:04:11,310 Aber wenn Sie jemals Eudora verwendet oder Outlook, können Sie ziemlich viel zu sagen ein 1362 01:04:11,310 --> 01:04:13,720 Mail-Server, dass Sie jemand, den Sie wollen. 1363 01:04:13,720 --> 01:04:16,450 Und das ist, wo ich zum Anziehen brauchen dass Hut und sagen, tun dies nicht. 1364 01:04:16,450 --> 01:04:21,140 Aber dies ist ein Beweis für, wie einfach ist es, Phishing-Angriffe durchzuführen, und 1365 01:04:21,140 --> 01:04:24,310 senden Sie anonyme E-Mails und Spam, mehr allgemein. 1366 01:04:24,310 --> 01:04:27,330 Und es wirklich darauf an, die Tatsache, dass alles, was Sie brauchen, ist etwas 1367 01:04:27,330 --> 01:04:28,500 programmgesteuerten Zugriff. 1368 01:04:28,500 --> 01:04:31,940 >> Nebenbei, meine engsten Begegnung mit die Anzeige Bord, meine eigenen ersten Jahr, 1369 01:04:31,940 --> 01:04:34,320 war, als ich dieses coole entdeckt Trick,, wow, können Sie 1370 01:04:34,320 --> 01:04:36,850 E-Mails von niemandem. 1371 01:04:36,850 --> 01:04:39,770 Und so waren wir mit etwas dumm Argument, buchstäblich, in Matthews, 1372 01:04:39,770 --> 01:04:40,790 unter meinen Proctor Gruppe. 1373 01:04:40,790 --> 01:04:42,470 Ich glaube nicht einmal daran erinnern, , was das Problem war. 1374 01:04:42,470 --> 01:04:44,970 Aber ich wollte versuchen, ein setzen Ende dieser Debatte dumm. 1375 01:04:44,970 --> 01:04:48,580 >> Also beschloss ich, werde ich senden Sie einfach eine E-Mail Zu meinen Proctor Gruppe vorgibt, 1376 01:04:48,580 --> 01:04:52,000 der andere Kerl, mit deren Meinung ich nicht einverstanden, und haben ihn zu dulden 1377 01:04:52,000 --> 01:04:54,680 was meiner Meinung nach in Diese besondere Debatte. 1378 01:04:54,680 --> 01:04:59,320 Und so habe ich diese E-Mail gefälscht mit einem Technik im Geiste diese. 1379 01:04:59,320 --> 01:05:01,256 Aber es war tatsächlich einfacher an der Zeit. 1380 01:05:01,256 --> 01:05:02,435 Hit senden. 1381 01:05:02,435 --> 01:05:06,660 Er war nicht erfreut, noch würde haben die ad Bord. 1382 01:05:06,660 --> 01:05:10,280 >> Und ich war sehr schnell innerhalb gefangen Sekunden, weil, wie Sie wissen, melde ich mich 1383 01:05:10,280 --> 01:05:11,420 meine E-Mails in einer bestimmten Weise. 1384 01:05:11,420 --> 01:05:14,200 Und wenn ich es manuell tun, in großen Teil, 15 Jahre später, da war ich 1385 01:05:14,200 --> 01:05:15,080 traumatisiert, dass. 1386 01:05:15,080 --> 01:05:16,960 Ich habe nicht eine Signatur auf meine E-Mail bekommen. 1387 01:05:16,960 --> 01:05:20,440 Aber im Jahr 1995, ich hatte gerade einen sig, eine Unterschrift per E-Mail. 1388 01:05:20,440 --> 01:05:24,630 Also da war dieser Zettel, sehr geehrte Proctor Gruppe, einzuwilligen ich meine Meinung 1389 01:05:24,630 --> 01:05:31,240 und stimmen mit David, so unterzeichnet und so, neue Zeile, neue Zeile, DJM. 1390 01:05:31,240 --> 01:05:36,220 >> Also nicht tun, oder, im Allgemeinen, nehmen Vorteil dieser Technik. 1391 01:05:36,220 --> 01:05:39,950 Aber beim Erstellen einer Webseite, für wie Ihr letztes Projekt, wenn Sie ein 1392 01:05:39,950 --> 01:05:43,460 Website für etwas Unternehmergeist, dies ist, wie, pragmatisch, können Sie 1393 01:05:43,460 --> 01:05:47,000 Hebelwirkung andere Dienste im Internet wie Mail und dann tatsächlich 1394 01:05:47,000 --> 01:05:49,440 senden Dinge mit Code. 1395 01:05:49,440 --> 01:05:51,240 >> Wie können wir also auf diese verbessern? 1396 01:05:51,240 --> 01:05:54,370 Nun, lassen Sie uns zuerst einen kurzen Überblick über einige der Dinge, die Sie sehen, 1397 01:05:54,370 --> 01:05:56,170 und dann einen Blick auf ein paar Beispiele. 1398 01:05:56,170 --> 01:05:59,500 So eins, zu beruhigen, weil wir fliegen durch PHP. 1399 01:05:59,500 --> 01:06:02,470 Und ich weiß, irgendwann, haben Sie tatsächlich beginnen schreibe dies, wenn Sie 1400 01:06:02,470 --> 01:06:03,460 nicht bereits haben. 1401 01:06:03,460 --> 01:06:06,220 Erkenne, dass, ein, ist Haupt-Art der aus dem Fenster mit PHP. 1402 01:06:06,220 --> 01:06:09,420 Wenn Sie möchten, Code zu schreiben, bekommt ausgeführt, die Sie gerade mit dem Schreiben beginnen sie in 1403 01:06:09,420 --> 01:06:13,970 eine Datei namens. php so lange wie haben Sie die Klammer 1404 01:06:13,970 --> 01:06:15,620 Fragezeichen PHP-Tag. 1405 01:06:15,620 --> 01:06:19,730 >> Aber beachten sind Bedingungen in php. 1406 01:06:19,730 --> 01:06:22,610 Beachten Sie, das ist genau das gleiche Bild Wir hatten in der ersten Woche, wenn wir hatten 1407 01:06:22,610 --> 01:06:25,670 Bedingungen in C. Bedingungen in PHP sind strukturell und 1408 01:06:25,670 --> 01:06:27,140 syntaktisch gleich. 1409 01:06:27,140 --> 01:06:30,290 Nur wirkliche Unterschied ist, wenn du hast Variablen beteiligt sind, müssen Sie die 1410 01:06:30,290 --> 01:06:31,600 Dollar-Zeichen. 1411 01:06:31,600 --> 01:06:33,970 >> Inzwischen Boolesche Ausdrücke aussehen wie dies für 1412 01:06:33,970 --> 01:06:35,725 oder-ing oder-ing und zusammen. 1413 01:06:35,725 --> 01:06:37,780 Schalter genau gleich aussehen. 1414 01:06:37,780 --> 01:06:42,180 Was ist schön in PHP, während in C, Schalter müssen Fälle sein 1415 01:06:42,180 --> 01:06:46,380 Primitive wie ints oder verkohlt, in PHP Ihr Fall Aussagen tatsächlich sein kann 1416 01:06:46,380 --> 01:06:48,430 auf einer ganzen Strings ist die eigentlich ganz nett. 1417 01:06:48,430 --> 01:06:49,480 Spart euch etwas Zeit. 1418 01:06:49,480 --> 01:06:50,820 Könnte das nicht in C. 1419 01:06:50,820 --> 01:06:52,880 >> Hier ist eine for-Schleife in PHP. 1420 01:06:52,880 --> 01:06:53,740 Es ist identisch. 1421 01:06:53,740 --> 01:06:55,400 Vielleicht ein paar Dollar-Zeichen haben für die Variablen. 1422 01:06:55,400 --> 01:06:57,530 Sie haben noch zu erwähnen, dass etwas ist ein int. 1423 01:06:57,530 --> 01:07:00,580 Sie müssen nur erklären mit einem Dollarzeichen und der Namen der Variablen. 1424 01:07:00,580 --> 01:07:01,430 Aber eine for-Schleife ist die gleiche. 1425 01:07:01,430 --> 01:07:02,760 Eine while-Schleife ist die gleiche. 1426 01:07:02,760 --> 01:07:04,870 Ein Do-Schleife, während die gleiche ist. 1427 01:07:04,870 --> 01:07:06,170 >> Dies ist ein wenig anders. 1428 01:07:06,170 --> 01:07:12,410 Also mit PHP, mit einer Reihe, können Sie statisch ein Array deklarieren, wie in C, 1429 01:07:12,410 --> 01:07:14,420 aber Sie eckige Klammern. 1430 01:07:14,420 --> 01:07:17,060 In C, würden Sie geschweiften Klammern, wenn Sie selbst wusste, dass. 1431 01:07:17,060 --> 01:07:20,910 Aber das ist eigentlich sehr häufig in PHP ein Array erklären, in diesem Fall 1432 01:07:20,910 --> 01:07:23,640 von Zahlen, und rufen Sie die variable Zahlen. 1433 01:07:23,640 --> 01:07:25,300 >> Variablen sich wie folgt aussehen. 1434 01:07:25,300 --> 01:07:28,710 Hier wird ein String ist, zitiere unquote "hallo Welt. "Du könntest einen Backslash n. 1435 01:07:28,710 --> 01:07:30,950 Ich habe einfach nicht in diesem Fall. 1436 01:07:30,950 --> 01:07:32,640 >> Nun ist dies ein interessantes Konstrukt. 1437 01:07:32,640 --> 01:07:33,700 C nicht über diese. 1438 01:07:33,700 --> 01:07:34,700 Aber das ist super hilfsbereit. 1439 01:07:34,700 --> 01:07:38,160 Und du wirst diese in P Satz 7 zu sehen spec - eine für jedes Konstrukt. 1440 01:07:38,160 --> 01:07:41,800 Wenn Sie möchten, zu wiederholen, über all die Elemente ein Array ist, müssen Sie nicht 1441 01:07:41,800 --> 01:07:45,500 mit $ i und $ n befassen, und + +, und das alles. 1442 01:07:45,500 --> 01:07:47,640 Sie können buchstäblich sagen, in PHP, diese - 1443 01:07:47,640 --> 01:07:51,890 für jede Zahl als Zahl, so Ich gehe davon aus, dass $ Zahlen 1444 01:07:51,890 --> 01:07:53,380 ein Array von Zahlen. 1445 01:07:53,380 --> 01:07:56,460 Und wenn ich sage für jede Zahlen als Nummer, wird dies gehen 1446 01:07:56,460 --> 01:08:00,505 automatisch, da meine Schleife führt, aktualisieren, auf jeder Iteration den Wert 1447 01:08:00,505 --> 01:08:03,260 innerhalb von Dollarzeichen Zahl - 1448 01:08:03,260 --> 01:08:07,730 wieder und wieder, und wieder zu Fuß für mich über dieses Array. 1449 01:08:07,730 --> 01:08:08,735 So ist es nur spart uns Code. 1450 01:08:08,735 --> 01:08:12,250 Keine Semikolon, kein + + 's, no i ist, nicht n, es ist einfach schön. 1451 01:08:12,250 --> 01:08:13,700 >> Aber PHP hat auch diese. 1452 01:08:13,700 --> 01:08:14,830 Und das ist super stark. 1453 01:08:14,830 --> 01:08:17,410 Und du wirst verwenden diese, die Hände auf, in P 7 eingestellt. 1454 01:08:17,410 --> 01:08:21,990 Und assoziatives Array wird auch erklärt, mit eckigen Klammern. 1455 01:08:21,990 --> 01:08:23,569 Aber beachten Sie die Syntax jetzt. 1456 01:08:23,569 --> 01:08:26,880 Es erinnert an das, was wir sahen, mit print_r vor einem Augenblick. 1457 01:08:26,880 --> 01:08:31,810 Wie viele Tasten wie ein kleines Plausibilitätsprüfung, bedeutet das Array zu haben scheinen. 1458 01:08:31,810 --> 01:08:32,689 >> So hat es zwei. 1459 01:08:32,689 --> 01:08:33,830 Und ich nenne diese ein Array. 1460 01:08:33,830 --> 01:08:36,760 Aber wenn es hilft, können Sie denken dieser als Hash-Tabelle oder als 1461 01:08:36,760 --> 01:08:37,930 ein assoziatives Array. 1462 01:08:37,930 --> 01:08:39,580 Aber es ist nur eine andere Array-Typ. 1463 01:08:39,580 --> 01:08:41,080 Und wieder verschiedenen Sprachen diese haben. 1464 01:08:41,080 --> 01:08:43,810 Wir werden sehen, etwas ähnliches in JavaScript als gut. 1465 01:08:43,810 --> 01:08:44,609 Es gibt zwei Schlüssel. 1466 01:08:44,609 --> 01:08:48,390 Eines ist unquote Zitat, "symbol", ist man zitieren unquote "Preis." Und dieser Schlüssel 1467 01:08:48,390 --> 01:08:49,250 jeweils einen Wert. 1468 01:08:49,250 --> 01:08:54,420 In diesem Fall ist der Wert Symbol FB, für Facebook und Preis Wert ist 49, 26, 1469 01:08:54,420 --> 01:08:56,899 das war Facebook-Aktie Preis wie dieser Morgen. 1470 01:08:56,899 --> 01:09:00,170 >> Also, was ist sinnvoll, über ein assoziatives Array. 1471 01:09:00,170 --> 01:09:02,620 Ich hätte eine numerisch indiziertes Array mit nur 1472 01:09:02,620 --> 01:09:04,120 einfachen eckigen Klammern. 1473 01:09:04,120 --> 01:09:09,380 Und ich hätte Dollarzeichen Zitat entspricht genau dies. 1474 01:09:09,380 --> 01:09:10,529 Lassen Sie mich es tatsächlich tun. 1475 01:09:10,529 --> 01:09:14,796 Angenommen, ich stattdessen nur erklärt Dieses Array so. 1476 01:09:14,796 --> 01:09:17,590 Das ist völlig in Ordnung, syntaktisch. 1477 01:09:17,590 --> 01:09:20,569 Es spielt keine Informationen verloren gehen, per se. 1478 01:09:20,569 --> 01:09:24,760 Ich sehe immer noch, dass das Symbol fb ist, und dass der Preis beträgt 49, 26. 1479 01:09:24,760 --> 01:09:28,939 Also warum sind assoziativ Arrays überzeugend? 1480 01:09:28,939 --> 01:09:30,189 >> ZUSCHAUER: Sie müssen nicht daran zu erinnern, wo du Sachen. 1481 01:09:30,189 --> 01:09:32,050 1482 01:09:32,050 --> 01:09:34,130 >> Sprecher 1: Genau, Sie müssen nicht zu erinnern, wo man Sachen setzen. 1483 01:09:34,130 --> 01:09:37,670 Sie müssen nicht willkürlich erinnern dass Börsenkürzel ist in Klammer Null, 1484 01:09:37,670 --> 01:09:41,479 und die Aktienkurse ist in einer Halterung, Das ist besonders gefährlich, wenn Sie 1485 01:09:41,479 --> 01:09:43,220 Dinge ändern, eventuell. 1486 01:09:43,220 --> 01:09:46,399 Es ist viel schöner zu assoziieren was wir nennen Metadaten 1487 01:09:46,399 --> 01:09:48,340 mit Ihrem tatsächlichen Daten. 1488 01:09:48,340 --> 01:09:52,399 Ich würde behaupten, dass das, was wir wirklich interessieren hier über fb und 49, 26. 1489 01:09:52,399 --> 01:09:57,020 Das Symbol und der Preis ist Metadaten das beschreibt die Daten, die wir 1490 01:09:57,020 --> 01:09:58,180 tatsächlich interessieren. 1491 01:09:58,180 --> 01:10:01,910 Aber das ist nur so viel leichter zugänglich. 1492 01:10:01,910 --> 01:10:04,090 >> Jetzt, so nebenbei, was ist der Preis, den wir bezahlen? 1493 01:10:04,090 --> 01:10:06,600 Wir machen das schon in CS50 für Wochen. 1494 01:10:06,600 --> 01:10:10,740 Diese Funktion muss an einem bestimmten Preis zu kommen. 1495 01:10:10,740 --> 01:10:11,350 Speicher. 1496 01:10:11,350 --> 01:10:13,830 Sie sind also nicht nur die Speicherung einer 32-Bit ganze Zahl, zum Beispiel. 1497 01:10:13,830 --> 01:10:17,980 Du Speicherung Symbol / 0, wahrscheinlich. 1498 01:10:17,980 --> 01:10:19,160 Sie sind also mit mehr Speicher. 1499 01:10:19,160 --> 01:10:22,540 >> Und was ist die Leistung der Suche etwas in ein 1500 01:10:22,540 --> 01:10:24,822 assoziatives Array, wahrscheinlich? 1501 01:10:24,822 --> 01:10:26,590 Es ist wahrscheinlich langsamer. 1502 01:10:26,590 --> 01:10:29,670 Random access ist schön, vor allem wenn Sie tun können binäre Suche. 1503 01:10:29,670 --> 01:10:33,380 Aber wenn Sie wirklich suchen nun nicht für Zahlen, aber für Streicher, diese 1504 01:10:33,380 --> 01:10:37,630 ist wirklich unter die implementierte Haube, wahrscheinlich als Hash-Tabelle, wo 1505 01:10:37,630 --> 01:10:42,950 Sie verwenden entweder eine Hash-Tabelle mit separater Verkettung. 1506 01:10:42,950 --> 01:10:46,040 Oder Sie verwenden einen Versuch, tatsächlich speichern Sie die Werte. 1507 01:10:46,040 --> 01:10:50,550 So können Sie vielleicht tun konstante Zeit, aber Sie müssen noch am S-Y-M-B-O-L aussehen, 1508 01:10:50,550 --> 01:10:54,510 möglicherweise, statt nur 32 Bits etwas nachschlagen. 1509 01:10:54,510 --> 01:10:58,430 Also noch einmal, kommen die gleichen Ideen Sicherung in diesem Zusammenhang wieder auftreten. 1510 01:10:58,430 --> 01:11:02,120 >> Aber noch einmal, PHP hat jetzt einige super Globals, die, es stellt sich heraus, sind 1511 01:11:02,120 --> 01:11:02,900 assoziative Arrays. 1512 01:11:02,900 --> 01:11:05,590 Wir sahen eine vor einem Augenblick, $ _POST. 1513 01:11:05,590 --> 01:11:08,400 Und das Super globalen hat Schlüssel und Werte. 1514 01:11:08,400 --> 01:11:10,550 Insbesondere werden die Tasten Line-Up mit was? 1515 01:11:10,550 --> 01:11:14,520 Woher kommen die Schlüssel in $ _POST her? 1516 01:11:14,520 --> 01:11:15,380 Nur zur Erinnerung? 1517 01:11:15,380 --> 01:11:16,480 >> ZUSCHAUER: Name. 1518 01:11:16,480 --> 01:11:17,900 >> SPRECHER 1: Name, wo? 1519 01:11:17,900 --> 01:11:19,860 >> ZUSCHAUER: [unverständlich] 1520 01:11:19,860 --> 01:11:20,750 >> SPRECHER 1: Name ist das Attribut. 1521 01:11:20,750 --> 01:11:23,480 Nun wo, wo haben sie ursprünglich her? 1522 01:11:23,480 --> 01:11:24,120 Die Form. 1523 01:11:24,120 --> 01:11:30,140 Also, wenn eine HTML-Seite ein Formular-Tag, innerhalb von denen einige Eingänge, wie 1524 01:11:30,140 --> 01:11:34,760 Checkboxen, Textfelder, Drop-Down Menüs, von denen jeder einen Namen hat, diese 1525 01:11:34,760 --> 01:11:40,260 Namen am Ende als Schlüssel in $ _POST, und, ehrlich gesagt, für diese Angelegenheit, $ _GET. 1526 01:11:40,260 --> 01:11:42,130 Wenn die Methode get, gleiche Idee. 1527 01:11:42,130 --> 01:11:43,830 Es ist nur in einem anderen Super-global. 1528 01:11:43,830 --> 01:11:47,620 Und die Werte natürlich kommen was der Benutzer in an seinem oder getippt 1529 01:11:47,620 --> 01:11:48,890 ihr Browser. 1530 01:11:48,890 --> 01:11:49,830 >> Aber es gibt noch ein paar andere. 1531 01:11:49,830 --> 01:11:52,140 Es gibt Plätzchen, die wir werden kommen zurück, um schließlich. 1532 01:11:52,140 --> 01:11:56,050 Aber das sind die Dinge, die Sie wissen die Bahn verwendet für einige gut oder böse. 1533 01:11:56,050 --> 01:11:57,420 Aber kommen wir zurück zu dem. 1534 01:11:57,420 --> 01:12:01,720 Server und Session, und die beiden haben einige spezielle Dienstprogramm. 1535 01:12:01,720 --> 01:12:03,940 >> Aber lassen Sie uns einen Blick auf diese. 1536 01:12:03,940 --> 01:12:13,330 Lassen Sie mich gehen Sie vor und eröffnen ein Beispiel genannt mvc0.php So MVC 1537 01:12:13,330 --> 01:12:14,900 steht für die folgenden. 1538 01:12:14,900 --> 01:12:19,390 Und stellen wir dies früher als typische, wirklich, um Ihnen den Entwurf 1539 01:12:19,390 --> 01:12:22,180 Problem Satz 7 und auch letzten Projekte, in Art einer Branche 1540 01:12:22,180 --> 01:12:23,670 Standard-Weg, und saubere Art und Weise. 1541 01:12:23,670 --> 01:12:24,820 Es ist gutes Design. 1542 01:12:24,820 --> 01:12:29,090 >> Also bist du etwa zu sehen, und du wirst Erfahrung, in P Satz 7, Paradigma, sortieren 1543 01:12:29,090 --> 01:12:32,260 einer Programmiersprache Denkweise, das sieht ein wenig etwas wie dieses. 1544 01:12:32,260 --> 01:12:35,570 M für Model, C für Controller, V für View. 1545 01:12:35,570 --> 01:12:39,690 Lange Rede kurzer Sinn, ist MVC nur irgendwie einer Methode, ein Weg, 1546 01:12:39,690 --> 01:12:43,360 Webseiten, insbesondere, wobei Sie Alle deine, dumm Begriff - 1547 01:12:43,360 --> 01:12:44,970 Business-Logik - 1548 01:12:44,970 --> 01:12:49,710 alle Ihre geistigen Eigentums in was einen Controller genannt, eine Datei 1549 01:12:49,710 --> 01:12:54,840 wie index.php, oder wir werden sehen, quote.php oder buy.php. 1550 01:12:54,840 --> 01:12:59,570 >> Im Rahmen der Reihe 7 Problem, Ihre Modelle enthalten in der Regel die Daten, 1551 01:12:59,570 --> 01:13:03,860 alles im Zusammenhang mit einer Datenbank, wie wir werden schließlich sehen, und eure Ansichten 1552 01:13:03,860 --> 01:13:07,510 enthalten die Ästhetik Ihres Website, die HTML, CSS die. 1553 01:13:07,510 --> 01:13:10,420 So haben wir bereits gesehen, dies in C ein wenig Bit durch. h-Dateien. 1554 01:13:10,420 --> 01:13:15,010 Wir sahen es wirklich vor einem Augenblick mit CSS, durch Factoring Der CSS Stilisierung 1555 01:13:15,010 --> 01:13:16,520 stopfen aus unserem HTML. 1556 01:13:16,520 --> 01:13:20,730 >> So MVC ist wirklich nur zum Zeichnen Linien in den Sand stecken und sagen, die 1557 01:13:20,730 --> 01:13:25,400 interessant Programmiercode für Ihre Website gehört, was wir nennen das 1558 01:13:25,400 --> 01:13:26,400 Controller. 1559 01:13:26,400 --> 01:13:29,280 Stuff an der Datenbank in der Regel endet in einem Modell. 1560 01:13:29,280 --> 01:13:33,070 Aber du wirst sehen, in Satz 7 Problem, wir verschmelzen C und M es einfach zu halten. 1561 01:13:33,070 --> 01:13:37,630 Aber Ansicht ist, wo alle Ihre HTML und Ästhetik in der Regel gehen. 1562 01:13:37,630 --> 01:13:39,160 >> Was bedeutet dies in real bedeuten? 1563 01:13:39,160 --> 01:13:45,980 Nun, lassen Sie mich in unserer MVC gehen Verzeichnis wie folgt. 1564 01:13:45,980 --> 01:13:48,880 Und du wirst sehen, mehr von diesen tourte durch in der spec. 1565 01:13:48,880 --> 01:13:53,200 So in mvc0 behaupte ich, dass dies, wie, Version 0 von CS50-Websites. 1566 01:13:53,200 --> 01:13:56,670 >> Alles, was wir haben, ist einige HTML, wie ein großer h1 tag, anscheinend. 1567 01:13:56,670 --> 01:13:57,800 Und dann eine Aufzählung. 1568 01:13:57,800 --> 01:13:59,860 Ich habe noch nie eine Aufzählung gesehen vor, aber keine große Sache. 1569 01:13:59,860 --> 01:14:01,590 Lassen Sie uns schnell Blick auf den Quellcode. 1570 01:14:01,590 --> 01:14:06,610 Stellt sich heraus, eine ungeordnete Liste mit Aufzählungszeichen ist offen Halterung ul mit einem oder 1571 01:14:06,610 --> 01:14:09,065 mehr Listenelemente li. 1572 01:14:09,065 --> 01:14:10,650 So ist hier ein Hinweis Ankertag. 1573 01:14:10,650 --> 01:14:12,130 Wir sahen, dass vor einem Augenblick. 1574 01:14:12,130 --> 01:14:13,810 >> Also das ist, wie ich umgesetzt Diese Seite. 1575 01:14:13,810 --> 01:14:18,460 Ich habe zwei Links, zwei Listenelemente, eine ul für ungeordnete Liste, und das Ende 1576 01:14:18,460 --> 01:14:22,700 Dadurch ästhetisch, ist dies sehr hübsche Website, Version 0 hier. 1577 01:14:22,700 --> 01:14:26,840 Aber was interessant ist nun, wie diese ist unter der Haube eingeführt. 1578 01:14:26,840 --> 01:14:33,590 >> Lassen Sie mich in gedit gehen und öffnen Sie diese ersten Beispiel ein Bild zu malen. 1579 01:14:33,590 --> 01:14:37,070 Und wir werden an, was fehlerhaft aussehen, potentiell in hier. 1580 01:14:37,070 --> 01:14:43,260 Nun, wenn ich gehe in localhost, Öffentlichkeit, MVC, bemerkt ein paar Dateien. 1581 01:14:43,260 --> 01:14:45,780 Ich werde diese nennen, für die Moment, alle Controller. 1582 01:14:45,780 --> 01:14:48,640 Aber das ist ein bisschen ein Missbrauch, weil du wirst sehen, alles vermischt ist 1583 01:14:48,640 --> 01:14:49,620 innen von ihnen. 1584 01:14:49,620 --> 01:14:52,330 >> Und lassen Sie mich in der index.php gehen. 1585 01:14:52,330 --> 01:14:54,700 Und wir sehen, buchstäblich, die gleiche HTML. 1586 01:14:54,700 --> 01:14:57,970 Also auch wenn diese Datei endet in . Php, bedeutet es nicht, es muss 1587 01:14:57,970 --> 01:14:59,500 haben keine PHP-Code. 1588 01:14:59,500 --> 01:15:02,290 Es kann nur rohe HTML sein, obwohl Das ist irgendwie albern. 1589 01:15:02,290 --> 01:15:07,650 Aber feststellen, es gibt keine offenen Klammer PHP Tag, außer für diese, die, ehrlich gesagt, 1590 01:15:07,650 --> 01:15:09,160 ist nur da, um als Kommentar dienen. 1591 01:15:09,160 --> 01:15:12,080 Aber das ist nicht funktional auch so interessant. 1592 01:15:12,080 --> 01:15:12,960 >> Aber dies feststellen. 1593 01:15:12,960 --> 01:15:15,400 Interessant ist nun, was Änderungen auf dieser Seite. 1594 01:15:15,400 --> 01:15:16,650 Lassen Sie mich auf Vorträge. 1595 01:15:16,650 --> 01:15:18,560 Und beachten Sie die URL soll sich nun ändern. 1596 01:15:18,560 --> 01:15:20,930 Jetzt bin ich bei lectures.php. 1597 01:15:20,930 --> 01:15:22,630 Lassen Sie mich auf Null. 1598 01:15:22,630 --> 01:15:27,200 Jetzt bin ich bei week0.php Und nun mir diese Dateien öffnen in gedit. 1599 01:15:27,200 --> 01:15:30,120 Nicht nur Index, aber wir me eröffnen Vorträge. 1600 01:15:30,120 --> 01:15:33,900 Und lassen Sie mich loswerden der Kommentare auf diesen Teil konzentrieren uns nur. 1601 01:15:33,900 --> 01:15:37,680 >> Und jetzt lassen Sie mich öffnen nur eine weitere, week0.php, wegwerfen, die Kommentare, 1602 01:15:37,680 --> 01:15:39,910 nur zu reinigen diese auf. 1603 01:15:39,910 --> 01:15:41,720 Und jetzt Folgendes feststellen. 1604 01:15:41,720 --> 01:15:47,340 Denken wirklich Art von sorgfältig über Design und wir machen es Linie 1605 01:15:47,340 --> 01:15:52,013 up der gleichen, was könnte getan werden hier besser, denken Sie? 1606 01:15:52,013 --> 01:15:56,450 1607 01:15:56,450 --> 01:15:57,780 >> Wie mache ich eine Woche ein? 1608 01:15:57,780 --> 01:15:58,480 Wie wäre es damit. 1609 01:15:58,480 --> 01:16:00,450 Also das ist, wie ich eine Woche gemacht. 1610 01:16:00,450 --> 01:16:08,290 Ich ging auf Datei, Neu, Einfügen, Speichern, week1.php, und dann ging ich in hier. 1611 01:16:08,290 --> 01:16:09,875 Und ich geändert one - 1612 01:16:09,875 --> 01:16:11,646 was war das, eine bis Freitag. 1613 01:16:11,646 --> 01:16:14,430 1614 01:16:14,430 --> 01:16:15,810 Ich änderte die Nullen zu eins. 1615 01:16:15,810 --> 01:16:17,150 Ich änderte dies zu eins. 1616 01:16:17,150 --> 01:16:20,350 >> OK, so jetzt an meine Dateien zu suchen. 1617 01:16:20,350 --> 01:16:22,100 Was hätte anders gemacht werden? 1618 01:16:22,100 --> 01:16:25,310 Wo ist die Gelegenheit, vielleicht? 1619 01:16:25,310 --> 01:16:28,330 So gibt es die Möglichkeit zu starten Factoring dieses Zeug aus. 1620 01:16:28,330 --> 01:16:32,950 Lassen Sie mich eröffnen, als Spoiler, für was Sie in P Satz 7 zu sehen. 1621 01:16:32,950 --> 01:16:38,750 Wenn ich öffnen, jetzt, index.php in Version Fünf davon, sieht es so 1622 01:16:38,750 --> 01:16:40,730 mehr kryptisch, zugegebenermaßen. 1623 01:16:40,730 --> 01:16:43,710 >> Aber dies ist nun, was ich rufe ein Controller, der die Steuerung der ist 1624 01:16:43,710 --> 01:16:44,770 Logik meiner Seite. 1625 01:16:44,770 --> 01:16:48,510 Und Sie können Art rekonstruieren, intuitiv, vielleicht, was ist los. 1626 01:16:48,510 --> 01:16:50,630 In der ersten Zeile, ist es ein wenig kryptisch. 1627 01:16:50,630 --> 01:16:54,040 Aber ich merke, bin erfordern, wie bei scharfe include, wird eine Datei namens 1628 01:16:54,040 --> 01:16:55,930 helpers.php. 1629 01:16:55,930 --> 01:16:59,980 Und dann rufe ich offenbar ein Funktion, genannt render, vorbei an 1630 01:16:59,980 --> 01:17:00,850 zwei Argumente. 1631 01:17:00,850 --> 01:17:02,440 >> Eines ist Zitat unquote, Header. 1632 01:17:02,440 --> 01:17:04,800 Und das andere ist, welche Art von Datentyp ist, auf 1633 01:17:04,800 --> 01:17:07,180 auf unserer Syntax früher? 1634 01:17:07,180 --> 01:17:08,160 Es ist eine zugehörige Array. 1635 01:17:08,160 --> 01:17:11,730 Genauer gesagt, ist es in dem Titel vorbei mit einigen Metadaten, erinnert 1636 01:17:11,730 --> 01:17:13,430 mir, was es ist und seinen Wert. 1637 01:17:13,430 --> 01:17:16,340 Dann sehe ich eine hart codiert ul, so dass einige raw HTML. 1638 01:17:16,340 --> 01:17:20,020 Aber dann bin ich wieder in den PHP-Modus Aufruf einer Funktion render. 1639 01:17:20,020 --> 01:17:24,390 Also selbst wenn Sie noch nie HTML oder PHP verwendet vor, und obwohl das sieht 1640 01:17:24,390 --> 01:17:27,480 gruseliger, warum ist dies wahrscheinlich besseres Design? 1641 01:17:27,480 --> 01:17:31,310 Was ist besser, darüber, basierend auf Ableitung? 1642 01:17:31,310 --> 01:17:32,130 >> ZUSCHAUER: [unverständlich] 1643 01:17:32,130 --> 01:17:35,750 >> Sprecher 1: Weniger redundante, dass es gibt keine mehr HTML-Tag, nicht mehr 1644 01:17:35,750 --> 01:17:38,410 Köpfe tag, nicht mehr Body-Tag in jedem verdammten Datei. 1645 01:17:38,410 --> 01:17:41,860 Stattdessen habe ich ausgeklammert der Gemeinsamkeiten und legte sie vermutlich 1646 01:17:41,860 --> 01:17:45,150 in eine Datei irgendwie verwandt zu einem Header. 1647 01:17:45,150 --> 01:17:48,500 Und dasselbe für die enge Körper tag, die enge HTML-Tag. 1648 01:17:48,500 --> 01:17:52,165 Das ist wahrscheinlich hier unten innen der Fußzeile irgendwo. 1649 01:17:52,165 --> 01:17:57,050 Und Sie werden sehen, in Problem-Satz 7, ein wenig Tour durch diese. 1650 01:17:57,050 --> 01:17:58,070 >> Also, was vor uns liegt? 1651 01:17:58,070 --> 01:18:03,390 Das einzige, was wir haben nicht die Fähigkeit, noch für ist, um tatsächlich Daten speichern. 1652 01:18:03,390 --> 01:18:06,110 Und so, was wir anfangen zu sehen, Mittwoch, zum Beispiel, ist, dass Ihr 1653 01:18:06,110 --> 01:18:08,450 alten Freund Excel oder Zahlen, können Sie viel speichern 1654 01:18:08,450 --> 01:18:10,060 Daten in Zeilen und Spalten. 1655 01:18:10,060 --> 01:18:12,570 Es stellte sich heraus, dass man in dem, was ist zu tun rief eine Datenbank, programmatisch. 1656 01:18:12,570 --> 01:18:16,620 manischen Und es stellt sich heraus, dass nach, wir werden in der Lage sein, Dinge wie speichern 1657 01:18:16,620 --> 01:18:20,550 diese, die Sie wieder zu sehen in P Set 7, eine ganze Reihe von Benutzernamen und 1658 01:18:20,550 --> 01:18:23,690 Passwörter, von denen die letztere sind tatsächlich verschlüsselt, so wie sie 1659 01:18:23,690 --> 01:18:25,550 waren in P 2 Satz Hacker-Ausgabe. 1660 01:18:25,550 --> 01:18:29,600 Und schließlich, werden Sie dies implementieren, Ihre eigene Website eTrade-like, dass 1661 01:18:29,600 --> 01:18:32,220 implementiert gemeinsam CS50 Finanzen. 1662 01:18:32,220 --> 01:18:36,000 >> Schließlich, da Sie schon einmal hier so spät heute, wenn Sie kommen zurück, um diesem Teil 1663 01:18:36,000 --> 01:18:41,120 Campus, um 4:00 Uhr heute, werden wir Ihnen nicht nur Beratung, bei der SCES 1664 01:18:41,120 --> 01:18:44,200 Beratung Fair, um 4:00 Uhr in der Maxwell-Dworkin, geben wir Ihnen einige 1665 01:18:44,200 --> 01:18:47,470 Americone Dream, Kirsche Garcia, Chocolate Fudge Brownie, Schokolade 1666 01:18:47,470 --> 01:18:50,840 Chip Cookie Dough, und, wenn Sie Google Chunky Affe, erhalten Sie diese. 1667 01:18:50,840 --> 01:18:53,620 Also alle, die um 4:00 erwartet PM in Maxwell-Dworkin. 1668 01:18:53,620 --> 01:18:56,736 Wir sehen uns am Mittwoch als gut. 1669 01:18:56,736 --> 01:18:59,960 >> Sprecher 2: An der nächsten CS50, RJ schläft in. 1670 01:18:59,960 --> 01:19:03,656 1671 01:19:03,656 --> 01:19:04,906 >> RJ: My-Bereich! 1672 01:19:04,906 --> 01:19:07,727 1673 01:19:07,727 --> 01:19:08,977 Ha! 1674 01:19:08,977 --> 01:19:12,056 1675 01:19:12,056 --> 01:19:13,306 Oh, 1676 01:19:13,306 --> 01:19:16,374