Symfony2, instalando la extensión Text de Twig en Symfony 2.7

Sigo estudiando y haciendo pruebas con Symfony2 (2.7), ahora he querido usar el filtro truncate de la extensión Text del motor de plantillas Twig.

En todas las webs que he consultado dice que es muy simple, que simplemente añadiendo al fichero app/config/config.yml (o app/config/services.yml) lo siguiente, es más que suficiente:

services:
twig.extension.text:
class: Twig_Extensions_Extension_Text
tags:
– { name: twig.extension }

En mi caso no ha funcionado, siempre me salía este error cargando cualquier página de mi proyecto:

[Symfony\Component\Debug\Exception\ClassNotFoundException] Attempted to load class “Twig_Extensions_Extension_Text” from the global namespace. Did you forget a “use” statement?

Googleando veo que es necesario instalar dichas extensiones antes con la ayuda del composer:

composer require twig/extensions

Pero al ejecutarse me informa que Twig va por la versión 1.3, y que no puede instalar la extensión en el Twig de mi Symfony 2.7, que es la versión 1.18.2, que como mínimo necesita la 1.20.

Total, finalmente me decido por desinstalar el Twig, instalarlo de nuevo, y luego instalar las extensiones.

composer remove twig/twig

composer require twig/twig

composer require twig/extensions

Con esto lo que he hecho es quitar la versión Twig (1.18.2) que traía mi Symfony2 (2.7), instalar el Twig (me ha instalado el 1.21), y luego instalar las extensiones.

Por lo que ahora lo único que hay que hacer es activar dichas extensiones en el servicio Twig (fichero app/config/config.yml o app/config/services.yml):

services:
twig.extension.text:
class: Twig_Extensions_Extension_Text
tags:
– { name: twig.extension }

Y ya podemos usar la extensión Text en nuestro proyecto, por ejemplo, podemos usar los filtros truncate y wordwrap.

 

 

 

 

 

 

 

Symfony2, instalar Composer en Windows

Instalar Composer en WIndows, es tan simple como ir a la web https://getcomposer.org/download/ descargar el instalador para Windows y ejecutarlo.

Los pasos del asistente son bien fáciles, destacando únicamente que hay que buscar y especificar la ruta donde se encuentra nuestro php.exe instalado, en mi caso D:\xampp\php\php.exe.

Symfony2, instalación en WAMP

Lo primero es tener un entorno WAMP operativo en nuestro PC, en mi caso me descargué e instalé XAMPP.

Después de instalarlo, y para poder ejecutar PHP desde línea de comandos desde cualquier unidad/directorio, añadí a la variable de entorno PATH la ruta donde se me ha instalado PHP, en mi caso D:\xampp\php. En este enlace hay una ayuda de como añadir/modificar variables de entorno en Windows.

Lo segundo es descargar la edición estándar de Synfony2 (en este momento la última versión es la 2.7). En la página anterior están las instrucciones para instalarlo, en concreto lo que yo hice fue:

