Bootstrap fácil en Symfony con MopaBootstrapBundle

symfony.png
Solucionex
30
Sep 16

A estas altura cualquier desarrollador que se precie conoce Bootstrap y más que probable lo haya tenido entre sus proyectos en alguna ocasión. Nos ayuda a agilizar la estructura con un gran ahorro de tiempo, también nos permite algunas bondades como diseño responsivo, clases predefinidas, etc.

Probablemente muchos conozcan ya MopaBootstrapBundle. Tanto para los que no, como para aquellos que sí pero han tenido algún problema de instalación, os proponemos que sigáis estos pasos para poder utilizarlo.

Vamos a partir de la base de que el proyecto cuenta con composer y less, assetic, etc. Si no es así os lo recomendamos.

Partimos añadiendo a composer el bundle para que se lo baje:

composer require mopa/bootstrap-bundle twbs/bootstrap

Ahora vamos a registrar el bundle en el núcleo de Symfony. Editamos el fichero app/AppKernel.php y añadimos:

// app/AppKernel.php
public function registerBundles()
{
    $bundles = array(
        ...,
        new Mopa\Bundle\BootstrapBundle\MopaBootstrapBundle(),
    );
    // ...
 
    return $bundles;
}

 

Si hacemos un "app/console" veremos que disponemos de más comandos de symfony que empiezan por "mopa:...". De estos nos interesa uno para que se genere un enlace simbólico al proyecto:

app/console mopa:bootstrap:symlink:less

Si os ha dado algún error extraño que menciona a composer o a MopaBridge, especialmente si tenéis un MAC, el problema está en composer, Da igual que le hagáis un "composer self-update", os recomiendo que lo volváis a bajar e instalar:

php -r "copy('https://getcomposer.org/installer', 'composer-setup.php');"
php -r "if (hash_file('SHA384', 'composer-setup.php') === 'e115a8dc7871f15d853148a7fbac7da27d6c0030b848d9b3dc09e2a0388afed865e6a3d6b3c0fad45c48e2b5fc1196ae') { echo 'Installer verified'; } else { echo 'Installer corrupt'; unlink('composer-setup.php'); } echo PHP_EOL;"
php composer-setup.php
php -r "unlink('composer-setup.php');"

Ya lo tenemos hecho, lo único que nos falta es usarlo. Cogemos una vista, de edición por ejemplo, y le decimos que extienda del base o del layout del bundle Mopa. Este es el resultado tras una:

Formulario de edición con MopaBootstrap