1
00:00:00,120 --> 00:00:05,250
Ahora que han escuchado mi introducción a Jay Cory, así como mi propia opinión sobre la enseñanza de la

2
00:00:05,430 --> 00:00:11,250
consulta de Jay y el enfoque que estamos tomando aquí, que resumir brevemente es que comenzamos con javascript y ahora que estamos

3
00:00:11,760 --> 00:00:15,130
seguros de hacer las cosas de esa forma nos moveremos hacia Jay Querrey.

4
00:00:15,510 --> 00:00:20,770
Entonces, lo primero que tenemos que hablar es cómo incluimos una consulta en una aplicación.

5
00:00:20,880 --> 00:00:26,430
Así que voy a comenzar con una aplicación muy simple aquí solo añadiendo mi edad a la boca y le

6
00:00:26,430 --> 00:00:27,250
doy un título.

7
00:00:27,370 --> 00:00:28,310
Jay queery demo

8
00:00:30,840 --> 00:00:33,390
Jay en Jay queery siempre es minúscula.

9
00:00:33,450 --> 00:00:37,990
No me preguntes por qué Q es mayúscula en pocos elementos.

10
00:00:38,030 --> 00:00:38,310
J.

11
00:00:38,310 --> 00:00:39,380
Demostración de Corey.

12
00:00:39,870 --> 00:00:46,710
Solo así y tal vez un aliado o dos y estos solo serán texto aleatorio.

13
00:00:47,100 --> 00:00:49,980
OK, así que tres aliados, etc. tú.

14
00:00:50,040 --> 00:00:52,440
Y H-1 y guardará.

15
00:00:52,710 --> 00:00:55,920
Y, por supuesto, vamos a seguir adelante y abrir eso en el navegador.

16
00:00:56,580 --> 00:00:58,960
Y aquí está nuestra página de demostración.

17
00:00:59,190 --> 00:01:04,220
Hay algunas maneras de agregar una consulta a nuestra propia aplicación y a nuestros propios archivos html de edad.

18
00:01:04,440 --> 00:01:07,140
Recuerde que la consulta J es solo un archivo javascript.

19
00:01:07,230 --> 00:01:10,080
No es diferente a los archivos que hemos escrito hasta ahora.

20
00:01:10,080 --> 00:01:13,320
Como nuestro juego de color esquivar A-S o nuestra lista de cosas por hacer.

21
00:01:13,410 --> 00:01:18,570
Sí o cualquier archivo javascript que hayamos creado y vinculado utilizando una etiqueta de script.

22
00:01:18,570 --> 00:01:21,990
Entonces, en ambos métodos, aquí estamos usando una etiqueta de script.

23
00:01:21,990 --> 00:01:24,900
La única diferencia es el atributo fuente.

24
00:01:25,080 --> 00:01:30,600
código para una consulta y lo colocaron en el mismo directorio que mi proyecto y luego lo vinculé.

25
00:01:30,600 --> 00:01:36,020
Y en este caso estamos vinculando el archivo localmente y lo que eso significa es que descargué el

26
00:01:36,120 --> 00:01:43,530
Así que le mostraré cómo lo hacemos si vamos a la documentación de J Crew y hacemos clic en descargar y luego tenemos que elegir una

27
00:01:43,530 --> 00:01:49,740
versión y voy a ir con la última, que es 2. 1 punto 4 y tenemos algunas

28
00:01:49,740 --> 00:01:50,460
opciones.

29
00:01:50,550 --> 00:01:56,700
Podemos descargar la producción comprimida Jey query 2. 0 punto 1. 4 y la versión de desarrollo sin comprimir.

30
00:01:57,180 --> 00:01:58,500
Voy a hacer ambas cosas.

31
00:01:58,500 --> 00:02:03,330
Por lo general, simplemente hago esto porque está comprimido, el punto es que es más rápido de cargar.

32
00:02:03,630 --> 00:02:05,380
Pero sí quiero mostrarte cómo se ve.

33
00:02:05,550 --> 00:02:09,960
Así que voy a obtener el descomprimido y el comprimido y puedes ver si obtenemos

34
00:02:09,960 --> 00:02:10,860
dos archivos diferentes.

35
00:02:10,860 --> 00:02:17,820
Tenemos Jay queery para señalar un punto para Dot J. S. y tenemos J consultado 2. 1 por ciento para los hombres.

36
00:02:18,030 --> 00:02:19,080
Sí.

37
00:02:19,080 --> 00:02:22,310
Así que voy a abrir ambos en sublime aquí.

38
00:02:22,530 --> 00:02:26,880
Solo arrástralos y echemos un vistazo a ellos.

39
00:02:26,970 --> 00:02:29,720
Entonces este archivo aquí es la versión sin comprimir.

40
00:02:29,970 --> 00:02:31,810
Y a medida que avanzo.

41
00:02:32,310 --> 00:02:35,730
Tenga en cuenta que es solo un archivo javascript realmente largo.

42
00:02:36,000 --> 00:02:44,730
Son más de 9000 líneas, por lo que podemos incluir este archivo o podemos incluir la versión minimizada, que es el mismo código detrás

