1
00:00:00,180 --> 00:00:03,900
Bien, continuamos con la segunda parte, vamos al directorio ese, recé.

2
00:00:04,110 --> 00:00:10,490
Acá lo primero que tenemos es el Lapp Hakata, todo el contenido de nuestro componente principal en

3
00:00:10,500 --> 00:00:11,580
la p.p. component.

4
00:00:12,000 --> 00:00:17,640
Acá tenemos el directorio Assets Environment y también algunos archivos en la raíz del ESE.

5
00:00:17,970 --> 00:00:20,610
Vamos a partir con el directorio app lo primero.

6
00:00:20,700 --> 00:00:26,030
Acá tenemos nuestra hoja de estilo el app component css.

7
00:00:26,100 --> 00:00:32,550
Acá podemos tener todos los estilos que son exclusivamente y específicamente del componente del componen.

8
00:00:32,610 --> 00:00:36,300
Por lo tanto nos van a hacer efecto en los demás componentes.

9
00:00:36,360 --> 00:00:38,070
Solamente en el app compone.

10
00:00:38,250 --> 00:00:45,160
Como ya dijimos anteriormente, si queremos agregar estilos globales, tenemos que usar el stills puntos

11
00:00:45,180 --> 00:00:48,000
CSS que justamente está en la raíz.

12
00:00:48,780 --> 00:00:49,080
Acá.

13
00:00:50,470 --> 00:00:58,720
Luego tenemos la plantilla o la vista que responde al componente, al componente punto TS, que contiene

14
00:00:58,720 --> 00:01:00,970
básicamente el HTML, la vista.

15
00:01:01,600 --> 00:01:09,070
Luego tenemos el archivo con extensión, es PEC, significa que son de prueba unitaria, de testing.

16
00:01:09,160 --> 00:01:14,560
Esto no lo vamos a ver porque se ranka un poco de contexto del curso, un tema bastante amplio.

17
00:01:14,710 --> 00:01:17,860
Por lo tanto, incluso por ahora, lo podemos borrar.

18
00:01:18,370 --> 00:01:20,050
No lo vamos a utilizar.

19
00:01:20,170 --> 00:01:25,480
Luego tenemos el app component ts que nuestro componente una clase.

20
00:01:25,600 --> 00:01:29,780
Esta clase representa una parte de nuestra aplicación web.

21
00:01:30,010 --> 00:01:35,470
Se podría comparar como si fuera un controlador de Spring que controla con lógica cierto contenido y

22
00:01:35,470 --> 00:01:41,800
cómo se muestra este contenido utilizando el selector, por ejemplo, en el lugar donde usemos la etiqueta

23
00:01:41,890 --> 00:01:49,330
a Pepe Rut, donde se va a mostrar a desplegar el contenido dinámico de este componente que está asociado

24
00:01:49,330 --> 00:01:51,460
también a una vista a una plantilla.

25
00:01:51,520 --> 00:01:59,110
Por ejemplo, si tenemos selector a Pepe Rut dentro del index, acá utilizamos el selector.

26
00:01:59,230 --> 00:02:07,270
Por lo tanto, dentro de esta etiqueta se está insertando el contenido HTML de esta plantilla que responde

27
00:02:07,660 --> 00:02:09,850
con la lógica del componente.

28
00:02:09,970 --> 00:02:10,900
Es muy importante.

29
00:02:10,930 --> 00:02:14,200
Primero, antes que nada importar el component.

30
00:02:14,290 --> 00:02:18,620
Acá tenemos el decorador muy similar a los import de Spring.

31
00:02:18,790 --> 00:02:23,950
Cuando importamos una clase acá también importamos clases decoradores que vamos a utilizar.

32
00:02:23,980 --> 00:02:27,550
Por ejemplo acá el componente y luego del decorador se define.

33
00:02:27,640 --> 00:02:34,810
La clase compone siempre con el sport para que se pueda después registrar y configurar como componente

34
00:02:34,870 --> 00:02:36,930
en el app module el punto teza.

35
00:02:37,030 --> 00:02:41,350
Luego tenemos el archivo app móvil bien importante.

36
00:02:41,470 --> 00:02:45,550
Esto es como un repositorio donde se registran nuestro componente.

37
00:02:45,670 --> 00:02:50,050
Las clases componen donde se registran los pipe, la clase de servicio.

38
00:02:50,170 --> 00:02:53,290
Acá también se importan los diferentes módulos que vamos a utilizar.

39
00:02:53,320 --> 00:02:59,560
Por ejemplo, por defecto está el browser que incluye la directivas, por ejemplo Enjoy if en Gifford

40
00:02:59,650 --> 00:03:03,790
y toda la directiva con las cuales trabajamos en la plantilla en las vistas.

41
00:03:03,880 --> 00:03:08,140
Pero además podríamos tener el for module para toja con formulario.

42
00:03:08,200 --> 00:03:14,980
El http module para trabajar con peticiones http para trabajar por ejemplo con REST y poder realizar

43
00:03:14,980 --> 00:03:17,950
peticiones a síncrona y obtener resultados.

44
00:03:17,980 --> 00:03:21,560
Jason En fin, un montón de cosas acá también en import.

45
00:03:21,610 --> 00:03:27,310
Podemos cargar configuraciones de la base auto, por ejemplo con memory data con Fauré base.

46
00:03:27,430 --> 00:03:31,210
En fin, acá importamos los diferentes módulos que vamos a utilizar.

