Laravel 5.4 y Angular 4. Inicio.

Bienvenidos.

Vamos a comenzar el desarrollo de una aplicación con Laravel 5.4 y Angular 4.

En esta entrada comenzaremos por instalar Laravel, corregirlo para poder ser utilizado por el servidor Virtualmin y configuraremos el IIS para que acepte toda esta estructura. También instalaremos angular 4 para poder hacer el desarrollo de la parte frontend.

Tras mucho bucear por internet y por tutoriales y preguntas en stackoverflow y sitios similares, al final voy a optar por un entorno separado. La parte frontend (con AngularJS) es la que irá en la dirección principal, y la parte backend (con Laravel) se encontrará en un subdominio «api». Así cada proyecto está separado y no se pegan entre ellos y simplifica los cambios y despliegues de cada parte.

Instalando Laravel 5.4.

Lo más sencillo (al menos en mi caso) es utilizar Composer para que se instale laravel en el directorio que voy a utilizar para desarrollar.

Lo primero es elegir la carpeta dónde se va a desarrollar.

Por lo tanto, en una terminal, dentro de la carpeta del proyecto, comenzaremos con la instalación de Laravel.

Con lo que se nos instalará la base del framework.

Una vez conseguido, voy a seguir las instrucciones que ya detallé aquí para tener el entorno listo para virtualmin, y que en resumidas cuentas vienen a ser:

  • Mover la carpeta «public» dentro de «nombre_laravel» a la raíz de nuestro proyecto.
  • Renombrar «public» a «public_html» dentro de su nueva ubicación.
  • Cambiar las líneas 22 y 36 de «public_html/index.php».

En mi caso han quedado así (sí, he puesto «laravel» a la carpeta de Laravel, original 😉 ):

Una vez realizado todo esto, procedo a subirlo al servidor IIS de pruebas, para lo cual sigo los siguientes pasos:
  • Tener una carpeta para el proyecto.
  • Copiar las carpetas public_html y laravel a la carpeta del proyecto dentro del servidor IIS (se acepta el método preferido de cada uno)
  • Importante: Asegurarse de que el usuario IUSR tiene control total (al menos de momento para desarrollar) en la carpeta del proyecto y todos sus archivos y carpetas dependientes.

  • Crear un nuevo sitio en IIS que apunte a la carpeta «public_html» dentro de nuestro proyecto.
  • Probar en el navegador.

Si todo ha ido bien tendremos instalado Laravel listo para comenzar.

Para desplegarlo en el sitio remoto (con virtualmin y apache), será necesario subir por ftp las dos carpetas, laravel y public_html a la raíz del subdominio donde se va a ejecutar.

Instalando Angular 4.

Ha llegado el momento de instalar la base de Angular 4 para comenzar a trabajar.

Para ello, y siguiendo con la terminal de VS code, lo mejor es seguir los siguientes pasos.

  • Asegurarse de que tenemos node instalado con «node -v».
  • Después ver si se tiene instalado el Angular-CLI con el comando «ng -v». De no ser así ejecutar «npm install -g @angular/cli» para instalarlo globalmente y que nos sirva para otros desarrollos.
  • Efectuar la instalación de una aplicación AngularJS con el comando «ng new web» (nombre para el proyecto original otra vez jeje).
  • al finalizar tendremos una estructura de carpetas parecida a la siguiente, en el ordenador de desarrollo.

Para probar que está en marcha, lo mejor es utilizar una nueva terminal de consola o powershell, y probar a arrancar angularjs con el comando «npm start» dentro de la carpeta «angular» de nuestro proyecto. Y acceder con un navegador a la url http://localhost:4200

Para poder probar esta primera instalación en el sitio remoto, será necesario seguir estos pasos:

  • Ejecutar en la carpeta de angular (web) el comando ng build –prod para que se generen y compilen las fuentes.
  • Esto creara un directorio «dist» dentro de la carpeta del proyecto de Angular.
  • Subir por ftp el contenido de la carpeta «dist» a la carpeta «public_html» del dominio remoto.
  • Probar en el sitio remoto.