43
00:02:44,730 --> 00:02:50,160
de las escenas, pero cuando se minimiza o comprime algo, se eliminan todos los espacios

44
00:02:50,160 --> 00:02:50,730
en blanco.

45
00:02:50,730 --> 00:02:56,940
Así que todo esto devuelve todos los comentarios se han ido y todos los nombres de

46
00:02:56,940 --> 00:03:06,150
variables y propiedades se acortan a caracteres individuales para que pueda ver que tenemos cosas como em o tenemos cosas como ABC que definitivamente

47
00:03:06,150 --> 00:03:12,630
no son los nombres de las propiedades y argumentos dentro si el archivo descomprimido para que podamos

48
00:03:12,630 --> 00:03:13,320
incluir uno.

49
00:03:13,500 --> 00:03:17,580
Y para hacer eso, solo debemos asegurarnos de agregar los archivos al directorio correcto.

50
00:03:17,940 --> 00:03:22,540
Así que voy a hacer una nueva carpeta en lugar de mi proyecto y la llamaré lib.

51
00:03:22,710 --> 00:03:24,650
Y no tenemos que hacer esto.

52
00:03:24,690 --> 00:03:30,780
Podríamos arrastrar nuestros dos archivos para estar en el mismo directorio que nuestro equipo h.

53
00:03:30,780 --> 00:03:33,100
Archivaré y comenzaré con eso de esa manera para mostrarte.

54
00:03:33,330 --> 00:03:41,730
Así que voy a abrir mi archivo H Tim L y agregar una secuencia de comandos aquí. Necesito fuentes iguales

55
00:03:41,760 --> 00:03:50,130
y necesito escribir este nombre aquí, que es una consulta J para señalar un punto para Dot J y lo

56
00:03:50,130 --> 00:03:50,740
necesitamos guión.

57
00:03:50,760 --> 00:03:55,750
Así que voy a copiarlo y simplemente establecer el origen de una consulta guión 2. 1. 4.

58
00:03:55,780 --> 00:03:56,050
J.

59
00:03:56,060 --> 00:04:04,560
Sí, siempre y cuando este archivo de la demo de J Curry esté en el mismo lugar que Jay Querrey 2. 1 14: 4 deberíamos estar

60
00:04:04,890 --> 00:04:05,760
bien.

61
00:04:06,030 --> 00:04:11,670
Así que lo guardaré y abriré de nuevo en el navegador y actualizaré.

62
00:04:11,790 --> 00:04:17,150
Si abrimos la consola, podemos escribir la palabra J Query y presionar enter.

63
00:04:17,250 --> 00:04:22,050
Y si no obtenemos un error que nos indique que la consulta se agregó correctamente a nuestra aplicación.

64
00:04:22,560 --> 00:04:29,370
para que no los confundamos y no sobrecarguemos nuestro directorio. estructura por lo que no es obligatorio en absoluto.

65
00:04:29,370 --> 00:04:35,640
Entonces, una mejor forma de estructurar esto es colocarlos en un directorio separado llamado lib para que

66
00:04:35,640 --> 00:04:40,350
podamos separar nuestros propios archivos javascript de los archivos javascript de la biblioteca

67
00:04:40,350 --> 00:04:42,220
Como viste, Jay tenía una consulta funcionando.

68
00:04:42,540 --> 00:04:46,320
Pero una mejor manera de hacerlo es crear un directorio y podemos llamarlo de esta forma.

69
00:04:46,440 --> 00:04:48,320
Podría llamarlo curva J si quisiera.

70
00:04:48,480 --> 00:04:51,820
Voy a ir con lib y luego tengo que cambiar mi enlace aquí.

71
00:04:51,840 --> 00:04:59,330
Mi fuente será lib slash. Jay query se apuntó para apuntar un punto cuatro y yo haré el mío.

72
00:04:59,550 --> 00:05:01,140
Sí y no tienes que hacer eso.

73
00:05:01,140 --> 00:05:03,660
No hay diferencia en la funcionalidad.

74
00:05:03,660 --> 00:05:07,980
La única diferencia es que esto es más rápido de cargar, pero necesito tenerlo aquí.

75
00:05:08,220 --> 00:05:10,350
Entonces, para reiterar, no los necesitamos a los dos.

76
00:05:10,380 --> 00:05:13,810
Solo necesitamos uno y debemos vincularlo correctamente.

77
00:05:14,250 --> 00:05:15,670
Entonces, verifiquemos que funcionó.

78
00:05:15,710 --> 00:05:18,660
Si actualizo la frecuencia, eso funciona bien.

79
00:05:18,720 --> 00:05:24,390
Puede escribir la consulta J y también podemos escribir el signo de dólar y, si funcionan, sabemos que la consulta de

80
00:05:24,390 --> 00:05:25,680
la hoja está instalada correctamente.

81
00:05:26,070 --> 00:05:31,640
Esa es la primera forma en que podemos descargar una consulta localmente y luego vincularla con la etiqueta de script.

82
00:05:31,840 --> 00:05:38,310
Sin embargo, existe otra opción, que consiste en utilizar un CD en un CD y significa red distribuida de