Abrir consola de Windows (cmd) e irme al directorio htdocs de mi servidor localhost (en mi caso D:\xampp\htdocs.

cd D:\xampp\htdocs

d:

Siguiendo las instrucciones de la web de Symfony2, ejecutar:

php -r “readfile(‘http://symfony.com/installer’);” > symfony

Veremos que ahora tenemos un fichero llamado ‘symfony’ en D:\xampp\htdocs.

Nos crearemos un primer proyecto web Symfony2 de prueba llamado test01:

php symfony new test01

Esto automáticamente nos creará toda la estructura de carpetas y ficheros necesarios para empezar a crear un nuevo proyecto Symfony2, en nuestro caso llamado test01, usando la última versión estable disponible. Este proceso puede llevar algún tiempo, en mi caso tardó un par de minutos.

Para comprobar si se ha instalado correctamente ejecutaremos desde el navegador:

http://localhost/test01/web/config.php

Esta web nos permite realizar algunas configuraciones para nuestro proyecto, es lo mismo que modificar manualmente el fichero test01/app/config/parameters.yml.

Es probable que en la web anterior se nos indiquen algunos aspectos o configuraciones de PHP a mejorar, es recomendable realizarlo, no obstante no es estrictamente imprescindible hacerlo para continuar con el proyecto demo (test01) que tenemos entre manos.

Si ejecutamos la siguiente web, pasaremos a configurar nuestra aplicación demo, para ello, antes, nos crearemos en nuestro MySQL local, una base de datos llamada, también, test01.

http://localhost/test01/web/app_dev.php/_configurator/

Desde aquí un cómodo asistente nos preguntará por los siguientes aspectos de nuestra futura web:

  • Base de datos principal.
  • Código secreto (con aceptar la cadena aleatoria proporcionada automáticamente es suficiente).

Finalmente el proceso termina, nos da la enhorabuena y nos informa que ha sobreescrito algunos parámetros en test01/app/config/parameters.yml.

Finalmente si ejecutamos desde el navegador:

http://localhost/test01/web/

Nos aparecerá una web de bienvenida. Ya tenemos listo todo para empezar a codificar nuestra aplicación Symfony2 🙂

Screenshot_2

 

 

Instalación de NodeJS, AngularJS (y Bootstrap) en Windows

Nos instalamos NodeJS desde su web oficial nodejs.org, haciendo clic en el botón ‘INSTALL’. Se descargará un fichero MSI que deberemos instalar en nuestro Windows.

Una vez instalado, nos aseguraremos que se ha instalado correctamente, para ello buscaremos en el botón de inicio de Windows, una nueva carpeta llamada ‘NodeJS’, y ahí haremos clic en ‘Node.js command prompt‘. Escribiremos:

node -v

Y deberemos ver la versión de NodeJS que acabamos de instalar.

Hasta aquí tenemos instalado correctamente NodeJS en nuestro sistema operativo Windows.

Para nuestra prueba, además instalaremos los módulos ‘connect‘ y ‘serve-static‘ de NodeJS, para podernos hacer un simple servidor web en NodeJS.

Para ello, desde la ventana previa abierta usando ‘Node.js command prompt’ escribiremos:

npm install -g connect

npm install -g serve-static

Con esto (deberíamos) haber terminado la instalación de NodeJS.

Ahora pasamos a descargarnos AngularJS, para ello vamos a su web oficial y pulsamos el botón ‘Download’, esto nos abrirá un popup, donde volveremos a pulsar ‘Download’ y se nos descargará un fichero angular.js.

Lo siguiente es descargar Bootstrap de su web oficial, por su simpleza y distintas posibilidades de descarga no voy a entrar en detalles de como se descarga, únicamente, al final de la descarga, deberemos tener los ficheros: bootstrap.cssbootstrap-theme.css.

Hasta este momento hemos descargado todo lo que nos hace falta, y tenemos NodeJS instalado.

Lo siguiente que vamos hacer es crear un ejemplo que cargue todo, para ello nos crearemos una carpeta nueva, por ejemplo c:\na, y ahí nos crearemos un fichero server.js con el siguiente contenido:

var connect = require(‘connect’),
serveStatic = require(‘serve-static’);

var app = connect();

app.use(serveStatic(“.”));
app.listen(5000);

Y desde la consola abierta usando ‘Node.js command prompt’ escribimos:

c:

cd c:\na

node server.js

A partir de este momento tendremos un pequeño servidor NodeJS oyendo en el puerto 5000.

En caso que nos muestre error de que no encuentra ‘connect’ o ‘serve-static’, deberemos hacer:

c:

cd c:\na

npm link connect

npm link serve-static

node server.js

Nos crearemos un nuevo directorio para nuestra prueba, en c:\na\e1, y dentro coparemos angular.jsbootstrap.cssbootstrap-theme.css, crearemos un nuevo fichero llamado index.html con el siguiente contenido:

<!DOCTYPE html>
<html ng-app>
<head>
<script src=”angular.js”></script>
<link href=”bootstrap.css” rel=”stylesheet” />
<link href=”bootstrap-theme.css” rel=”stylesheet” />
</head>
<body>
<div class=”btn btn-default”>{{“AngularJS”}}</div>
<div class=”btn btn-success”>Bootstrap</div>
</body>
</html>

Si abrimos un navegador y escribimos http://localhost:5000/e1 y vemos una web simple con un botón “bonito”, y con la salvedad que a pesar de haber escrito {{“AngularJS”}} vemos AngularJS significa que tenemos NodeJS + AngularJS + Bootstrap correctamente instalados y listos para ser usados.