Domina Angular 2 - Parte 1 - Inicio rápido

1. Introducción a la angular 2 2: ¿ están usando angulares a? ¿ Y ya? Si no lo eres, deberías serlo. Y déjame explicarte por qué deberías serlo. En primer lugar, puedes hacer cosas fantásticas con él. Mira estos ejemplos que tengo en hecho con punto angular com. Tenemos Enciclopedia Britannica, Wolfram l para tenemos el Canal del Clima, tenemos hasta trabajo. Esa es una grande. No sabía que eso existiera. Tenemos socios de Google, y por supuesto, Google lo usaría porque como que lo inventaron. ¿ Y por qué toda esta gente cambiando a angular? ¿ Qué tiene de genial? Bueno, angular es simplemente un framework JavaScript, pero lo que hace es que toma todas esas funciones que tendríamos que programar en JavaScript y las hace mucho más fáciles de usar como desarrollador. Lo que significa que puedes hacer más cosas. Puedes hacer cosas más geniales. Y bueno, como se puede ver aquí, se puede hacer mucho más cosas snazzy. Esto realmente es una especie de la tercera. Se aireación fuera de la Web de tres puntos. Ah, si quieres. Y voy a tener derechos de autor eso porque acabo de llegar a eso ahora mismo, ¿ verdad? Entonces lo que es genial de angular también es que es algo que usamos para crear una aplicación de una sola página . Ahora, ¿qué significa eso? Bueno, tradicionalmente, si subía a mi barra de direcciones, meto una dirección y le pego Enter. Se va a un servidor, y recupera algunas cosas ahora angulares para que te permita hacer eso, pero generalmente solo para el primer fetch. Por lo que va y busca este sitio web. Entonces, cuando hago clic en cosas como de solo ir a dar clic a este NPR uno y mirar, se expande y tenemos un video listo para salir. Estamos en una nueva página. Te darás cuenta arriba en la parte superior. Nada cambió. mejor la dirección cambió, pero nada más Si vuelvo a hacer clic, no había barra de carga contraste que con cuando vuelvo a hacer clic y tenemos esa barra de carga. Entonces lo que está pasando ahí es que toda la aplicación se descarga a mi computadora cuando primero voy a made with angular dot com, y cada página a la que voy posteriormente se renderiza por angular en mi PC. El único motivo por el que necesita ir a mi servidor es para obtener bits de datos, y, como se puede imaginar, eso es mucho más barato de hacer en términos de servidor Web. Después reenviar todo este HTML y JavaScript cada vez que cambio la página. Entonces es por eso que el angler es tan bueno y por qué ha sido adoptado por todos estos ejemplos porque realmente relaja la carga en su servidor. Hace lo que llamamos una aplicación de una sola página. Por lo que todo este canal se va a dedicar a enseñar angular y todo fuera de sus conceptos relacionados . Y voy a precisar en este punto vamos a enseñar ángulo a. Pero cuando salga angular tres, voy a cambiar todo a eso fuera de curso. Entonces sin más preámbulos, instalemos angular y editemos nuestro primer código. 2. Cómo instalar el nodo JS y Angular 2: ahora. El primer paso, por supuesto, es instalar angular en sí mismo, y el primer paso fuera de ese proceso es instalar realmente el nodo Js. Porque ningún Js es el servidor que en realidad va a servir a nuestra aplicación angular. También hace un montón de otras cosas. Y si quieres saber más sobre ningún Js, entonces simplemente puedes ir a conocer Jr se detuvo. O como es, irás allá de todos modos e irás a la sección de descargas y no instalarás ningún Js para tu plataforma relevante. Estoy en un Mac, así que conseguiré el instalador de Macintosh e instalaré eso ahora. No te preocupes si tarda un tiempo en instalarse. Eso es perfectamente normal. Simplemente adelante, haz clic en él e instálalo bien. Una vez que lo hayas instalado, sigue adelante y abre una ventana de terminal o una ventana de comandos en las ventanas. Entonces obviamente lo estoy usando, Mac, porque simplemente me parece agradable de usar. Pero todos los comandos son prácticamente iguales en las ventanas. Entonces si tus ventanas golpean la tecla windows y van a ejecutarse y escribir CMD, que es una ventana de comandos, y deberías abrir al mismo tipo de interfaz que ves aquí. Ahora, una vez que lo hayas instalado, vamos a comprobar que esté instalado al golpear el nodo Dash V, y eso nos dice la versión fuera del nodo que estamos ejecutando, que es 6.9 punto uno. Y si quieres asegurarte de que tus aplicaciones funcionen bien, volvamos a conocer J s y descarguemos. Sólo voy a señalar que en realidad hay dos paquetes. Tienes apoyo a largo plazo y el actual y generalmente queremos apoyo a largo plazo, que ahora está en 6.9 punto uno. Hay un cuatro puntos algo flotando alrededor y quieres tener cuidado de no instalar eso. Asegúrate de que esté por encima de seis. Ahora, también tenemos que comprobar que NPM, que es el gestor de paquetes de nodos y el gestor de paquetes de nodos, nos cuida muchas instalaciones de paquetes. Va y consigue el código para nosotros, lo pone en nuestro proyecto sin que tengamos que hacer nada manualmente. Es realmente, realmente bueno. Queremos revisar la versión de eso. Entonces otra vez, Dash V y esa es versión para y si de nuevo para volver a esta página web tenemos. Esto incluye el NPM 3.1, que obviamente es quizás incorrecto. Pero creo que en mi máquina he actualizado a la carga el último gestor de paquetes de nodo. Entonces mientras estés por encima de tres, deberías estar bien para irte Ahora. Solo quiero señalar que es siempre que estás desarrollando tus aplicaciones angulares y las cosas salen mal. En ocasiones ayuda actualizar tu NPM o actualizar tu nodo. Es yo mismo. Tan solo tienes una búsqueda en Google si las cosas van mal para ti y averigua cuáles son las respuestas para tus problemas. De acuerdo, así que las notas instaladas N PM's instaladas. ¿ Qué sigue? Bueno, puedes dirigirte a punto angular io y tenemos algunos muelles aquí que incluyen un inicio rápido . Ahí está la dirección ahora dentro de aquí. Tenemos nuestros pasos para empezar a ejecutar una aplicación de pesca, y simplemente estoy revisando esta lista. Entonces si cambia, ya sabes a dónde ir para obtener los cambios de actualización porque sí cambia con bastante frecuencia. Pero espero que eso sea mucho menos ahora. Y ahora. Por supuesto, lo primero que miramos aquí es requisito previo. Instalar lo que ya hemos instalado. Y luego requerimos la versión cuatro de nodo o superior. Tenemos seis, lo cual es bueno. Y NPM tres X o superior. Y ahí tenemos nuestros comandos que acabo de mostrarles cómo correr. De acuerdo, entonces nuestro servicio listo, nuestro gestor de paquetes de nodos está listo. Ahora, estamos listos para empezar realmente a crear proyectos angulares. Entonces eso es lo que les voy a mostrar en la próxima conferencia. 3. Crea una aplicación angular 2 de fácil: derecho. Estamos listos para crear nuestro proyecto angular. Pero justo antes de que lo hagamos, en realidad vamos a ir a echar un vistazo a ese sitio web del que te hablé. Con la dirección se puede ver ahora, punto angular io y te dice cómo crear un proyecto angular. Y ya hemos instalado nodo en NPM, lo cual está bien. Pero ahora tenemos algunas otras cosas como tenemos que crear carpeta del proyecto, crear archivos de conflicto e instalar paquetes. Ahora, todas estas instrucciones nos llevan a través de lo que tenemos que hacer muy bien, pero en realidad no explican qué está pasando. Entonces solo te voy a dar un resumen rápido, y luego te voy a mostrar una forma mucho más rápida de hacerlo. Entonces, primer lugar, tenemos que crear este paquete, Doc, Jason, archivo. Y esto nos dice qué tipo de dependencias necesitamos para nuestros proyectos. Qué cosas necesitamos tener ahí dentro. Y si nos desplazamos hacia abajo, este sitio web nos da algunos de ellos. Entonces tenemos un nombre y tenemos una versión, y eso es por supuesto, nos pusimos. Tenemos algunos scripts que definen cómo nos quedamos sin servidor. No me preocuparía por esto por ahora. Tenemos licencias, Entonces esto es importante. Si no haces gente para copiar o codificar. Tenemos algunas dependencias, lo que nos dice que necesitamos cosas angulares. Necesitamos formas básicas comunes del compilador. Todo este tipo de cosas. No te preocupes por ellos. Por ahora, solo estoy señalando que existen. Necesitamos un montón de cosas como mecanografía, servidor de luz, etcétera, etcétera. Y entonces, claro, tenemos otro expediente. Ts punto de conflicto Jason. Y esto nos dice cómo el compilador mecanografiado genera JavaScript a partir de los archivos de proyectos . Ahora, ¿qué significa eso? Bueno, significa que en realidad estamos escribiendo en mecanografía, que es una forma mucho más agradable de escribir scripts Java más de una forma clásica de programación. Y a medida que empezamos a crear aplicaciones, verás cómo es mucho más fácil que usar JavaScript en realidad porque JavaScript, para mí, siempre ha sido una especie de forma libre sin estructura. Typescript le da esa estructura que creo que realmente necesita despegar para la multitud de programación clásica. Entonces, ¿qué más tenemos? Tenemos el punto de conflicto del sistema Js, y esto solo pone a un montón de globales a través de esta función global aquí. Ahora, no te preocupes por nada de esto. No tienes que crear nada de esto. Hubo un tiempo hace unos meses en el que habrías tenido que crearlo y luego realmente instalar tus paquetes. Pero a partir de ahora, vamos a utilizar la nueva forma de salir, creando angulares dos aplicaciones a través de esta línea de comandos. Ahora, mayoría de las cosas que creamos a través de la línea de comandos usan lo que se llama interfaz de línea de comandos, que es sólo un zit suena. Utilizamos la línea de comandos como interfaz. Angular tiene una nueva interfaz de línea de comandos, y aquí la tenemos. Si vamos a cli dot angular dot i o podemos usar el Angelus CLI y aquí tenemos el primer viaje de comando para ver NPM instalar Dash G Angular Dash C L. I. Así que vamos a nuestra línea de comandos y hagamos que NPM instale en esto simplemente dice, Usa el gestor de paquetes de notas para instalar algo e instalar qué? Bueno, queremos instalar la CLI angular, pero notarás que hay un guión G y esto significa globalmente. Ahora bien, si no usas Dash G, solo puedes usar esto dentro de tu propio proyecto. Cuando crea un nuevo proyecto, necesita reinstalar la interfaz de línea de comandos. Cuando utilizas Dash G. Estás diciendo que tu sistema instaló esto en todas partes, para que cada aplicación pueda usarlo. Entonces Dashti significa global, y luego quitamos el nombre del paquete. Ahora, el gestor de paquetes de notas es lo suficientemente inteligente como para saber a dónde ir y obtener el cli angular . Entonces cuando golpeas entrar, eso debería apagarse, desaparecer y recuperarlo para nosotros. Dejé de grabar ahí porque solo quería cortarlo para que lo hicieras más rápido. Pero lo he vuelto a encender. Wells se estaban instalando porque sabes lo que vi? Yo vi. Bueno, ya tenemos suficientes Samaras. Pero si me desplaza hacia arriba, nos faltan estas advertencias, acceso derecho y un montón de advertencias. Y si esto sucede y también obtienes un montón de errores, entonces probablemente tengas que ejecutar este comando como el super usuario tan pseudo y luego tienes que ingresar tu contraseña cuando hagas eso que estoy haciendo ahora. Ahora, si estás en Windows, no deberías conseguir ese tema. Podrías conseguir un pop up que diga que necesita acceso de administrador. Pero si consigues ese problema cuando abres tu línea de comandos a la derecha, haz clic en él y haz clic en ejecutar como administrador y entonces deberías estar bien, ¿ verdad? Y una vez completado, no debes tener errores. Podría tener una o dos advertencias, pero en general, eso está bien, así que tengo un par de advertencias ahí, y a veces ayuda pasar por ellas. Sólo para que si tienes problemas más adelante, ya sabes que esas advertencias sí aparecieron, pero deberíamos estar bien tal como está. Entonces una vez que eso esté instalado, necesitamos crear nuestra nueva aplicación angular encendida en lugar de correr a través de todas estas cosas, creando los archivos por nosotros mismos, lo cual está perfectamente bien de hacer. Lo que vamos a hacer es usar la CLI angular para ir n g nu y el nombre del PNUMA y lo que voy a hacer miedo es primero, sólo voy a ir al proyecto como déjame ver donde voy a poner esto, tal vez en documentos, entonces documentos sórdidos para ir a la carpeta donde quieres almacenar esto, ir a ver qué hay ahí dentro. Déjame hacer un directorio fuera de N G dos quizás, Y entonces voy a entrar en ese directorio energía a APS, y ese directorio debería estar vacío. Entonces lo que he hecho ahí es simplemente crea director. Por supuesto, podrías hacer esto manualmente. Eso está perfectamente bien. Por lo que iré a su posterior No, podemos usar el comando y G ya que este sitio web se refiere a N g Nuevo y podemos crear una app. Así que solo llamemos a esta primera aplicación dash tres hit Respuesta. El interfaz de línea de comandos va a configurar todo lo que necesitamos. Ve que se crean todos estos archivos que necesitamos. Entonces si ahora vamos a ese directorio, voy a mostrar que en la carpeta anexa tenemos ahora nuestra primera carpeta APP, que está en la energía Tuapse. Y tenemos todos estos expedientes. Tenemos ese archivo de paquete. Recuerda que nos pidió crear y un par de cosas más no se preocupan por lo que son. Este es nuestro angular básico a la aplicación. Recuerda, todo es javascript y mecanografía. Entonces con el fin de editar estos archivos y dejar de jugar con cosas, bueno, esto aún no ha renunciado. A veces hace esto, se queda un poco atascado o mientras creo que está haciendo es realmente instalar cosas para nosotros . Entonces déjame solo marchar un minuto y dejar que haga lo que tiene que hacer. De acuerdo, eso ha terminado de instalar cosas. Entonces si buscamos en nuestra carpeta ahora, ahora tenemos algo llamado carpeta Node Modules. Y lo que hizo nuestra interfaz angular de línea de comandos fue que consiguió todas esas dependencias, todos esos bits de javascript que necesitamos para ejecutar a nuestro cazador. Se fue y los recuperó automáticamente para nosotros, y todos están almacenados dentro de la carpeta de módulos de nodo. Y como se puede ver, comienza con, por supuesto, angular. Tenemos la CLI. Tenemos herramientas angulares y tenemos un giro de cosas. Nunca, nunca entraremos dentro de esta carpeta o la usaremos a menos que sea un caso extremo, en cuyo caso necesitamos arreglar un error. Pero te prometo que nunca necesitarás hacer eso bien. Entonces eso sí. Realmente simplifica nuestra vida en instalar un tobillo hasta arriba. Ya está listo para salir. Entonces, ¿cómo lo ejecutamos? Bueno, APS generalmente se ejecutan en un servidor local. Si estamos desarrollando en nuestra máquina y el servidor local está almacenado en el host local en este momento, nos dice que no existe tal cosa. Y eso es porque necesitamos iniciar nuestro host local con este comando llamado N G servir. Entonces, primer lugar, necesitamos entrar en nuestra primera carpeta APP y luego escribir N G serve y angular o la interfaz de línea de comandos va a ir y buscar todas nuestras cosas angulares. Compilarlo juntos y servirlo y decirle a nuestro equipo cuando vaya al host local, vaya a este servidor Web que he creado. Por lo que ahí puedes ver que comando Angular Live Dev server se está ejecutando en esta dirección en esa dirección se está ejecutando en el Puerto 4200 por lo que tu puerto puede ser cualquier cosa. Se puede cambiar eso si quieres, pero no hay necesidad de hacerlo en este punto, vamos al anfitrión local 4200 hit Enter y Walla. Nuestra app funciona así que gracias a la cli angular se han tenido que hacer ninguna basura manual. Acabamos de crear nuestra envoltura angular. Lo hemos servido en nuestro servidor no Js, que actualmente se está ejecutando. Entonces así es como se crea un pescadero a la altura. Y así es como lo ejecutas en un servidor. Ahora, mucho más tarde en otras secciones, les voy a mostrar cómo instalar esto en un servidor real en vivo. Pero todo el proceso que has visto aquí arrancando el servidor es prácticamente el mismo. Entonces todo solo funciona como debería en la conferencia final de esta noche en esta sección, solo te voy a mostrar algunas maneras muy, muy básicas de editar un par de bits y piezas en Europa solo para que podamos conseguir un sabor de sentir para lo que es realmente construir y crear un angular para mapear. 4. Dirección de una aplicación angular 2 y editar tu primer código: bien, en la parte final de esta sección, sólo vamos a hacer un poco de edición. Recuerda, tenemos nuestra angular a la aplicación lista y ejecutándose en host local y Puerto 4200. Nuestra APP funciona. Es un poco avión por el momento, así que cambiemos eso. Vamos a la carpeta donde está almacenada nuestra app y notarás que todos estos archivos tienen. Tienen interminables tipos diferentes, pero básicamente son todos archivos de texto, por lo que puedes usar cualquier editor de texto para editarlos. Ahora, tengo todo un montón instalado aquí y tal vez tengas tu favorito. Y en la siguiente sección, te mostraré cuál preferiría que utilizaras porque lo uso. Y creo que es genial, y realmente ayuda a reducir los errores que podrías tener. Pero por ahora, solo vamos a usar cualquier editor de texto que tengas que ir a tu carpeta APS y luego mirar dentro Aquí Tenemos thes folders e to E. Eso no suena como si fuera nuestra app. Tenemos la carpeta de módulos, ¿recuerdas? Dije: No toques cosas ahí dentro. Tenemos el paquete carpeta Doc Jason, que contiene todas las cosas que necesitamos para nuestra app. Y también tenemos esta fuente de carpeta. Ahora bien, si entras ahí, lo que vas a ver son otras tres carpetas, quizás más, quizás menos, dependiendo de tu versión. Tenemos este ícono y ese ícono. Si vamos por aquí y hacemos click en nuestra barra de direcciones arriba en la parte superior justo antes de la dirección, podemos ver ese icono. Entonces esto nos está dando una pista de que nuestra APP se crea a partir de esta sección porque ahí es donde está la imagen. Básicamente es otra pista en que tenemos un archivo html index dot y si abro ese archivo con solo un editor de texto plano o no lo hemos hecho, hay carga. lo mejor si abro esto con déjame probar código de estudio visual, Veamos qué nos da eso. Uh, tenemos un html think básico y dentro, si tenemos todo un montón de etiquetas que es simplemente html viejo, tenemos por delante. Tienes el HTML tenemos el tipo doc. Claramente, esta no es toda una app, así que voy a cerrar eso. Sigamos viendo esto ahora. Si él Si sabes de Desarrollo Web, sabes que el índice siempre se carga primero. Y si reabro eso en realidad y te muestro algo, el índice se carga y toda nuestra aplicación angular no está ubicada dentro de esta etiqueta de ruta de la aplicación . Entonces todo lo que vamos a crear está contenido dentro del desarraigo. Eso es sólo algo a tener en cuenta por ahora. Entonces, ¿ qué, en realidad está contenido ahí dentro? Bueno, nuestra app, eso es click. Y tenemos un montón de archivos de nombre extraño aquí. Pero lo que sus nombres realmente no importa porque quiero que notes un patrón de nomenclatura que sucede aquí. Tenemos un componente app, Doctor. Sí, Tenemos un componente APP dot html y un componente app dot C s. Ahora, si estás familiarizado con el desarrollo Web, esto es como javascript, pero está usando mecanografía. De ahí que el HTML final de TS es una especie de lenguaje de marcado de hipertexto de diseño y CSS es, por supuesto, el estilo. Por lo que ya puedes empezar a ver algunos elementos familiares del desarrollo Web. Tenemos una página de estilo, tenemos una página de diseño y tenemos la parte comercial real fuera de la página. Entonces, vamos a abrir esto los componentes dot mecanografiado de nuevo. Solo estamos mirando cosas por ahora para ver qué está pasando. Por lo que puedes usar primero cualquier editor de texto. Tenemos todo esto de aspecto muy extraño. ¿ Y qué tenemos aquí arriba? Bueno, si estás familiarizado con cualquier otro tipo de programación orientada a objetos, tenemos esta declaración de importación y esto trae en la clase de componente. Si te gusta desde angular y un componente es una parte fundamental de angular, puedes pensar en todo lo que vamos a hacer como componentes. Son como bloques de Lego, y vamos a poner todos esos bloques de Lego juntos en las aplicaciones que construimos. No, este es nuestro primer componente al componente app y note que tenemos algo llamado selector, que es la ruta APP. Ahora bien, ¿dónde hemos visto esto antes? Bueno, en realidad vimos esto dentro de este archivo html punto índice. Por lo que angular utiliza lo que se llama selector para cargar lo que sea que hayamos creado dentro de ataque . Y esa etiqueta en este caso está en la raíz, que está en el archivo html index dot Entonces, por supuesto, cada componente necesita una plantilla y esta plantilla se encuentra en este archivo. El componente de la app dot html y cada plantilla necesita un estilo el cual se crea el cual se encuentra en el archivo correspondiente de C. S s. Entonces todos juntos, lo que hemos dicho aquí es que tenemos un componente. Es así como hizo referencia a los componentes mediante el uso de una etiqueta llamada Uproot. El plantilla para este componente se encuentra en el archivo html dot componente y el estilo para ello está contenido en el componente dot CSS. Esto es sólo una especie de convención y nos vamos a acostumbrar mucho a esta causa seguiremos recreando este escenario para todos los componentes que creamos. Por último, tenemos una clase de exportación llamada componente APP con un título igual a trabajos de aplicación. Ahora, ¿dónde has visto eso antes? Bueno, es nuestra página principal en las obras, Así que si solo dibujo un pequeño cuadro para ti de qué está pasando aquí? Nuestra APP está cargando este archivo HTML y el archivo HTML. Vamos, cargarla está buscando la ruta de la APP. Entonces lo que hace es que encuentre la fruta de la app, que es este componente de la app. Entonces si solo te muestro que en la estructura de archivos, en app y es Estos tres archivos látigos a tres. Por lo que se apaga y lo encuentra dentro de componente de aplicación. Doctor. Sí, y dice: Mira, tengo el desarraigo. Después pide una plantilla que la proporcionamos. Le damos los componentes de la app dot html que está aquí, y le damos un poco de estilo, que es opcional. No necesitas tener eso. Entonces tenemos esta parte tan importante que no voy a abordar la exportación. Y cuando decimos exportación y angular estaban diciendo todo que esto está disponible para su uso. Si no tenemos exportación, nuestra sintaxis seguirá siendo válida. Pero la aplicación no sabrá sobre nuestro componente de aplicación, y no sabrá sobre las etiquetas apurate que obtendrán un error. Y dentro de aquí, acabamos de hacer algo muy sencillo, que se titula Equal App Works. Ahora, tal vez te estés preguntando, ¿cómo se transfiere ese título a nuestra solicitud? Bueno, aquí es donde realmente vamos a abrir el archivo html abierto con código de estudio visual. Y mira esto por dentro a Curly Brace. Es importante notar que hay dos. Tenemos este título y esta es la belleza de angular. Está vinculando este título de variable con lo que esté contenido en la clase. Entonces dentro de esta clase de exportación, puedo caer y nombrar variable, por ejemplo, y sólo sirviendo a Grant, Guarda eso Y dentro de aquí, debajo de H uno, puedo darle un etiqueta de párrafo y lo que no es Grant. Nosotros queremos poner un nombre, y puedo cerrar mi etiqueta de párrafo. Ahora voy a guardar eso. Y luego voy a ir a mi terminal y mirar, Nuestra terminal recoge que las cosas han cambiado y se re compila para nosotros, lo que debería volver a compilar y decirle a un navegador. Tenemos algo nuevo, y ahí lo tenemos en obras y Grant. De acuerdo, felicitaciones. Has editado tu primer angular para codificar E. Disculpe. Ahora puedo apreciar Había mucha información ahí. Si eres nuevo en esto y angular, no funciona. Al igual que la mayoría de otros marcos que he encontrado. Pero una vez que te acostumbras a ello, es bastante fácil trabajar realmente con muy rápido. Entonces solo para asegurarme de que tengo los conceptos básicos dentro de tu cabeza, solo voy a volver a pasar por un par de esas cosas. Voy a ir a mi buscador, y lo voy a repasar y decir que tenemos nuestro archivo de índice. Y dentro de ese archivo de índice que tenemos Es como un archivo html habitual porque este es el 1er 1 que se carga. Tenemos nuestra ruta de manzana, Tague, y esto contiene todo en nuestra app. Te aconsejaría que siempre dejaras esto tal como está. Por lo que nuestro sistema angular se apaga y busca la fruta de la app. Y cuando se apaga y lo encuentra dentro de uno de estos componentes el cual ha exportado frijol, así que sabemos que está ahí y encuentra a este selector el desarraigo, luego carga una plantilla. Y estos estilos, si los tenemos, carga todo lo que necesitamos dentro de la clase. Y si es necesario, vincula algunas variables como título y nombre. Y luego combina todo eso y genera algo que luego podemos leer en nuestro navegador . Entonces esa es una visión muy rápida, muy básica de lo angular que hace lo que hace. Y justo antes de terminar esto, si recuerdas en los viejos tiempos fuera del desarrollo web y solo uso esto. No escribas en tu uno. Sólo estoy escribiendo en la mía. En los viejos tiempos, tendrías que hacer lo que se llama Traversing the Dom the document object model. Entonces si tuvieras algo así como una H en los viejos tiempos del desarrollo, dirías que el yo d era igual a título. Y luego en algún lugar de tu archivo javascript, entonces tendrías que tener algún tipo de función como tu consulta J funcional lo que fuera para ir y encontrar, ya sabes, ítem llamado título. Y este señoritas es extremadamente ineficiente porque hay que recorrer todo el camino por este árbol de elementos. Tendrías que buscar todo hasta que te encuentres con este ítem de título y luego lo harías igual a lo que sea tu variable waas Y sé que no he usado un lenguaje adecuado aquí, pero te das la idea para que atravesar el dawn es increíblemente caro de hacer en términos de potencia de procesamiento y ralentiza las cosas. Y lo que angular hace es detrás de bambalinas. Registra todas estas variables. Todos estos elementos dom si necesitamos que se registren y los pone libremente disponibles para su uso por nuestro programa JavaScript o mecanografiado, y eso significa que obtenemos enormes beneficios en términos de rendimiento. Por lo que los APS angulares son realmente, realmente rápidos y angulares Tuapse aún más. Correcto, Entonces eso concluye este modelo. Espero que se vayan a unir a mí en el siguiente módulo cuando vamos a bucear un poco más profundo y crear nuestro propio componente. Y una vez que hayas hecho eso, vas a tener los bloques de construcción muy básicos fuera, pudiendo crear cualquier cosa que puedas imaginar en la Web. 5. Cómo continuar de aprendizaje: Enhorabuena. Terminas esto. Un módulo muy rápido sobre angular al ahora, si quieres seguir aprendiendo y ¿por qué no lo harías? Porque angular es bastante impresionante. Entonces hay una manera fácil de hacer eso. Yo lo he configurado, así que es bonito y sencillo. Pocos y habilidad comparten lo que ves en la esquina inferior de la imagen en pantalla, hay un número que es un número secuencial. También lo puedes ver en el título fuera del curso. Entonces, por ejemplo, esta es la primera parte, pero podrías estar en la parte cinco o la parte 50. No importa si quieres acceder a la siguiente parte de este curso, entonces simplemente busca angular dos o ve a mi página de perfil haciendo clic en uno de los enlaces relevantes arriba en la esquina superior derecha, y verás una lista de los cursos que enseño. Posibilidades. ¿ Estás confinado? Se puede avistar de inmediato cuál es el siguiente, por lo que en este caso es el número dos. Pero en tu caso podría ser el número 51. Entonces así es como continúas. Simplemente haz clic en el curso ahora e insértate para continuar tu aprendizaje angular, aunque no lo vayas a completar en este momento. Es buena idea inscribirse ahora. Para que sepas dónde estás la próxima vez que inicies sesión en share de habilidades y quieres mantener la experiencia de aprendizaje en marcha, te veré en el siguiente módulo.