1 00:00:00,200 --> 00:00:02,240 Está bien en la ruta de búsqueda. 2 00:00:02,250 --> 00:00:10,050 Así que de nuevo queremos poder tener una búsqueda en barra o simplemente convertirla en la barra diagonal de la página de 3 00:00:10,260 --> 00:00:16,990 inicio y tendremos un formulario que llenaremos el formulario que envíe a esta ruta, que luego hará que una 4 00:00:17,010 --> 00:00:25,040 solicitud sea API excepto esa solicitud tendrá una variable aquí desde el formulario y luego todo lo demás funcionará de la misma 5 00:00:25,050 --> 00:00:27,780 manera podremos dejar esta ruta en paz. 6 00:00:28,230 --> 00:00:30,300 Así que agreguemos eso 7 00:00:32,940 --> 00:00:33,630 en 8 00:00:37,860 --> 00:00:44,160 apt get slash así y comenzaremos por renderizar un formulario al que llamaremos búsqueda. 9 00:00:45,270 --> 00:00:52,890 Así que, a continuación, hagamos que esa vista toque la barra de búsqueda. 10 00:00:52,910 --> 00:00:53,200 MI. J. Sí y tuve 11 00:00:53,220 --> 00:00:53,610 un error tipográfico Tudge views slash search. 12 00:00:56,990 --> 00:01:00,930 MI. J. Sí. 13 00:01:00,950 --> 00:01:01,230 Míralo en un H1. 14 00:01:01,290 --> 00:01:03,280 Busque una pelicula 15 00:01:03,390 --> 00:01:07,850 Y como mencioné lo estamos manteniendo muy, muy barebones aquí. 16 00:01:08,010 --> 00:01:09,940 Sin estilo. 17 00:01:09,960 --> 00:01:12,910 Asegurémonos de ver esto cuando ejecutemos el servidor. 18 00:01:12,930 --> 00:01:14,310 Voy a la ruta de la ruta que veo buscar una película. 19 00:01:14,310 --> 00:01:19,150 Excelente. 20 00:01:19,200 --> 00:01:23,400 Así que construyamos un formulario y agreguemos solo un tipo de entrada igual que el marcador de posición de texto igual al término de búsqueda y 21 00:01:23,400 --> 00:01:24,070 agregaremos otro tipo de 22 00:01:24,300 --> 00:01:25,350 entrada igual a enviar de esa manera. 23 00:01:29,070 --> 00:01:47,160 Entonces, ¿a dónde irá esta forma? 24 00:01:47,160 --> 00:01:54,320 nuestro ajuste de resultados y los resultados a lo largo de todo el proceso se encargarán de manejar la llamada API y luego renderizar una plantilla. 25 00:01:54,330 --> 00:01:55,960 Bien, queremos que se envíe a 26 00:01:56,220 --> 00:02:03,780 Así que eso va a ser resultados de barra de acción y el método simplemente 27 00:02:03,780 --> 00:02:06,370 se pone de manera que 28 00:02:07,110 --> 00:02:19,770 casi todo si echamos un vistazo refrescamos la página, tenemos una forma realmente horrible. Puedo agregar algo aquí pero no se está haciendo nada con esto. 29 00:02:19,770 --> 00:02:29,100 Entonces, incluso si busco Harry Potter y pulso enviar, vi obtener Iowa pero está enviando el formulario correctamente. 30 00:02:29,100 --> 00:02:30,320 Está llegando a los resultados de esta ruta de corte y eso se está viendo en las películas de Iowa y presentando la plantilla de resultados. 31 00:02:30,330 --> 00:02:38,700 Entonces, necesitamos tomar los datos de este formulario y conectarlos a la llamada API. 32 00:02:39,030 --> 00:02:46,270 Entonces, lo primero que debemos hacer es agregar nuestro atributo de nombre para que podamos llamar a esto lo que queramos. 33 00:02:47,280 --> 00:02:53,870 Vamos a llamarlo queery. 34 00:02:53,880 --> 00:03:00,470 No, en realidad eso es un poco confuso. 35 00:03:00,480 --> 00:03:03,180 Entonces, en lugar de eso, simplemente llámenos búsqueda. 36 00:03:03,630 --> 00:03:05,670 Así que recuerda cuándo se realiza esta solicitud cuando enviemos el formulario, se verá así. 37 00:03:05,670 --> 00:03:08,020 Te mostraré en solo un segundo. 38 00:03:08,400 --> 00:03:14,580 Reinicia el servidor. 39 00:03:14,580 --> 00:03:16,880 Entonces nuestros datos, lo que sea que pongamos aquí, se almacenarán y buscarán. 40 00:03:17,130 --> 00:03:18,850 Si volvemos a actualizar, intente algo como: ¿qué otro estado podemos hacer? 41 00:03:19,110 --> 00:03:22,760 Hagamos Wyoming. 42 00:03:23,100 --> 00:03:31,050 Enviar puede ver aquí tenemos la búsqueda es igual a Wyoming. 43 00:03:31,410 --> 00:03:32,890 Nuestro par de valores clave en la cadena de consulta. 44 00:03:33,420 --> 00:03:38,420 Así que eso es todo lo que tenemos que hacer para el formulario. 45 00:03:38,730 --> 00:03:41,220 Luego, dentro de nuestra aplicación en esta ruta, necesitamos acceder 46 00:03:41,310 --> 00:03:44,130 a los datos de esa cadena de consulta e insertarla aquí. 47 00:03:44,160 --> 00:03:53,460 Comencemos simple. 48 00:03:53,460 --> 00:03:54,810 ¿Cómo obtenemos datos de la cadena de consulta? 49 00:03:55,740 --> 00:03:57,630 Bueno, es un punto de solicitud de consulta dot el nombre de la o la clave de 50 00:03:57,630 --> 00:03:59,360 esa información que es la búsqueda que es lo que llamamos guardarlo en una variable. 51 00:03:59,490 --> 00:04:09,630 Imprimámoslo para comenzar. 52 00:04:11,430 --> 00:04:14,210 Siempre me gusta empezar agradable y simple. 53 00:04:14,430 --> 00:04:16,780 Así que vuelvo aquí. 54 00:04:17,490 --> 00:04:20,550 Hagámoslo Montana ahora y puedes ver que Montana se imprima allí. 55 00:04:20,550 --> 00:04:22,030 Entonces, ahora solo se trata de guardar eso en una variable. 56 00:04:22,230 --> 00:04:28,530 Así que lo llamaremos "lo que llamamos queery es igual a naufragio que búsqueda consultada". 57 00:04:28,530 --> 00:04:35,700 Entonces, lo que podríamos hacer es simplemente hacer más consultas allí mismo y eso simplemente agregará nuestra 58 00:04:35,700 --> 00:04:44,350 consulta de búsqueda de una manera más fácil o más limpia, en mi opinión al menos es hacer que aurl 59 00:04:44,820 --> 00:04:53,550 sea variable y concatenarlas de esta manera para que tengamos una solicitud más corta. que hacemos aquí, solo solicitamos que salgas. 60 00:04:53,640 --> 00:05:02,760 Así que estamos preguntando al rector de consultas sobre la búsqueda, así que sea lo que sea que el usuario tipeó en 61 00:05:02,760 --> 00:05:10,530 el formulario o agarrando que Montana en este caso guarda eso en esta variable y luego reconstruye usted 62 00:05:10,620 --> 00:05:17,790 sabe que todo lo que va a parecer es HTP colon slash slash OAM desviarse aquí . 63 00:05:17,790 --> 00:05:23,850 El signo de interrogación punto com barra s es igual a lo que escribió el usuario en ese formulario. 64 00:05:23,880 --> 00:05:27,230 Y luego estamos usando eso que eres. 65 00:05:27,270 --> 00:05:33,670 Y eso es. 66 00:05:34,440 --> 00:05:36,190 Así que demos una oportunidad para ir a nuestro formulario y buscar Florida y lo que sabe que obtenemos 10 resultados en Florida. 67 00:05:36,600 --> 00:05:37,590 Inténtalo de nuevo esta vez, hagamos otro estado. 68 00:05:37,590 --> 00:05:52,350 Alabama. 69 00:05:53,270 --> 00:05:58,440 Increíble. 70 00:05:58,530 --> 00:06:03,110 Entonces, lo siguiente que podríamos hacer es agregar algunas mejoras menores. 71 00:06:03,120 --> 00:06:04,010 Cualquier cosa es una 72 00:06:04,530 --> 00:06:09,960 mejora, supongo, pero lo más importante que estoy pensando no es la interfaz de usuario, sino que estoy pensando en mostrarte usando más datos. 73 00:06:09,970 --> 00:06:17,160 Así que no estamos usando el año en que no necesitamos el tipo, solo usemos el año. 74 00:06:17,160 --> 00:06:19,920 Así que vamos a hacer el título de la película Dasch del año, 75 00:06:19,980 --> 00:06:26,030 que debería ser lo suficientemente simple, y nos gustaría que Look parezca el año de la película, así que nos salvará, ya que puedes ver aquí que tenemos el año. 76 00:06:26,190 --> 00:06:34,420 Y también agreguemos en negrita el título de la película o en cursiva el año cualquiera. 77 00:06:34,610 --> 00:06:45,030 Hagamos esto un poco más limpio aquí. 78 00:06:45,570 --> 00:06:54,150 Creo que técnicamente deberíamos agregar UL y 79 00:06:55,050 --> 00:06:57,670 todo eso. 80 00:06:58,220 --> 00:07:03,270 DE ACUERDO. 81 00:07:07,530 --> 00:07:09,420 Y estamos haciendo el título y haremos que 82 00:07:09,960 --> 00:07:11,050 el título sea demasiado 83 00:07:11,430 --> 00:07:15,240 fuerte y también podemos aplicar esto para que sea más fácil ver lo que está sucediendo. 84 00:07:18,020 --> 00:07:21,020 Todo bien. 85 00:07:26,970 --> 00:07:33,040 Así que echemos un vistazo. 86 00:07:34,320 --> 00:07:36,280 Aquí vamos. 87 00:07:36,810 --> 00:07:40,540 Ahora enloquecemos a Sweet Home Alabama en negrita y luego el año que no es audaz. 88 00:07:40,590 --> 00:07:41,040 Todo bien. 89 00:07:41,040 --> 00:07:46,630 Así que una última cosa realmente menor. 90 00:07:47,070 --> 00:07:47,800 Pero simplemente agreguemos un botón Atrás. 91 00:07:47,880 --> 00:07:50,610 Así que una etiqueta que desee que ref sea igual a barra simplemente busque nuevamente. 92 00:07:50,610 --> 00:07:53,410 Me gusta eso. 93 00:07:53,700 --> 00:08:03,690 Y ahora podemos buscar de nuevo. 94 00:08:04,230 --> 00:08:05,870 DE ACUERDO. 95 00:08:06,420 --> 00:08:08,140 Uno mas. 96 00:08:08,640 --> 00:08:08,930 Lo que se dice es otro estado que podríamos usar. 97 00:08:08,940 --> 00:08:10,230 Oh, probemos en Nueva York. 98 00:08:10,260 --> 00:08:12,150 Entonces tenemos un espacio y cuando lo presentamos notamos que 99 00:08:12,180 --> 00:08:14,080 automáticamente tiene un signo más que agrega su nuevo plus. 100 00:08:14,100 --> 00:08:23,730 York y eso es lo que se está haciendo de. 101 00:08:23,730 --> 00:08:24,100 O eso es con lo que se está haciendo la solicitud. 102 00:08:24,100 --> 00:08:26,910 Así que eso es todo por ahora. 103 00:08:26,920 --> 00:08:29,610 Así que solo para reiterar los puntos clave solo una ruta regular. 104 00:08:29,700 --> 00:08:31,220 Estamos simplemente pegando la solicitud dentro de ella. 105 00:08:31,590 --> 00:08:35,850 Cuando se realiza esa solicitud, estamos procesando una plantilla. 106 00:08:36,060 --> 00:08:38,070 La otra cosa que es importante es en las partes inferiores 107 00:08:38,070 --> 00:08:42,310 porque cuando conviertes esa cadena en un objeto javascript que podemos usar y lo último que queda es que estamos creando una dinámica. 108 00:08:42,870 --> 00:08:48,330 Entonces, no siempre es California, Iowa o lo que sea. 109 00:08:48,330 --> 00:08:53,060 Ahora estamos agregando las consultas del usuario provenientes de la cadena de consulta del formulario. 110 00:08:53,130 --> 00:08:56,250 Nuestra 111 00:08:56,250 --> 00:09:01,610   112 00:09:01,680 --> 00:09:02,030