1 00:00:00,270 --> 00:00:04,500 Al final del último video, mencioné que vamos a presentar una nueva estructura 2 00:00:04,500 --> 00:00:09,300 de carpetas, así que vamos a empezar creando primero las carpetas y los archivos correctos. 3 00:00:09,330 --> 00:00:14,350 Así que voy a ir a sublime y voy a hacer mi nuevo archivo para cada equipo. 4 00:00:14,580 --> 00:00:18,700 Simplemente será nuestro archivo HTML principal y lo llamaré indexado. 5 00:00:18,720 --> 00:00:23,690 H Tim L y yo tenemos una carpeta para eso. Estoy llamando para hacer un proyecto de lista. 6 00:00:23,790 --> 00:00:32,130 Así que indexe ese HD M-L y luego lo agregaremos en nuestro boilerplate de correo H-2 básico y lo llamaré lista de tareas 7 00:00:32,850 --> 00:00:33,790 y lo guardaré. 8 00:00:34,380 --> 00:00:37,200 Y luego vamos a hacer algunos directorios nuevos. 9 00:00:37,680 --> 00:00:44,130 Y voy a hacer eso desde el buscador para que pueda hacer clic derecho y hacer una nueva carpeta. 10 00:00:44,130 --> 00:00:50,270 Puedes hacer un cambio de comando y también puedes hacerlo desde adentro de sublime. 11 00:00:50,400 --> 00:00:58,680 Si ingresas en un archivo nuevo y lo guardas, puedes hacer clic en una nueva carpeta. Sin embargo, al crear 12 00:00:58,680 --> 00:01:06,120 la nueva carpeta vamos a crear una carpeta llamada assets y luego dentro de assets vamos a hacer 13 00:01:06,180 --> 00:01:12,720 dos carpetas one para J. S. y otro para nosotros 14 00:01:13,740 --> 00:01:19,360 Y finalmente, en vez de J. S. vamos a hacer otra carpeta llamada lib. 15 00:01:19,830 --> 00:01:28,950 sublime simplemente arrastrando todo el proyecto de esta manera, puede ver que nuestra estructura ahora es para hacer este proyecto y 16 00:01:28,950 --> 00:01:37,620 tenemos un índice que h t m l y luego tenemos un directorio de activos en lugar de activos. 17 00:01:37,620 --> 00:01:41,120 Entonces, si abro toda esta estructura dentro de 18 00:01:41,220 --> 00:01:46,700 Tenemos C Ss y tenemos javascript y en lugar de javascript tenemos un directorio lib. 19 00:01:46,860 --> 00:01:52,770 Así que pondremos nuestra hoja de estilos en lugar del directorio C S S y en lugar de J. S. vamos a poner nuestro propio javascript 20 00:01:52,770 --> 00:01:58,520 personalizado donde escribimos la consulta de jey y dentro de lib es donde vamos a agregar. 21 00:01:58,790 --> 00:02:01,520 Consultar en sí mismo el archivo de consulta J real. 22 00:02:01,800 --> 00:02:02,980 Entonces comenzaremos allí. 23 00:02:03,120 --> 00:02:05,310 Vamos y asegúrate de tener una consulta. 24 00:02:05,580 --> 00:02:11,550 CDN porque este es un proyecto más serio, vamos a descargar la versión comprimida más reciente. 25 00:02:11,550 --> 00:02:17,540 Así que solo voy a ir a Jay Querrey dot com y en lugar de hacer un 26 00:02:17,640 --> 00:02:22,850 Entonces, aquí está la producción comprimida 2. 0 1. 4. 27 00:02:23,430 --> 00:02:28,950 Y luego voy a encontrar ese archivo y simplemente agregarlo a mis activos. 28 00:02:29,010 --> 00:02:36,870 J. S. lib simplemente agregar eso así y ahora voy a ir al enlace correcto. 29 00:02:36,880 --> 00:02:39,520 El interior de mi proveedor. 30 00:02:39,870 --> 00:02:43,350 Entonces en mi HMO necesito agregar una etiqueta de script. 31 00:02:44,250 --> 00:02:53,190 Y el camino para llegar es activos J. slash. S. slash lib slash Jay se apresuró a señalar un punto para el dolmen. 32 00:02:53,650 --> 00:02:54,500 Sí. 33 00:02:54,570 --> 00:03:06,130 Así que hagámoslo ahora, escriba el tipo de script porque el origen de JavaScript es igual a los activos, barra J. S. slash lib slash. 34 00:03:06,480 --> 00:03:10,370 Jay query dash 2. 1 punto, un punto, cuatro hombres 35 00:03:10,620 --> 00:03:15,300 Ese es un nombre de archivo sí largo para llegar, pero guarda esto. 36 00:03:15,510 --> 00:03:18,300 Y vamos a abrirlo en un navegador para comenzar. 37 00:03:18,300 --> 00:03:23,130 Así que vaya a buscar nuestro estudio de índice cada vez que lo abra. 38 00:03:23,160 --> 00:03:24,620 No tenemos nada que ver 39 00:03:24,870 --> 00:03:27,780 Pero si voy aquí, escribo una consulta. 40 00:03:27,780 --> 00:03:29,180 Las cosas están funcionando bien. 41 00:03:29,400 --> 00:03:34,550 También pude probar haciendo esto seleccionando el cuerpo y eso también funciona. 42 00:03:34,560 --> 00:03:36,620 Entonces eso significa que estamos listos para irnos. 43 00:03:36,690 --> 00:03:42,360 A continuación, centrémonos en obtener nuestra hoja de estilos y nuestro propio archivo JavaScript personalizado incluido. 44 00:03:42,360 --> 00:03:44,660 Así que vamos a hacer la hoja de estilos primero. 45 00:03:44,760 --> 00:03:53,490 Así que hagamos un nuevo archivo y guárdelo, y lo llamaré estilos que C-s usaremos y voy a entrar en 46 00:03:53,490 --> 00:03:59,890 mis activos, ver SS y, de hecho, ser coherentes, hagamos con Dewes con SS. 47 00:04:00,090 --> 00:04:09,810 Así que para hacer cosas C Ss dentro de nuestro directorio de activos C Ss y guardar y agreguemos algo como fondo de cuerpo 48 00:04:10,140 --> 00:04:12,820 morado del cual nos libraremos por completo. 49 00:04:13,020 --> 00:04:20,100 Pero solo para asegurarnos de que funciona y luego veremos aquí y agreguemos la etiqueta vinculada 50 00:04:20,130 --> 00:04:29,910 y luego agreguemos la ruta correcta, que es activos, barra C. Barra diagonal a Dewes dot C Ss y guardaremos y actualizaremos, y 51 00:04:30,750 --> 00:04:35,100 podrá ver que nuestra hoja de estilo ahora está conectada correctamente. 52 00:04:35,100 --> 00:04:39,310 Lo último que vamos a hacer es obtener nuestro propio archivo JavaScript personalizado. 53 00:04:39,420 --> 00:04:45,150 Así que voy a hacer un nuevo archivo y guardarlo y llamaremos a este para hacer Scott J. S. y ahí es donde vamos a 54 00:04:45,150 --> 00:04:49,290 escribir el código real que hará que nuestra lista de tareas funcione. 55 00:04:49,320 --> 00:04:53,250 Entonces eso debería ir dentro de los activos. 56 00:04:53,280 --> 00:04:54,780 J. S. y eso es. 57 00:04:54,780 --> 00:04:59,960 Así que no lo ponemos en lib, porque lib es donde vamos a poner código externo 58 00:05:00,080 --> 00:05:05,870 y bibliotecas como Jay Querrey. Así que vamos a ponerlo en JS y guardar nuestra estructura así. 59 00:05:05,930 --> 00:05:10,310 Los activos CSSA debemos usar en lugar de J. S. Tenemos un directorio lib que tiene una consulta J y tenemos el nuestro para hacerlo. 60 00:05:10,560 --> 00:05:14,830 J. S. en lugar de la carpeta G-S y los votos, agrega una alerta simple conectada y guarda. 61 00:05:14,860 --> 00:05:23,820 Ahora regrese a nuestro correo HQ y agregue 62 00:05:23,850 --> 00:05:31,110 otra etiqueta de secuencia de comandos y esta vez vamos a agregar fuente igual a activos barra J. S. barra para hacer sí y guardar. 63 00:05:31,110 --> 00:05:39,170 Y ahora veamos qué ocurre cuando actualizamos y recibimos nuestra alerta conectada. 64 00:05:39,540 --> 00:05:45,130 que presentaremos otro archivo que necesitamos colocar una vez que hablemos de Funt. 65 00:05:46,260 --> 00:05:51,420 De acuerdo, entonces tenemos la estructura de carpetas configurada correctamente, por lo 66 00:05:51,420 --> 00:05:53,470 Impresionante que es una biblioteca de CSSA. 67 00:05:53,480 --> 00:05:56,180 Básicamente es un grupo de íconos que podemos incluir. 68 00:05:56,190 --> 00:05:58,770 Por lo tanto, volveremos a esta estructura de carpetas y la agregaremos en el video futuro. 69 00:05:58,770 --> 00:06:02,980 Por ahora eso es todo lo que tenemos que hacer en el próximo video. 70 00:06:03,000 --> 00:06:05,240 Nos enfocaremos en escribir algún código 71 00:06:05,250 --> 00:06:06,620