Y con todo esto ya tendremos las dos herramientas funcionando y listas para comenzar.

He elegido esta separación de carpetas por dos motivos: Para poder enviar al servidor virtualmin lo necesario para los proyectos y que la parte privada siga funcionando correctamente, y para poder tener cada desarrollo totalmente separado, dado que utilizaré Laravel para formar la parte backend y angular para la parte frontend.

Nos vemos en la siguiente parte.

Outlook, Funambol y Egroupware.

Este ya es un tema tratado, en Sincronización Egroupware y Outlook y en Sincronización Egroupware y Outlook (II).

Bueno, en esas entradas (que como veis tienen tiempo ya) describía como me había funcionado una instalación de Egroupware y la sincronización con Outlook.

Cual es mi sorpresa cuando al tratar de hacerlo de nuevo ayer… me encuentro con que al utilizar el programa Funambol Outlook Plugin me da un error tan bonito como “Client not Authenticated” (usuario no autorizado).

Dirección de servidor, usuario, todo correcto… Comedura de cabeza en marcha…

¿Solución? tan simple que duele… Activar SyncML para los usuarios/grupos que necesiten la sincronización, desde la administración de cuentas de Egroupware.

Solución encontrada tras ver esta entrada en Desarrollo Libre.

Manda narices… lo más sencillo lo que más quebraderos de cabeza da…

WordPress no muestra los comentarios en las páginas…

Bueno, no podía ser de otra forma, me he encontrado con un fallo en el generador de plantillas de wordpress…

Tiene la malsana costumbre de que en el archivo “page.php” se le “olvida” meter una sección para que los comentarios se muestren si la página los tiene habilitados.

Menos mal que la solución es bastante simple:

  1. Antes de subir el tema al blog, editar el archivo “page.php” (con el bloc de notas mismo, o vuestro editor HTML favorito.
  2. localizar el fin del bucle de wordpress. En concreto una línea como esta: “php endwhile;”
  3. justo antes de esa linea insertar esta otra: “< ?php comments_template(); ?>”.
  4. Subir el tema.

Listo!. ya solo queda disfrutarlo.

Portabilizar Windows Live! Writer y plugins

Bien, después de probar el programa, creo que mi pequeña contribución va a ser esta, un pequeño tutorial sobre como conseguir que WLW sea portable, con los plugins, sin tener que instalar cada plugin, e integrado con Portable Apps

El programa para hacer portable lo descubrí gracias a Homotecno y la instalación del Writer se hace a través de la propia MSN

Requisitos:

  • Tener un pendrive (o HD externo) donde se va a instalar (no imprescindible).
  • Tener instalado al menos el menú de Portable Apps

Pasos:

  1. Nos descargamos el Programa Universal Extractor (paso no imprescindible en caso de tener un programa para "descompilar" archivos .msi, instaladores de Microsoft).
  2. Descomprimimos WLWPortable en \Portableapps
  3. Tenemos dos alternativas:
    1. O bien nos instalamos el WLW de Microsoft con el instalador de Windows Live!. (mas sencillo) y despues cogerlos de su directorio de instalación y copiarlos en \PortableApps\WindowsLiveWriterPortable\App\WindowsLiveWriter
    2. O bien si conseguimos el .msi o .cab de instalación, utilizando el Universal Extractor, extraer los archivos de  WLW en la carpeta \PortableApps\WindowsLiveWriterPortable\App\WindowsLiveWriter 
      1. Este paso no esta probado, aunque podría ser la solución a un problema que planteaba BlogSTD en la entrada de Homotecno, que es el tener que instalar el WLW en el PC, pero ¿y sí no queremos hacerlo?
  4. Para cada plugin:
    1. Utilizando el Universal Extractor extraemos de cada msi o cab de instalación del plugin la/s dll/s necesaria/s
    2. Copiamos los archivos extraídos en el paso anterior  en \PortableApps\WindowsLiveWriterPortable\App\WindowsLiveWriter\Plugins
  5. En el menu de Portableapps cogemos la acción de actualizar aplicaciones.
  6. Abrimos WLW, y a disfrutarlo!!

DescargarWLW Portable