83
00:05:38,760 --> 00:05:44,640
contenido y pensar en ello como una forma de tomar un archivo de Internet sin tener que

84
00:05:44,640 --> 00:05:45,750
descargarlo en su máquina.

85
00:05:45,810 --> 00:05:52,410
Así que te mostraré si solo copiamos este Arel aquí, que es AJ queery CDN para la versión

86
00:05:52,410 --> 00:05:53,680
2. 0 1. 4.

87
00:05:53,770 --> 00:05:58,660
Y si voy a esa URL, verá que es solo el archivo J Corey aquí.

88
00:05:58,920 --> 00:06:04,380
hay muchos de ellos en línea y que funcionarán de la misma manera que enlazando el archivo aquí localmente.

89
00:06:04,380 --> 00:06:09,850
Lo que podemos hacer es vincular a este tu Arel o cualquier otro CD de J queery y sabes que

90
00:06:09,870 --> 00:06:14,850
La única diferencia es que esto se cargará un poco más rápido porque es

91
00:06:15,360 --> 00:06:20,410
local en nuestra computadora y si lo reemplazamos con el CD, entonces no lo notaremos.

92
00:06:20,530 --> 00:06:25,800
Pero bajo el paraguas tarda un poco más pero, por supuesto, es mucho más fácil y simple de usar

93
00:06:25,920 --> 00:06:30,430
porque no tenemos que descargar una copia de la consulta de Jay para cada aplicación que hacemos.

94
00:06:30,780 --> 00:06:33,010
Así que refrescaré.

95
00:06:33,750 --> 00:06:37,350
Y si escribimos la consulta J aquí todavía debería funcionar y lo hace.

96
00:06:37,770 --> 00:06:40,190
Por último, te mostraré cómo encontré ese CDN.

97
00:06:40,230 --> 00:06:47,580
Simplemente abra una nueva pestaña y busque Cdn Jay queery y si solo hacemos una búsqueda de Cdn y luego

98
00:06:47,580 --> 00:06:50,770
cualquier otra biblioteca que verá algunas otras más adelante.

99
00:06:50,810 --> 00:06:52,110
Mike J consulta.

100
00:06:52,110 --> 00:06:53,650
Verás que obtenemos un montón de enlaces.

101
00:06:53,850 --> 00:06:55,850
Entonces la consulta de Jay tiene una oficial.

102
00:06:55,860 --> 00:07:02,100
Está el Cdn Dodge City NJ s punto com y tenemos muchos de ustedes aquí que podemos copiar.

103
00:07:02,910 --> 00:07:07,040
Tendríamos que prestar atención a la versión, así que esto es para 3. 00.

104
00:07:07,200 --> 00:07:14,210
Si vamos a 2. 20 punto 4 nos da un descomprimir la versión normal y una versión modificada.

105
00:07:14,470 --> 00:07:17,090
Y solo para mostrarte si voy a eso, estás bien.

106
00:07:17,310 --> 00:07:18,720
Los veo en un archivo de archivo.

107
00:07:19,110 --> 00:07:20,490
Entonces para terminar.

108
00:07:20,700 --> 00:07:22,130
De cualquier manera funciona.

109
00:07:22,230 --> 00:07:28,440
Necesitamos una etiqueta de secuencia de comandos en ambos casos, pero la fuente será un archivo local o un archivo

110
00:07:28,440 --> 00:07:32,000
alojado en algún lugar al que estamos vinculando utilizando un CDN.

111
00:07:32,100 --> 00:07:36,870
Lo último que desea hacer es darle una rápida vista previa de 30 segundos de cómo se ve la corte.

112
00:07:37,110 --> 00:07:39,930
Así que aquí hay un poco de cómo se ve la consulta J

113
00:07:39,930 --> 00:07:45,300
Lo primero que puede notar es que hay un signo de dólar que se usa en cuatro lugares diferentes.

114
00:07:45,300 --> 00:07:51,480
Tenemos un montón de métodos, como el clic de Dom, que hacen que SS dot fade out dot remove.

115
00:07:51,690 --> 00:07:57,900
Entonces, lo que este código realmente hará es seleccionar un botón con el activador de ID y cuando se hace clic

116
00:07:57,900 --> 00:08:04,350
ejecuta todo este código y cuando se hace clic vamos a cambiar el color de fondo del cuerpo para que sea amarillo.

117
00:08:04,980 --> 00:08:08,290
Vamos a desvanecer todas las imágenes en la página.

118
00:08:08,370 --> 00:08:13,470
Tardará 3 segundos desvanecerlos y luego, cuando termine el fundido, eliminaremos esas

119
00:08:13,470 --> 00:08:15,340
tres imágenes de la página.

120
00:08:15,750 --> 00:08:18,380
Entonces haz clic en el botón con el disparador IDF.

121
00:08:18,390 --> 00:08:23,580
Cambia las imágenes de fundido del color del cuerpo en tres segundos y luego quita las imágenes cuando terminen.

122
00:08:23,970 --> 00:08:26,640
Muy bien, así que era la vista previa de velocidad de una consulta.

123
00:08:26,730 --> 00:08:29,100
Ahora empecemos a escribir algunos en el próximo video.
