1 00:00:00,000 --> 00:00:00,500 2 00:00:00,500 --> 00:00:10,960 [Música tocando] 3 00:00:10,960 --> 00:00:12,960 ROGER ZURAWICKI: Ola, meu nome é Roger Zurawicki, 4 00:00:12,960 --> 00:00:16,410 e eu estarei cubrindo o seminario CS50 Meteor. 5 00:00:16,410 --> 00:00:21,520 Meteor é un novo marco dedicado ao novo tipo de tea, 6 00:00:21,520 --> 00:00:25,220 non PHP facer pedidos e cara atrás tipo 7 00:00:25,220 --> 00:00:29,070 de web vimos no set PHPP, pero o JavaScript máis dinámico 8 00:00:29,070 --> 00:00:31,370 partes da trama. 9 00:00:31,370 --> 00:00:36,260 Cousas Meteor pode facer inclúe actualización en tempo real 10 00:00:36,260 --> 00:00:42,380 e comunicar inmediatamente entre usuarios do mesmo sitio web. 11 00:00:42,380 --> 00:00:46,420 >> Para este seminario, temos código aloxado no meu GitHub. 12 00:00:46,420 --> 00:00:49,690 Pode ir a este URL e baixalo. 13 00:00:49,690 --> 00:00:53,085 Se sabe como usar Git, pode clonar o repositorio. 14 00:00:53,085 --> 00:00:55,460 Se non sabe como usar Git ou non usei GitHub, 15 00:00:55,460 --> 00:00:57,030 que é totalmente ben. 16 00:00:57,030 --> 00:01:00,480 Eu vou te amosar moi rapidamente como podemos ir GitHub, 17 00:01:00,480 --> 00:01:03,604 e hai unha opción para descargar un zip alí mesmo. 18 00:01:03,604 --> 00:01:06,770 Despois de baixar este directorio, vostede Pode comezar a xogar co noso código. 19 00:01:06,770 --> 00:01:10,200 20 00:01:10,200 --> 00:01:13,190 >> Máis sobre Meteor se pode atopar en meteor.com. 21 00:01:13,190 --> 00:01:16,580 No cartafol Seminario, realmente ten algúns proxectos de meteoros que podemos utilizar. 22 00:01:16,580 --> 00:01:20,380 23 00:01:20,380 --> 00:01:26,400 Unha das carpetas que temos na nosa proxecto seminario é o app Todos. 24 00:01:26,400 --> 00:01:28,780 Entón, se eu entrar nel I, Meteor ten instalado. 25 00:01:28,780 --> 00:01:35,690 Entón, para executa-lo, eu só precisa escribir Meteor, e Meteor instalará. 26 00:01:35,690 --> 00:01:38,310 Como verás, hai que asegurarse de que instalou Meteor. 27 00:01:38,310 --> 00:01:40,562 Entón, eu estou indo só para executa-lo unha vez 28 00:01:40,562 --> 00:01:42,520 estar seguro de que Meteor está instalado correctamente. 29 00:01:42,520 --> 00:01:46,370 30 00:01:46,370 --> 00:01:48,450 >> Aínda que eu teña Meteor instalación, podo amosar-lle 31 00:01:48,450 --> 00:01:53,760 algunhas demostracións en vivo de sitios de meteoros indo ao vivo agora en internet. 32 00:01:53,760 --> 00:01:57,990 Eu teño unha demostración do noso programa. 33 00:01:57,990 --> 00:02:00,740 Pode acceder a ela no seguinte URL. 34 00:02:00,740 --> 00:02:06,350 Este é o programa de facelo nós temos no noso directorio seminario. 35 00:02:06,350 --> 00:02:09,940 A URL para iso é rozu-rabbit.meteor.com. 36 00:02:09,940 --> 00:02:14,782 Verá que vai realmente Meteor hospedar os seus proxectos Meteor balde. 37 00:02:14,782 --> 00:02:17,490 E ao final do seminario, vai ser capaz de facer iso tamén. 38 00:02:17,490 --> 00:02:20,550 39 00:02:20,550 --> 00:02:22,160 >> Este é unha aplicación para facer a lista. 40 00:02:22,160 --> 00:02:27,740 E pode entrar, crear contas, e engadir tarefas. 41 00:02:27,740 --> 00:02:30,020 Pode crear unha conta como tal. 42 00:02:30,020 --> 00:02:33,050 43 00:02:33,050 --> 00:02:35,850 E agora, xa que ten un conta, pode engadir tarefas. 44 00:02:35,850 --> 00:02:42,780 Por exemplo, unha das tarefas I pode ter que ir buscar a miña roupa. 45 00:02:42,780 --> 00:02:45,160 E se está neste sitio en liña, vai 46 00:02:45,160 --> 00:02:49,790 realmente ver esta tarefa en seu ordenador en tempo real. 47 00:02:49,790 --> 00:02:53,760 >> Podo amosar-lle unha demostración rápida deste abrindo rozu-coello 48 00:02:53,760 --> 00:02:56,700 noutra pestana coa mesma URL. 49 00:02:56,700 --> 00:03:00,360 E vemos que os mesmos datos vén á tona. 50 00:03:00,360 --> 00:03:02,240 Tamén pode executa-lo en un navegador diferente. 51 00:03:02,240 --> 00:03:03,420 Digamos que eu executa-lo no Safari. 52 00:03:03,420 --> 00:03:04,720 Desta forma, non está dentro do sistema. 53 00:03:04,720 --> 00:03:07,750 54 00:03:07,750 --> 00:03:11,060 Polo tanto, temos a mesma Meteor app, e unha vez que cargue, 55 00:03:11,060 --> 00:03:13,910 imos ver os mesmos datos fixemos o primeiro. 56 00:03:13,910 --> 00:03:16,710 Como verás, eu non estou conectado aquí. 57 00:03:16,710 --> 00:03:20,000 E cando os datos cheques de audiencia, el actualiza en todos os navegadores 58 00:03:20,000 --> 00:03:20,910 ó mesmo tempo. 59 00:03:20,910 --> 00:03:23,740 Este é un dos de verdade recursos interesantes sobre Meteor. 60 00:03:23,740 --> 00:03:27,700 Con case ningún traballo, teño unha aplicación de actualización en directo 61 00:03:27,700 --> 00:03:31,240 que os cambios en todas seus dispositivos á vez. 62 00:03:31,240 --> 00:03:36,690 >> Se eu marque a caixa de verificación aquí na miña lista para facer, teremos, 63 00:03:36,690 --> 00:03:41,230 no meu outro navegador Chrome, o elemento comprobado fóra. 64 00:03:41,230 --> 00:03:42,605 E isto acontece instantaneamente. 65 00:03:42,605 --> 00:03:46,340 66 00:03:46,340 --> 00:03:47,280 Todo certo. 67 00:03:47,280 --> 00:03:52,730 Polo tanto, parece que Meteor instalación está listo agora. 68 00:03:52,730 --> 00:03:57,000 Entón agora imos voltar para o Todos app e executar este localmente. 69 00:03:57,000 --> 00:04:01,599 >> Se tes un proxecto Meteor, pode basta executa-lo co Meteor comando. 70 00:04:01,599 --> 00:04:03,640 Unha vez que se fai iso, Meteor vai facer algunha preparación 71 00:04:03,640 --> 00:04:06,120 para asegurarse de todos seu código está en xaque. 72 00:04:06,120 --> 00:04:12,440 E, a continuación, que vai dicirlle que o proxecto está listo para ser servido. 73 00:04:12,440 --> 00:04:17,750 Pode ser necesario facer que o seu firewall, se o ordenador bloquea vostede. 74 00:04:17,750 --> 00:04:22,440 >> Entón, o que está me dicindo Meteor agora é que neste sitio web 75 00:04:22,440 --> 00:04:26,100 lugar para o meu ordenador, eu podo ver o que este proxecto é Meteor. 76 00:04:26,100 --> 00:04:29,290 Teña en conta que agora, meu aplicación non está accesible para a internet. 77 00:04:29,290 --> 00:04:35,170 Nós imos cubrir a forma de levar o seu Meteor app para un sitio en directo un pouco máis tarde. 78 00:04:35,170 --> 00:04:40,510 Entón, eu estou indo só para copiar este URL agora e ir ao Google Chrome. 79 00:04:40,510 --> 00:04:42,600 >> E este é o que facer lista dende o exemplo. 80 00:04:42,600 --> 00:04:46,080 Podes ver que aplicaron máis algunhas funcionalidades aquí. 81 00:04:46,080 --> 00:04:49,210 Temos diferentes pestanas, nós teñen os mesmos recursos de conta, 82 00:04:49,210 --> 00:04:52,141 e podemos engadir novas listas. 83 00:04:52,141 --> 00:04:54,140 Agora, un dos de verdade recurso interesante sobre Meteor 84 00:04:54,140 --> 00:04:57,450 é que non só esta pode traballar no seu navegador, 85 00:04:57,450 --> 00:05:00,030 pero tamén pode crear nativo para iPhone e Android 86 00:05:00,030 --> 00:05:02,990 aplicacións a través dunha ferramenta chamada PhoneGap. 87 00:05:02,990 --> 00:05:06,740 >> Entón, algúns proxectos virán preconfigurado para a execución de 88 00:05:06,740 --> 00:05:08,700 en iOS, como esta app Todos. 89 00:05:08,700 --> 00:05:14,780 Polo tanto, todo o que eu teño que facer para executalo en iOS é tipo Meteor, executar e, a continuación, IOS. 90 00:05:14,780 --> 00:05:17,540 E cando fago iso, Meteor preparará o paquete novo. 91 00:05:17,540 --> 00:05:21,670 E entón, cando estea listo, que vai cargar o simulador iOS no meu mando. 92 00:05:21,670 --> 00:05:24,745 Teña en conta que só se pode executar aplicacións IOS Se tes un ordenador Mac. 93 00:05:24,745 --> 00:05:27,650 94 00:05:27,650 --> 00:05:30,730 Pode realizar as súas aplicacións en Android en todas as plataformas. 95 00:05:30,730 --> 00:05:34,070 96 00:05:34,070 --> 00:05:38,290 >> Entón, agora pode ver que o meu iPhone simulador xurdiu na miña pantalla. 97 00:05:38,290 --> 00:05:40,370 E en só un momento, que vai cargar co app. 98 00:05:40,370 --> 00:05:46,070 99 00:05:46,070 --> 00:05:48,490 Se facemos que só un pouco menor para caber na pantalla, 100 00:05:48,490 --> 00:05:50,780 vemos que temos o noso aplicación para iPhone. 101 00:05:50,780 --> 00:05:53,220 E só así non ficar confuso, imos facer 102 00:05:53,220 --> 00:05:59,790 seguro de que estamos no mesmo web, o servidor local 3000. 103 00:05:59,790 --> 00:06:03,490 >> Entón, aquí está un exemplo do app Meteor que eu teño, 104 00:06:03,490 --> 00:06:08,770 o app Todos, rodando tanto en un teléfono e nun navegador web. 105 00:06:08,770 --> 00:06:10,770 E cando eu cambiar cousas no navegador web, 106 00:06:10,770 --> 00:06:12,675 vai inmediatamente para o teléfono. 107 00:06:12,675 --> 00:06:16,500 E podo eliminar algo no teléfono, e iso cambia no navegador web. 108 00:06:16,500 --> 00:06:21,050 >> Agora, normalmente para crear nativa app teléfono para iOS ou Android, 109 00:06:21,050 --> 00:06:26,090 ten que saber Java ou Objective C. A tecnoloxía utiliza Meteor 110 00:06:26,090 --> 00:06:29,240 para permitir JavaScript para funcionar como súa aplicación chámase PhoneGap. 111 00:06:29,240 --> 00:06:31,320 Que o seu app esencialmente é é un navegador web. 112 00:06:31,320 --> 00:06:34,500 E Meteor manipula todo as partes complicadas implicadas 113 00:06:34,500 --> 00:06:39,820 para traer ese navegador para seu iPhone ou o seu teléfono Android. 114 00:06:39,820 --> 00:06:42,210 Podes ver que o interface co usuario é lisa, 115 00:06:42,210 --> 00:06:45,290 e mira e se sente moi moi parecido unha aplicación nativo. 116 00:06:45,290 --> 00:06:48,620 Teña en conta que, se eu ir a casa pantalla agora, eu tamén obter unha icona. 117 00:06:48,620 --> 00:06:50,880 Este non é un sitio como o atoparía en Safari. 118 00:06:50,880 --> 00:06:51,860 Este é o seu propio app. 119 00:06:51,860 --> 00:06:54,130 Pode instalar e borrar-lo se quere. 120 00:06:54,130 --> 00:06:59,500 121 00:06:59,500 --> 00:07:04,436 >> Podemos brevemente mostrar o que o código para este tipo de Todos app parece. 122 00:07:04,436 --> 00:07:08,260 Se ollar no cartafol Todos, vai ver que hai moitas carpetas. 123 00:07:08,260 --> 00:07:11,440 Pero, ao longo do curso do seminario, imos 124 00:07:11,440 --> 00:07:14,780 entender o que cada cartafol emprégase para. 125 00:07:14,780 --> 00:07:17,830 Imos para o terminal para que pode ver os ficheiros un pouco mellor. 126 00:07:17,830 --> 00:07:20,410 >> Eu estou indo a presionar Control C para deter o servidor, 127 00:07:20,410 --> 00:07:22,770 e agora eu estou de volta no app Todos. 128 00:07:22,770 --> 00:07:26,660 Teño carpetas diferentes aquí, como o cartafol do cliente, o cartafol do servidor. 129 00:07:26,660 --> 00:07:30,500 E esas carpetas simplemente significar que todo no cartafol cliente 130 00:07:30,500 --> 00:07:32,630 executarase no seu navegador. 131 00:07:32,630 --> 00:07:35,530 Todo nun cartafol do servidor execútase nun servidor. 132 00:07:35,530 --> 00:07:38,100 >> O que quero apuntar fóra é que o que tiñamos 133 00:07:38,100 --> 00:07:42,140 cando tivemos o noso teléfono abertas e noso navegador, estes eran clientes. 134 00:07:42,140 --> 00:07:45,730 Pero o que está a ser executado nun terminal, que é o servidor. 135 00:07:45,730 --> 00:07:48,710 Temos outros cartafoles, como lib, que é o código da biblioteca, 136 00:07:48,710 --> 00:07:51,050 como o seu axudante funcións, que pode 137 00:07:51,050 --> 00:07:53,710 usar tanto no cliente e do servidor. 138 00:07:53,710 --> 00:07:55,820 E entón tes un público cartafol e recursos 139 00:07:55,820 --> 00:07:59,310 cartafol necesaria para a obtención de súas imaxes e outro CSS cargado. 140 00:07:59,310 --> 00:08:02,630 141 00:08:02,630 --> 00:08:09,360 >> Se ten instalado Meteor, imos continuar co tutorial para Meteor. 142 00:08:09,360 --> 00:08:12,790 Pode ir a este URL, meteor.com/install, 143 00:08:12,790 --> 00:08:17,990 para obter a liña de comandos que eu mostre que instala Meteor. 144 00:08:17,990 --> 00:08:20,240 Imos pasar polo primeiro algúns pasos para obter unha mellor 145 00:08:20,240 --> 00:08:22,760 sente sobre como instalar Meteor. 146 00:08:22,760 --> 00:08:28,000 >> Pero, primeiro, eu creo que é importante que analizar un pouco de JavaScript. 147 00:08:28,000 --> 00:08:32,360 Para amosar-lle algúns exemplos de como o noso coñecemento C pode ser traducido 148 00:08:32,360 --> 00:08:34,950 para JavaScript, eu teño creado algúns exemplos. 149 00:08:34,950 --> 00:08:36,940 Están no directorio js. 150 00:08:36,940 --> 00:08:41,750 Polo tanto, se nos seminarios cartafol que mire, hai unha carpeta chamada js. 151 00:08:41,750 --> 00:08:44,540 E, aquí, temos algúns exemplos. 152 00:08:44,540 --> 00:08:50,120 >> Imos abrir a primeira exemplo para ver moi rapidamente. 153 00:08:50,120 --> 00:08:53,980 O que vemos é o seu patrón Ola mando mundo. 154 00:08:53,980 --> 00:08:56,520 Entender en C que ten algunhas liñas. 155 00:08:56,520 --> 00:09:00,490 E como estudantes CS50 sabe, necesitamos unha función principal, 156 00:09:00,490 --> 00:09:05,730 e temos que inclúe a norma I / O biblioteca, a fin de chamar printf. 157 00:09:05,730 --> 00:09:09,320 >> Vexamos como JavaScript compara. 158 00:09:09,320 --> 00:09:11,560 Vou abrir ex1.js. 159 00:09:11,560 --> 00:09:14,650 Comentado é o que o C código sería semellante, 160 00:09:14,650 --> 00:09:17,550 e a liña de fondo é todo precisa para ser executado en Node. 161 00:09:17,550 --> 00:09:20,452 Non precisa de unha función principal, Non é necesario incluír todos os ficheiros, 162 00:09:20,452 --> 00:09:21,660 e non precisa volver. 163 00:09:21,660 --> 00:09:23,810 Só chame console.log. 164 00:09:23,810 --> 00:09:26,370 Isto é o equivalente do seu printf. 165 00:09:26,370 --> 00:09:29,310 >> E leva o mesmo argumentos printf faría. 166 00:09:29,310 --> 00:09:33,870 E, a fin de executa-lo, en vez de correr facer EX1, 167 00:09:33,870 --> 00:09:38,930 vostede tería só que chamar ex1.js. Nó 168 00:09:38,930 --> 00:09:41,830 Escribe Nó e, a continuación, o ficheiro, e é executado. 169 00:09:41,830 --> 00:09:43,580 Non queda compilado. 170 00:09:43,580 --> 00:09:45,970 JavaScript é unha linguaxe interpretada. 171 00:09:45,970 --> 00:09:49,150 Por iso, non necesita ser compilado antes de ser executado. 172 00:09:49,150 --> 00:09:53,450 Se eu quixese correr ex1.c, Teño que facelo en primeiro lugar, 173 00:09:53,450 --> 00:09:59,160 e entón eu podo executar o executable para obter o mesmo resultado. 174 00:09:59,160 --> 00:10:02,460 >> Imos rapidamente cubrir algúns outros conceptos JavaScript. 175 00:10:02,460 --> 00:10:04,490 Vexamos exemplo dous. 176 00:10:04,490 --> 00:10:14,690 En ex2.js, en ex2.c, podemos ver que temos algún código. 177 00:10:14,690 --> 00:10:16,550 Deixe-me ir rapidamente a unha mellor editor de texto 178 00:10:16,550 --> 00:10:18,400 que debería amosar estes novas liñas un pouco mellor. 179 00:10:18,400 --> 00:10:21,760 180 00:10:21,760 --> 00:10:22,380 Todo certo. 181 00:10:22,380 --> 00:10:24,190 Aquí temos o exemplo 2.c. 182 00:10:24,190 --> 00:10:27,360 Aquí temos diferentes tipos que estamos imprimindo. 183 00:10:27,360 --> 00:10:30,880 E, como sabemos, leva printf diferentes argumentos por cento 184 00:10:30,880 --> 00:10:34,050 para acceder diferentes partes de datos. 185 00:10:34,050 --> 00:10:36,840 Se queremos imprimir unha corda, que chamamos% s. 186 00:10:36,840 --> 00:10:40,390 Se queremos chamar un flotante número de punto, chamamos% f. 187 00:10:40,390 --> 00:10:45,810 E non hai ningunha forma fácil de chamar un Boolean polo seu valor verdadeiro ou falso. 188 00:10:45,810 --> 00:10:50,760 Pero se usa% d, pode obter un 0 ou un 1 para falso e certo. 189 00:10:50,760 --> 00:10:53,270 >> JavaScript é un pouco mellor para nós. 190 00:10:53,270 --> 00:10:57,740 En JavaScript, imos ollar os poucos diferenzas que temos neste arquivo. 191 00:10:57,740 --> 00:11:05,790 En primeiro lugar, ten en conta que en C, debemos arrincar todas as variables cun tipo. 192 00:11:05,790 --> 00:11:06,940 S é unha estrela de char. 193 00:11:06,940 --> 00:11:08,930 É unha cadea, e el Non pode ser de calquera outro tipo. 194 00:11:08,930 --> 00:11:10,450 N é un float. 195 00:11:10,450 --> 00:11:11,780 B é un bool. 196 00:11:11,780 --> 00:11:14,220 >> Pero en JavaScript, existen tipos dinámicos. 197 00:11:14,220 --> 00:11:16,400 Isto significa que non fai Debe dicir JavaScript 198 00:11:16,400 --> 00:11:17,860 que tipo súas variables será. 199 00:11:17,860 --> 00:11:22,730 Acaba de dicir var á variable, o nome da variable, e, a continuación, o seu valor. 200 00:11:22,730 --> 00:11:24,690 Así, unha var pode ser calquera cousa realmente. 201 00:11:24,690 --> 00:11:25,640 Debe ser unha cadea. 202 00:11:25,640 --> 00:11:27,300 Pode ser un número de punto flotante. 203 00:11:27,300 --> 00:11:28,560 Pode ser un personaxe. 204 00:11:28,560 --> 00:11:31,250 Pode ser un booleano. 205 00:11:31,250 --> 00:11:34,380 E de rexistro da consola funciona un pouco diferente. 206 00:11:34,380 --> 00:11:37,340 Se desexa imprimir un número, vostede chama% d. 207 00:11:37,340 --> 00:11:41,740 Pero a maioría dos valores poden ser impresas como cordas moi ben. 208 00:11:41,740 --> 00:11:46,220 >> Imos realizar isto en Node para ver o que acontecería. 209 00:11:46,220 --> 00:11:51,880 Podo chamar ex2.js Nó, e temos printf 210 00:11:51,880 --> 00:11:56,870 co CS50 valores, como N o número de punto flotante, 211 00:11:56,870 --> 00:12:00,620 e, a continuación, B como o booleano convertida para unha cadea verdade. 212 00:12:00,620 --> 00:12:03,830 Que tal se fixésemos exemplo 2.c? 213 00:12:03,830 --> 00:12:09,630 Ben, aínda temos algúns máis problema con printf. 214 00:12:09,630 --> 00:12:13,110 Teña en conta que o punto flotante número ten que ser formatado correctamente, 215 00:12:13,110 --> 00:12:18,120 e que o booleano non pode simplemente ser presentado como verdadeiro ou falso. 216 00:12:18,120 --> 00:12:18,620 Todo certo. 217 00:12:18,620 --> 00:12:22,680 Agora imos ollar para o exemplo de tres. 218 00:12:22,680 --> 00:12:26,470 No exemplo de tres, estamos amosando como usaría un loop. 219 00:12:26,470 --> 00:12:27,630 De feito, é moi sinxelo. 220 00:12:27,630 --> 00:12:31,430 Unha das cousas agradables sobre JavaScript é que está baseado C. 221 00:12:31,430 --> 00:12:33,920 Isto significa que unha morea de seu código será moi similar 222 00:12:33,920 --> 00:12:36,490 e me sinto moi moi mesmo. 223 00:12:36,490 --> 00:12:39,220 En un loop for, o único que realmente cambiou aquí 224 00:12:39,220 --> 00:12:41,840 é, en vez de int i, temos var i. 225 00:12:41,840 --> 00:12:45,470 Aínda os podemos atribuílo lo a valorar cero, comprobe se é inferior a cinco, 226 00:12:45,470 --> 00:12:49,390 e incrementa-lo por un co operador ++. 227 00:12:49,390 --> 00:12:56,286 Chamamos console.log no i, e que nos imprimir un número cada liña. 228 00:12:56,286 --> 00:12:58,410 Imos executa-lo moi rapidamente a ver que el produce. 229 00:12:58,410 --> 00:13:02,320 230 00:13:02,320 --> 00:13:03,880 Estivemos con un novo número en cada liña. 231 00:13:03,880 --> 00:13:06,920 Outra cousa que quero que a notar con console.log 232 00:13:06,920 --> 00:13:09,960 é que non ten que escribir barra invertida n para a nova liña. 233 00:13:09,960 --> 00:13:12,480 Console.log imprimirá todo na súa propia liña. 234 00:13:12,480 --> 00:13:14,585 Isto é un bo recurso JavaScript que nos dá. 235 00:13:14,585 --> 00:13:18,440 236 00:13:18,440 --> 00:13:22,600 >> Agora imos abrir exemplo catro. 237 00:13:22,600 --> 00:13:28,710 No exemplo catro, en primeiro lugar no C, estamos chamando algunhas funcións. 238 00:13:28,710 --> 00:13:33,290 Teña en conta que debemos declarar a funcións antes de usalos en principal. 239 00:13:33,290 --> 00:13:37,250 Se tivésemos principal en primeiro lugar e a continuación, engadir e, a continuación, alta, faga, 240 00:13:37,250 --> 00:13:39,540 clang, ou GCC sería ofrécenos un erro dicindo 241 00:13:39,540 --> 00:13:41,060 que el non sabe o que é alta. 242 00:13:41,060 --> 00:13:42,780 El non sabe o que é add. 243 00:13:42,780 --> 00:13:46,480 Así, en C, ten que ser esixente en canto á orde en que chama de súas funcións. 244 00:13:46,480 --> 00:13:49,220 245 00:13:49,220 --> 00:13:51,310 >> Imos dar un ollo a como pode facelo en JavaScript. 246 00:13:51,310 --> 00:13:56,060 Temos diferentes arquivos, porque hai algunhas formas diferentes de facelo. 247 00:13:56,060 --> 00:13:58,950 Un xeito é moi fermoso unha tradución directa. 248 00:13:58,950 --> 00:14:02,180 Como as funcións en C tipo de retorno, e JavaScript 249 00:14:02,180 --> 00:14:05,210 non sabe ou coidados sobre que tipo volver, 250 00:14:05,210 --> 00:14:06,300 non escribe un tipo. 251 00:14:06,300 --> 00:14:08,100 Pola contra, só precisa para escribir a función, 252 00:14:08,100 --> 00:14:11,180 e todo é moi do mesmo xeito como antes. 253 00:14:11,180 --> 00:14:14,630 >> Cando ten unha variable, como en engadir, só necesitamos escribir x e y. 254 00:14:14,630 --> 00:14:16,060 Non precisamos dicir que x é un int. 255 00:14:16,060 --> 00:14:18,940 Non necesitamos dicir y é un int. 256 00:14:18,940 --> 00:14:21,030 Volvemos coa mesma sintaxe. 257 00:14:21,030 --> 00:14:24,230 Por alto, nós declaralo la con funcionar en vez de baleiro. 258 00:14:24,230 --> 00:14:26,110 Teña en conta que se é nulo ou non-nula, 259 00:14:26,110 --> 00:14:28,380 aínda está todo a mesma función. 260 00:14:28,380 --> 00:14:32,440 E nós simplemente non poñer algo entre parénteses, 261 00:14:32,440 --> 00:14:34,690 e el se parece moito co código C. 262 00:14:34,690 --> 00:14:37,460 E a continuación, podemos chamalo continuación. 263 00:14:37,460 --> 00:14:42,730 >> Mira o exemplo 4b, notamos que eu mudei algunhas cousas. 264 00:14:42,730 --> 00:14:45,340 O único que eu mudei realmente, con todo, é o final. 265 00:14:45,340 --> 00:14:47,340 Temos o mesmo funcións, pero agora están 266 00:14:47,340 --> 00:14:52,200 declarou despois que son usados ​​en console.log e alto nas liñas 18, 19. 267 00:14:52,200 --> 00:14:54,740 Se fixo iso en C, facer sería lanzar un erro. 268 00:14:54,740 --> 00:14:56,070 Aquí, iso funciona moi ben. 269 00:14:56,070 --> 00:15:01,935 E podo amosar isto para vostede por chamando Node no exemplo 4b. 270 00:15:01,935 --> 00:15:05,350 271 00:15:05,350 --> 00:15:10,130 >> Outro xeito de chamar funcións é por funcións de aforro como variables. 272 00:15:10,130 --> 00:15:13,790 Como dixen, unha variable pode ter calquera tipo. 273 00:15:13,790 --> 00:15:16,720 Un dos tipos unha variable pode ter é unha función. 274 00:15:16,720 --> 00:15:19,800 Entón, se ollar para exemplo 4C, o que eu mudei 275 00:15:19,800 --> 00:15:24,320 aquí é var engadir no canto de función add. 276 00:15:24,320 --> 00:15:26,807 E agora é igual a engadir unha función. 277 00:15:26,807 --> 00:15:28,140 Esta función aquí é anónimo. 278 00:15:28,140 --> 00:15:33,346 Non ten nome, polo que é só función e, a continuación, os parénteses. 279 00:15:33,346 --> 00:15:35,220 A sintaxe que despois non cambia, pero 280 00:15:35,220 --> 00:15:38,300 ten que ter en conta que ten unha variable que está 281 00:15:38,300 --> 00:15:42,940 almacenar a función en add, e un variable que está almacenando en alta. 282 00:15:42,940 --> 00:15:47,620 >> Como engadir e alta agora son variables e non funciona, algo cambia. 283 00:15:47,620 --> 00:15:50,190 Este é un erro común que vexo en unha morea de JavaScripts das persoas, 284 00:15:50,190 --> 00:15:52,410 e algo a ter en conta. 285 00:15:52,410 --> 00:15:54,365 Cando executo iso, imos ver que pasa. 286 00:15:54,365 --> 00:15:57,410 287 00:15:57,410 --> 00:15:58,230 Eu recibín un erro. 288 00:15:58,230 --> 00:16:01,000 É dicir indefinido neste momento. 289 00:16:01,000 --> 00:16:03,520 Entón, está dicindo que non sabe o que é engadir. 290 00:16:03,520 --> 00:16:06,010 >> Porque agora engadir non é un función, engadir é unha variable. 291 00:16:06,010 --> 00:16:10,100 E non teña realmente dado engadir un valor aínda cando usou. 292 00:16:10,100 --> 00:16:14,460 Isto lévanos a exemplo 4D, onde se quere usar variables como funcións, 293 00:16:14,460 --> 00:16:17,210 só precisa ter seguro de que eles obter o valor antes de seren usados. 294 00:16:17,210 --> 00:16:20,200 295 00:16:20,200 --> 00:16:23,420 >> Imos seguir adiante co exemplo de cinco entón. 296 00:16:23,420 --> 00:16:27,390 Aquí, falamos estruturas en C. En C, estruturas 297 00:16:27,390 --> 00:16:30,320 teñen esta estrutura fixa a eles porque ten que declaralo los 298 00:16:30,320 --> 00:16:33,050 antes de usalo, e di que eu teño un alumno, 299 00:16:33,050 --> 00:16:36,645 e cada alumno ten exactamente un nome, un ano, un xénero. 300 00:16:36,645 --> 00:16:37,770 Ten que ter todos eles. 301 00:16:37,770 --> 00:16:42,280 Non pode ter calquera outros valores, e eles teñen que ser certos tipos. 302 00:16:42,280 --> 00:16:47,540 >> Entón, podemos arrincar o struct nesta sintaxe agradable 303 00:16:47,540 --> 00:16:49,470 porque sabe a orde. 304 00:16:49,470 --> 00:16:51,460 Por iso, sabe que Roger é un nome. 305 00:16:51,460 --> 00:16:54,060 El sabe que 2016 é un ano e M é un xénero 306 00:16:54,060 --> 00:16:58,200 porque dixo que este lista é un estudante struct. 307 00:16:58,200 --> 00:17:01,607 E entón podes imprimir lo, acceder s.name. 308 00:17:01,607 --> 00:17:03,690 Imos ver como iríamos convertelo en JavaScript. 309 00:17:03,690 --> 00:17:06,400 310 00:17:06,400 --> 00:17:09,790 Teña en conta que é agora é un variable, e non hai ningún tipo. 311 00:17:09,790 --> 00:17:10,920 É só unha var novo. 312 00:17:10,920 --> 00:17:14,480 ¿Por que non importa se o tipo de esta variable é un punteiro, 313 00:17:14,480 --> 00:17:17,440 é unha estrutura, ou calquera outra cousa. 314 00:17:17,440 --> 00:17:19,650 Temos unha sintaxe un pouco diferente. 315 00:17:19,650 --> 00:17:21,890 Esta sintaxe é a sintaxe obxecto. 316 00:17:21,890 --> 00:17:24,400 >> Xa debe ter visto en JSON. 317 00:17:24,400 --> 00:17:27,780 JSON, en realidade, representa o JavaScript Object Notation. 318 00:17:27,780 --> 00:17:31,240 Isto é como establecer obxectos en JavaScript. 319 00:17:31,240 --> 00:17:34,500 Temos unha clave, que é o valor, como o nome. 320 00:17:34,500 --> 00:17:37,680 E nós darlle valores en o outro lado do colonos. 321 00:17:37,680 --> 00:17:41,850 E unha cousa a ter presente é que Non é necesario ter un nome e un ano 322 00:17:41,850 --> 00:17:42,980 e un xénero dun obxecto. 323 00:17:42,980 --> 00:17:44,570 Un obxecto pode ter ningún valor. 324 00:17:44,570 --> 00:17:46,920 Pode ter como moitos como quere. 325 00:17:46,920 --> 00:17:50,375 >> Podemos usar estes obxectos en só o mesmo xeito que usaría un struct, s.name. 326 00:17:50,375 --> 00:17:53,810 327 00:17:53,810 --> 00:17:57,080 Podemos executa-lo moi rapidamente facendo nodo exemplo 5.c. 328 00:17:57,080 --> 00:18:00,320 329 00:18:00,320 --> 00:18:02,520 Non podemos realmente facer un arquivo C en Node. 330 00:18:02,520 --> 00:18:03,654 El non sabe o que é C. 331 00:18:03,654 --> 00:18:04,695 El só sabe JavaScript. 332 00:18:04,695 --> 00:18:09,865 Cando executamos os ex5.js, obtemos o valor, o que se espera. 333 00:18:09,865 --> 00:18:13,490 334 00:18:13,490 --> 00:18:15,980 >> Imos seguir adiante co exemplo de seis. 335 00:18:15,980 --> 00:18:18,930 Aquí eu só quero falar un pouco pouco máis sobre matrices de JavaScript 336 00:18:18,930 --> 00:18:20,930 porque son un pouco diferente do que é 337 00:18:20,930 --> 00:18:26,940 utilizado no C. Arrays son notados, non cos soportes, como en C, 338 00:18:26,940 --> 00:18:28,640 coas chaves, pero corchetes. 339 00:18:28,640 --> 00:18:32,150 Pode ter unha matriz baleira, como arr na liña catro. 340 00:18:32,150 --> 00:18:34,680 Pode ter matrices con varios valores. 341 00:18:34,680 --> 00:18:39,790 E acceder a eles exactamente da mesma maneira en C. 342 00:18:39,790 --> 00:18:42,990 >> -Se A liña sete, todo Parece moi sinxelo. 343 00:18:42,990 --> 00:18:45,390 Unha pequena diferenza está aquí na liña 10. 344 00:18:45,390 --> 00:18:48,620 O xeito como obter unha lonxitude dun matriz é só chamando .length. 345 00:18:48,620 --> 00:18:50,620 Unha matriz pode ser realmente tratado como un obxecto, 346 00:18:50,620 --> 00:18:54,960 e ese obxecto ten unha propiedade de lonxitude que chamar para obter a lonxitude do mesmo. 347 00:18:54,960 --> 00:18:57,350 Teña en conta que isto é diferente en C porque en C ti 348 00:18:57,350 --> 00:19:01,600 Ten que saber a lonxitude do seu obxecto antes de tempo. 349 00:19:01,600 --> 00:19:04,700 >> Polo tanto, outra cousa agradable sobre matrices é que pode ter diferentes tipos. 350 00:19:04,700 --> 00:19:07,470 Se vostede ten unha matriz en C, non son matrices de un valor específico, 351 00:19:07,470 --> 00:19:11,900 un punteiro struct ou flota ou [inaudível]. 352 00:19:11,900 --> 00:19:13,700 Aquí, pode ter valores diferentes. 353 00:19:13,700 --> 00:19:17,560 Eu tiña primeiro un número de punto flotante, a continuación, un booleano, logo outro enteiro. 354 00:19:17,560 --> 00:19:19,670 E, de feito, poden cambiar tipo tamén. 355 00:19:19,670 --> 00:19:21,220 Olhe liña 16. 356 00:19:21,220 --> 00:19:26,760 Matriz de dúas está cambiando de un número, un número enteiro, a unha cadea. 357 00:19:26,760 --> 00:19:30,920 >> Outra cousa legal sobre matrices é aquí na liña 19, que ten tamaño infinito. 358 00:19:30,920 --> 00:19:35,900 Pode só dicir que quero o centésimo elemento a ser a cadea lexítimo. 359 00:19:35,900 --> 00:19:38,510 E iso non parece facer sentido, porque a matriz só 360 00:19:38,510 --> 00:19:41,080 ten espazo para tres elementos, de xeito que o extremo debe ser dous. 361 00:19:41,080 --> 00:19:44,800 Pero cando fai isto, imos ver o que se fai matriz de tres. 362 00:19:44,800 --> 00:19:47,460 Queremos realizar este rapidamente con nó exemplo six.js. 363 00:19:47,460 --> 00:19:49,990 364 00:19:49,990 --> 00:19:52,180 Recibimos esta moi longo array, e que pasa 365 00:19:52,180 --> 00:19:55,100 é que temos os primeiros elementos e, a continuación, unha morea de espazo en branco 366 00:19:55,100 --> 00:19:56,580 ata chegar a nosa cadea. 367 00:19:56,580 --> 00:19:58,580 JavaScript enche o matriz como é necesario. 368 00:19:58,580 --> 00:20:01,790 369 00:20:01,790 --> 00:20:05,420 >> Imos finalmente ir ao noso último exemplo. 370 00:20:05,420 --> 00:20:08,180 Aquí temos unha lista de diferentes alumnos. 371 00:20:08,180 --> 00:20:11,350 Quero falar un pouco pouco sobre algúns aspectos agradables 372 00:20:11,350 --> 00:20:14,240 de loops en JavaScript. 373 00:20:14,240 --> 00:20:17,500 En C, para loops son tipo de limitación. 374 00:20:17,500 --> 00:20:21,490 Teñen unha estrutura fixa, onde ter unha variable, ten unha condición, 375 00:20:21,490 --> 00:20:23,850 e, a continuación, fai algo ao final do ciclo. 376 00:20:23,850 --> 00:20:27,560 E por suposto que isto funciona en JavaScript, como vimos nos exemplos anteriores. 377 00:20:27,560 --> 00:20:31,030 Pero tamén temos formas máis agradables de facelo en JavaScript. 378 00:20:31,030 --> 00:20:33,870 Iso é chamado de un loop foreach. 379 00:20:33,870 --> 00:20:36,580 >> Sentímolo, imos volver a sete exemplo aquí. 380 00:20:36,580 --> 00:20:39,320 Podemos dicir tamén sección é unha lista. 381 00:20:39,320 --> 00:20:43,250 Entón me dea todo i ou todos os índices nesa lista. 382 00:20:43,250 --> 00:20:46,255 Entón, podemos obter o alumno por só chamando sección i. 383 00:20:46,255 --> 00:20:50,690 Entón, todo o código do establecemento i igual a cero e asegurarse de i 384 00:20:50,690 --> 00:20:54,420 é menor que a lonxitude ea sumándose ao i cada vez, iso é 385 00:20:54,420 --> 00:21:00,220 coidando de ti, en vez moi ben con este bucle foreach. 386 00:21:00,220 --> 00:21:02,830 >> Non só loops foreach traballar en listas ou matrices, 387 00:21:02,830 --> 00:21:06,130 eles tamén traballan en obxectos, que tamén é bo. 388 00:21:06,130 --> 00:21:10,240 Pode obter o nome de cada propiedade por só tomando 389 00:21:10,240 --> 00:21:15,030 un dicionario ou un obxecto, como estudante, e despois é só dicir me dea cada chave. 390 00:21:15,030 --> 00:21:18,920 A clave sería estes propiedades, nome ou casa. 391 00:21:18,920 --> 00:21:22,870 Entón, o que vai pasar aquí é que nós imprimir primeiro nome e, a continuación, 392 00:21:22,870 --> 00:21:24,920 a casa de cada alumno. 393 00:21:24,920 --> 00:21:29,170 >> Podo usar este en Node moi rapidamente para lle amosar. 394 00:21:29,170 --> 00:21:35,510 Estivemos en primeiro lugar o estilo C para o lazo, onde obtemos cada obxecto que está a ser impreso. 395 00:21:35,510 --> 00:21:38,910 E entón temos o JavaScript estilo, onde podes só 396 00:21:38,910 --> 00:21:41,510 imprimir cada clave e valorar individualmente. 397 00:21:41,510 --> 00:21:45,560 398 00:21:45,560 --> 00:21:47,050 >> Todo certo. 399 00:21:47,050 --> 00:21:52,850 Agora que nós Cubrimos Node.js, creo estamos preparados para comezar co Meteor. 400 00:21:52,850 --> 00:21:56,070 Como dixen, Meteor fixo un gran traballo de escribir algúns exemplos ready-made 401 00:21:56,070 --> 00:22:00,600 para ti que pode explotar por medio de Neste tutorial ou no cartafol de seminario. 402 00:22:00,600 --> 00:22:03,750 Pero aquí quero iniciar máis a partir de cero. 403 00:22:03,750 --> 00:22:06,810 >> Imos crear un sinxelo de facer aplicación. 404 00:22:06,810 --> 00:22:14,140 Este é o tipo de base que o de faga unha aplicación que lle mostre anteriormente é. 405 00:22:14,140 --> 00:22:16,990 Neste tutorial, vai ver que non hai 406 00:22:16,990 --> 00:22:20,180 Un meteoro mando crear a crear un novo proxecto Meteor. 407 00:22:20,180 --> 00:22:24,510 Ten que chamar iso de forma para realizar proxectos de meteoros porque 408 00:22:24,510 --> 00:22:27,470 executará os comandos para crear o Meteor 409 00:22:27,470 --> 00:22:31,100 os arquivos necesarios para o seu proxecto. 410 00:22:31,100 --> 00:22:35,920 >> Se entrar na terminal, o que pudermos ir á carpeta chamada primeira etapa. 411 00:22:35,920 --> 00:22:41,240 E o primeiro paso corresponderá o primeiro paso para o tutorial. 412 00:22:41,240 --> 00:22:44,020 Aviso existen carpetas, paso un, dous paso, por todo o camiño ata cinco. 413 00:22:44,020 --> 00:22:47,835 E cada un é correspondente a un paso neste tutorial. 414 00:22:47,835 --> 00:22:50,960 415 00:22:50,960 --> 00:22:52,780 Eu estou indo a abrilo no meu editor de texto aquí 416 00:22:52,780 --> 00:22:56,280 para que poidamos ver un pouco do que foi creado. 417 00:22:56,280 --> 00:22:58,530 Notamos que hai catro partes principais. 418 00:22:58,530 --> 00:23:01,170 Hai un directorio Meteor, .meteor. 419 00:23:01,170 --> 00:23:03,180 E que normalmente Non é necesario tocar. 420 00:23:03,180 --> 00:23:05,070 Meteor coida de esa carpeta, e iso só 421 00:23:05,070 --> 00:23:08,640 asegura que o seu proxecto funcionará correctamente. 422 00:23:08,640 --> 00:23:14,580 >> Temos tamén tres arquivos, un arquivo HTML, un arquivo JavaScript, e un arquivo CSS. 423 00:23:14,580 --> 00:23:18,670 Imos comezar primeiro co arquivo HTML. 424 00:23:18,670 --> 00:23:21,310 A primeira vista, iso parece como un documento HTML normal. 425 00:23:21,310 --> 00:23:23,490 Pero teña en conta que hai algunhas diferenzas. 426 00:23:23,490 --> 00:23:26,520 Un, isto non é certo un documento HTML. 427 00:23:26,520 --> 00:23:28,640 Estamos perdendo as etiquetas HTML. 428 00:23:28,640 --> 00:23:29,700 Isto é normal. 429 00:23:29,700 --> 00:23:33,560 En Meteor, non está espera para crear estas etiquetas HTML. 430 00:23:33,560 --> 00:23:35,260 Isto é feito para ti. 431 00:23:35,260 --> 00:23:38,380 Queres begin-- se quero crear un sitio web, 432 00:23:38,380 --> 00:23:40,430 só precisa comezar coa marca de cabeza, 433 00:23:40,430 --> 00:23:43,510 definir que, a continuación, definir tag corpo. 434 00:23:43,510 --> 00:23:48,940 >> Pero se observa neste Ficheiro HTML, temos unha nova etiqueta. 435 00:23:48,940 --> 00:23:50,350 Temos tag template. 436 00:23:50,350 --> 00:23:52,050 Este non é o HTML normal. 437 00:23:52,050 --> 00:23:55,300 Esta é unha versión especial do HTML Meteor que fai dispoñible para ti. 438 00:23:55,300 --> 00:23:57,660 É chamado de barras de espazo. 439 00:23:57,660 --> 00:24:00,980 Podes establecer modelos como pouco módulos, como o tipo de funcións auxiliares, 440 00:24:00,980 --> 00:24:03,660 na súa C ou código JavaScript. 441 00:24:03,660 --> 00:24:06,020 Este modelo sería ten un nome chamado tarefa. 442 00:24:06,020 --> 00:24:10,520 E podes ver aquí en liña 13 que pode chamar estes modelos. 443 00:24:10,520 --> 00:24:14,380 E o que Meteor vai facer é só cubrir esas tarefas para ti. 444 00:24:14,380 --> 00:24:17,540 445 00:24:17,540 --> 00:24:22,580 >> Outra cousa que pode entender é unha pouco diferente é esta cada función. 446 00:24:22,580 --> 00:24:26,130 Cada un terá a variable tarefas e tipo de pasar por iso 447 00:24:26,130 --> 00:24:28,810 en que nós loop foreach viu no exemplo sete. 448 00:24:28,810 --> 00:24:34,200 Esta cada un pode levar un dicionario ou unha lista, un obxecto ou unha lista, 449 00:24:34,200 --> 00:24:38,820 e el só vai pasar por todo o valores como un loop foreach faría. 450 00:24:38,820 --> 00:24:44,110 Entón, se temos unha morea de tarefas, este vai chamar o modelo en cada tarefa. 451 00:24:44,110 --> 00:24:49,590 >> Imos realizar o proxecto Meteor só para ver que isto ocorre. 452 00:24:49,590 --> 00:24:53,260 Eu executar o proxecto con Meteor só Meteor ou Meteor executado. 453 00:24:53,260 --> 00:24:56,690 E agora Meteor só precisa preparar rapidamente o proxecto, 454 00:24:56,690 --> 00:25:03,320 iniciar a base de datos como necesario, e logo publicar a aplicación local. 455 00:25:03,320 --> 00:25:07,200 Podemos ir ao noso navegador agora. 456 00:25:07,200 --> 00:25:10,215 E nós imos ver que nós teño unha aplicación moi sinxelo. 457 00:25:10,215 --> 00:25:22,190 458 00:25:22,190 --> 00:25:29,130 Entón, o que se viu foi realmente mostrou-se o primeiro paso, o paso dun arquivo. 459 00:25:29,130 --> 00:25:33,260 >> Imos pasar á etapa dous só porque Eu creo que vai servir a mesma finalidade. 460 00:25:33,260 --> 00:25:36,500 Eu só vou cambiar ao directorio etapa dous 461 00:25:36,500 --> 00:25:39,550 e executar Meteor novo para que poidamos ver o modelo que acabamos con quen traballou. 462 00:25:39,550 --> 00:25:43,560 463 00:25:43,560 --> 00:25:45,730 Si, unha pregunta? 464 00:25:45,730 --> 00:25:49,724 >> Audiencia: Se estamos recibindo permiso negado, é isso-- o que é iso 465 00:25:49,724 --> 00:25:50,390 chamado para iso? 466 00:25:50,390 --> 00:25:52,154 467 00:25:52,154 --> 00:25:54,070 ROGER ZURAWICKI: Se está executando Meteor prazo, 468 00:25:54,070 --> 00:25:57,280 e ten permiso negada, algúns dos seus arquivos 469 00:25:57,280 --> 00:25:59,070 Pode non ter o conxunto de permisos dereita. 470 00:25:59,070 --> 00:26:03,970 Entón tes que comprobar onde os permisos desactívanse. 471 00:26:03,970 --> 00:26:06,030 Eles poderían estar fóra seu proxecto Meteor, 472 00:26:06,030 --> 00:26:08,550 ou eles poderían estar fóra no Meteor propios arquivos. 473 00:26:08,550 --> 00:26:13,742 >> Audiencia: Se eu baixei só agora dende o seu GitHub, entón o que debo facer 474 00:26:13,742 --> 00:26:16,110 [Inaudível]? 475 00:26:16,110 --> 00:26:20,110 >> ROGER ZURAWICKI: Se quere para asegurarse de que pode acceder a ela, 476 00:26:20,110 --> 00:26:21,450 hai unha orde que pode realizar. 477 00:26:21,450 --> 00:26:26,590 Déixeme rapidamente gravala-lo para que outras persoas poidan velo. 478 00:26:26,590 --> 00:26:30,670 Vou abrir un novo separador aquí e ir meu cartafol de seminario. 479 00:26:30,670 --> 00:26:33,500 480 00:26:33,500 --> 00:26:36,490 Chmod é o comando para cambiar os permisos, 481 00:26:36,490 --> 00:26:40,060 e pode dicir r para facelo recursivamente para cada ficheiro. 482 00:26:40,060 --> 00:26:46,040 E permisos, podes probar 0755 para asegurarse de que ten acceso completo, 483 00:26:46,040 --> 00:26:47,820 e todo o mundo pode ler. 484 00:26:47,820 --> 00:26:50,100 E se só correr este comando, que vai facer 485 00:26:50,100 --> 00:26:55,800 Comproba se os permisos están en vaia ó directorio enteiro. 486 00:26:55,800 --> 00:26:59,160 Correndo ls-l pode amosar-lle o permisos de forma máis detallada. 487 00:26:59,160 --> 00:27:01,290 Isto parece OK. 488 00:27:01,290 --> 00:27:03,900 >> O que é máis importante é que ten todos os tres 489 00:27:03,900 --> 00:27:06,610 rwx para todos os ficheiros o directorio seminario. 490 00:27:06,610 --> 00:27:09,415 491 00:27:09,415 --> 00:27:11,330 Será que isto resolve o problema? 492 00:27:11,330 --> 00:27:13,735 >> Audiencia: Di que falta operante [inaudível]. 493 00:27:13,735 --> 00:27:17,980 494 00:27:17,980 --> 00:27:18,740 [Inaudível] 495 00:27:18,740 --> 00:27:20,490 ROGER ZURAWICKI: Vostede ten que ter seguro que 496 00:27:20,490 --> 00:27:23,022 teñen un punto ao final do seu mando. 497 00:27:23,022 --> 00:27:23,938 Audiencia: [inaudível]. 498 00:27:23,938 --> 00:27:36,395 499 00:27:36,395 --> 00:27:37,520 ROGER ZURAWICKI: Todo ben. 500 00:27:37,520 --> 00:27:42,220 Imos rapidamente volver ao servidor local, o app que temos. 501 00:27:42,220 --> 00:27:46,640 E vai ver que temos un algunhas tarefas aquí, como se esperaba. 502 00:27:46,640 --> 00:27:49,330 503 00:27:49,330 --> 00:27:51,990 Temos unha morea de CSS, que non se preocupe. 504 00:27:51,990 --> 00:27:53,740 O tutorial Meteor só dá isto para vostede 505 00:27:53,740 --> 00:27:58,010 para facer a súa lista para facer un ollo pouco mellor que o HTML simple. 506 00:27:58,010 --> 00:28:02,290 E nós temos o arquivo JavaScript, o que Eu vou entrar en máis detalles un pouco máis tarde, 507 00:28:02,290 --> 00:28:04,272 pero só ofrece estas tarefas. 508 00:28:04,272 --> 00:28:04,980 Esta é unha tarefa. 509 00:28:04,980 --> 00:28:05,740 Esta tarefa é dous. 510 00:28:05,740 --> 00:28:06,590 Esta tarefa é tres. 511 00:28:06,590 --> 00:28:09,720 Entón esta é a datos Meteor está quedando. 512 00:28:09,720 --> 00:28:15,590 >> Unha das cousas legais sobre Meteor é que cambios poden ocorrer automaticamente. 513 00:28:15,590 --> 00:28:18,990 Se eu quería cambiar o nome da primeira tarefa, 514 00:28:18,990 --> 00:28:22,490 por iso, diría que este non é tarefa, e eu salvalo, 515 00:28:22,490 --> 00:28:26,370 entón cando ir á web navegador, pode actualiza-lo, 516 00:28:26,370 --> 00:28:30,861 e el di que automaticamente esta non é unha tarefa un. 517 00:28:30,861 --> 00:28:32,860 Podes facer o mesmo en calquera destes ficheiros. 518 00:28:32,860 --> 00:28:37,940 Fai un cambio, en vez de facer lista, eu vou ter o meu para facer a lista. 519 00:28:37,940 --> 00:28:40,980 >> E unha cousa que só notei, que eu non tiña sequera para refrescar. 520 00:28:40,980 --> 00:28:43,960 A idea de refrescante é unha especie de resolto para ti con Meteor. 521 00:28:43,960 --> 00:28:48,970 Sempre que detecta os cambios de arquivos, que vai cargar os cambios para ti. 522 00:28:48,970 --> 00:28:53,110 Isto funciona en todos os ficheiros, se é HTML, CSS, JavaScript ou. 523 00:28:53,110 --> 00:28:57,990 Para mostrar a vostede o que esta app ollaría como sen CSS, podo eliminar todo. 524 00:28:57,990 --> 00:29:04,720 E cando é recargando, agora tes unha non tan boa aparencia para facer a lista. 525 00:29:04,720 --> 00:29:06,370 Imos poñer este contido de volta. 526 00:29:06,370 --> 00:29:11,343 E certamente o suficiente, refresca, e nosa CSS está de volta. 527 00:29:11,343 --> 00:29:11,843 Óptimo. 528 00:29:11,843 --> 00:29:15,700 529 00:29:15,700 --> 00:29:20,010 >> Agora podemos seguir adiante co tutorial. 530 00:29:20,010 --> 00:29:23,360 Imos falar sobre a segunda etapa, templates. 531 00:29:23,360 --> 00:29:27,140 Isto é o que acabamos de ver coas diferentes tarefas. 532 00:29:27,140 --> 00:29:31,550 Meteor pode explicar-lle o que modelos e como esa lóxica funciona. 533 00:29:31,550 --> 00:29:34,760 Pero imos ollar o código para ver se podemos ter sentido fóra del. 534 00:29:34,760 --> 00:29:38,030 535 00:29:38,030 --> 00:29:41,460 >> En aplicacións moi sinxelo, parecido ao que temos no simple 536 00:29:41,460 --> 00:29:44,550 facer, paso un, paso dous, paso tres, catro etapas, etapa cinco, 537 00:29:44,550 --> 00:29:45,700 non temos ningún cartafoles. 538 00:29:45,700 --> 00:29:47,533 Non temos o servidor cartafol que mencionei. 539 00:29:47,533 --> 00:29:50,510 Non temos o cliente cartafol que foi mencionado. 540 00:29:50,510 --> 00:29:52,290 Entón Meteor executarase todos os ficheiros. 541 00:29:52,290 --> 00:29:55,210 Vai executa-lo tanto no cliente, tanto no servidor. 542 00:29:55,210 --> 00:29:58,840 >> E se queres partes do seu JavaScript código para ser executado só no cliente, 543 00:29:58,840 --> 00:30:02,350 precisan estar seguro de que ten un se instrución, tipo de como o que 544 00:30:02,350 --> 00:30:04,890 temos no noso arquivo JavaScript aquí. 545 00:30:04,890 --> 00:30:08,010 Entón Meteor, só se é o cliente, entón eu 546 00:30:08,010 --> 00:30:12,355 quere establecer un modelo auxiliar chamado tarefas. 547 00:30:12,355 --> 00:30:15,050 548 00:30:15,050 --> 00:30:19,260 Que este código realmente fai é que di que non hai 549 00:30:19,260 --> 00:30:21,800 un modelo de obxecto chamado Meteor que ofrece. 550 00:30:21,800 --> 00:30:23,270 E nós imos engadir un axudante. 551 00:30:23,270 --> 00:30:27,680 Helpers son estas tarefas, esas cousas como as tarefas. 552 00:30:27,680 --> 00:30:33,890 >> Vai ver que, se volver para o Ficheiro HTML, chamamos cada nas tarefas. 553 00:30:33,890 --> 00:30:35,750 As tarefas non se define no HTML. 554 00:30:35,750 --> 00:30:37,770 É definido no JavaScript. 555 00:30:37,770 --> 00:30:42,610 E Meteor que saber que as tarefas que se cando imos para o Javascript aquí. 556 00:30:42,610 --> 00:30:45,550 Tarefas é este auxiliar. 557 00:30:45,550 --> 00:30:49,830 Helper, pode pensar Lo como unha variable de modelo. 558 00:30:49,830 --> 00:30:51,000 E o que facer tarefas? 559 00:30:51,000 --> 00:30:53,580 Ben, el retorna a lista de valores. 560 00:30:53,580 --> 00:30:56,750 Porque é unha lista, podemos chamar cada nel. 561 00:30:56,750 --> 00:30:58,590 Entón é por iso que chamamos cada un en tarefas. 562 00:30:58,590 --> 00:30:59,730 E agora temos tarefa. 563 00:30:59,730 --> 00:31:02,850 564 00:31:02,850 --> 00:31:03,990 >> Que facer tarefa? 565 00:31:03,990 --> 00:31:07,740 Ben, ten esa frecha aquí despois de as chaves. 566 00:31:07,740 --> 00:31:09,130 Isto significa que é un modelo de tarefa. 567 00:31:09,130 --> 00:31:11,100 Non é un axudante, como o que acabamos de ver. 568 00:31:11,100 --> 00:31:12,872 É un modelo que teña definido. 569 00:31:12,872 --> 00:31:14,080 E onde é que definimos iso? 570 00:31:14,080 --> 00:31:16,950 Definimos abaixo aquí. 571 00:31:16,950 --> 00:31:21,160 >> Todo este modelo fai é facer un elemento da lista, e el chama de texto. 572 00:31:21,160 --> 00:31:24,160 Agora, o texto parece ser un axudante, pero eu vou amosar-lle 573 00:31:24,160 --> 00:31:26,610 que este é, en realidade, aínda membro de datos de tarefas. 574 00:31:26,610 --> 00:31:29,230 575 00:31:29,230 --> 00:31:33,670 Cando chamar cada un, que vai para a estrutura de datos un pouco. 576 00:31:33,670 --> 00:31:39,130 Como o loop foreach, agora só mira no primeiro elemento na nosa obxecto. 577 00:31:39,130 --> 00:31:41,850 Vemos que o texto é definido aquí no noso obxecto. 578 00:31:41,850 --> 00:31:45,350 Entón Meteor é intelixente para saber que estamos a falar sobre este texto, 579 00:31:45,350 --> 00:31:47,630 non o axudante chamado texto. 580 00:31:47,630 --> 00:31:52,120 Ela só queda o valor deste texto aquí e exhibe como HTML, 581 00:31:52,120 --> 00:31:55,475 e é así que os datos van desde o JavaScript para HTML. 582 00:31:55,475 --> 00:32:03,320 583 00:32:03,320 --> 00:32:07,030 >> Movendo-se con todo, neste exemplo nós codificado eses valores. 584 00:32:07,030 --> 00:32:10,440 Meteor fai dous realmente cousas boas para nós. 585 00:32:10,440 --> 00:32:15,050 Ademais da actualización en directo que nós mostrou, tamén xestiona a nosa base de datos. 586 00:32:15,050 --> 00:32:18,750 Se tivese que traballar con PHP, tiña que configurar phpMyAdmin. 587 00:32:18,750 --> 00:32:21,320 Tiña que asegurarse que o seu mesas estaban todas en cheque. 588 00:32:21,320 --> 00:32:24,760 Tiña que facer unha chea de traballo a facer que os seus datos foi formatado correctamente, 589 00:32:24,760 --> 00:32:27,880 e PHP podería comunicarse con el. 590 00:32:27,880 --> 00:32:30,170 >> Agora, Meteor usa un novo paradigma. 591 00:32:30,170 --> 00:32:32,310 Esta é unha forma máis moderna da manipulación de unha base de datos. 592 00:32:32,310 --> 00:32:34,580 É unha tecnoloxía chamada MongoDB. 593 00:32:34,580 --> 00:32:38,740 Así como en JavaScript, vimos que Non importaba o que tipo de datos contiña. 594 00:32:38,740 --> 00:32:39,640 Todo era unha var. 595 00:32:39,640 --> 00:32:40,570 Non foi un charstar. 596 00:32:40,570 --> 00:32:40,930 Non foi un int. 597 00:32:40,930 --> 00:32:41,970 Non foi un struct. 598 00:32:41,970 --> 00:32:44,210 Foi só var iso, var iso. 599 00:32:44,210 --> 00:32:46,320 >> MongoDB funciona especie do mesmo xeito. 600 00:32:46,320 --> 00:32:48,160 Non ten que definir as tabelas. 601 00:32:48,160 --> 00:32:50,860 Non ten que dicir unha mesa ten un nome, que ten un int. 602 00:32:50,860 --> 00:32:54,710 Ten, eu non sei, un dólar, o que é un decimal. 603 00:32:54,710 --> 00:32:58,360 É só estes obxectos JavaScript, todas estas vars, esencialmente. 604 00:32:58,360 --> 00:33:02,780 E iso é realmente un poderoso forma de prototipo seu app. 605 00:33:02,780 --> 00:33:06,190 E é por iso Meteor aproveita iso. 606 00:33:06,190 --> 00:33:11,080 >> Ou tamén para a etapa tres, imos ver o que cambiou. 607 00:33:11,080 --> 00:33:15,480 Mira o HTML Todos, non moito. 608 00:33:15,480 --> 00:33:17,170 CSS non cambiou en nada. 609 00:33:17,170 --> 00:33:22,420 Pero a pequena mudanza que vemos en HTML é que xa cambiou a forma como as tarefas está definido. 610 00:33:22,420 --> 00:33:23,800 Tarefas agora é unha función. 611 00:33:23,800 --> 00:33:25,800 Isto significa que todo tempo queremos chegar tarefas, 612 00:33:25,800 --> 00:33:27,480 nós estamos indo a cabo esta función. 613 00:33:27,480 --> 00:33:29,230 Ela non retorna a función como un valor. 614 00:33:29,230 --> 00:33:33,710 >> Meteor é intelixente para realmente executar o función para ver o que se obteñen. 615 00:33:33,710 --> 00:33:36,650 E el retorna esa cousa chamada tarefas. 616 00:33:36,650 --> 00:33:40,650 Temos definido tarefas na liña un, e é unha colección Mongo. 617 00:33:40,650 --> 00:33:43,170 Mongo está referindo a a base de datos usa Meteor, 618 00:33:43,170 --> 00:33:48,420 e este novo significa só imos facer unha nova colección, chamalo de tarefas. 619 00:33:48,420 --> 00:33:53,540 En MySQL, isto sería equivalente a mirando para as tarefas de mesa chamado. 620 00:33:53,540 --> 00:33:56,350 Mongo ten coleccións, non táboas. 621 00:33:56,350 --> 00:34:00,100 Entón, iso só mira para as tarefas. 622 00:34:00,100 --> 00:34:04,820 >> Agora, modelo no noso auxiliar no molde, todo 623 00:34:04,820 --> 00:34:08,380 que temos que facer para obter toda a tarefas é esa función, atopar 624 00:34:08,380 --> 00:34:11,710 e esta chave baleiro. 625 00:34:11,710 --> 00:34:14,150 Este é máis especial para sintaxe Mongo. 626 00:34:14,150 --> 00:34:16,159 Hai unha abundancia de documentación en liña para saber como 627 00:34:16,159 --> 00:34:19,360 pode facer eficiente e realmente útil Mongo consulta. 628 00:34:19,360 --> 00:34:25,560 Pero algo como iso é bo o suficiente para só atopar todos os datos. 629 00:34:25,560 --> 00:34:30,100 >> Agora, unha das cuestións que se pode ver é que nós nunca realmente engadir datos. 630 00:34:30,100 --> 00:34:35,020 Entón o que ocorre cando nós realmente executar o paso tres? 631 00:34:35,020 --> 00:34:37,550 Imos rapidamente entrar o terceiro paso e executar Meteor. 632 00:34:37,550 --> 00:34:42,870 633 00:34:42,870 --> 00:34:45,650 Repare que eu tiña outra Meteor proxecto en execución en outro lugar, 634 00:34:45,650 --> 00:34:49,110 así Meteor non me gusta diso. 635 00:34:49,110 --> 00:34:52,810 Eu só vou pechar rapidamente para outro Meteor con control C, 636 00:34:52,810 --> 00:34:55,780 ir ao paso tres, e executar Meteor novo. 637 00:34:55,780 --> 00:35:01,070 638 00:35:01,070 --> 00:35:03,180 Teña en conta que está comezando MongoDB porque MongoDB 639 00:35:03,180 --> 00:35:06,370 é unha parte de cada proxecto Meteor. 640 00:35:06,370 --> 00:35:09,190 >> Entón, el di que a miña candidatura ten erros. 641 00:35:09,190 --> 00:35:10,590 Isto é un bo recurso Meteor ten. 642 00:35:10,590 --> 00:35:13,700 El asegura que o seu HTML é ben validado. 643 00:35:13,700 --> 00:35:17,710 Imos examinar rapidamente por que isto pode ser. 644 00:35:17,710 --> 00:35:26,110 Parece que eu teño accidentalmente copiou o código HTML mal. 645 00:35:26,110 --> 00:35:30,610 Se eu salvalo agora, Meteor reiniciar automaticamente o servidor, 646 00:35:30,610 --> 00:35:34,650 e agora a aplicación está a ser executado conforme o esperado. 647 00:35:34,650 --> 00:35:39,220 Observe para solucionar isto, pode simplemente executar o mesmo ficheiro HTML a partir do paso dous, 648 00:35:39,220 --> 00:35:40,380 copia-lo para a etapa tres. 649 00:35:40,380 --> 00:35:43,290 650 00:35:43,290 --> 00:35:45,917 >> Podemos volver ao noso servidor local. 651 00:35:45,917 --> 00:35:47,500 E agora vemos que temos o noso para facer a lista. 652 00:35:47,500 --> 00:35:50,070 Gran, pero é baleiro. 653 00:35:50,070 --> 00:35:54,210 Nós realmente non teñen ningunha tarefas na nosa base de datos Mongo. 654 00:35:54,210 --> 00:35:57,930 Entón imos falar sobre un algunhas formas que podemos facelo. 655 00:35:57,930 --> 00:36:03,240 Se volver para o terminal, que pode pecha-lo e executalo Meteor Mongo. 656 00:36:03,240 --> 00:36:05,320 >> Se está familiarizado coa forma como funciona Meteor, 657 00:36:05,320 --> 00:36:14,100 iso realmente lle dá acceso ao MongoDB completo para Meteor. 658 00:36:14,100 --> 00:36:17,570 Teña en conta que ten que estar en execución Meteoro primeiro para que isto funcione. 659 00:36:17,570 --> 00:36:23,840 Entón, se eu executar este nunha nova pestana, I pode volver para o mesmo directorio. 660 00:36:23,840 --> 00:36:29,040 661 00:36:29,040 --> 00:36:32,570 E agora Meteor funciona moi ben. 662 00:36:32,570 --> 00:36:33,600 Este é un prompt. 663 00:36:33,600 --> 00:36:36,350 664 00:36:36,350 --> 00:36:38,790 Deixe-me facer-lle un pouco maior para que poidamos ver. 665 00:36:38,790 --> 00:36:41,550 Isto parece un pouco diferente do que o que se pode usar para ti 666 00:36:41,550 --> 00:36:42,869 realmente non precisa usar Mongo. 667 00:36:42,869 --> 00:36:45,410 Toda a punto de me aquí é de modo que pode empregar JavaScript. 668 00:36:45,410 --> 00:36:48,250 Pero se está curioso, API Mongo non fai 669 00:36:48,250 --> 00:36:50,730 usar SQL, o Structured Query Language. 670 00:36:50,730 --> 00:36:55,570 Usa a súa propia linguaxe que parece moito con JavaScript. 671 00:36:55,570 --> 00:37:00,520 Moi rapidamente, podemos atopar a táboa a través db.tasks. 672 00:37:00,520 --> 00:37:08,940 E está me dicindo Acontece que, se corremos atopar, 673 00:37:08,940 --> 00:37:13,450 tipo de semellante ao que tivemos con Meteor, podemos subir todos os elementos. 674 00:37:13,450 --> 00:37:17,330 O problema é que nós non realmente ten ningún tarefas definidas. 675 00:37:17,330 --> 00:37:20,600 Por iso, non pode obtelos. 676 00:37:20,600 --> 00:37:22,130 >> Podemos introducir, no entanto. 677 00:37:22,130 --> 00:37:25,170 Así, podemos realizar insert coa inserción de comandos. 678 00:37:25,170 --> 00:37:29,140 E nós só darlle un obxecto, e nós só 679 00:37:29,140 --> 00:37:31,840 comproba se o formato é o que esperamos. 680 00:37:31,840 --> 00:37:35,030 Se miramos para a segunda etapa, vimos que cada tarefa 681 00:37:35,030 --> 00:37:39,590 Era un obxecto cun texto como a clave e calquera que sexa 682 00:37:39,590 --> 00:37:41,640 a súa tarefa era como unha variable. 683 00:37:41,640 --> 00:37:44,680 Así, podemos facer algo aquí. 684 00:37:44,680 --> 00:37:50,160 >> Podemos ter que introducir unha tarefa chamado Veño de Mongo. 685 00:37:50,160 --> 00:37:52,570 E nós, prema Intro, e é executado. 686 00:37:52,570 --> 00:37:56,900 Podemos correr atopar de novo, e nós ver que non é un obxecto aquí. 687 00:37:56,900 --> 00:38:01,810 Mongo atribúe a el un ID, que realmente non se preocupe. 688 00:38:01,810 --> 00:38:06,690 O que é importante para vostede é a datos pór, son os datos que saír. 689 00:38:06,690 --> 00:38:10,500 >> Imos volver ao noso sitio web, e hey, a nosa tarefa cargado. 690 00:38:10,500 --> 00:38:13,987 E podes ver que porque Meteor é moi intelixente 691 00:38:13,987 --> 00:38:16,570 e sempre actualizada para ti, eu Non ten que tocar a páxina. 692 00:38:16,570 --> 00:38:19,160 É cargado automaticamente. 693 00:38:19,160 --> 00:38:23,520 >> Imos realizar algún código en JavaScript aínda para facelo. 694 00:38:23,520 --> 00:38:26,120 Como temos Nó na parte de atrás rematar de realizar fóra JavaScript, 695 00:38:26,120 --> 00:38:29,280 que tamén pode realizar JavaScript directamente nos nosos navegadores. 696 00:38:29,280 --> 00:38:31,970 Podes facelo por un recurso chamado Inspect Element. 697 00:38:31,970 --> 00:38:34,210 Se eu botón dereito sobre un sección da páxina, 698 00:38:34,210 --> 00:38:36,730 hai unha opción chamado Inspect Element. 699 00:38:36,730 --> 00:38:38,840 Se está executando un navegador como Safari, vostede 700 00:38:38,840 --> 00:38:45,430 quizais sexa necesario activar o creador ferramentas antes de chegar a este recurso. 701 00:38:45,430 --> 00:38:46,930 >> O que nos interesa é a consola. 702 00:38:46,930 --> 00:38:48,930 Entón, imos só ir ao consola na parte inferior. 703 00:38:48,930 --> 00:38:52,110 704 00:38:52,110 --> 00:38:55,970 Agora podemos realizar calquera JavaScript aquí, como o JavaScript 705 00:38:55,970 --> 00:38:58,860 arquivos eu mostre no exemplo js. 706 00:38:58,860 --> 00:39:02,040 Pero agora imos ollar para as tarefas. 707 00:39:02,040 --> 00:39:04,955 Podemos correr o noso comando. 708 00:39:04,955 --> 00:39:07,830 E espero que eu vou ser capaz de facer Lo un pouco maior para que todos poidamos ver. 709 00:39:07,830 --> 00:39:14,390 710 00:39:14,390 --> 00:39:18,450 >> Se corrermos tasks.find, e ver que este é exactamente o mesmo código 711 00:39:18,450 --> 00:39:24,840 que os usos ficheiro JavaScript na etapa tres, este task.find. 712 00:39:24,840 --> 00:39:29,100 Podemos realizar o mesmo, e agora temos algunhas cousas estrañas. 713 00:39:29,100 --> 00:39:31,050 Como é que imos realmente obter os datos? 714 00:39:31,050 --> 00:39:34,860 Ben, nós temos que executar este mando chamado buscar. 715 00:39:34,860 --> 00:39:37,150 >> Isto é moi útil para depuración. 716 00:39:37,150 --> 00:39:41,000 O que chegar aquí é un cursor, e isto é 717 00:39:41,000 --> 00:39:44,890 unha boa forma Meteor ten Buscando datos optimizada. 718 00:39:44,890 --> 00:39:48,270 Este cursor ten todas as características para actualización en tempo real e actualizar a páxina 719 00:39:48,270 --> 00:39:49,650 cando algo cambiou. 720 00:39:49,650 --> 00:39:51,280 Pero iso non vai pegar os datos. 721 00:39:51,280 --> 00:39:52,720 Podemos obter os datos a través buscar. 722 00:39:52,720 --> 00:39:56,880 E ve que temos un obxecto, e é como o que tiñamos en Mongo, 723 00:39:56,880 --> 00:40:00,040 cun ID e o texto que poñemos no. 724 00:40:00,040 --> 00:40:04,200 >> Entón, como imos introducir un elemento en Meteor? 725 00:40:04,200 --> 00:40:07,250 Ben, nós só temos tarefas. 726 00:40:07,250 --> 00:40:09,990 E entón podemos executar o mesmo comando de inserción, 727 00:40:09,990 --> 00:40:17,520 dando un dicionario ou un obxecto co mesmo formato, texto 728 00:40:17,520 --> 00:40:22,340 e logo, eu veño da consola. 729 00:40:22,340 --> 00:40:27,240 Bótalle un ollo de enriba, porque cando eu facelo, el mostra-se na páxina web 730 00:40:27,240 --> 00:40:29,660 automaticamente. 731 00:40:29,660 --> 00:40:33,291 >> Teña en conta que pode poñer calquera cousa quere nestes elementos. 732 00:40:33,291 --> 00:40:35,040 El non ten que ten unha estrutura fixa. 733 00:40:35,040 --> 00:40:39,790 Podería ter un igual ao número tres eb igual a false. 734 00:40:39,790 --> 00:40:41,600 E todo funciona. 735 00:40:41,600 --> 00:40:46,000 Podo ata optar por non incluír un texto en todo. 736 00:40:46,000 --> 00:40:48,320 Isto só non se recomenda aínda porque entón Meteor 737 00:40:48,320 --> 00:40:50,920 non vai saber o que mostras. 738 00:40:50,920 --> 00:40:53,110 Pero, en cada caso, nós obter un ID, e iso é 739 00:40:53,110 --> 00:40:54,785 o ID do obxecto que pode usar. 740 00:40:54,785 --> 00:41:01,120 741 00:41:01,120 --> 00:41:03,280 >> A medida que seguimos con etapa catro e paso cinco, 742 00:41:03,280 --> 00:41:06,870 o tutorial pode amosar-lle formas que podes crear elementos de interface de usuario a usar 743 00:41:06,870 --> 00:41:13,130 HTML que sabe crear diferentes tarefas. 744 00:41:13,130 --> 00:41:15,440 Imos ollar para a etapa catro moi rapidamente. 745 00:41:15,440 --> 00:41:18,290 Veremos que nós engadimos unha sección sobre os eventos. 746 00:41:18,290 --> 00:41:20,874 Os modelos poden ter axudantes, que nos Obter datos. 747 00:41:20,874 --> 00:41:22,040 Pero tamén pode chamar a eventos. 748 00:41:22,040 --> 00:41:25,300 E é aí onde o material torna-se útil, porque os eventos 749 00:41:25,300 --> 00:41:28,590 son o que pasa cando fai clic cousas distintas na súa páxina web. 750 00:41:28,590 --> 00:41:33,790 >> Aquí, o noso código está dicindo -Nos para engadir este evento. 751 00:41:33,790 --> 00:41:38,860 Engadir lo cando enviou algo coa clase nova tarefa. 752 00:41:38,860 --> 00:41:41,910 O que ten aquí é un selector CSS. 753 00:41:41,910 --> 00:41:45,870 Entón, iso só mira para un HTML elemento que ten a clase nova tarefa. 754 00:41:45,870 --> 00:41:47,940 E mira para o evento, como enviar. 755 00:41:47,940 --> 00:41:51,050 Outros eventos inclúen prema, pairo, dobre clic, 756 00:41:51,050 --> 00:41:54,450 semellante ao que poñerse en HTML normal. 757 00:41:54,450 --> 00:41:56,770 >> O que dalo aquí agora é unha función. 758 00:41:56,770 --> 00:42:01,210 E pode que o seu código nesa función. 759 00:42:01,210 --> 00:42:06,360 Esta función é a que acaba ficando chamado cando enviar esta nova tarefa. 760 00:42:06,360 --> 00:42:12,170 Imos ollar para o HTML só para que entender o que esta nova tarefa é. 761 00:42:12,170 --> 00:42:15,570 Nós engadimos un formulario aquí coa clase nova tarefa. 762 00:42:15,570 --> 00:42:19,880 E que ten unha entrada que leva o texto. 763 00:42:19,880 --> 00:42:22,605 E este é o lugar onde nós engadirá nosas novas tarefas. 764 00:42:22,605 --> 00:42:25,520 765 00:42:25,520 --> 00:42:29,780 >> Imos correr a etapa catro no sitio para ver o que parece. 766 00:42:29,780 --> 00:42:32,710 Podemos saír por primeira vez do MongoDB tivemos 767 00:42:32,710 --> 00:42:35,300 do noso anterior exemplo con control C. 768 00:42:35,300 --> 00:42:37,690 E imos transformalo en a etapa catro directorio. 769 00:42:37,690 --> 00:42:41,000 770 00:42:41,000 --> 00:42:42,920 Nós correremos Meteor novo para iniciar o servidor. 771 00:42:42,920 --> 00:42:46,850 772 00:42:46,850 --> 00:42:50,510 E, por desgraza, tiven Meteor sendo executado outro terminal. 773 00:42:50,510 --> 00:42:53,080 Entón, eu estou indo só para comproba se esta pechada. 774 00:42:53,080 --> 00:43:01,805 Imos saír desta e de cambio cuarta parte, a etapa catro. 775 00:43:01,805 --> 00:43:02,305 Aceptar. 776 00:43:02,305 --> 00:43:11,220 777 00:43:11,220 --> 00:43:13,250 >> Agora o noso código Meteor está en execución. 778 00:43:13,250 --> 00:43:19,480 E podes ver que actualizado, sen nós nin sequera ter que actualizar a páxina. 779 00:43:19,480 --> 00:43:24,410 O que cambiou aquí é agora que non temos ningún tarefa, 780 00:43:24,410 --> 00:43:29,530 pero temos un formulario aquí, este cadro de texto, para engadir as nosas novas tarefas. 781 00:43:29,530 --> 00:43:31,550 E podemos escribir a nosa tarefa aquí. 782 00:43:31,550 --> 00:43:34,564 Eu veño da páxina HTML. 783 00:43:34,564 --> 00:43:36,105 Ao premer Intro, foi sometido. 784 00:43:36,105 --> 00:43:39,180 785 00:43:39,180 --> 00:43:44,540 >> Podemos ver o que pasou como definidos polo código JavaScript. 786 00:43:44,540 --> 00:43:49,930 O que esta función fixo foi tomar o texto de forma, 787 00:43:49,930 --> 00:43:53,680 e, a continuación, chamado só de tasks.insert, como fixemos na consola. 788 00:43:53,680 --> 00:43:56,410 Eles elixiu engadir unha data createdAt. 789 00:43:56,410 --> 00:43:59,840 Isto é como se fose especifica o tempo actual. 790 00:43:59,840 --> 00:44:03,220 Despois diso, el limpa a forma, facendo Comproba se o valor é unha cadea baleira. 791 00:44:03,220 --> 00:44:06,550 >> E entón el chama voltar false para asegurarse de nada máis pasa. 792 00:44:06,550 --> 00:44:10,350 Cando retornar dunha falsa evento de solicitude, que interrompe a execución. 793 00:44:10,350 --> 00:44:14,520 Digamos que un formulario ten unha acción, como someterse a unha páxina PHP. 794 00:44:14,520 --> 00:44:16,980 Se non tivese retorno falsa, retornar certo. 795 00:44:16,980 --> 00:44:18,500 Sería acabar facendo esta proposta. 796 00:44:18,500 --> 00:44:20,590 Intercepta falsa, e para-lo alí mesmo. 797 00:44:20,590 --> 00:44:23,510 798 00:44:23,510 --> 00:44:28,610 >> Así, foi unha pequena demostración sobre Meteor como funciona, e nós temos 799 00:44:28,610 --> 00:44:30,980 está a seguir o tutorial por un tempo. 800 00:44:30,980 --> 00:44:33,560 E pode sentir por favor libre para continuar facendo isto. 801 00:44:33,560 --> 00:44:37,760 Hai unha abundancia de recursos, e o tutorial é realmente só 802 00:44:37,760 --> 00:44:40,400 moi bo a explicar o que está pasando. 803 00:44:40,400 --> 00:44:44,362 Quero te amosar agora, en os poucos minutos que nos quedan, 804 00:44:44,362 --> 00:44:46,320 o que son algúns dos características máis frías do Meteor, 805 00:44:46,320 --> 00:44:48,772 e cales son algúns dos paquetes máis útiles. 806 00:44:48,772 --> 00:44:51,730 Unha das grandes cousas sobre Meteor é que ten un sistema de paquetes. 807 00:44:51,730 --> 00:44:55,620 Pode facilmente incorporar código que moitos miles de desenvolvedores 808 00:44:55,620 --> 00:44:58,840 escribir en todo o mundo no seu proxecto Meteor. 809 00:44:58,840 --> 00:45:02,410 Un exemplo diso é o que pode facer na etapa nove do tutorial, onde 810 00:45:02,410 --> 00:45:07,435 estás engadir contas ao seu proxecto Meteor. 811 00:45:07,435 --> 00:45:10,010 812 00:45:10,010 --> 00:45:13,690 Se temos un PHP CS50 proxecto, teriamos 813 00:45:13,690 --> 00:45:17,810 a contar co cadro ou o noso propio código para facer 814 00:45:17,810 --> 00:45:20,820 seguro que tratar de forma segura contrasinais e nomes de usuarios 815 00:45:20,820 --> 00:45:23,120 e almacenar a base de datos e todo iso. 816 00:45:23,120 --> 00:45:25,670 >> Acontece Meteor ten algún paquetes para facelo por vostede, 817 00:45:25,670 --> 00:45:29,160 e facelo con moita facilidade. 818 00:45:29,160 --> 00:45:31,950 O que podemos facer é engadir algúns paquetes. 819 00:45:31,950 --> 00:45:37,450 Entón, imos facelo dereito agora na nosa consola. 820 00:45:37,450 --> 00:45:42,460 Vou saír do proxecto e agora entrar en simple Todos. 821 00:45:42,460 --> 00:45:47,450 822 00:45:47,450 --> 00:45:50,050 Agora, simple-Todos é o proxecto que 823 00:45:50,050 --> 00:45:53,500 terá despois de ser feito co paso 11 ou paso 12, 824 00:45:53,500 --> 00:45:55,250 ao final deste tutorial. 825 00:45:55,250 --> 00:45:58,642 E imos rapidamente miralo para ver cales son os diferentes recursos que temos. 826 00:45:58,642 --> 00:46:01,610 Nós só que seguro que está a ser executado. 827 00:46:01,610 --> 00:46:04,400 Ás veces é preciso un tempo para refrescar, pero aquí está. 828 00:46:04,400 --> 00:46:09,710 >> Temos a nosa opción para agochar completar tarefas, e podemos entrar. 829 00:46:09,710 --> 00:46:11,770 E iso foi feito con o paquete Meteor. 830 00:46:11,770 --> 00:46:12,270 É excelente. 831 00:46:12,270 --> 00:46:14,910 Temos agora un usuario e sinal de contrasinal no. 832 00:46:14,910 --> 00:46:19,170 Pero o que se quería engadir outro tipo de mecanismo de login? 833 00:46:19,170 --> 00:46:22,560 Digamos que eu quería facer sesión coa miña conta Meteor. 834 00:46:22,560 --> 00:46:27,270 Vou correr meteoro add, e este é a sintaxe para engadir paquetes. 835 00:46:27,270 --> 00:46:32,160 Podo dicir contas e accounts.meteor. 836 00:46:32,160 --> 00:46:35,720 Vai atopar agora o paquete e cargalo. 837 00:46:35,720 --> 00:46:40,480 Podes ver que eu non teño atopar o nome do paquete certo. 838 00:46:40,480 --> 00:46:42,820 >> Entón, como descubrir sobre os paquetes? 839 00:46:42,820 --> 00:46:46,380 Así, hai un gran sitio, feito dispoñible polo pobo Meteor, 840 00:46:46,380 --> 00:46:47,780 chamado atmospherejs.com. 841 00:46:47,780 --> 00:46:52,520 Atmospherejs, nunha palabra, dot con, é un gran repositorio 842 00:46:52,520 --> 00:46:57,660 para atopar todo o Meteor paquetes no repositorio. 843 00:46:57,660 --> 00:47:05,140 Podo buscar contas, e logo me vai amosar todo o material correspondente, 844 00:47:05,140 --> 00:47:07,320 todos os paquetes co nome da conta. 845 00:47:07,320 --> 00:47:10,180 846 00:47:10,180 --> 00:47:13,270 >> Mentres que carga, podemos tentar a adición de algúns outros paquetes. 847 00:47:13,270 --> 00:47:19,380 Quizais o paquete Meteor non funciona agora, pero podo engadir Facebook. 848 00:47:19,380 --> 00:47:22,860 849 00:47:22,860 --> 00:47:27,190 Podo engadir a conta e, a continuación, realizar o proxecto Meteor novo. 850 00:47:27,190 --> 00:47:33,260 851 00:47:33,260 --> 00:47:36,900 Xa que isto comeza, veremos o que cambiou na web. 852 00:47:36,900 --> 00:47:40,010 853 00:47:40,010 --> 00:47:44,580 Pode see-- puiden ten que actualiza-la aquí. 854 00:47:44,580 --> 00:47:47,320 >> Eu teño un botón para configurar Facebook login. 855 00:47:47,320 --> 00:47:49,765 E aquí, eu teño todo as instrucións de meteoros 856 00:47:49,765 --> 00:47:52,960 preparou para ti para a creación dunha aplicación de Facebook. 857 00:47:52,960 --> 00:47:58,990 E pode usar isto información para engadir os seus IDs. 858 00:47:58,990 --> 00:48:04,130 Unha vez feito isto, vai ter Facebook Entra a traballar no seu app. 859 00:48:04,130 --> 00:48:08,559 >> Eu só vou chegar un ID de aplicación e un segredo, 860 00:48:08,559 --> 00:48:10,100 só para te amosar como iso pode funcionar. 861 00:48:10,100 --> 00:48:16,000 862 00:48:16,000 --> 00:48:20,360 Vai ter unha conta en Facebook para usar as opcións de desenvolvedores de Facebook. 863 00:48:20,360 --> 00:48:31,160 864 00:48:31,160 --> 00:48:35,290 Déixeme só atopar rapidamente a Teclas de meteoro que son necesarias. 865 00:48:35,290 --> 00:48:46,994 866 00:48:46,994 --> 00:48:49,160 Eu teño un outro proxecto Meteor que eu vou usar, 867 00:48:49,160 --> 00:48:55,590 e eu só vou tomar as claves do ficheiro. 868 00:48:55,590 --> 00:49:14,410 869 00:49:14,410 --> 00:49:20,930 >> E xa que eu atopalo, eu vou ser capaz para copiar estas chaves no meu Facebook. 870 00:49:20,930 --> 00:49:23,489 Entón, aquí é unha chave. 871 00:49:23,489 --> 00:49:24,280 E este é o segredo. 872 00:49:24,280 --> 00:49:26,071 Non debe ser compartir isto coa xente. 873 00:49:26,071 --> 00:49:28,870 874 00:49:28,870 --> 00:49:30,910 E entón dá a el o seu segredo app. 875 00:49:30,910 --> 00:49:33,560 E iso é tan Facebook sabe que é vostede. 876 00:49:33,560 --> 00:49:37,630 877 00:49:37,630 --> 00:49:39,080 E gardar a configuración. 878 00:49:39,080 --> 00:49:45,160 879 00:49:45,160 --> 00:49:48,640 >> Creo que no proceso I parar meu app Meteor. 880 00:49:48,640 --> 00:49:52,290 Entón, eu só quero facer seguro de que aínda está alí. 881 00:49:52,290 --> 00:49:54,962 882 00:49:54,962 --> 00:49:58,610 OK, imos facer que o noso servidor Meteor está en execución para que a páxina web está en execución. 883 00:49:58,610 --> 00:50:02,440 Observe se pararmos o Meteor servidor, a páxina aínda está alí. 884 00:50:02,440 --> 00:50:04,700 El só non vai actualizar máis. 885 00:50:04,700 --> 00:50:10,290 O servidor Meteor é necesario para asegurarse de que a páxina é en directo. 886 00:50:10,290 --> 00:50:14,050 >> OK, eu xa o presentou, e agora Podo entrar con Facebook. 887 00:50:14,050 --> 00:50:17,400 Agora é só unha cuestión de ter un pop up Facebook 888 00:50:17,400 --> 00:50:21,710 e poñendo na súa conta información e rexistro no. 889 00:50:21,710 --> 00:50:24,520 890 00:50:24,520 --> 00:50:27,930 Despois de facelo, Facebook pode Nag vostede para un pouco máis de seguridade. 891 00:50:27,930 --> 00:50:29,810 Entón imos deixar por aí. 892 00:50:29,810 --> 00:50:34,110 A cuestión é que cando está feito con iso, vai ter Facebook login. 893 00:50:34,110 --> 00:50:37,850 >> Meteor ten unha morea de outros paquetes tamén. 894 00:50:37,850 --> 00:50:39,200 Pode conectar-se con Google+. 895 00:50:39,200 --> 00:50:40,500 Pode conectar-se con GitHub. 896 00:50:40,500 --> 00:50:42,170 Pode conectar-se con Twitter. 897 00:50:42,170 --> 00:50:44,870 Ou se buscar, vai atopar moitas outras cousas 898 00:50:44,870 --> 00:50:49,170 como Meetup, LinkedIn, e Meteor Developer. 899 00:50:49,170 --> 00:50:53,100 Entón Meteor creador foi o paquete que eu estaba a buscar. 900 00:50:53,100 --> 00:50:56,170 meteoro engadir contas-meteoro polo creador. 901 00:50:56,170 --> 00:51:06,192 902 00:51:06,192 --> 00:51:07,900 Nese medio tempo, eu tamén quero recomendar 903 00:51:07,900 --> 00:51:11,340 algúns outros paquetes para os seus proxectos. 904 00:51:11,340 --> 00:51:14,670 Pode ser útil para incluír o paquete jQuery. 905 00:51:14,670 --> 00:51:17,909 Isto permite que use jQuery nos seus clientes. 906 00:51:17,909 --> 00:51:21,200 Podería facelo só cunha liña, e Meteor vai asegurarse de que está actualizado 907 00:51:21,200 --> 00:51:21,825 en jQuery. 908 00:51:21,825 --> 00:51:24,330 909 00:51:24,330 --> 00:51:27,450 Eu tamén recomendo houston: admin. 910 00:51:27,450 --> 00:51:31,550 >> Isto é como unha especie de phpMyAdmin tipo de ferramenta para a súa MongoDB. 911 00:51:31,550 --> 00:51:33,890 Isto permite que edite seus datos con bastante facilidade 912 00:51:33,890 --> 00:51:37,950 sen ter que ir ao shell Mongo, como se eu tivese feito máis cedo no seminario. 913 00:51:37,950 --> 00:51:43,160 914 00:51:43,160 --> 00:51:47,101 Polo tanto, agora que que está a ser executado, imos realizar Meteoro novo e ver o que podemos facer. 915 00:51:47,101 --> 00:51:56,240 916 00:51:56,240 --> 00:52:00,720 >> Entender que a adición de algúns paquetes pode ter-lles presentar algunhas advertencias. 917 00:52:00,720 --> 00:52:02,720 Non vai ter que preocuparse sobre iso con houston. 918 00:52:02,720 --> 00:52:06,040 919 00:52:06,040 --> 00:52:10,810 Así, podemos agora teñen a posibilidade configurar Meteor administrador. 920 00:52:10,810 --> 00:52:15,080 E eles dan-lle as direccións se quere configurar isto. 921 00:52:15,080 --> 00:52:17,750 922 00:52:17,750 --> 00:52:20,440 >> Tamén podemos agora ir / admin. 923 00:52:20,440 --> 00:52:23,280 Este é trae a vostede polo paquete de Houston. 924 00:52:23,280 --> 00:52:27,470 E este é Meteor interface de administración. 925 00:52:27,470 --> 00:52:30,660 Acaba de crear unha conta de administrador, así. 926 00:52:30,660 --> 00:52:38,150 E se actualizar a páxina, pode ten algunhas coleccións aparecendo. 927 00:52:38,150 --> 00:52:40,980 928 00:52:40,980 --> 00:52:43,460 >> É unha ferramenta moi útil, e eu recomendo encarecidamente. 929 00:52:43,460 --> 00:52:46,717 930 00:52:46,717 --> 00:52:49,050 Podes ver que, por mor houston estaba dando algúns erros, 931 00:52:49,050 --> 00:52:52,330 non temos ningún coleccións aparecendo agora. 932 00:52:52,330 --> 00:52:56,800 A forma como usaría houston é asegurarse de esta función queda 933 00:52:56,800 --> 00:52:58,860 chamado nos seus-Todos simple. 934 00:52:58,860 --> 00:53:01,370 Así, non fai Houston saber o que as miñas tarefas son. 935 00:53:01,370 --> 00:53:04,490 >> Montar un Mongo colección chamada tarefas. 936 00:53:04,490 --> 00:53:11,390 Imos entrar simple-Todos e só asegurarse de que o JavaScript, 937 00:53:11,390 --> 00:53:16,295 nós engadimos tarefas para as nosas coleccións. 938 00:53:16,295 --> 00:53:19,340 939 00:53:19,340 --> 00:53:25,670 Temos agora salvo, e constrúe a aplicación, refrescante. 940 00:53:25,670 --> 00:53:26,750 E veremos. 941 00:53:26,750 --> 00:53:29,090 Agora temos algunhas tarefas. 942 00:53:29,090 --> 00:53:32,630 E podemos engadir algunhas novas tarefas. 943 00:53:32,630 --> 00:53:35,840 Pero, se queremos engadir tarefas, imos facelo co propio app. 944 00:53:35,840 --> 00:53:39,660 945 00:53:39,660 --> 00:53:41,050 >> Agora podemos engadir algúns datos. 946 00:53:41,050 --> 00:53:53,410 Ola, esta é unha tarefa. 947 00:53:53,410 --> 00:53:57,080 Parece medio raro que non estamos a ver ningunha tarefa. 948 00:53:57,080 --> 00:54:00,290 949 00:54:00,290 --> 00:54:05,260 Nós pode querer comprobar se temos calquera erros aquí, ou que noutro lugar. 950 00:54:05,260 --> 00:54:08,810 951 00:54:08,810 --> 00:54:20,260 Ou tamén para admin, que parece raro. 952 00:54:20,260 --> 00:54:24,080 Se tirar o repositorio tras este seminario, 953 00:54:24,080 --> 00:54:27,580 Vou ter a certeza de que simple-Todos traballa con houston. 954 00:54:27,580 --> 00:54:30,370 Desafortunadamente, non parece estar traballando neste exacto momento. 955 00:54:30,370 --> 00:54:34,810 956 00:54:34,810 --> 00:54:37,640 >> Existen outras cuestións? 957 00:54:37,640 --> 00:54:41,800 Houston normalmente é un ferramenta que funciona moi ben. 958 00:54:41,800 --> 00:54:44,510 Houston, en concreto, é un pouco buggier do que os outros, 959 00:54:44,510 --> 00:54:49,470 pero eu recomendo que cando funciona. 960 00:54:49,470 --> 00:54:50,080 Si. 961 00:54:50,080 --> 00:54:52,395 >> Audiencia: O que podes facer co paquete Facebook 962 00:54:52,395 --> 00:54:54,270 xa que o usuario estea conectado co seu Facebook? 963 00:54:54,270 --> 00:54:55,978 >> ROGER ZURAWICKI: Xa un usuario de sesión, 964 00:54:55,978 --> 00:54:59,540 pode facer chamadas a API de Facebook. 965 00:54:59,540 --> 00:55:02,890 Unha morea de que se atopa máis en como Facebook abre a súa API. 966 00:55:02,890 --> 00:55:05,120 Meteor, comproba se ten a conexión. 967 00:55:05,120 --> 00:55:09,300 Pero despois de todo isto é unha cuestión de aprender a usar a API de Facebook. 968 00:55:09,300 --> 00:55:10,216 Audiencia: [inaudível]. 969 00:55:10,216 --> 00:55:17,756 970 00:55:17,756 --> 00:55:18,880 ROGER ZURAWICKI: Todo ben. 971 00:55:18,880 --> 00:55:21,670 Moitas grazas por Neste seminario CS50 en Meteor. 972 00:55:21,670 --> 00:55:24,060 Se ten algunha dúbida, me pode enviar correo-e 973 00:55:24,060 --> 00:55:28,319 no meu enderezo de correo-e enumerados a continuación do seminario. 974 00:55:28,319 --> 00:55:30,110 E eu vou ser feliz para responder ás súas preguntas. 975 00:55:30,110 --> 00:55:33,020 Eu tamén vou estar no CS50 hackathon debería 976 00:55:33,020 --> 00:55:35,550 abonda con proxectos de meteoros. 977 00:55:35,550 --> 00:55:37,650 Grazas por asistir. 978 00:55:37,650 --> 00:55:38,816