DAVID Malan: Todo ben, estamos de volta. Así, para o emocionante Concluíndo, a nosa última sección en programación web, que eu pensei que ía usar como un termo xeral para capturar algúns temas restantes. Así, a finais do día, imos realmente facer un pouco de hands-on de programación web cunha linguaxe chamada JavaScript. E eu creo que nós imos dar un ollo en algo relacionado a imaxes e descubrindo algo secretaría agochada nunha imaxe, e tamén un ollo en Google API de Google Maps, de programación de aplicación interface, como algo representante do tipo de software que é cada vez máis e libremente dispoñible hoxe. Pero por que non dar un ollo nun ingrediente para este mundo que tipo de estado dando por certo hai durante algún tempo, unha base de datos. Para o día pasado e medio que xa asumiu que temos acceso a unha base de datos, pero o problema é que unha base de datos de resolver? O que fai por nós? ¿Que é iso? Audiencia: [inaudível] DAVID Malan: Contén toda a información, OK, e que tipo de información Pode pór nel? Audiencia: [inaudível] DAVID Malan: Calquera información poñer nel, vai volver. Iso é verdade. E nunha web baseado na web típico ou web aplicación, que tipo de información, En concreto, pode pór en? Audiencia: [inaudível] DAVID Malan: Usuarios. Así que é un usuario? Audiencia: [inaudível] DAVID Malan: OK, rexistrada usuario do sitio web. E o que significa Information Store 'usuarios? O que compón un usuario? Un usuario ten que? Audiencia: [inaudível] DAVID Malan: Si, persoal de datos, e me gusta diso. Imos ser máis preciso. Así, un usuario normalmente ten un nome, o que máis pode un usuario teñen? Audiencia: [inaudível] DAVID Malan: An OK addr--, Entón, primeiro nome, apelidos. Iso é bo. De feito, imos fixar iso, porque vai para abrir-se a unha oportunidade discusión, aínda, máis lonxe. Nome, apelidos, sexo. Un ID de calquera tipo. Que máis? Escoitei algo antes, tamén. Un correo electrónico, enderezo postal. Entón, imos facer unha pausa alí e agora considerar non o que está almacenando na base de datos, Mas-- e por que non, xa que é, se cadra, Claramente xa que rexistrar un usuario, quere lembrar-los por algún tempo. Non quere que só ser almacenado na memoria RAM e ser así forgotten-- imos concentrar en como. Acontece que en o mundo dos bancos de datos, hai polo menos dous tipos estes días. Algo chamado unha base de datos SQL, Structured Query Language, ou, de xeito fofa nomeado, NoSQL, que non é SQL. E o último é un exemplo do que pode ser chamado unha orientada a obxectos, ou un almacenamento de obxecto, unha base de datos que almacena obxectos, e non, escusa min, como veremos en breve, liñas. Entón, imos concentrar un momento en O primeiro destes, a saber, un SQL base de datos, só porque é tan familiar xa, a ninguén que usase o Excel ou Follas de Google ou Apple Números ou calquera defecto programa de folla de cálculo, ou, de forma equivalente, ou máis sofisticada, algo así como Microsoft Acceso ou Oracle ou MySQL ou PostgreSQL, todos os cales son nomes de produtos para implementacións do seguinte idea. Unha base de datos relacional é simplemente algo que ten liñas e columnas. E por liñas e columnas, Eu literalmente significar algo como este, por iso, onde nós pode ter a nome dun campo e seu tipo aquí. E, de feito, déixeme agora comezar a mapear estes. Entón, en realidade, eu non sei por iso que eu deseño dun gráfico separado. Imos manter este sinxelo. Temos aquí a inicios da nosa mesa, onde este é o nome do campo e este é o tipo de datos, e por tipo quero dicir o seguinte. É un número, é unha cadea, unha corda curta como unha palabra, é un parágrafo é datos binarios, como unha imaxe? E imos provocar este separados por só un momento. Entón, primeiro nome, número, corda, gran peza de texto-- Audiencia: [inaudível] DAVID Malan: Si, por iso cadea. E nun contexto de base de datos, imos normalmente chamar este campo carácter. Vou só dicir carbón para agora, pero estamos indo para refinar iso nun momento. campo de caracteres. Último nome é probablemente o mesmo. Sexo? Home ou muller, polo que podería ser un campo carbón animal. Podería ser calquera cita, pecha comiñas "Macho" ou cita, pecha comiñas "feminino" ou pode ser ou f m. Se quere ser máis inclusiva, pode ter que un terceiro valor ou algún tipo de outro campo completamente. E así podería usar certo falso. O campo podería ser chamado sexo masculino, e logo, podería dicir verdadeiro ou falso. Pero iso non significa necesariamente capturar toda a información que pode querer. Non é que hai outro tipo de campo que pode ser útil aquí nunha base de datos típico, denominado enum, onde é un campo de caracteres, pero, o deseño, chegar a enumerar os valores posibles, como cita, "macho" pecha comiñas, citas, unquote "feminino" e así por diante. De xeito que calquera valor está na súa base de datos, é realmente baseado en carácteres, pero que ten que ser un deses valores. É probable que non quere un enum para o primeiro ou último nome. En caso contrario, teríamos para enumerar, como o nome deriva, literalmente todo posible nome e apelidos. OK, entón ID que debe un ID ser? Si, quizais por iso un número. Entón, imos ir con que, polo momento, número. E por número, o número é un pouco demasiado ampla agora. Ao final do segundo día, eu sinto que debe ser un pouco máis precisa. Número podería dicir como é Podería ser algo así como 1.236. E iso non é probablemente o que entendemos por un ID. O que nós probablemente quere dicir con un ID? Audiencia: [inaudível] DAVID Malan: Oh, ben, entón quizais non sexa aínda un número. Quizais sexa realmente un identificador único que é unha cadea, como un nome de usuario. Entón, absolutamente, pode ser. Eu creo que alguén probablemente significaba numérico, aínda. Entón, imos ir con iso. Que tipo de número? ¿Que é un máis precise-- un enteiro. Así, un número como 0, 1, 2, 3, así que imos chamar iso de un enteiro. E aínda así, eu podería ser picuinhas, é non é realmente só un integer xeral que quere. Probablemente non quere valores negativos, só porque, el só se sente estraño. Probablemente quere enteiros positivos. Entón tamén pode expresarse que nunha base de datos, pero por agora, imos dicir enteiro. Correo-e? Este é probablemente só-- que? Audiencia: [inaudível] DAVID Malan: É unha mensaxe, pero iso é caracteres, non? El só ten un carácter descolados como un símbolo "arroba" ou calquera outra cousa, senón que é un campo de caracteres. Enderezo postal? campo de caracteres. Entón iso é un bo comezo, pero imos ser un pouco máis que agora. Así, verifícase que en unha base de datos, moitas veces ten unha opción sobre o máis refinado versións destas cousas. De feito, nunha base de datos SQL típica, SQL, ou, máis xeralmente, base de datos relacional, bases de datos con liñas e columnas, moitas veces chegar ao especificar non só do tipo de a field-- déixeme facer un espazo aqui-- pero tamén a lonxitude. Entón, canto tempo é un nome? Coido que, D-A-V-I-D. OK, entendeu I Probablemente só ofendido como metade das persoas na sala, dereita, sempre que os seus nomes son máis que cinco letras, entón cinco parece un pouco egoísta e inxenuo, entón o que é un valor mellor? 10, todo ben, e eu creo que estamos ben no cuarto. 13? 30? Por que non tomar a visión de antes, cando estaban falando sobre matrices e memoria? Por que non só dicir como 1000? nome de ninguén vai para ser máis longo que 1000. Empurrar cara atrás. Audiencia: [inaudível] DAVID Malan: Si, é desperdicio, á dereita, especialmente a maioría dos nomes son só cinco ou 10 ou 15 caracteres, que é moi custosa. Entón vostede sabe o que? Este é tipo de unha pregunta difícil. Agora, por suposto podemos analizar Inglés e os nomes de calquera outra lingua e descubrir, así, cal é a media média-- realmente non axudar US-- o que é o máximo é probablemente o que realmente queremos. Pero resulta que temos ata algunha opción do tipo aquí. Nunha base de datos SQL típica, vostede ter algo chamado un campo de char e tamén un VARCHAR, V-A-R, para o campo de char variable. E a diferenza é esta. Un campo char, ten o deseño, Ten que especificar anticipadamente a lonxitude exacto do campo. Entón, talvez o nome como 20 sente tipo de seguro. Pode ter que facer algún googling para ver se isto é realmente seguro dabondo. Hai probablemente un nome con 21 caracteres, pero por agora, supoña que 20 é seguro. Un campo de char implicaría nunha base de datos que lle están utilizando 20 e sempre 20 caracteres. Agora, se é só D-A-V-I-D, 15 dos só será caracteres en branco, pero aínda está a usar todos os 20 bytes. Un campo VARCHAR, pola contra, enténdese a cadea debe ser de ata 20 caracteres pero se é só cinco, só vai usar cinco, ou quizais seis para un valor especial ao final, así 0 discutir que significa o fin dun carácter secuencia na memoria. Entón, cando pensa pode escoller de char contra VARCHAR, dado que trade-off? Char usa moitos personaxes, VARCHAR non utiliza máis do que moitos caracteres. Audiencia: [inaudível] DAVID Malan: OK, cando vostede sabe o lonxitude da corda moi convincente usar só char, porque se coñece-lo, só tes que poñer-lo para abaixo. E quizais iso é verdade para un zip código, en Estados Unidos, polo menos, 02138, está sempre será de cinco caracteres ata que engade o trazo catro. Pero pode ter algúns valores que sempre sabe o longo. Ou quizais símbolos do Estado, como NY en Nova York, e MA para Massachusetts en Estados Unidos. Quizais ten algunhas situacións onde iso é totalmente razoable, pero por esa lóxica, por que Nós ata cismar isto? Por que non só usar VARCHAR e logo, imos só Sempre use dous caracteres de calquera xeito, é utiliza sempre cinco caracteres de calquera maneira? Por que non só salvar VARCHAR para todo, por esa lóxica? Debe haber un prendedor. Audiencia: [inaudível] DAVID Malan: Podería escribir algo mal. Entón, iso é verdade. Pero, aínda así, non poden usar máis memoria do que eu reservar. Eu aínda teño a final dicir ao longo da lonxitude, entón eles non poden accidentalmente facer este erro, pero un bo pensamento. É máis sutil, pero é moi relacionada para a nosa discusión, en realidade, de matrices e listas ligadas anteriormente. Acontece que unha base de datos, se sábese que todos os valores sexan de lonxitude fixa, aínda que algúns deses valores están en branco, tipo de estética en branco, D-V-A-I-D e logo 15 baleiros, verifícase que cada campo é o mesmo lonxitude, así como unha serie tivo todo o seu material de costas cara atrás para atrás, como se podería só 1 para chegar ao seguinte valor, mesma idea nunha táboa de base de datos. Todos o seu personaxe cadeas son a mesma lonxitude, ten o que se chama de acceso aleatorio. Se todas as cordas son de lonxitude de 20, non só facer máis 1 acaba de facer máis 20, máis 20, máis 20, máis 20, e pode moi rapidamente percorrer ou busca a través de todos os seus datos. Un campo de char variable, pola contra, non sempre ten 20 caracteres. Pode ter 20 e, a continuación, 15 e, a continuación, 19 e, a continuación, 10, e por iso, se quere buscar a través del, non pode só cega engadir 20 bytes para chegar ao seguinte. Vostede literalmente ten que buscar porque o bordo da estrutura de datos, se quixeren, é irregular. É o tipo de entra e sae base na lonxitude real da cadea. Entón, cando vostede sabe o longo, como Kareem di, usa un campo char, porque gañou aquela eficiencia de ser capaz de buscar a través lo máis rápido cando está mirando para os datos, pola contra, usa unha variable. Desafortunadamente, eu non teño unha boa resposta a canto tempo o nome debe ser, pero para algo como un nome, eu diría un VARCHAR é común porque non vai ser unha lonxitude fixa para todos. 20, eu non sei, 20 sente un pouco axustado. Nós só dicir que o 50, 50. Realmente non custa-lle que moito máis que dicir 50 en vez de 40, pero nalgún momento, ten que para facer unha chamada de xuízo. Moi común, francamente, para [? histórico?] razóns, aínda que sexa excesiva, quere dicir 255, porque hai algún tempo, en sistemas de base de datos populares, como MySQL, unha ferramenta gratuíta de código aberto que unha morea de empresas como incluso en Facebook usado, este foi o estándar máximo para que a xente só fun con el. Así, non é razoable, pero imos utilizar un pouco máis de intuición e dicir, con certeza 50, que é probablemente un pouco excesivo. Sexo, máis me gusta de enum, e por iso, polo tanto, pode enumerar macho ou femia, ou que de forma máis eficiente, m ou f ou outra simboloxía, pero enum se sente como unha boa opción alí. Para ser claro, o sexo podería ser só un VARCHAR, e nós poderiamos só todo Concordo persoas como agradables, sempre poñer os mesmos valores alí. Macho ou femia ou outros enfeites. Pero o problema, entón, é que poderiamos cometer un erro, como [inaudível] propuxeron anteriormente nun contexto diferente. Se comete un erro, poderiamos obter valores incorrectos na nosa base de datos. Entón, o que é agradable sobre bases de datos como Oracle e MySQL e outros, é que ten esta última capa de defensa, onde o administrador dBA, base de datos, quen está designado esta táboa como nós son verbalmente, podería poñer no lugar unha enumeración que que protexe contra especificando masculino, feminino, e así por ninguén outra cousa calquera programador pode accidentalmente inserir calquera outro valor. Entón, iso sería bo. Esta é unha característica. Así, un ID, asumindo unha identificación numérica, el probablemente debe ser un enteiro positivo. E, ás veces, teñen oportunidade para discutir lonxitude. Non faría normalmente especificar un número aquí, vostede, en vez, especificar este é un int, ou un gran int, como son normalmente chamados. Pero, normalmente, un número enteiro sería, digamos, 4 bytes. E se é 4 bytes, iso é cantos bits? Audiencia: [inaudível] DAVID Malan: 32 bits. Entón, cantos usuarios que podemos ter en nosa base de datos todos eles teñen un ID e este ID debe ser único? 32 bits significa que temos patróns dun, dous, tres, catro, five-- Así como moitos patróns diferentes de ceros e os que pode ter se existen 32? Isto é o mesmo que pregunta o que hai de dous a 32? É un gran número que Non podo axustar, pero sei que é preto de 4 millóns de dólares. Entón isto significa que a súa táboa de base de datos pode ten catro millóns de usuarios e é iso. Polo tanto, este é un interesante implicación deseño. Un número razoable de empresas decidiron, quizais non tanto para a súa táboa de usuarios, xa que 4 millóns de usuarios é un problema raro. Esta é unha especie de Facebook de estilo problema, e non un problema típico empresa. Pero quizais se ten rexistros de transaccións ou algún tipo de datos que constantemente está escrita en base de datos que absolutamente podería millóns e millóns de liñas e usa un enteiro para el, o que vai pasar por iso comeza a remar número 4 millóns e, a continuación, tentar introducir o 4000000000 e 1, por así dicir? Estou simplificando un pouco os números. Pode cortar, quero dicir que Ten que tratar con isto de algunha maneira. E o que un ordenador sería normalmente facer, pensar sobre el mesmo dende esta mañá, se ten un valor de 4 bits como 1, 1, 1, 1, a cal, só para amarrar a mañá en conxunto para a tarde, o que representa este número en binario? OK, imos facelo máis fácil. Que ese número representan en binario? OK, imos facelo máis doado, o que isto representa en binario? Audiencia: Tres. DAVID Malan: Tres porque temos os column-- [Risas] Ufa! Tivemos a columna queridos ea columna dous. Entón supoño que, de feito, o noso [? infield?] non eran de 32 bits, pero eran dous bits, podemos contar dende o número 0, 1, 2, 3 usuario, e entón nós estamos tipo de de volta ao usuario 00 de novo. Entón, iso é o que normalmente acontece. Se vostede xa escoitou a expressão-- Probablemente non, pero se have-- integer overflow, onde manter lanzando os seus anacos ser os maiores valores, e entón está fóra de bits, o que normalmente ocorre? Por que digo 00? Ben, este é tres. ¿Como representar 4? ¿Como representar o ao número 4 en binario? Audiencia: [inaudível] DAVID Malan: um-- si, non digo 100 per se, porque ten o mal connotación, pero 1-0-0. Así, este número é de feito 1-0-0 correcto, pero se só ten dous bits, o que realmente fixo? Vostede rolou para 00. E, de feito, é o que ía ocorrer. En realidade, pode pensar sobre iso máis familiarmente. Se ben se lembran, o que, 16 anos, o mundo debería rematar cando o problema Y2K pasou. Por que isto? Así a maioría dos ordenadores, a decisións razoables, foron almacenar números como o ano 1975 ou o ano 1999 só usando dous díxitos na memoria do ordenador. Entón, por suposto, o que pasa cando chegar ao ano 2000, vai a este, ou mellor, si. Entón vai para o ano 2000, pero se só está a usar dous díxitos parecer como o ano 00 e entón rolou. E é por iso que unha morea de sistemas precisaba ser actualizado no momento. Así, co que dixo, empresas como a Facebook ir contra iso. Polo tanto, o único xeito de manexar o situación, francamente, é anticipar-lo. Ou o xeito máis limpa para xestionar esta situación é anticipar-lo para que non Ten que facer cambios máis tarde. Entón, en vez de 8 bytes, vostede sabe o que? Eu vou ser con visión de futuro aquí, aínda que sexa algo optimista de que teremos 4 millóns e 1 usuarios na nosa web. Pero imos usar só 8 bytes, ou 64 bits, o que xeralmente sería chamado un gran número enteiro, moi técnico. E iso significa só que pode ter aínda máis díxitos no seu número. Pero esta é unha importante decisión de deseño, porque se escolle un número que ten tamén algúns anacos de expresividade realmente pode crear un erro no software. Todo ben, entón imos pechar con correo electrónico e enderezo postal. Así, o correo electrónico, o tempo debe un enderezo de correo-e ser? 50. Eu realmente non teño idea, pero é probablemente algo parecido, porque se non, ninguén vai escribir-lle se el fica moito tempo, entón 50, imos ir con el para agora. enderezo postal, canto tempo debe ser? Audiencia: [inaudível] DAVID Malan: Non só un código postal, aínda. enderezo postal, oín. Entón, iso é como unha Brattle Square, coma, Cambridge Mass., coma, 02138. E, de feito, déixeme tirar algo folla aquí. Este parece que é unha oportunidade perdida. Se temos 1 Brattle Square, coma, Cambridge MA 02138, Eu sinto que podemos facer mellor de enderezos, pode postal. Por que non imos explotar esta un pouco? O que estou querendo chegar? O que temos que si ter para as nosas liñas aquí, quizais? Audiencia: [inaudível] DAVID Malan: Si, entón imos chamalo street_number, e un subliñado é só unha común forma de ter o que parece ser un espazo, pero non é, en realidade. Calle, e despois cidade-- pena? Audiencia: [inaudível] DAVID Malan: Poderiamos facelo. Liña un, liña dous. Por que non imos manter Lo simple de momento, pero iso é absolutamente unha decisión aceptable. E entón estado, e despois imos ser un pouco centrado nos EUA polo momento e só facer CEP, só porque vai levar a un erro interesante ou problema aquí. Entón supoño que é agora o noso enderezo. É un pouco máis irritante que temos todas estas máis campos, pero agora podemos marcar as cousas un pouco mellor. número Entón, agora rúa probablemente non debe ser un char, debería? O que debería ser? Audiencia: [inaudível] DAVID Malan: Quizais, un número como un número enteiro de novo? Un gran número enteiro? Probablemente non viven en 4 millóns Main Street ou algo tola así. Así enteiro pode ser ben, pero ten ninguén viviu nun enderezo como 1A Brattle Square, ou 1 e 1/2? que esas cousas existen, por desgraza, mesmo se non viviu alí, hai esas anomalías como o piso 1A, 1B, 1C. Entón vostede sabe o que, probablemente Non debe ir con enteiro, se non, imos perdendo algunhas vendas. campo Char, quizais? Non sei canto tempo. Probablemente non vai ser tanto tempo, entón 10 ou algo así. Ninguén vai escribir un número máis longo, quizais. Pero, de novo, nós probablemente debe dar máis atención a iso. Quizais Google, facer algunha investigación, pero imos ir con nosas entrañas para agora. Rúas, char, 50, eu non sei. Nalgún momento, ninguén vai gravala-lo en un sobre, tamén, entón hai probablemente algúns límites superiores alí. City, mesmo, con certeza, de xeito carbonizar 50. Estado, pode ser centrado nos EUA polo momento. Así, podería ser unha lista, por tanto, tipo dunha chamada de xuízo, estado. Podería ser como dous caracteres. Entón, en realidade, se cadra, non paraba de dicir carbón. Eu probablemente significa VARCHAR, só por algunha eficacia, pero imos volver esta decisión nun momento. Podería ser un char de lonxitude 2 para o estado. En EEUU teñen, como MA, Massachusetts, Nova York, Nova York, Nova Jersey, Nova Jersey, e así por diante. Así, podería ser fixada a iso. DC para Washington DC. Pero eu creo que, Olivier, vostede propuxo outra visión. Audiencia: [inaudível] DAVID Malan: Si, por iso é unha pouco aburrido para escribir, pero unha enumeración podería facer máis sentido, porque deste xeito, polo menos para os Estados Unidos, podería enumerar, se tediosamente pero facelo só unha vez na súa base de datos e nunca máis ter que pensar sobre Lo, os 50 códigos de dous caracteres. Entón, me gusta enum. Imos ir con iso aí, porque que tipo de impón máis rigor. E, a continuación, código postal? Creo que Andrew tiña un pensamento sobre ese Audiencia: [inaudível] DAVID Malan: Si, cinco ou nove. Nós só mantelo simple. Só ten que facer cinco por agora. Pero quizais eu só podía facer un número enteiro, non? Podería, pero xa sabe o que, eu fixen este erro xa, nalgún sentido. Anos, eu estaba migrando de Microsoft Outlook a Gmail, e Outlook ten un xeito de exportar todos os seus contactos como un arquivo de Excel, un arquivo CSV, separados por comas ficheiro valores. E eu cometín o erro, I pensar, de facer dobre clic nel, xa me baixei a exportación, a asegúrese de que parecía como eu esperaba. Debo ter bateu gardar ou deixar auto-save xute no ou algo así. Porque cando, logo de importación Lo en Gmail, todo funcionou. Pero durante anos, ata hoxe, e Eu fixen iso cinco, 10 anos, Eu aínda estou atopando amigos que teñen enderezos que se parecen con iso. Por que? Audiencia: [inaudível] DAVID Malan: Tardou a 0, así, en vez diso, tomou todo o código postal como un número, e, polo tanto, é un 0 que significa non ten ningún significado. E así 2138 parece ser o meu código postal. E este é, francamente, un Excel irritante característica pola cal creo que por defecto, aínda que iso significou só ser texto, Microsoft Excel decide, déixeme ser útil, e Oh, eu vexo só números. Imos tratalos como números. E trunca os ceros á esquerda. Xuro por Deus, cada parella meses eu atopar un enderezo, e fóra de un tipo de TOC, eu volvo e engadir a 0, a pesar de eu nunca enviar cartas de persoas ou calquera cousa. Pero eu estou atopando restos desta. Entón, iso quere dicir, que é unha boa idea? OK, non, porque ninguén en Massachusetts, nesta área, terá un líder deles. Entón imos con gusto char probablemente cinco. E aquí, entendemos que podería usar un enum e nós podería enumerar 10.000 posibles códigos postais, pero iso parece que é, probablemente, cruzando unha liña de, como, beneficios. Se ten de entrada que moitos datos en base de datos para protexer contra algo. Entón carbón entender que podería escribir na H-E-L-L-O como o seu código postal, o que non é, obviamente, numérico. Así, non hai ningunha maneira, en unha base de datos típico, especifica numérica e só cinco caracteres, polo que teremos facelo no código. Nós imos facelo en PHP ou Java ou calquera outra lingua que estamos usando o servidor para facer cumprir este tipo de restrición. Whoo! Todo ben, entón todas as preguntas só aínda? Imos facer outra decisión de deseño. Acontece que Tamén terá que escoller, ao proxecto unha base de datos SQL, ou database-- típicos relacionais onde de novo, relacional só significa liñas e columnas, é así que organice as súas data-- e entender que o que isto significa, Teño enganosa no que, estou drawing-- este é o que se chama esquema para unha táboa de base de datos. Isto é como o especificacións para a mesa-- pero cando chega a hora para realmente almacenar datos, e imos facer isto, só tes exemplo aquí. Vou abrir Excel, porque Excel me vai dar liñas e columnas. E iso é o que a Oracle e MySQL e outras ferramentas me vai dar. Entón, eu estou indo só para usar Lo debido de discusión. Deixe-me ir adiante e abrir unha documento representativo aquí, ampliar un pouco. Así, por exemplo, os nosos cabeceiras están nome, apelidos, sexo, ID, correo electrónico, número de rúa, rúa, berros. Rúa, cidade, provincia, só sobre encaixa na pantalla. Entón, o que isto significa que cando un usuario se rexistra por primeira vez para o meu sitio, que vai ser algo así como David, Malan, m, digamos 1, malan@harvard.edu, número da rúa vai ser como unha Brattle Square, Cambridge, MA, 02138, e logo así por diante. Entón, cando eu digo que unha base de datos relacional ou base de datos SQL é liñas e columnas, Quero dicir iso. Que os datos reais son almacenados en liñas e columnas. Esta é só unha coincidencia, que estabamos falando, e eu estaba só tirando-o en filas e columnas. Este é só o esquema, a definición global. Entón destes campos aquí, ou equivalentemente, alí, cales son os campos que pensa Eu son probablemente a investigar sobre se eu son un usuario ou se eu son o administrador da base de datos? Como, o que eu son campos en realidade, indo buscar? Audiencia: [inaudível] DAVID Malan: O nome, si de modo Eu gusto do feito isso-- si, correo electrónico pode ser bastante común. Sentímolo, dixo o nome. Entón maybe-- e de novo, estamos tipo de falar en abstracto. Non sei por que ía estar á procura dun nome, pero que se sente razoable se está buscando por un usuario. Quizais afirma, con certeza, ID. E é unha escorregadia declive, porque podía inventar un escenario onde quizais o meu xefe me pediu, cantos homes temos na nosa web? Cantas mulleres que temos na nosa web? E así, nese punto, pode querer para buscar no campo de xénero, tamén, e nada máis. Polo tanto, hai un trade-off aquí. De novo, non hai ningunha resposta correcta, pero hai é unha característica na maioría dos bancos de datos SQL coñecido como indexación, en que vostede, o deseño, o administrador de base de datos, comeza a decidir anticipadamente cales Campos A base de datos debe optimizar para a investigación en. Podería moi inxenuamente dicir, optimizar tanto, optimizar tanto, optimizar tanto, optimizar iso e iso, e a base de datos facer algo máxica debaixo do capo, e facer algo de xeito que a próxima vez que vostede buscar en calquera destes campos, vai, de feito, ser máis rápido. Isto é posible. Non anula a si mesmo. Pero debe haber un prezo a pagar. Se inxenuamente, ou exceso de entusiasmo digamos, o índice de todos estes campos, por así dicir, facelos todos eficientemente searchable, cal o prezo que está pagando probablemente? Audiencia: [inaudível] DAVID Malan: Performance. Que queres dicir? Ben rendemento, polo menos a contexto, estou discutindo, é mellor agora. Esta é a definición de indexación. Isto fará que as enquisas rápidas. Así, o tempo diminúe, por así dicir. Audiencia: [inaudível] DAVID Malan: Space. Entón, de novo, estes son un comercio común. Podo acelerar as súas investigacións, pero é vai custa-lle máis bytes de espazo. Por que? Ben, por defecto, se temos ningún estas estrelas vermellas, ningún destes índices, como eu digo, como buscar para un nome neste banco de datos? Entón, imos chamar a nosa atención a este exemplo. Se temos David e Scully e Kareem e Arwa e outros nestas liñas, por exemplo. Entón, imos facer exactamente isto. Scully está aquí, e despois temos Kareem, e Arwa, e os outros, se non o fai ten un índice definido, por así dicir, o mellor que podes facer é buscar lineal. Se buscar Arwa, non estamos vai ser capaz de ir á dereita para ela rapidamente. Nós imos comezar a parte superior e percorrer todo o camiño ata o fondo, non moi diferente do noso orixinal exemplo Mike Smith. Se, con todo, eu digo, hey, base de datos, Índice do primeiro campo de nome, logo vai facer algo extravagante e apoiar algo como busca binaria. Probablemente non é a busca binaria per se. Bases de datos tenden a usar outro estrutura de datos chamada de b-trees, non debe ser confundido con árbores binarias, que facelo máis rápido para buscar algo logarítmica na natureza. Pero o prezo que paga para construír esa O recurso, que a estrutura de datos na memoria, é máis bytes. Entón, isto pode levar algúns megabytes, algúns gigabytes, quen sabe? Depende dos datos. Entón, nalgún momento, ten que decidir, Probablemente non é un caso común. Entón, cales son o común real casos, se o tivese que escoller, o que podería seus campos favoritos ser? Correo electrónico. E máis me gusta de correo porque correo electrónico, en teoría, debe ser único. E así normalmente, cando vostede sabe de antemán que un dos seus campos é ou será único, que tende a ser un bo campo para buscar, porque desa forma, cando busca por algo, vai recibir de volta unha ou Restablecer respostas e, a continuación, está feito. Non ten que manter buscando outros aínda. E así, neste caso aquí, e-mail, sempre que non pode rexistrar dúas veces co mesmo correo electrónico, é unha boa. ID por definición, o mundo da informática, se está a falar dun ID, que mellor ser único. Isto é o tipo de connotación de ID ou identificador. E o resto deles pode ser, imos chamalos bo haves, pero non é realmente necesario. E así, nunha base de datos, se especifica índices, pero pode ser aínda máis preciso. Pode dicir, hey, base de datos, comproba se que cada ID nesta táboa é única. Non deixe nin mesmo un programador accidentalmente poñer en un correo-e duplicados ou duplicar número de identificación. Tan parecido enums protexer-nos da mesma forma, Pode que estas defensas de nivel inferior. E así por proxecto de base de datos, en certo sentido, é unha especie de diversión, porque facelo á defensiva. Vostede tipo de supoñer que traballa cos programadores horrible, horrible e quere poñer en tantas defensas como pode protexer os seus datos, pero á vez quere para axuda-los a ter un mellor desenvolvemento escollendo cales campos para optimizar. Pero non pode necesariamente facelo un baleiro como nós tipo de está aquí. Ten que saber cales son Nestes casos comúns estar. Se os desenvolvedores están implantación dun libro de enderezos, pode moi ben querer ser capaz a investigación en case todos os campos, só pola natureza da aplicación. Entón, talvez gasta que espazo adicional. Seguro, algunha pregunta? Si. Audiencia: [inaudível] DAVID Malan: Non. Audiencia: [inaudível] DAVID Malan: OK. Audiencia: [inaudível] DAVID Malan: Ah, entón nós estamos a falar dun xeito agora que é totalmente independente de linguaxe. Polo tanto, estamos a falar agora sobre bases de datos relacionais de forma máis xeral, ou SQL base de datos de forma máis xeral. Audiencia: [inaudível] DAVID Malan: A palabra mellor para usar é, pode ser usado por calquera linguaxe. Entón, podo escribir o código JavaScript, C código de código, C ++, Java de código, código Ruby, todos os cales falar a unha base de datos e realizar consultas. En realidade, iso non é un mal Segue a unha consulta de exemplo. E, de novo, non imos entrar en Java ou C ++ ou calquera dos que máis, pero en SQL, a linguaxe que me manter referíndose, Structured Query Language, este é en si unha linguaxe de programación, pero que está destinado a ser utilizado para, non sorpresa, estruturado consultas de consulta. Por iso quero dicir iso. A forma como selecciona datos desde unha base de datos MySQL é que, literalmente, escriba no seu programa algo así como select estrela dos usuarios. Estou asumindo que esta táboa, é a partir de agora chamado usuarios. Podería chamalo de calquera cousa que quere, pero este tipo de sentido. E así select é moi verbo común, se Vai, en SQL, que, literalmente, fai iso. ¿Que pensas estrela significa, neste contexto ,? Audiencia: [inaudível] DAVID Malan: Eu sinto moito? Audiencia: [inaudível] DAVID Malan: Non é necesario, é máis inclusiva que iso, en realidade. É o carácter comodín. Protagonizar case sempre significa algo, entón iso significa neste caso Seleccionar todo da base de datos. Polo tanto, cando digo iso, quero dicir me devolva cada columna da miña táboa chamada usuarios. Entón me dea un conxunto de resultados, como se chama. Noutras palabras, dáme unha copia do folla de cálculo, é o que eu estou chegando. Pero se eu dixese selecciona estrela de usuarios onde ID é igual a 1, o grande debe meu conxunto de resultados sería entón? Ou equivalentemente, cantas liñas deben I entrega de volta a partir da base de datos? Probablemente só un, se eu tivera de feito ID tratada como un identificador único, e David ten que ID único, I debería volver unha e só unha liña conteñen toda a información de David. Se eu dixen iso, onde ID é igual a 99, eu debería volver, Neste contexto, cero liñas, polo menos de momento. Con todo, se realmente non me importa sobre toda esta información, Podería só dicir, onde é que David vivir? Escolla un código postal de usuarios onde ID é 1. Isto pode seleccionar só a min zip de David código e non a totalidade desa liña. Por que eu podería facelo en vez de a consulta estrela, o wild card? Audiencia: [inaudível] DAVID Malan: Si, eu só podería ter del. Así, o rendemento é unha vez máis a resposta aquí. Por que pedir máis información que precisa, porque aínda que está todo ben en conxunto, aínda ten que copiar os datos, ao parecer, a partir da base de datos no seu programa de algunha maneira, e que é tontería se só precisa cinco deses díxitos, Non é a totalidade da cola. Entón, como podo inserir un usuario? Supoña que un usuario ten só rexistrado por primeira vez. A sintaxe normalmente sería coma este. Inserir usuarios e entón diriamos valores, e entón nós diría valores como, por exemplo, Lauren Scully, noso director de cine aquí. E o próximo campo é o xénero. Entón, imos dicir cita, pecha comiñas "F", entón temos unha identificación e eu vou dizer-- imos finxir que non é realmente aquí, así que imos retroceder na historia. Entón 2 será o seu ID. E entón o seguinte campo aquí é o seu e-mail. Por iso, será como Lauren Scully etc., e imos Dot Dot dot-lo de aquí en diante. Agora vai estar un pouco tedioso, pero a consulta de inserción acabaría por parecerse a iso. Se eu queira desfacerse de Scully, uh-oh, imos cancelar -la, ela exclúe súa conta, eliminar usuarios onde ID é igual a 2, vai se librar de Scully. Ou podo dicir actualizar usuarios definir, imos dicir, o que poderiamos cambiar? Supoña que se move. Set zip é igual a 021-- non, é ela zip actual. 90210. O único outro código postal Sei que o mundo. Así que mudaría ela zip code-- en realidade, que non cambiaría o seu código postal. Que acaba de facer? Aínda que a sintaxe é probablemente novo. Audiencia: [inaudível] DAVID Malan: Si, eu me mudei todos para Beverly Hills, California. Entón, eu debería realmente dicir onde ID é igual a 2. E así por diante. Entón SQL é todo sobre estes tipo de instrucións. SELECT, INSERT, eliminar, actualizar con estes predicados no extremo estas cláusulas, onde, por así dicir. E hai moito máis pode facer, pero é realmente só se reduce simplemente, se arcanely, expresando o que quere que a base de datos para facer. E, a continuación, a base de datos Vai descubrir cando inserir Lauren Scully para o base de datos, onde poñela na memoria para que poidamos obter moi rapidamente -la con base no seu enderezo de correo-e ou segundo o seu número de identificación ou outros similares. Si, Dan. Audiencia: [inaudível] DAVID Malan: Realmente boa pregunta. Será que estes scripts cambiar de Microsoft Access para Oracle ao MySQL para PostgreSQL? A resposta curta é que depende. En teoría, hai unha moi subconxunto común significativo de SQL que é compartido entre todos estas implementacións. Con todo, varios fabricantes ten características engadidas aos seus bancos de datos para facer certas cousas alén do alcance destes recursos, que pode, de feito, romper. Así, o xeito desenvolvedores protexer contra iso, é que en vez de escribir en bruto código SQL que estou escribindo aquí, eles en vez de usar unha biblioteca, unha biblioteca común que a propia é unha especie de alto-nivel e resumos distancia, que produto que está a usar. E dálle funcións e procedementos para chamar para que nunca realmente escribir SQL puro. En teoría, entón, pode cambiar produtos de Oracle para Microsoft ou viceversa, ou algo outra cousa, e literalmente cambiar nada sobre o seu código. A realidade, con todo, é, ás veces desistir de recursos como resultado. Pode escoller un produto porque ten eses recursos de valor engadido, e está agora non usalas conscientemente. E informalmente, a maioría das empresas tenden Nunca se afastar do seu banco de datos. Así, mentres que este é un bo ten recurso, a realidade é, se está revisando base de datos, está probablemente facendo acios doutras alteracións de calquera xeito, que non necesariamente Debe anticipar iso. Polo tanto, é indiscutibelmente over-enxeñaría do problema, pero realmente depende do contexto. Pero, en teoría, o SQL é compartido entre estes diferentes produtos. Realmente boas preguntas. Si. Audiencia: [inaudível] DAVID Malan: Si, entón pode pensar unha base de datos é só un servidor, a finais de do día, e no interior do referido servidor é unha morea de táboas, liñas e columnas. E cando envía unha consulta como esta desde o programa, o seu sitio web, escrito en Java, Ruby, Python, calquera que sexa, o servidor está a recibir esta orde e interpretando a literalmente, do mesmo xeito discutir anteriormente con linguaxes interpretadas, e logo, realizar algunha acción sobre a cero ou máis liñas en cero ou máis táboas. Audiencia: [inaudível] DAVID Malan: Exactamente, exactamente. Así, o pseudocódigo para algo como iso pode ser iso. No seu arquivo PHP ou o arquivo Python ou o seu arquivo de Java, tería de código pseudo-código, ou Risco-como bloques como, visitas de usuarios acme.com/register~~V por primeira vez, logo inserir usuarios e así por diante. E queremos traducir isto para código máis concreto no final. Pero, realmente, temos todo os bloques de construción aquí, aínda que estamos ignorando algúns das etapas de implantación. Entón deixe-me atopar o fallo co que marabillosas fixo só un momento atrás. Creou unha fermosa táboa completa para os usuarios. É certo, poderiamos aplicar Lo en algunhas formas diferentes, pero ten realmente nos levou baixo a path-- e eu dígolle, pero é probablemente o meu fault-- dun moi base de datos de aplicación ineficiente. Non é normalizado. E por normalizada quero dicir alí vai ser, co paso do tempo, unha redundancia significativa, e, polo tanto, ineficiencia, que é desperdicio de espazo. En base a só o que ve aquí, pode imaxina que esta perda de espazo Vai veñen, co paso do tempo, a medida que máis e máis usuarios rexistrar para o seu sitio? O que os datos poden chegar a ser redundantes? Audiencia: [inaudível] DAVID Malan: Por que quere dicir isto? Audiencia: [inaudível] DAVID Malan: Yeah. E imos supor que para os fins de hoxe que iso é verdade. Acontece que, e aprendemos tanto do xeito máis difícil, iso non é verdade. Dalgunha forma, varias cidades, dalgún xeito, o mesmo código postal, que rompe esa intuición marabillosa. Pero imos supoñer que isto sexa verdade, porque é case sempre certo. Entón, supoñamos que un código postal é sempre asociada coa mesma cidade e do estado, que é unha especie da suposición razoable, pero incorrecta, verifica-se. Pero unha suposición razoable para fins de hoxe. Axiña, supoña que eu vivo en Cambridge, MA, segundo a táboa do usuario, e supoñamos que Lauren Scully vive en Cambridge, MA, e supoñamos que Kareem vive en Cambridge, MA, e Arwa vive en Cambridge, MA, todos nós, en 02138. Por que estamos lembrando Cambridge MA, 02138 para as catro de nós? O que debe ser suficiente para lembrar? Audiencia: [inaudível] DAVID Malan: Só o CEP. Basta que hai 02138 porque sabe o que poderiamos facer? Poderiamos estar un pouco sofisticados aquí e aquí, establecer outra mesa onde é que isto vai ser o nome, este será o tipo, este será o lonxitude, e de aí en diante, eu son vai chamar este meu cidades mesa. Isto foi chamado, de Por suposto, a miña táboa de usuarios. E entón o que debo poñer aquí para o meu cidades mesa, que pensas? Audiencia: [inaudível] DAVID Malan: Yeah. Entón zip e estado e cidade. E así o tipo aquí, imos dicir este será un char 5 de novo, suxeitas ao debate de antes. Esta será unha enumeración, quizais como antes, ea cidade será un VARCHAR 50. E agora o que eu gaño para eliminar a partir desta táboa para eliminar esa ineficiencia? Audiencia: [inaudível] DAVID Malan: Nice. Estado e municipio ir, entón eu teño agora eliminada a ineficacia potencial de forma redundante lembrar, Cambridge, MA, Cambridge, MA, Cambridge, MA, Cambridge, MA, que, esperanza nunca vai cambiar. E mesmo se isto acontecer, é minorly chat, agora que eu teño que cambiar Lo en varias liñas, mentres que aquí, eu só podía mudalo nun só lugar. Agora, cal é o trade-off, quizais? Este foi super cómodo. Tiña todos os meus datos ben xuntos. Pero o que é claramente o caso agora? Audiencia: [inaudível] DAVID Malan: Exactamente, e eu son feliz que usou a palabra xuntarse, porque esa é realmente a palabra clave, no mundo dos bancos de datos relacionais en SQL, é unha palabra real pode escribir ou polo menos transmitir. E, de feito, o que temos agora que facer para seleccionar a información completa de David é algo así como selecciona Estrela usuarios, participar de cidades, on-- e agora Vou só mover unha segunda liña de xeito que esta é igual a users.zip fits-- cities.zip onde users.ID é igual a 1. Entón, o que está a suceder? É feo mirando, pero pode tipo de lelo esquerda a dereita, de arriba a abaixo. Select estrela de usuarios é o mesmo que antes, pero non é dos usuarios, por si só. É de usuarios unirse cidades. O que eu estou xuntando esas dúas táboas? Ben, ao parecer, o usuarios mesas zip campo, e este período é só especial sintaxe para expresar esta idea, e esta é a cidades táboas campo zip. Quero os dous para ser igual, pero quero para seleccionar, en última instancia só as liñas onde ID na táboa de usuarios é igual a 1, que pasou a ser o meu. E só para quedar claro, a programador, polo xeral, cando codificar algo así como o número 1, porque senón o sitio só Soporta David ou primeiro usuario, en vez diso facer algo así como ID onde isto supón un variable, que algo pode cambiar co paso do tempo, similar en espírito para o que eu dixen anteriormente con estes tipos de espazos reservados. Pero, por agora imos só codifica-lo como un. E entón o que é que isto significa? Ben, unha boa forma de ver que é que, se esta man é a táboa de usuarios, e este lado é o zips mesa, somos tipo de finding-- e as puntas dos meus dedos están zip aquí, e as puntas dos meus dedos aquí están zip, está tipo de intertravamento que de xeito que recibir de volta o que resulta táboa orixinal, por realmente unirse as dúas táboas o campo común. E non ten que ser peche de correr. Podería ser máis que calquera outra cousa, pero zip é bo, porque un, é curto, dous, é sempre a mesma lonxitude, non hai unha verdadeira eficacia ao Olivier aquí proposto con factoring o zip, e [Inaudível] propoñendo que se librar da cidade e estados. Polo tanto, este é o proceso coñecido como normalización. Calquera dúbida sobre iso? Ben, deixe-me salientar este é o tipo de cousas, aínda que sexa moi baixo nivel, Nesta discusión, que pensaría está tipo de obtención perdido nas herbas daniñas, esta é unha manifestación dun amplo oportunidade para os desenvolvedores de ser malo. E, de feito, mesmo cando, en cursos que ensinei, cando tivemos, por exemplo, inexperto programadores de graduación construír sitios, a primeira vista, os sitios poden ollar fantástico. E eles teñen todo o funcionalidade foi solicitada, os desenvolvedores fixeron un bo traballo. Pero eles non sabían necesariamente abondo sobre o deseño de bases de datos ou non pensar moito abondo sobre os tipos de datos e os tipos de usuarios das web ía ter, e nós cremos, entón, seis meses despois, despois de que se formou ou cambiaron, que porra, a nosa web é realmente, realmente lento. E eu non estou nin fala de millóns ou miles de usuarios. Quero dicir algúns centenares de usuarios no campus, todos os cales desexa, por exemplo, compra para cursos na Ao mesmo tempo, son usando este catálogo de cursos aplicación mencionen ea cousa está quedando realmente lento porque non había índices. Non houbo estrelas vermellas, por así falar, ou non tivo necesariamente fatoramos datos comúns a obter algunhas economías de espazo. E así, cando vetar un creador ou persoa base de datos ou similares, tipo de preguntas para pensar é aínda, no momento da revisión do código de alguén, quere dicir, non necesariamente ollar a través de todo o seu código, pero dicir, imos ollar a través das táboas de base de datos. O que está almacenando? E entón a dicir, ben, agarde un minuto, porque está a usar un número enteiro? E se temos 4 millóns e unha destas liñas? E este tipo de preguntas é unha oportunidade ao tipo de empurrar cara atrás e ter unha noción de onde se non está cómodo facendo Lo, ter alguén máis técnico esas preguntas, de se é ou non a persoa realmente sabe o seu material. E este é o tipo de cousas, tamén, que a xente en internet que son propio didatas, quizais aprender con menos frecuencia, porque non necesariamente se atopou con ela logo, porque pode obter a base de datos instalado e funcionando, pero a menos que xa leu -se en tutoriais ou ser contou sobre normalización de bases de datos e indexación e rendemento, estes son os tipos de cousas que van te machucar. E podería pensar, ou un mal enxeñeiro Pódese dicir, oh, así, nos mellores salarios para unha base de datos máis grande ou unha base de datos máis rapidamente ou só xogar cartos con iso, escala vertical, non é necesariamente así. Se vai em-- e pode ir despois os índices fact-- e engadir, e isto pode levar unhas horas para o base de datos para construír os novos datos estrutura que me referín anteriormente, aínda pode solucionar isto despois do feito, que este é onde comezar a distinguir bos deseñadores de bad os deseñadores, non só esteticamente, pero en termos de rendemento tamén. Algunha pregunta? Non? Así, para NoSQL, que era o outro tipo de base de datos a que aludi anteriormente, Non ten liñas e columnas. Pola contra, que tería algo que parece un pouco máis como este. Vou usar unha sintaxe común. claves ocorrer pode usar aquí bastante. Pode ter algo como o seu nome é David, pode ter pasado nome é Malan, citas, pode ter ID é-- Desculpe-me, whoops-- ID é 1, correo-e está malan@harvard.edu, e non vou molesta escribindo o resto, e logo algunhas outras cousas. Noutras palabras, esta é representación como texto que nós xeralmente chamamos un obxecto nun programa de ordenador. E un obxecto é xeralmente só unha colección de pares de valores clave. Entón, de novo, este tema recurrente. Vimos pares de valores clave HTML, vimos pares de chaves de valor agora no contexto das bases de datos, e vin un par de identificador-valor no contexto de, penso eu, unha linguaxe máis cedo hoxe. Segue a subir. E, de feito, iso é realmente os datos que se reduce a, datos e metadatos, ou valores e chaves, respectivamente. Así, un non-relacional base de datos, en base algo en obxectos, onde só se aglomeram todo xunto e poñelas na memoria, sería normalmente retratado como, ou pensado, como este. E eu vou deixar isto agora como un tipo de visión alternativa. E un non é necesariamente mellor que o outro. En realidade, moi en voga nos días de hoxe son sistemas de base de datos como MongoDB e Redis e algúns outras ferramentas, dispoñibles gratuitamente, pero eles están cada vez máis en voga. En parte porque ofrecen adicional presenta máis de estas formulacións tabulares, pero tamén porque son un pouco máis fácil de usar, porque non ten que pensar tan duro sobre unha morea desas decisións de deseño. Entón pros e contras. Entón entendo que hai opcións máis do que acabamos de pasar tempo con. Entón, imos facelo. Imos facer a transición algo volta agora a programación web, de xeito que nós tipo de concluír hoxe con algo Isto é un pouco hands-on, enche algunhas lagoas de onte. Deixe-me ir a este primeiro. Entón recordar que onte tivemos algúns HTML canónica páxinas que tiveron Inicialmente, só HTML, e logo secundariamente tivo CSS, follas de estilo en cascada. Esta é unha nova etiqueta que non fixo vexa onte ou habitan sobre, chamado tag script. Acontece que realmente pode incorporar un linguaxe chamada Javascript no seu web páxina e facer o seu web páxinas facer algo. Entón, o que quero dicir con isto? Ben, deixe-me ir adiante e só prestar este código para un momento. Eu estou indo a ir a Cloud9, non hai necesidade para ir alí vos aínda, e eu vou chamar este alert.HTML. Eu estou indo a pegar no meu arquivo aquí. E só para aclarar o que eu fixen, deixe -me ir a este enderezo e ir avisar, e ve o Ola Mundo. Pero este é o tipo de underwhelming. Quero facer algo un pouco diferente. Entón, eu vou realmente facelo. Eu estou indo a ir aquí e, e entre as miñas marcas de script, din alert ( 'Ola, mundo "); entón, observe é un pouco desleixado, pero eu teño HTML, no interior dos cales é un linguaxe chamada JavaScript, e iso é o que se chama chamada de función ou chamada de procedemento. Este é un verbo, literalmente, neste caso, e eu estou chamando funcionalidade código que outra persoa escribiu. Así que a función é un alerta, entón imos ir a esta páxina agora e prema recarga, e agora ver un pouco de interactividade. É unha especie de vella escola e feo. Este tipo de lembra-o da ventás emerxentes, quizais, do pasado pero fixo facer algo un pouco máis programática. Así, máis do que iso, imos facer algo máis interesante. Déixeme entrar aquí e se librar desa. E eu estou indo a ir adiante e crear unha forma como fixemos onte. De feito, xa sabe o que? Eu estou indo a ir google.html, que comezou onte, que parecía este, a través do cal temos demandado por gato Pero teña en conta que hai unha especie de erro na versión actual. Traballa para gatos, pero supoñamos que Non cooperar e eu escribir nada, e eu simplemente prema en enviar. Este tipo de comportamento estraño. levoume ao verdadeiro Google Non me deu unha mensaxe de erro. Gustaríame dicir ao usuario precisa dar un valor. Entón, como podemos facelo? Ben, deixe-me volver Cloud9 e deixe-me ir para arriba da miña páxina e engadir unha marca de script como este, onde Eu estou indo a escribir un código JavaScript. E eu vou facer o seguinte. Se (document.getelementByID-- e recordo que falamos sobre iso antes, esta función. A ID é que quero chegar? Eu quero ir q, e eu vou digamos equivale a nada, como isto-- en realidade, déixeme usar comiñas dobres só para consistency-- é igual a nada, logo alert ( "Por favor, escriba unha consulta") aquí. Entón, eu teño o que parece ser algo así como unha condición. Vimos esa idea xeral no risco. É como un deses puzzle pezas que mirou como este. E o que digo? Ben, aquí abaixo, repare en que eu son imos facer o seguinte. Vou dar esta forma campo non só un nome q, que é o que é pasado a Google, pero estou vai dar-lle un identificador local, tamén chamado Q. Pero eu podería chamar iso de calquera cousa que eu quero, eu só vou mantelo simple e tamén chamalo q, só para simplificar. E agora eu vou facer algo un pouco máis. Sobre os campos do formulario aquí, eu vou engadir o que se chama un manipulador de eventos. En presentar, quero chamar unha función chamada de validación. Isto aínda non existe, este palabra, ou iso validar verbo, porque o que eu vou facer -se aquí agora é engadir un código. Eu vou dicir a función de validación. Eu estou indo a recuar este e engadir outro chaveta aquí e outro aquí. Considero o que iso está facendo agora. Teño agora-- pensar niso como creei o meu propia peza do puzzle que non tiña anteriormente existen, e eu chamei este puzzle peza a peza de validación de puzzle. O seu obxectivo na vida é realizar as catro liñas de código no mesmo. se document.getElementById de xeito conceptualmente, que está indo a ir ao elemento, o elemento HTML cuxa única idea é só q, e, a continuación, aínda que a sintaxe parece un pouco raro, que a igualdade é igual significa só iguais. Entón isto significa que se o elemento co identificador único q cando obtido, non ten valor, el só é igual a entre comiñas, nada alí, entón o que quero facer? Quero berrar co usuario. E nós non imos gran detalle aquí. Vou voltar falso. Que é un erro. Senón, eu vou volver certo. Así, ou que funcionou ou non. Falso ou verdadeiro. E agora, se eu non cometer erros, déixeme gardar esta e recargue esta. E déixeme comprobar só o dobre Non, en realidade, facer posibles erros de dixitación, entón eu non me avergoñar. Imos ver se funciona. Entón agora eu vou escribir gatos. Aínda funciona, ou funciona media, polo menos. Agora déixeme cargalo, e agora imos me tente enviar sen escribir anything-- drogas, el rompe. Un intre. Déixeme abrir a consola, [Inaudível] rexistro, recargue a páxina. Déixeme probar outra vez. Oh, droga. Esquecín. Eu fixen un erro de dixitación. Lembro o que é. .value. Eu quería dicir o valor do elemento cuxo ID é q é igual a iso, entón berrar co usuario. Entón, agora déixeme préndoo respiración de novo. Alá imos. Alí imos nós. Por favor, escriba unha consulta. Polo tanto, non é me deixar pasar. I poden tipo de brincallón con iso, e no canto de verificación de ningún valor, Eu podo dicir algo así como: Chega de buscar gatos, e agora podemos só divertidamente deixar a procura do usuario para os cans se el ou ela quere, ou se eu entrar aquí e buscar gatos, agora eu non podo. Entón cal é o takeaway aquí? Entón, un, nós introducimos en noso mundo de HTML e CSS, función de programación. Podo realmente agora tomar decisións en código. Anteriormente, todo o que eu podía facer é marcar contido textual ou contido gráfico e dicirlle o que buscar como e onde amosar. Agora podo realmente pedir preguntas na páxina web e tomar decisións baseadas sobre el, e solicitar ao usuario se eu ter berrar con el ou ela. Entón, imos tentar algo no noso propio con este. Dalle, déixeme abrir o seguinte diapositiva aquí, e só salientar algo. Así como con CSS, podemos fatorar o noso código JavaScript nun ficheiro separado, podes facer o mesmo con JavaScript como con CSS. E usa o uso dunha fonte atributo da etiqueta script. Pero non imos complicar as cousas para o momento. Pola contra, se puidese ir non desta páxina, mas-- déixeme ir esta en torno a order-- ir, se puidese, esta páxina aquí. Este URL aquí. É en láminas de hoxe. Pode ter que recargar porque Eu engade un par de cousas. Pero vaia alí onde algúns puzzles esperan. E iso vai dar unha oportunidade, nun contexto un pouco máis divertido, a se involucrar con algún JavaScript. E cando chegar alí, Vou explicar o que espera. Obter verde. Establecer azul. Define verde, define vermello. Oops. Sentímolo. Esta é a medida da nosa documentación para este desafío. E iso vai funcionar do seguinte xeito. Entón, o que ten no presente A páxina é un monte de crebacabezas imaxe por un amigo na Universidade de Stanford. Entón, o que está a ver aquí é case tipo de un deses enigmas ollo máxico, pero se só ollar para el, nada vai pop en ti. Pola contra, algo está escondidas nesta imaxe. E está oculto do seguinte xeito. Imaxes, como vostede sabe, pode ser composta de tres cores. Algúns vermello, un pouco de azul, e un pouco de verde. E podemos facer toda a cores no arco da vella mesturando estes tres cores de algunha maneira. Polo tanto, este parece na maior parte verde e azul, pero como Nick di aquí, esta imaxe Enigma de ferro é un puzzle. Contén unha imaxe de algo famoso, con todo, a imaxe foi distorsionada. O obxecto famoso é nos valores de vermello. valores Con todo, o vermello foi dividido por 10. Así, son moi pequenas por un factor de 10. Polo tanto, noutras palabras, Nick tomou unha imaxe orixinal, e dessaturado todos do vermello a partir del, diminuíndo a cantidade de vermello pintura, se, nel. Os valores de azul e verde están só sen sentido, valores aleatorios, tamén coñecido como ruído deseñados para obscurecer a imaxe real. Entón, o que Nick fixo foi el atenuada ao vermello e, a continuación, el só xogou aleatorio cantidades de azul e verde na imaxe para tipo de escura o que é, en realidade, aínda está alí. Debe desfacer estas distorsións para revelar a imaxe. En primeiro lugar, establecer os valores azuis e verdes a cero para tiralos do camiño, e mirar para o resultado. logo multiplicar cada valor vermello por 10, escalando atrás ata aproximadamente o valor final. Que é o famoso obxecto? Entón, todo o que tes este rectángulo no seu navegador agora. E entender que hai algunha código de inicio, por así dicir. Este é o código JavaScript que Nick escribiu para ti. E teña en conta que non hai unha liña no medio que comeza cunha barra de ferramentas, que é o que é xeralmente chamado de un comentario. Significa que é unha frase para o programador que non ten ningún significado funcional. É só unha suxestión visual para o ser humano. Así, pode ir adiante e eliminar só esta liña, e ser super coidado de non eliminar ou cambiar calquera outra cousa. E deixe-me leva-lo a través o que este código fai e eu vou deixar lo a vostede para descubrir a imaxe secreta. Esta primeira liña aquí que eu acabo resaltado dálle o seguinte. Do lado da man esquerda, ten o que se chama unha variable que Nick ten arbitrariamente, pero razoablemente chamado im para a imaxe. No lado dereito de que a igualdade de sinal, está dicindo me dar un novo Cita, pecha comiñas "imaxe simple". Imaxe simple, neste contexto é o que se chama unha clase, así, é como unha especie de class-- tecnicamente un prototype-- pero realmente, iso está me dando un novo obxecto, os contidos dos cales son o arquivo, ferro-puzzle.png. Noutras palabras, Nick creou esa noción dunha imaxe simple para que poidamos, por pedagóxica propósitos, xogar coa imaxe e cambiar o seu vermello, valores verde e azul. E como imos facelo? Esta sintaxe algo enigmática aquí é como o bloque de repetición que algúns de vostedes viu en perigo anteriormente hoxe, onde podes repetir 10 veces. Neste caso, Nick non codificado un número como 10. Ao contrario, está dicindo, arrincar unha variable chamada x 0, comprobar se x é menor que o ancho da imaxe. E para ser máis adecuada, é a imaxe variable, punto significa ir a dentro del e obter a súa largura, e logo paréntese aberto, pechado paren é só unha forma de un programador de dicir isto é unha función. Este é un procedemento. Esta é a característica alguén escribiu. Usalo e darme de volta unha resposta. E, a continuación, x ++ é un xeito elegante de dicindo, despois de ter feito isto xa, incrementar x por 1. Noutras palabras, esta é a forma de un programador de inducir un loop que é indo para repetir todas as columnas nunha imaxe. Unha imaxe é só unha reixa de puntos, liñas e columnas de puntos. Esta é unha forma de iteración sobre todas as columnas. E no interior, Mentres tanto, estamos interactuar sobre as alturas, aquí e aquí e aquí. Polo tanto, esta é só unha forma de Traipsing, case como unha máquina de escribir vella escola, só para pasar por riba da imaxe enteira de forma iterativa. Aínda que non é ben completo claro, pode levar na fe, polo momento, que estas tres liñas de código son xuntos vai permitir que a mirada de forma iterativa en cada pixel, cada punto na imaxe. ¿Que é un pixel? Ben, para ser claro, se miramos no orixinal e aumentar o zoom, se realmente poñer os seus ollos a pantalla do ordenador, que é só unha morea de puntos, varios mil puntos embalados xuntos alí. E entón o que está a piques de facer? Cada un destes puntos, unha definición final, é o resultado do que adoita chamado RGB, vermello, verde, azul, que unha vez máis, poden ser combinados para darlle calquera número de cores. En realidade, se se lembra de moitos, moitos anos, pantallas de proxección como estas cousas adoitaba ter nin unha lente, pero tres. Un deles cuspiu luz vermella, un dos Los cuspir luz verde, un deles cuspir luz azul. E se está nunha escola media como eu era, onde nunca foron aliñado correctamente, era sempre ver películas de historia que foron lixeiramente distorsionada, porque as tres cores non eran combinando adecuadamente. Pero parece que cada un dos estes valores de vermello, verde e azul, pode ter un número que lles están asociados. Por exemplo, 0 para o vermello significa que non hai vermello, 0 para o verde significa que non hai verde, e 0 para azul significa que non azul. Entón, se non ten ningún vermello, non verde, e ningún azul, a cor que ten? Audiencia: [inaudível] DAVID Malan: Vostede faría espero que si, é branco. Desafortunadamente, este operates-- pena? Audiencia: [inaudível] DAVID Malan: Entón o que realmente ten negro, neste caso. Entón se ten ningún destes cores conectado, ten branco. Con todo, se ten, digamos que un monte deles, como unha morea de vermello, 255 do mesmo, unha morea de verde, e unha morea de azul, que é negro. Entón, eses son os dous extremos. Entón, por esa lóxica, se eu teño unha morea de vermello e ningún verde e non azul, que cor é esa? Audiencia: [inaudível] DAVID Malan: Certo, obviamente. E, a continuación, ningún vermello, moi verde, non azul, e, a continuación, se have-- ben, imos rematar que, só porque, pero iso, por suposto, agora, é azul. E agora pode combinar estas cores. Agora, como un aparte, se algún de vós ten Xa fixo algún proxecto real web, pode realmente vexa símbolos como este. FFF-- e, en realidade, é probablemente nin iso. É FFFFFF. Alguén xa viu F de e E do e A through-- de xeito que parece, falamos onte sobre decimal, e hoxe, unha especie de preto decimal. Hoxe falamos binario. Acontece que, hexadecimal é moi sistema de base común para usar en computación. Binario é dous, decimal é 10, hexadecimal é 16. E verifícase se, como facer contar en hexadecimal? Cero, un, dous, tres, catro, cinco, seis, sete, oito, nove, o que usa despois das nove? Cal é o próximo número? Xa utilizado cero. Necesito 16 destes. Cero, un, dous, tres, catro, cinco, seis, sete, oito, nove, precisas algunha convención arbitraria. E o que a humanidade decidiu tempo atrás, que despois das nove vén letra A e B e logo, logo C. Así, o forma que contar en hexadecimal é cero, un, dous, tres, catro, cinco, seis, sete, oito, nove, A, B, C, D, E, F, e que vai contar lo todo o camiño, ao parecer, a 15. Así cero a 15 é igual a cero a través F. Agora, por que é importante? Ben, cando ten dous f, é así que expresar 255. Entón, longa historia curta, en o mundo do Photoshop, que o software de deseño gráfico, no mundo do desenvolvemento web, onde ten moitas cores, por suposto, para xogar, moitas veces os desenvolvedores expresar os en hexadecimal, só porque tende para ser un pouco máis simple. Aínda que a primeira vista é moito máis complexa. Así, en calquera caso, esta é importante porque Nick at Stanford deunos seis anacos de funcionalidade que, os programadores novatos, agora terá a capacidade de usar. Incorporadas a este web A páxina é de seis funcións, seis procedementos que Nick escribiu. Tres deles vai che dar un número, un vermello, verde, ou un valor de azul. Tres deles pode definir ese valor. E estes subliñados son só espazos reservados, de xeito que ten que saber cales son elas. Así, con estas tres funcións, A primeira destas cousas será unha coordenada x, ea segunda destas cousas será unha coordenada y. Noutras palabras, o que destacou, que píxeles que quere obter o verde do, obter o azul, obter o vermello do. E entón aquí, este será x, este será un valor y, e iso vai ser un número. Entón imos facer o primeiro liña deste conxunto e entón eu vou deixar vostede para tratar de deducir o resto. Así, de acordo coas instrucións Nesta páxina, cómpre para aumentar a vermello por un factor de 10, e necesitamos eliminar o verde e retire o azul. Imos comezar cos últimos escenarios. Entón, se eu queira, e eu vou para recuar usando algúns espazos, se eu queira configurar o vermello, o verde, ou o valor de azul, Vou facer o seguinte. Imaxe, im.setBlue, e logo en base a miñas instrucións aquí, Cales son as tres cousas que eu debería tipo dentro parénteses agora? Necesito o valor x, o valor y, e que número debo poñer aquí se eu queira desfacerse do azul, con base nesa historia aquí? Só cero. Se eu non quero azul, eu son só indo para cambia-lo para cero. Agora imos recapitular o que iso está facendo. Teño aquí sobre estes arriba segunda e terceira liñas, I alegou dous loops, loops aniñados, se Vai, que vai ter o efecto de progresar a partir de esquerda a dereita, arriba abaixo sobre toda a X os valores e todos os valores de y. Porque unha vez máis, unha imaxe só unha reixa de liñas e columnas. Polo tanto, esta se ve librar de todo o azul. Permita-me deixar na seguinte liña para ti. ¿Como me librar de todo o verde? Audiencia: [inaudível] DAVID Malan: Nice. Audiencia: [inaudível] DAVID Malan: Nice. E eu vou reducir, e só tomar coidado de que non teña feito os erros de dixitación. E se está cómodo co que fixo, dalle prema o botón Executar / Gardar e ver o que recibe. E unha vez máis, fixemos tres cambios. Nós excluído que o primeiro comentar e substituíu o con estas dúas liñas de código. E todo ben se precisa acertar botón run / Save algunhas veces para corrixir algo. E déixeme tamén facer zoom na miña código para que poida transcribir. Bo. Entón eu vexo Andrew ten o que parece ser un erro. El só ten un gran negro rectángulo na súa pantalla. alguén ten un rectángulo negro grande? Audiencia: Si. DAVID Malan: rectángulo negro grande? OK, entón imos pensar sobre o que iso significa. Dixemos que cero, cero, cero, para que o verde, non vermello, non azul, vai darlle negro. E verifícase que a maioría dos nosos portátiles simplemente non teñen fidelidade suficiente. Non pode dicir non é realmente algo alí. E se tipo de posible inclinarse pantalla para adiante e cara atrás, quizais ve un peixe alí? Quizais, tipo, especie de? Non é perfectamente negro. Audiencia: [inaudível] DAVID Malan: Spoiler! Hai algún vermello alí, pero Lembre-se a partir das especificacións do problema, Nick debilitada abaixo. El desaturated-lo un pouco, pero non todo o camiño a cero. Polo tanto, se queremos ampliar a cantidade de vermello, déixeme propoñer este truco. Deixe-me facer zoom na pantalla. E deixe-me ir adiante e dicir cantidade igual im.getRed (x, y). Esta liña de código está me dando algo chamado unha variable. Teño arbitrariamente, pero, sen dúbida, razoablemente chamou a miña variable que, aparentemente? Importe. cantidade xusta. Podería chamar el calquera cousa que quero, pero eu son utilizando esta outra función que eu describe anteriormente para obter a cantidade de vermello en x comas y. Por que eu faría iso? O que quere facer aquí? Debe add-- Audiencia: [inaudível] DAVID Malan: Si, quizais multiplicalo por 10. E se non sabe iso, eu son indo a ir adiante e facelo. Eu estou indo a ir adiante e por exemplo, quero a cantidade de vermello Eu quero ser o que quere está en vermello, veces 10, ea estrela, o asterisco no teclado as-- non usan x. Use a estrela. É así que se multiplican as cousas na maioría das linguaxes de programación. Así, segundo a intuición de Kareem, almacenado nesta variable chamada importe, é como vermella Quero a xy localización. Como agora, fago o que Pixel ter ese número? Xa fixo iso antes. Define o verde eo azul para ningún valor, a cero. Audiencia: [inaudível] DAVID Malan: Si, ben non quere que a 10. Xa fixo as contas aquí. Entón, estamos a recibir o valor de vermello, que é un número baixo, presuntamente. Estamos multiplicándose por 10. O que quere facer o importe variable agora? Audiencia: [inaudível] DAVID Malan: Nice. Entón im.set-- que? Audiencia: setRed. DAVID Malan: setRed, a localización XY. Si. E só cantidade. Noutras palabras, unha variable é un espazo reservado temporal que pode pór o que quere na. Nós ocorrer a estar poñendo un número que, no momento. Temos multiplicado por 10 para facelo máis grande. E agora estou substituíndo esta variable como o terceiro argumento, ou entrada para definir vermello. E así que, despois de rematar isto, e tomar nota dos puntos e comas e os parénteses. Dalle clic executar / gardar de novo, e que ver, Magic, o que era, en realidade, alí. [? Arwa ,?] Que é? A torre Eiffel en pleno dereito vermello, non moi escuro. debe ser máis evidente agora, si? OK. E Andrew, o cadro non máis negro? Audiencia: [inaudível] DAVID Malan: Todo ben. Entón, eu vou manter isto en pantalla. Se quere xogar con este máis tarde, eu vou volver a crear este para ti. Pero este código aquí fixo exactamente iso. Por que non facemos outra. Déixeme rolar para abaixo un pouco. Polo tanto, neste caso, o proxector non realmente facer xustiza. Pero nas súas pantallas, probablemente ten unha caixa moi vermello e moi negro. Isto, ademais, é un puzzle que mostra algo famoso. Con todo, a imaxe foi distorsionada. A imaxe verdadeira, esta vez, é os valores en azul e verde. Con todo, todos eles foron divididos o 20 de xeito que os valores son moi pequenas. Os valores de vermello son só números aleatorios, o ruído. Desfacer esas distorsións para revelar a verdadeira imaxe. Entón Nick dille entón o que facer. Define os valores de vermello a cero, e non romper o que é. Logo multiplicar o azul e os valores verdes por 20. Entón, é case o mesmo programa como antes, pero está invertendo o proceso. E porei o meu código de antes na pantalla no caso quere referir a el ou xogar máis con iso. Deixe-me facer zoom sobre iso. Pero a imaxe cobre resolver puzzle, o número dous. Audiencia: [inaudível] DAVID Malan: OK, entón iso que eu son Non vai dar como moitas suxestións. Entón eu would-- oh, imos ver, ten un erro de dixitación aquí. Entón lembre, este aquí realmente precisa ir alí. Entón, o que me gustaría propoñer, se quere concentrarse en un regalo, non é a resposta. Se quere transcribir tanto, que debe obter o primeiro traballo. E entón pode usar isto como inspiración para a segunda. Niza. Bo. E para os curiosos, este é un exemplo simple dunha ciencia ou unha arte chamada esteganografia, a arte de ocultar información en imaxes. Normalmente, as imaxes poden ser marca de auga moi descaradamente cun logotipo no fondo canto, pero claramente, pode ser moito máis sofisticado sobre iso e, de feito, ocultar outras imaxes nas imaxes dalgún xeito con esta técnica. Tome máis 30 segundos, e despois imos polo menos, anunciar o que ten que ver. E eu vou deixar o terceiro un como un exercicio na casa, Se desexa máis dun desafiar este fin de semana. E eu creo que Andrew pode chegar primeiro. Que é a segunda imaxe, Andrew? Audiencia: Estatua da Liberdade. DAVID Malan: Estatua de liberdade será a resposta desta vez. Entón, de novo, só algunhas simple exemplos, cuxo obxectivo é darlle un sentido de como temos traducido cero pictórica bloques para máis irritante e moito máis código complicado, pero todo ideas aínda son exactamente os mesmos, aínda coa introdución agora da noción dunha variable, sendo capaz de almacenar temporalmente algo. Imos facer un hands-on, só para agora conectar os puntos para que un simple do mundo real. Cando estea listo, se puidese vaia a este URL en pantalla. Isto tamén é na súa copia do diapositivas, developers.google.com/maps~~V. Imos realmente facer algo certo, por así dicir, na web usando a API de Google Maps, ou interface de programación de aplicación, do seguinte xeito. Google, como moitas empresas, ofrece unha serie de características libre que pode usar para construír o seu propias aplicacións interesantes. En realidade, se xa usou Über para incorporarse un taxi ou un coche, probablemente sabe que ten Über Nun mapa e mostra coches nel. Isto é, o mellor que eu poida dicir, o Google Maps API. Están realmente usar mapas de Google, pero Über non é unha empresa de cartografía, nin tería que ser unha problema particularmente interesante para resolver na parte superior do seu problema servizo de coche. E así están de pé, de novo, sobre os ombreiros dos outros, Google neste caso. Entón eles usan mapas de Google, pero a súa propia servizos de vehículos e outros tales características. Entón, nós estamos indo a aproveitar deste para facer o seguinte. E se eu teño ido moi rápido, só chamar-me máis nun momento. Feliz para recapitular algunhas das cousas de imaxe. Ten que ver a si mesmo nunha páxina como esta. Tan bo, de Google, e están entre os mellores de proporcionar non só APIs, pero APIs gratuítos que pode xogar con ou utilizar comercialmente. Eles comezar a cobrar-lle o seu uso é alto, pero fun fronte con antelación e asinado connosco para unha conta gratuíta que, esperamos, 10 ordenadores non descualificar connosco para de súpeto. Polo tanto, esperamos que este demostración funcionará. E conta que eles teñen APIs para Android, IOS, servizos web e web, Sexa o que sexa. Imos concentrar en web. Prema na caixa-de-rosa, web, e que vai levar vostede, espero, a unha páxina aquí. E eles teñen unha morea de APIs. E pode ser un pouco esmagadora en primeiro lugar, pero eu vou dirixir-nos a través do que queremos. Na esquina superior esquerda é Google Maps JavaScript API, API JavaScript. Entón vai adiante e faga clic aquel. E que leva-lo agora para a páxina seguinte, demos e código de exemplo. Déixeme zoom out aquí. E déixeme levarnos a-- rolar para abaixo onde di pasos de configuración rápida. A súa pantalla debe ser semellante a miña. E hai dúas etapas, obter unha chave e comezar a desenvolver. Eu xa fixen o primeiro paso para nós, recibindo unha chave chamada. E esta é unha idea común. Unha chave de API é xeralmente só un número aleatorio grande ou cadea que se quere para pegar no seu código, para que Google sabe quen é vostede cando está a usar o seu servizo, a súa API. O que non quere dicir que somos sendo cobra nada. E agora, prema, en vez de un, prema comezar a desenvolver. Se podería só acenar-me sobre se non está certo de onde estamos. Entón imos rabuñar a superficie, aquí, pero o que Eu penso que sería convincente é realmente ter todos, usando Cloud9 nunha fiestra e Neste tutorial noutra fiestra, imos realmente comezar a nosa propia aplicación instalado e funcionando que incorpora un Google Custom Guión da nosa propia páxina web, e logo engade unha ou dúas características. Pero imos só rabuñar a superficie do que podemos facer. Polo tanto, só unha comprobación de sanidade rápida. Están todos a ver esta páxina, Google Maps JavaScript API? Debe dicir comezando. Non estamos indo a percorrer a cousa toda por calquera medio. OK, noutra pestana, se non o fai telo aberto, non entran en Cloud9 e obter-se só unha nova guía, en última instancia. Entón, de novo, c9.io de onte, c9.io, e só crear un novo ficheiro. E dalle chamada quere que desexa. Eu chamei o meu map.html. Chamalo algo que termina .html. E ten que ser máis ou menos onde estou neste proceso con só un prompt chiscando nun baleiro pestana chamada algo map.html. Ou arquivo, novo ficheiro neste momento. E agora, co paso do Google Maps JavaScript API, imos saltar lectura por todo iso texto. Pero teña en conta que Ola mundo é en realidade, en todas partes, ve-lo agora. Ola, mundo ten esa gran colorido exemplo dun grupo enteiro de HTML. Dalle copiar e pegar só iso HTML, de xeito que a partir do tipo doc superior todo o camiño para a etiqueta HTML fin, ir adiante e copiar todos isso-- de novo, que está baixo o mundo da Ola example-- e pegar que no seu guía Cloud9, de xeito que agora a súa pantalla debe ollar máis ou menos como a miña. E pode garda-lo, pero non cargalo aínda. Imos primeiro ollar o código e ver se nós non se pode inferir ou aprender do que é Google tivo connosco cegamente copiar e pegar. Eles só queren axudar, literalmente, un bo comezo, pero non hai que moi complexidade realmente alí. Todas as preguntas só aínda? Estamos seguros para seguir adiante? OK. Entón, rapidamente, imos facer algunhas rápidas checagens. Unha liña que eu ver, e espero que, Mira, o que iso significa, DOCTYPE HTML? Kareem, lembra? Audiencia: [inaudível] DAVID Malan: Si. Aí vén HTML 5. Mentres tanto, a liña dous no pantalla aquí significa navegador hey, aquí vén o HTML real. Liña tres é hey navegador, aquí vén a cabeza. Liña catro é, por suposto, ei navegador, aquí vén o título. O que fai liña de cinco facer? En realidade, iso non fai realmente facer algo para nós. Neste caso, el só redimensiona a páxina a un estándar. Liña seis, Non falamos, pero especifica a codificación de caracteres. Hai diferentes formas de codificar ficheiros, especialmente para linguas estranxeiras. UTF-8 só tende a ser o estándar. Entón agora imos ver na liña de sete a 16, algúns CSS. E aínda que non teña visto todas estas cousas antes, podemos tipo de inferir. Entón aliñar oito medios, hey navegador, aplique todos os seguintes elementos ós que dúas marcas, aparentemente? O texto HTML e corpo. Así, a coma é o novo alí. E iso é só unha forma de especificando varias marcas á vez. Entón temos as claves. Entón, ao parecer, este ó navegador, facer a altura da páxina 100%. Así, mesmo se hai moi pouco contido, facer a páxina enteira, facer a cousa encher a páxina. Fai o mapa en definitiva, cubrir a páxina. Marxe, o que significa isto? Isto é xeralmente como arbitraria espazo en branco ao redor das beiras que algúns deseño de navegador só decidiu debería estar alí, porque tipo de fai as cousas parecen máis limpo. Pero nós non queremos iso. Queremos que o mapa se todo o camiño para os bordos. Recheo, similares ao espírito da beira. Marxes significa fóra, medios de recheo dentro, pero é o mesmo tipo de empresa. É un pouco de un buffer entre vostede e os bordos. E, a continuación, liña 13 é un bo oportunidade para unha revisión rápida. O que fai sinal do mapa afiada É dicir, é un mapa hashtag significa? O que isto referirse, en principio? Audiencia: [inaudível] DAVID Malan: Exactamente. Esta propiedade, esta propiedade CSS aplícase a unha cousa, a etiqueta HTML que ten un ID de cita, pecha comiñas "mapa". E agora imos avanzar rapidamente, desprácese a parte inferior do arquivo, que non é moi lonxe, e previo en liña 19, se pegalo exactamente como eu fixen, A liña 19 ten só un div, que é un división da páxina, que onte chamado dunha rexión rectangular. Non ten nada nel ten. É unha etiqueta aberta, etiqueta preto. Pero ten unha identificación única. Entón, o que parece ser pasando aquí é Google está a preparar a nosa páxina web para ten unha altura total de 100%, e ningún recheo, sen marxes, porque o que imos a poñer dentro desta div, cuxa identificación única é mapa, é un mapa real incorporado. E queremos que enche a páxina e non só haber algún pequeno rectángulo no medio. Así, a liña 14 do mesmo xeito subliña, o mapear en si debe ter unha altura de 100%. Entón agora conta entre as liñas 20 e 28, que é o código JavaScript. E isto é, aínda que sexa sintaticamente un pouco raro, Non hai todo o que moita cousa a ocorrer aquí. Na liña 21, este está declarando algo chamado unha variable. No canto de chamalo ascende, como fixemos antes, estamos dicindo máis precisamente var, que significa variable. Poderiamos usar que, en código de Nick, pero non o fixo, entón eu non se incomodou en facelo tamén. É unha variable chamada Guión, e entón hai unha función que é aparentemente chamado initMap. Polo tanto, este é como o noso propio costume parte do enigma en perigo. Creamos unha peza de funcionalidade chamada initMap, e pode tipo de inferir o que está pasando aquí. Do lado da man esquerda, temos unha variable, así que nós estamos indo a poñer o seguinte cousa dentro desa variable, da dereita á esquerda. O lado dereito di, hey navegador, dáme un novo mapa de Google. E google.maps.Map é só un xeito funky especificar que esta función pertence a Google Maps. Tras os parénteses, vimos iso antes, hey navegador, obter me os elementos da páxina, o tag na páxina cuxa identificación única é-- Audiencia: [inaudível] DAVID Malan: --map. E o que está a suceder, así, xuntos por esa liña, liña 23, é, esencialmente, dicindo: hey navegador, vai buscar-me que div baleira na páxina cuxa identificación única é o mapa, porque quero inserir en ele-- inxectar nel, se will-- unha morea de contido que pasa a ser procedente web, subsecuentemente. E Google está facendo todo isto para nós. Entón, de novo, ao final do día, temos este exemplo de abstracción. Non teño a menor idea do que un mapa é ou como aplicar un mapa API. Non precisa. Nós só precisa dicir o mapa onde poñer-se, e deixar aqueles implantación subxacente detalles para Google. Agora non hai aparentemente dúas pezas de datos que neste exemplo é dando a API de Google. Ao parecer, o centro do mapa, eo nivel de zoom, por así dicir. E alguén recoñece-los coordenadas, latitude e lonxitude? Probablemente non, pero podemos volver ao tutorial, vexa literalmente. Pero imos velo en só un momento. nivel de zoom é un valor entre, eu non sei sabe, un de cada 13 ou algo así. El só ten que ver co quão lonxe está ampliado ou reducido, e é iso. E agora a finais de a páxina, liña de aviso 29-- é un pouco feo, porque Lo wraps-- esta liña de código é o que fai a descarga para o navegador API real de Google. Todo o código que o de Google enxeñeiros teñen escrito que aplicar Toda esta función de mapas incorporáveis. Agora non imos cambiar nada. Se está acompañando, vai adiante e basta gardar o ficheiro, se realmente ten o que eu teño. Ir a URL. Pode facer clic no botón Run enriba e que vai dicir -lle o URL do servidor web de novo. E iso vai levar vostede para unha nova guía. Se preme en Abrir para map.html, e as probabilidades son que está indo para obter unha alerta, unha mensaxe de erro, non é? Mensaxe de erro, mensaxe de erro? Así, por desgraza, o erro mensaxe non é que esclarecedora a menos que realmente abrir o consola, que guía especial que abría onte e un pouco máis cedo hoxe. Pero eu tropeçar iso antes, entón eu xa descubrín cal é a solución. En láminas de hoxe, ou en vez diso, en Cloud9, aviso que non facer algo deliberadamente. Teña en conta que esta etiqueta script liña 29, se ler, é como maps.googleapis.com/ algo, algo, algo, logo entender que alguén, un dos desenvolvedores, escribiu en todas as capitais letras, a súa chave de API. Necesitamos pegar algo alí dentro. E este foi o paso Eu fixen a nós antes, e de novo poden lista negra -Nos se, de súpeto, 12 ou máis de nós comezar a usar a mesma clave, pero imos ver o que acontece. Entón, se ir hoxe diapositivas, unha foto despois, hai esta cadea moi badalado aparencia do texto. Dalle só copiar e pegalo onde di que a súa chave de API. Iso é o que eu inscribiu. E, en definitiva, non tente escribindo-lo manualmente, porque se sente cheo con erros de dixitación, potencialmente. Entón, só tes que copiar e pegar isto. E que vai facer a liña máis tempo, pero agora, só para quedar claro, debe ollar un pouco máis como este, onde chave non é igual capitalizar berrando contigo. Salva a súa páxina, volver a outro guía, actualizar, e esperamos ver un mapa de onde? Audiencia: Australia. DAVID Malan: Australia. Así, ao parecer, son os do Coordenadas GPS de Australia. E déixeme andar por aí por un momento e axudar a alguén que non está moi alá, pero déixeme propoñer, a través de Google, atopar as coordenadas GPS da súa propia cidade natal ou o seu propio país de orixe. E, probabelmente, Google pode transformar este -Se, ou Wikipedia podo dicir. Pero escoller dous valores distintos de lonxitude e latitude, volver e cola-los, e logo volver cargar a páxina despois de gardar e vexa se pode ter un Guión para a súa propia cidade natal. E cando se fai con que, o seguimento challenge-- e eu vou dar un pouco menos sentido, deliberadamente, de xeito que deliberadamente ten que loitar por un par minutos coa documentación, cambiar o mapa para non ser esta cartoonish estándar, pero un mapa de satélite. Entón, o que realmente ve por satélite imaxes en vez das cores bonitas. E a información que vou darlle é cambiar o tipo de mapa. Voltar para que a obtención comezou a páxina en busca de inspiración. Como pode recoller, se está a buscar, hai tantos máis cousas que podes facer. Algúns de vós xa teñen cambiou o tipo de mapa. Pero pode fazer-- por exemplo, déixeme ir a algo que fixemos para o curso I teach-- maps.cs50.net. Un dos nosos graduandos fixo. Centramos a nosa mapa sobre Harvard Yard e sobrepasar todos estes nomes de construción, e tivemos que engadir. Entón, se eu queira buscar, por exemplo, Matthews Hall, temos un pequeno menú desplegable. E eu creo que está a usar Bootstrap, o biblioteca discutir anteriormente para iso. E se fai clic en Matthews Hall, Lo inmediatamente salta o mapa para unha determinada localización, e mostra -lle unha imaxe neste pequeno emerxente. Pero aínda esta pequena emerxentes, non aplicar. Se eu rolar para abaixo na nosa quedando comezou a páxina e procure fiestras de información, verás que algúns dos funcionalidade vostede mesmo pode engadir, aínda que con algo máis complexidade, é algo chamado un diálogo de información. E se eu facer clic nun exemplo aquí, e iso é o que é divertido, podes facer cousas como esta, facer clic nun marcador e, a continuación, voila, información aparece. Non temos moito introducido recursos suficientes JavaScript para pintar un retrato de como exactamente podería chamar todas esas cousas xuntas, pero medio que rabuñou a superficie. En realidade, o que eu fixen cando Prema no que marcador, foi desencadear un evento, unha chamada no evento de prema. E que se viu un evento hoxe cedo, o chamado caso presentar, cando estabamos impedindo o usuario de buscar gatos. Entón nós medio que escolleu e escolleu Entre todas estas varias características, para darlle un sentido, espera-se, do que pode, en realidade, facer un pouco máis confort en programación, e recursos totalmente gratuíto. Algunha pregunta? Non? Esta é a súa última oportunidade, polo menos hoxe, nunha venres para conseguir algo fóra do seu peito de xeito que saír de aquí Sentindo-se confia e cómodo. Si. Audiencia: Por que non facer engadir unha cousa? DAVID Malan: Oh meu Deus. Necesito descansar este fin de semana, eu creo. Outras preguntas? Audiencia: [inaudível] DAVID Malan: Vostede can-- en Internet Explorer, descanse en paz, adoitaba ser capaz de poñer VB guión, guión básico virtual, pero que en realidade nunca colleu. Polo tanto, a resposta curta é só JavaScript. Outras preguntas? Todo ben, ben, deixe-me facelo. Déixeme coller nosos compañeiros fóra. Teñen algún tipo de avaliación formas que queren todo gastar uns minutos enche. Queren cobrar a forma e calquera renuncias que pode ter fóra. Eles tamén teñen certificados. Estou supoñendo que hai aínda algúns lanches fóra. Déixame pasar estes para fóra, e se ten dúbidas, non obstante, Vou andar por aí máis individualmente e podemos axudar a comezar. Si, por suposto. Audiencia: [inaudível] DAVID Malan: Isto é normalmente feito nos días de hoxe. Certamente con web software, está inclinando sobre os outros ou está esteticamente usando cousas como Bootstrap, para que non Ten que aplicar o nivel baixo detalles de menús e botóns e todo máis. Está inclinando-se a alguén como Google para que Non ten que construír un Über empresas e unha empresa de cartografía, e calquera número de semellante aplicacións. De feito, logins son populares tamén. Se xa usou Spotify ou calquera número de sitios, vai facer login para algúns sitios usando Facebook. Entón, o que é bo, non son APIs para logins hoxe en día, de xeito que non ten para ter a súa propia táboa de usuarios e todo o seu propio banco de datos necesariamente no mesmo grao. Pode deixar Facebook facer todo de que a complexidade para ti. Entón é un momento emocionante, Honesta, na programación, porque hai tantos terceiros servizos que pode construír enriba. E, de novo, o prezo que paga é sexa financeira ou de tempo de inactividade. Se o Google vai para abaixo, o mesmo ocorre co Über, sen dúbida, pero quizais iso é unha razoable trade-off. E, de novo, que foi un dos temas, esperanza, para o último par de días, Son estes trade-offs. E de cando en cando hai indo ser unha resposta correcta. É realmente o mellor de dúas ou máis respostas. Pase estes arredor. E esas contas Cloud9 continuará para traballar en teoría, en perpetuidade. Que se pode atopar se esperar algúns días ou unha semana ou máis para volver entrar deles, isto pode levar como un ou cinco minutos para abrir back-up, pero iso é só porque eles puxeron Lo para durmir para aforrar recursos.