Angular 2 avanzado: Gestión de archivos en PHP

Publicar la aplicación

Prueba ahora LinkedIn Learning sin cargo y sin compromiso.

Prueba gratis Mostrar modalidades de suscripción
Una vez terminado el proceso de desarrollo, es momento de compilar el código fuente, que hasta ahora está basado en TypeScript y separado en múltiples archivos, para convertirlo en una aplicación basada en CSS, HTML y JavaScript 100% compatible con todos los navegadores web modernos.
04:34

Transcripción

Estamos listos para publicar nuestra aplicación. He realizado algunos cambios menores para que mejore la apariencia estética de nuestra aplicación. He incluido un nuevo icono para las carpetas utilizando Font Awesome y también modificando el filtro para que soporte la extensión "dir". También he incluido, dentro del contenedor principal index.html, una clase "container" para que todos los elementos aparezcan alineados independientemente de la resolución y tamaño de pantalla. Y también he modificado ligeramente el archivo donde me muestra la información de la carpeta, específicamente en el comando "scandir", dentro del archivo "leer-carpeta.php", le he agregado el parámetro "1" para que las carpetas aparezcan en el orden que estamos acostumbrados, o sea, que las carpetas aparezcan de primeras. Tengo acá el resultado final de mi aplicación. Ya estoy listo para publicar. Lo que voy a hacer es que voy a tomar la consola, en este caso desde Visual Studio, estoy ejecutando por ahora el servidor. Voy a detener el servidor presionando "Ctrl+c". En este caso acepto que se detenga. Y voy a utilizar el comando "ng build" y esto va a tomar mi proyecto y lo va a compilar en un documento externo donde se incluye todo el código fuente, todas las librerías externas, toda la información necesaria. Pero vamos a eliminar el código fuente, específicamente todos los archivos de typescript, todas las librerías innecesarias y solamente vamos a tener el código con el que vamos a trabajar. Podemos ver el resultado final en la carpeta donde estamos trabajando, en este caso, mi proyecto se llama "manejo de archivos". Y al ejecutar el comando "ng build" tengo una carpeta que se llama "dist", donde se encuentra mi aplicación. Y ahora, sí, la aplicación tiene solo la información necesaria para trabajar. Esta carpeta es la que debes copiar y pegar dentro de tu servidor y, de hecho, el archivo "index" va a ser el punto de entrada de tu aplicación. A partir de ahora, ya no vas a necesitar el código en el que hemos estado trabajando. Tampoco vas a necesitar trabajar con el servidor de desarrollo. Por ejemplo, yo voy a copiar la información que está acá dentro, dentro de la carpeta "dist", voy a copiar todos estos archivos. Voy a ir a la raíz de mi servidor, en este caso estoy trabajando dentro de un servidor "MAMP", dentro de la carpeta "htdocs", y voy a pegar directamente toda esta información. Vemos que tengo el archivo "index", que como te acabo de decir es el punto de entrada de mi aplicación. Tenemos acá todos los scripts, todo el código necesario, para que Angular ejecute la aplicación tal como la hemos diseñado. Y también tenemos una carpeta "assets", donde se encuentran los archivos relacionados con nuestra aplicación. En este caso tenemos "css" y tipografías, pero también podemos almacenar acá imágenes. Ya tenemos lista nuestra aplicación. Voy a revisar mi código. Ya lo tenemos todo listo. Voy a cerrar toda la información relacionada con Visual Studio, de hecho, voy a detener cualquier servidor que se esté ejecutando. Únicamente voy a tener el servidor Apache, que es donde he estado trabajando. Por ejemplo, ahora el servidor 4200, que es el servidor que he estado usando de depuración, ya no funciona. Y voy a entrar directamente, en este caso, a "localhost", que es donde se encuentra mi servidor Apache. Y voy a cargar el archivo "index", pero ahora ya estoy cargando el archivo "index" que ha generado mi aplicación, el que ya está optimizado y está listo para producción. Está es mi aplicación, trabajando desde un servidor Apache, que este lo puedes trabajar prácticamente en cualquier tecnología, es únicamente "html". Y recordemos que, en este caso, se está conectando a todos los elementos que se encuentran dentro de php. Y voy a cargar el archivo "index", pero ahora ya estoy cargándolo desde, directamente, el servidor Apache. Nuestra aplicación ya está totalmente terminada. Estamos listos para distribuirla, para publicarla y para enviarla a nuestros servidores de producción.

Angular 2 avanzado: Gestión de archivos en PHP

Aprende a crear vínculos entre PHP y Angular 2 mediante un ejemplo práctico en el que trabajarás del lado del servidor con PHP y la parte web con la tecnología Angular de Google.

3:20 horas (33 Videos)
Actualmente no hay comentarios.
 
Software:
Fecha de publicación:19/04/2017

Este curso video2brain está disponible como descarga y para ser visualizado online. ¡Pero no hace falta que decidas entre las dos opciones! Al comprar el curso, disfrutarás de ambas posibilidades.

La descarga te permite ver las lecciones sin estar conectado/a a internet y supone una navegación fácil y ágil entre capítulo y capítulo. Si vas a trabajar en diferentes ordenadores o si no quieres descargarte el curso completo, entra en la web con tus datos de acceso y disfruta directamente de tus vídeos online. Te deseamos que disfrutes de este curso y te resulte de mucha utilidad.

Estamos a tu disposición si tienes cualquier tipo de duda o pregunta.