47
00:03:31,300 --> 00:03:37,780
Bueno, en declaration acá se registran todos nuestros componente dentro de providers se registran nuestra

48
00:03:37,780 --> 00:03:43,430
clase de servicio, todo aquellos que tengan algún tipo de lógica de negocio o clase con algún tipo

49
00:03:43,450 --> 00:03:44,200
funcionalidad.

50
00:03:44,230 --> 00:03:52,090
Por ejemplo para trabajar con Jason, que realizan consultas asíncrona a un servidor REST, a una aplicación

51
00:03:52,180 --> 00:03:55,630
backend, por ejemplo con Spring Framework, acá tenemos el vostra.

52
00:03:55,720 --> 00:03:59,290
Acá se indica cuál es el componente principal que se va a cargar.

53
00:03:59,380 --> 00:04:01,300
Acá tenemos el app component.

54
00:04:01,390 --> 00:04:08,290
Finalmente acá tenemos la clase App Module y es justamente la clase que se carga que arranca en el Main

55
00:04:08,350 --> 00:04:09,040
.3.

56
00:04:09,280 --> 00:04:15,100
Entonces, resumiendo, el app móvil es un repositorio, es un contenedor donde se registran nuestro

57
00:04:15,100 --> 00:04:18,700
componente, nuestro módulos, nuestra clase de servicio.

58
00:04:18,790 --> 00:04:23,950
Muy parecido en el fondo, lo que sería un contenedor de Spring y también los providers.

59
00:04:24,010 --> 00:04:30,340
La clase servicio se puede inyectar a través de esta independencia, se definen, son inyectables y

60
00:04:30,340 --> 00:04:32,800
se pueden pasar a los diferentes componentes.

61
00:04:32,860 --> 00:04:34,120
Son globales.

62
00:04:35,110 --> 00:04:36,820
Luego tenemos el Assets.

63
00:04:37,240 --> 00:04:43,030
Había mencionado que acá se guardan todos los contenidos estático de nuestra aplicación environment.

64
00:04:43,150 --> 00:04:47,650
Acá tenemos, por ejemplo, el ambiente Desarrollo Productions igual a fols.

65
00:04:48,100 --> 00:04:52,960
Y acá tenemos el en varios M.T production igual thru el ambiente de producción.

66
00:04:53,020 --> 00:04:58,120
Esto se utiliza ya cuando se genera la carpeta de distribución y se publica a producción.

67
00:04:58,630 --> 00:05:05,050
Luego tenemos el favicon el de Angular que justamente el que se muestra en el navegador en los tab.

68
00:05:05,110 --> 00:05:06,460
Luego tenemos index.

69
00:05:06,550 --> 00:05:08,530
HTML que nuestra página principal.

70
00:05:08,650 --> 00:05:16,300
Acá se coloca el selector del componente principal, el app component, la clase main principal que

71
00:05:16,390 --> 00:05:20,050
levanta y arranca nuestra aplicación el app móvil.

72
00:05:20,380 --> 00:05:25,960
Acá por defecto estamos utilizando el plataforma Browser Dinamic, es decir, podemos trabajar tanto

73
00:05:25,960 --> 00:05:31,150
con navegador, con aplicaciones web, también con aplicaciones smartphone, aplicaciones móviles,

74
00:05:31,210 --> 00:05:35,800
pero también podríamos utilizar otro tipo que sean solamente para aplicaciones móviles.

75
00:05:35,860 --> 00:05:36,200
En fin.

76
00:05:36,250 --> 00:05:42,100
Pero durante el curso vamos a trabajar con aplicaciones web y utilizando push up se pueden hacer responsive

77
00:05:42,130 --> 00:05:47,500
para que nuestra creación web funcione perfectamente en un dispositivo smartphone o celular.

78
00:05:47,560 --> 00:05:49,360
Luego tenemos el Polifenoles.

79
00:05:49,500 --> 00:05:53,460
Un archivo de configuración para aumentar la compatibilidad de nuestra aplicación.

80
00:05:54,690 --> 00:05:58,890
Acá tenemos el Styles para los estilos globales.

81
00:06:00,420 --> 00:06:03,810
Luego tenemos test para pruebas unitarias.

82
00:06:03,930 --> 00:06:07,110
Luego tenemos el ts config en la confesión de tal script.

83
00:06:07,200 --> 00:06:09,720
Acá tenemos también pruebas unitarias.

84
00:06:09,860 --> 00:06:10,110
Bien.

85
00:06:10,200 --> 00:06:16,770
Y eso sería todo si revisamos también el directorio de nuestro proyecto en el explorador.

86
00:06:16,890 --> 00:06:21,600
Acá notamos que tenemos la carpeta IT y nos modules que está oculta.

87
00:06:21,750 --> 00:06:27,660
Se ocultan por la configuración que realizamos en el video anterior, pero básicamente en los módulos.

88
00:06:28,080 --> 00:06:31,650
Acá tenemos toda la dependencia de nuestra aplicación.

89
00:06:31,860 --> 00:06:36,360
Todos los plugins, toda la librería de Angular que hemos instalado Hakata todo.

90
00:06:36,480 --> 00:06:38,280
Y esto básicamente no se toca.

91
00:06:38,400 --> 00:06:40,380
Librería de Angular y de terceros.

92
00:06:40,560 --> 00:06:45,600
Los Ventor quedamos hasta acá y cualquier duda que tengan la revisamos en el foro.

93
00:06:45,750 --> 00:06:46,770
Les habló el profesor.

94
00:06:46,830 --> 00:06:47,670
Hasta la próxima.