Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Team Building Around Drupal

Team Building Around Drupal

Un viaje integral en torno a Drupal para enfocar proyectos en equipo. #Drupal

David Rodríguez (davidjguru)

February 01, 2018
Tweet

More Decks by David Rodríguez (davidjguru)

Other Decks in Technology

Transcript

  1. TEAM BUILDING
    AROUND DRUPAL
    - un viaje integral para enfocar proyectos -
    By David Rodríguez, @davidjguru

    View Slide

  2. David Rodríguez
    @davidjguru
    Hello my name is:
    drupal.org/rojomorgan

    View Slide

  3. ¿Qué estamos haciendo aquí?
    Objetivo de alto nivel: Generar un mapa de Drupal que
    permita una visión cohesionada.
    Target: Un equipo tecnológico sin experiencia en Drupal.
    Duración: 32 horas divididas en ocho sesiones de cuatro
    horas cada una.

    View Slide

  4. • Ofrecer una mapa lo más completo posible de la tecnología
    Drupal (Ampliar).
    • Proporcionar un modelo constructivista: el asistente formará su
    propia experiencia gracias a una combinación teórico-práctica.
    (Experimentar).
    • Conseguir en el alumnado el refuerzo necesario como
    profesionales para emprender proyectos basados en Drupal
    (Madurar).
    Complementariamente:

    View Slide

  5. Sesión 1 - Bloque 1: Expectativas
    Hablemos un poco a título personal para
    encontrar una mecánica:
    ¿Cuáles son
    vuestras
    expectativas
    respecto a este
    curso?

    View Slide

  6. Donde A = Asistentes, F = Formador y O = la Organización
    Intersección de expectativas

    View Slide

  7. Este es el registro de vuestras expectativas con las que trabajaremos:
    ● Tener una buena base de partida para proyectos basados en Drupal
    ● Saber como crear portales web con Drupal
    ● Conocer como acometer proyectos con Drupal
    ● Experimentar con Drupal en si
    ● Practicar de 0 a web con Drupal
    ● Identificar las ventajas de la arquitectura de Drupal
    ● Identificar bien Drupal 8
    ● Probar como hacer actualizaciones
    ● Adquirir experiencia en Drupal
    ● Localizar canales y sitios donde encontrar ayuda sobre Drupal

    View Slide

  8. ¿Cómo podemos
    combinar todas las
    expectativas?
    Empieza a
    aparecer EL RETO
    Ahora tenemos que sintetizar bien toda la
    información.

    View Slide

  9. Siempre, en todo momento, estaremos jugando.
    Jugamos a que investigamos, a que probamos, a
    que estamos experimentando.
    No existe la prisa ahora. Vamos despacio
    porque vamos lejos.
    El verbo más utilizado será “Romper”:
    construiremos cosas y las probaremos. Algunas
    se romperán, y así aprenderemos como
    repararlas.
    La experiencia se adquiere a través de la
    práctica y eso incluye el error: Vamos a
    equivocarnos.
    Siempre nos aproximaremos a conceptos
    nuevos desde la experiencia que ya tenemos:
    los equipos responden mejor al aprendizaje
    cuando se usan puentes con lo ya
    experimentado.
    EL RETO FUNDAMENTAL DEL CURSO
    Tejer el conjunto intersección de expectativas
    a tres bandas: organización convocante
    (vuestra empresa), vosotros y vosotras como
    asistentes y participantes, y yo como guía.
    Debemos ser capaces de construir una
    mecánica fluida, participativa, progresiva,
    integradora y constructivista.
    En base a ello, las claves:
    ● Más colaborativo que expositivo
    ● Más práctico que teórico
    ● Más biyectivo que unidireccional
    ● Más intuitivo que complejo
    ● Más experimental que observador
    ● Más dinámico que estático
    Tenemos 8 sesiones, 30 horas en total para partir
    de un conjunto de personas que no han
    experimentado antes ni con Drupal ni con el Stack
    Tecnológico habitual de Drupal y llegar a un mapa
    lo más integral posible de experiencias directas
    con la tecnología: RETO.

    View Slide

  10. Sesión 1 - Bloque 2: Necesidades y Acuerdos
    Análisis de
    necesidades:
    Vamos a evaluar en
    que punto estamos
    this.

    View Slide

  11. Necesitamos responder a estas cuestiones con
    toda la sinceridad posible:
    1. ¿Qué experiencia tenéis con Drupal?
    2. ¿Tenéis práctica con entornos Linux tipo Ubuntu, Debian, etc?
    3. ¿PHP?
    4. ¿Programación orientada a objetos?
    5. ¿Conocéis algún CMS?
    6. ¿Habéis practicado con el Modelo-Vista-Controlador, MVC?
    7. ¿Control de versiones? ¿svn? ¿git?
    8. ¿Habéis trabajado con repositorios externos?
    9. ¿Tenéis experiencia con Github?
    10. ¿Qué objetivos podemos marcarnos?
    Plano de situación

    View Slide

  12. ¿PHP?
    ¿Control de versiones?
    ¿Qué objetivos podemos marcarnos?
    Completa la frase: Cuando termine el
    curso, yo debo haber aprendido...

    View Slide

  13. Metodología y
    Mecánica
    Seamos realistas: los
    objetivos son ambiciosos,
    solo tenemos 30 horas para
    experimentar y este curso
    tiene una serie de
    dependencias que hay que
    “inyectar”:
    Consola Linux
    Git
    PHP
    Drupal (Inside y Outside)

    View Slide

  14. 1- Proyecto de
    Sitebuilding
    Crearemos un sitio web
    personal al que iremos
    añadiendo funcionalidades y
    sobre el que iremos
    practicando.
    2- Proyecto de
    desarrollo de un
    módulo Drupal
    Crearemos un módulo
    Drupal de manera
    colaborativa mediante
    parches en los repositorios
    oficiales de Drupal.org
    Mientras realizamos este curso y antes de terminar, realizaremos dos pequeños
    proyectos prácticos de manera complementaria y de forma iterativa:

    View Slide

  15. Sesión 1 - Bloque 3: Instalando Drupal
    EJERCICIO 1
    Y para terminar esta primera sesión,
    vamos a practicar un poco.
    Primer ejercicio: Instalemos Drupal

    View Slide

  16. Apache / Nginx
    MySQL / SQLite
    PHP
    https://www.drupal.org/download
    Requisitos

    View Slide

  17. View Slide

  18. EJERCICIO 2
    Ahora crearemos
    nuestro primer
    tipo de contenido y
    nuestro primer
    nodo en Drupal.

    View Slide

  19. Uno de nuestros
    nuevos amigos:
    Devel Generate
    https://www.drupal.org/project/devel
    EJERCICIO 3
    Instalamos y activamos el módulo Devel
    Generate

    View Slide

  20. Sesión 2 - Bloque 1: Historia de Drupal
    ● Dos estudiantes de la universidad de Amberes (Dries Buytaert y Hans Snijder), pensaban cómo
    comunicarse con el resto de estudiantes intentaron construir un panel de anuncios online para
    intercambiar mensajes.
    ● Ese pequeño panel fue evolucionando y se fue ampliando el número de usuarios, con lo que poco a
    poco se fue desarrollando un esqueleto inicial de gestor de contenidos en una especie de Intranet
    universitaria.
    ● Dries consideró “dorp”, una palabra que en holandés significa “pueblo”, pero al teclear introdujo
    “Drop” y así se quedó. Lanzó drop.org como una plataforma a medio camino entre el foro, red social y
    tablón de contenido.
    ● La primera versión libre de Drupal se liberó en 2001
    ● Actualmente está liberado bajo una licencia GPL 2 y 3 , lo que permite entre otras cosas, descargarlo,
    reutilizarlo, modificarlo y distribuir tus cambios ( lo que son las cuatro libertades básicas del Software
    Libre ) a partir del software alojado enDrupal.org y poder combinarlo con cualquier otro software
    cuya licencia sea compatible con las propias de Drupal.

    View Slide

  21. Drupal.org en el año 2002, con unos ocho sitios web registrados construidos con Drupal:
    Unos años más tarde:

    View Slide

  22. ¿Cómo se consigue esto?
    ● En la comunidad alrededor de Drupal hay miles de personas contribuyendo activamente.
    ● Con diferentes perfiles: desde desarrolladores que trabajan en el core hasta
    mantenedores de módulos, pero además multitud de perfiles no específicamente
    tecnológicos.
    ● Diseñadores que proponen mejoras de UX para las interfaces tanto para la navegación a
    través del sitio web como para las vistas internas de gestión en menús de administración
    y módulos, traductores que se encargan de hacer que cada versión del core de Drupal y
    sus módulos estén disponibles en algún idioma específico y muchas más personas
    dedicadas a documentar, actualizar y editar los contenidos disponibles, las guías y
    manuales de instalación y recomendaciones.
    ● Todo un ecosistema de participantes y colaboradores que hacen que actualmente, las
    cifras en torno a Drupal sean realmente impresionantes: más de treinta y cinco mil
    módulos disponibles para diferentes versiones del core de Drupal, más de dos mil temas
    visuales y unos dos mil commits enviados de media a la semana.
    ● Más de mil versiones configuradas a modo de “distribuciones”, es decir, adaptaciones de
    Drupal como herramientas de propósito específico debidamente “profileadas”
    (disculpenme el palabro) para usos concretos: gestión de proyectos y tareas con
    OpenAtrium, construcción de comunidades con Drupal Commons e incluso una versión
    para iglesias y cultos religiosos: OpenChurch.

    View Slide

  23. Hitos:
    ● Drupal 1.0 - enero 2001
    ● Drupal 4.0 - junio 2002
    ● Drupal 4.1 - 4.7 2004 - 2006
    ● Drupal 5 - junio 2007
    ● Drupal 6 - febrero 2008
    ● Drupal 7 - junio 2011
    ● Drupal 7.56 - junio 2017
    ● Drupal 8 - noviembre 2015
    ● Drupal 8.5 - marzo 2018
    Fuentes:
    ● https://betabeers.com/blog/a-quince-anos-vis
    ta-la-primera-release-drupal-239/
    ● https://www.drupal.org/about/history
    ● http://www.comunic-art.com/historia-de-dru
    pal
    ● https://opensource.com/life/16/9/drupal-evol
    ution
    ● https://en.wikipedia.org/wiki/Drupal
    ● https://www.drupal.org/case-studies
    ● http://cgit.drupalcode.org/drupal/plain/CHA
    NGELOG.txt?id=497914920385b7016ac9c
    9367e0198530787adf2
    COMUNIDAD DRUPAL
    DRUPAL ASSOCIATION
    DRUPAL.ORG
    DRUPAL EN PAÍSES
    DRUPAL EN REGIONES
    DRUPAL EN CIUDADES
    https://groups.drupal.org/
    https://www.drupical.com/

    View Slide

  24. https://dri.es/state-of-drupal-
    presentation-september-2017

    View Slide

  25. Sesión 2 - Bloque 2: ¿Dónde está Drupal?

    View Slide

  26. View Slide

  27. En Github también hay Drupal

    View Slide

  28. View Slide

  29. ¿Git? ¿Qué Git?
    https://www.codeschool.com/courses/git-real
    https://www.codeschool.com/courses/try-git
    https://www.devroom.io/2009/10/26/how-to-create-and-apply-a-patch-with-git/
    https://coderwall.com/p/yeh5tw/how-to-create-and-apply-a-patch-with-git
    https://guides.github.com/activities/hello-world/
    https://github.com/flowsta/github
    https://product.hubspot.com/blog/git-and-github-tutorial-for-beginners

    View Slide

  30. Sesión 2 - Bloque 3: Configuración de Drupal
    Repasemos antes del siguiente
    ejercicio:

    View Slide

  31. Vamos a configurar varias cosas en
    nuestro Drupal:
    1. Roles de usuario
    2. Tipos de Contenido
    3. Vistas
    4. Bloques
    EJERCICIO 4

    View Slide

  32. ¿El Sandbox de Drupal.org?
    https://www.drupal.org/user

    View Slide

  33. View Slide

  34. EJERCICIO 5
    Proyectos
    colaborativos en
    Git/Github
    1. Distribución en
    Equipos
    2. Sincronización
    local/remoto
    3. Push / Pull
    request

    View Slide

  35. Sesión 3 - Bloque 1: Estructura de Drupal
    ¿Hacemos un poco de...

    View Slide

  36. Autoloader
    Composer.json
    install.php
    update.php
    Core/
    Modules/
    Themes/
    Sites/
    Themes/
    Vendor/
    ¿Cómo está organizado Drupal?

    View Slide

  37. View Slide

  38. View Slide

  39. install.php
    update.php
    autoload.php
    composer.json
    core/
    modules/
    themes/
    sites/
    vendor/

    View Slide

  40. Sesión 3 - Bloque 2: Módulos en Drupal
    “A module is an add-on which provides specialized
    functionality to Drupal. Some modules are already
    components of Drupal. Others are developed by the user
    community and made available to you through the Drupal
    Cloud service. Module details are described in the Advanced
    Help menu.”
    https://www.drupal.org/project/project_module

    View Slide

  41. View Slide

  42. Tipos de módulos en Drupal
    Tipos de módulos (por ubicación):
    Módulos de core
    Módulos contribuidos
    Módulos custom
    Tipos de módulos (por funcionalidad):
    Módulos de desarrollo
    Módulos de seguridad
    Módulo de migración
    Módulos de SEO

    View Slide

  43. Backup and Migrate:
    https://www.drupal.org/project/backup_migrate
    Masquerade:
    https://www.drupal.org/project/masquerade
    XMLSitemap:
    https://www.drupal.org/project/xmlsitemap
    Metatag: https://www.drupal.org/project/metatag
    G.A:
    https://www.drupal.org/project/google_analytics
    Quicktabs:
    https://www.drupal.org/project/quicktabs
    Dependencias
    Versiones
    Requisitos
    Estado (rc, alpha,
    beta, dev, etc).

    View Slide

  44. EJERCICIO 6:
    LOCALIZAR
    MÓDULOS
    INTERESANTES E
    INSTALARLOS EN
    NUESTRO
    DRUPAL
    wget
    ftp
    interface
    composer
    drush

    View Slide

  45. Sesión 3 - Bloque 3: Drush en Drupal

    View Slide

  46. curl -sS https://getcomposer.org/installer | php
    mv composer.phar /usr/local/bin/composer
    ln -s /usr/local/bin/composer /usr/bin/composer
    git clone https://github.com/drush-ops/drush.git /usr/local/src/drush
    cd /usr/local/src/drush
    git checkout 8.1.15 #or whatever version you want.
    ln -s /usr/local/src/drush/drush /usr/bin/drush
    composer install
    drush --version
    https://github.com/drush-ops/drush/releases
    Drush

    View Slide

  47. drush dl drupal
    Utilidades frecuentes Drush
    dl
    en / en -y
    dis
    cc
    pml
    cron
    pm-uninstall
    ard
    vl
    va
    up --security-only -n
    https://drushcommands.com
    EJERCICIO 7: Vamos a crear users con Drush

    View Slide

  48. Utilidades
    frecuentes Drush
    role-add-perm (rap): Grant a
    specified permission to a role.
    role-create (rcrt) Create a new role.
    role-list (rls) Display a list of all
    roles defined on the system. If a
    role name is provided as an
    argument, then all of the
    permissions of that role will be
    listed. If a permission name is
    provided as an option, then all of
    the roles that have been granted
    that permission will be listed.
    role-delete (rdel) Delete a role.
    role-remove-perm Remove a
    specified permission from a role.
    (rmp)
    updatedb
    pml
    user-cancel
    drush dis

    View Slide

  49. EJERCICIO 8:
    Realizar un backup
    de nuestro Drupal,
    instalar un nuevo
    Drupal e importar
    el backup
    (todo vía Drush)
    https://drushcomman
    ds.com/drush-8x/cor
    e/archive-dump/
    https://drushcomman
    ds.com/drush-8x/cor
    e/archive-restore/
    https://drushcomman
    ds.com/drush-8x/cor
    e/php-script/

    View Slide

  50. Sesión 4 - Bloque 1: Git, Github & Drupal
    PRIMERA PARTE: UN POCO DE GIT
    (Esquema intuitivo de GIT)

    View Slide

  51. Podemos decir de manera resumida que un repositorio git
    consiste en tres estructuras de árboles que git gestiona.
    El primero es nuestro directorio de trabajo que tiene todo
    los archivos.
    El segundo es un índice que trabajo como registro y
    almacenamiento y finalmente el head, que consiste en
    apuntar al último cambio enviado, el más reciente.
    Workflow elemental de GIT

    View Slide

  52. Workflow elemental de GIT
    1. Working directory: es el directorio donde tengamos el código sobre el que
    vamos a trabajar.
    2. Staging area(Index): es el lugar donde se almacenan los archivos que han
    sido modificados, antes de escribir los cambios en el repositorio local.
    3. Local repo: Repositorio local donde almacenamos y controlamos las
    diferentes ramas y estados de nuestro código, se encuentra en el directorio
    .git de nuestro Working directory.
    4. Remote repo: Repositorio central con el cual se sincronizan el resto de
    usuarios.

    View Slide

  53. Inicializar un repositorio: git init
    Copia local -> git clone /path/to/repository
    Copia remoto -> git clone
    [email protected]:/path/to/repository
    El git clone que usamos ayer -> git clone
    https://github.com/drush-ops/drush.git
    /usr/local/src/drush
    (instrucción - ruta de origen - ruta de
    destino)
    git add nombrearchivo -> Añade archivo al
    index del repositorio local, se puede usar
    para añadir todos los archivos.
    git status -> nos dice todos los cambios que
    hay en el index.
    git commit -am “message” ->Hace commit
    de todos los cambios del index al
    repositorio local.
    git commit -m “message” archivos -> Hace
    commits de los archivos indicados.
    git log -> Muestra el historial de commits.
    git diff commitX commitY –> muestra las
    diferencias entre el commitX y el commitY.
    git checkout -- archivo –> Modifica archivo
    al estado en el que se encontraba en el
    último commit.
    git pull –> Actualiza el repositorio local con
    el repositorio remoto.
    git push –> Manda los cambios del
    repositorio local al repositorio remoto.

    View Slide

  54. HACIENDO PARCHES EN GIT
    Conceptualmente, consiste en hacer un
    registro cotejado de las diferencias entre un
    código que está registrado con partes que no
    lo están y han cambiado.
    1- Tenemos un código que nos hemos
    descargado o tenemos bajo control de
    versiones.
    2- Realizamos cambios en el código.
    3- Pedimos a git que nos genere un fichero
    comparado.
    git diff > cambios.patch
    Otras personas aplicarán el parche:
    git apply cambios.patch
    Si quieres ver los cambios que trae el parche:
    git apply --stat cambios.patch
    Referencias:
    http://rogerdudler.github.io/git-guide
    /
    https://git-scm.com/
    https://github.com/trein/dev-best-pra
    ctices/wiki/Git-Commit-Best-Practice
    s
    https://github.com/trein/dev-best-pra
    ctices/wiki/Git-Tips
    https://wildlyinaccurate.com/a-hacke
    rs-guide-to-git/
    https://github.com/git-tips/tips

    View Slide

  55. Sesión 4 - Bloque 2: Trabajando con Github

    View Slide

  56. FORK & PULL REQUEST

    View Slide

  57. Local & Remoto
    $ git push origin master
    + Identificación Github: usuario y contraseña

    View Slide

  58. EJERCICIO 9: WORKFLOW BÁSICO EN
    GITHUB
    1 - Crear un repositorio nuevo en Github,
    inicialmente vacío
    2- Hacer clone en local y traer el repo
    3- Crear un “Hello World” en PHP dentro
    del repositorio local

    4- Hacer Push al repositorio remoto
    EJERCICIO 10: WORKFLOW
    COLABORATIVO EN GITHUB
    1 - Nos separamos por equipos y
    seleccionamos un usuario como repositorio
    central.
    2- Fork del proyecto central.
    3- Paso a local
    4- Desarrollamos el Hello World, una
    pequeña funcionalidad por persona.
    5- Push a remoto
    6- Pull Request e integración

    View Slide

  59. Sesión 4 - Bloque 3: Desarrollo de Módulos
    SINTAXIS YAML

    View Slide

  60. En Drupal, existe una parte de configuración y una parte de código a resolver.
    primer_ejemplo.info.yml
    name: Primer Ejemplo
    type: module
    description:
    package:
    core:
    EJERCICIO 11: Nuestro primer módulo Drupal
    1- Cambiamos el nombre de carpeta.
    2- Cambiamos nombre del fichero.
    3- Cambiamos los valores de core.
    4- Quitamos las comillas en description.
    ESTRUCTURA ELEMENTAL DE MÓDULOS

    View Slide

  61. EJERCICIO 12: Cambios en nuestro primer módulo Drupal
    1- Añadimos dependencias:
    dependencies:
    - drupal:pruebainvent
    2- Añadimos ruta y controlador:
    primer_ejemplo.routing.yml
    example_2.description:
    path: 'example'
    defaults:
    _controller: '\Drupal\primer_ejemplo\Controller\ExampleController::build'
    _title: 'Example hello'
    requirements:
    _permission: 'access content'

    View Slide

  62. Controladores Directorios

    View Slide

  63. Sesión 5 - Bloque 1: Retrospectiva
    NUESTRO PRIMER MÓDULO EN DRUPAL 8:
    - Habíamos visto el formato YAML para la estructura de
    un módulo.
    - Habíamos creado nuestro primer módulo.
    - Lo habíamos instalado.
    - Habíamos declarado sus dependencias.
    - Habíamos creado ruta y controlador.

    View Slide

  64. Fichero: ejemplo_1.info.yml
    ----
    name: Ejemplo 1
    type: module
    description: "Primer ejemplo del curso de Drupal"
    package: Curso Drupal
    core: 8.x
    Ejemplo 1

    View Slide

  65. Ejemplo 2
    Fichero: ejemplo_2.info.yml
    ----
    name: Ejemplo 2
    type: module
    description: "Segundo ejemplo del curso de Drupal"
    package: Curso Drupal
    core: 8.x

    View Slide

  66. Fichero: ejemplo_2.routing.yml
    ----
    # Definimos una ruta para el evento de
    nuestro ejemplo.
    ejemplo_2.description:
    path: 'ejemplo2'
    defaults:
    _controller:
    '\Drupal\ejemplo_2\Controller\ExampleCo
    ntroller::build'
    _title: 'Ejemplo 2 Hello World'
    requirements:
    _permission: 'access content'
    Fichero: ExampleController.php
    src/Controller/
    ----
    namespace Drupal\ejemplo_2\Controller;
    use
    Drupal\Core\Controller\ControllerBase;
    class ExampleController extends
    ControllerBase {
    public function build() {
    $build = [
    '#type' => 'markup',
    '#markup' => 'Hello World!',
    ];
    return $build;
    }
    }

    View Slide

  67. EJERCICIO 13: MÓDULOS DRUPAL EN
    MODO COLABORATIVO
    0- Configuramos nuestra conexión ssh
    para el uso de git en Drupal.org
    1- Subimos todos y todas nuestro
    primer módulo Drupal al Sandbox de
    Drupal.org
    2- Volvemos a organizarnos por
    equipos y a seleccionar un proyecto
    central
    3- Checkout del proyecto en entorno
    local.
    4- Creamos cambios sobre el módulo
    5- Generamos un parche de cambios y
    lo subimos al proyecto
    6- Integramos parches
    Formato de nombrado de parche en
    Drupal:
    proyecto-tarea-IssueNumber-CommentNu
    mber.patch
    git diff >
    geohide-filter-subsystem-by-city-region-c
    ountry-2901393-3.patch

    View Slide

  68. Sesión 5 - Bloque 2: Construyendo módulos
    EJERCICIO 14: RUTAS Y CONTROLADORES
    DRUPAL
    1- Volvemos a nuestro módulo de referencia
    2- Le añadimos una nueva ruta
    3- Le añadimos un nuevo controlador y un nuevo contenido
    a mostrar

    View Slide

  69. EJERCICIO 15: VARIABLES Y PLANTILLAS TWIG
    1- Volvemos a nuestro módulo de referencia.
    2- Necesitamos una nueva carpeta “templates” para guardar la plantilla de extensión
    .html.twig
    3- Necesitamos modificar el controlador para decirle que active la plantilla.
    4- Necesitamos una nueva variable en el controlador.
    5- Necesitamos un fichero de permisos primer_ejemplo.permissions.yml

    Hello World!

    This is my First Module
    Here is the value:
    {{ ejemplo_var }}
    -------------------------------------------
    $build = [
    '#theme' => 'primer_ejemplo_theme',
    '#ejemplo_var' => '9876543210',
    ];
    # Custom permisions.
    primer ejemplo access:
    title: 'Primer Ejemplo Access'
    description: 'Access to the example page.'
    restrict access: true

    View Slide

  70. Sesión 5 - Bloque 3: Sitebuilding con Drupal
    VIEWS en Drupal
    Construcción Gráfica
    de consultas SQL a
    base de datos.
    Útil para:
    Listados
    Exportación de datos
    Búsquedas y resultados

    View Slide

  71. View Slide

  72. View Slide

  73. EJERCICIO 16: Vamos a
    configurar Views para
    construir listados de
    contenidos en nuestro
    Drupal.

    View Slide

  74. View Slide

  75. Sesión 6 - Bloque 1: Theming con Drupal
    Conceptualmente, un Theme es una estructura visual que define una serie de regiones,
    organización visual, plantillas y recursos para construir la interfaz de nuestro proyecto.
    El conjunto de elementos se denomina “Theme” y forma parte de nuestro proyecto:

    View Slide

  76. ¿Qué contiene un Theme? Veamos:
    Theming con Drupal

    View Slide

  77. Theming con Drupal
    Subtheming: creando un tema hijo de otro Theme ya existente
    Estructura básica:
    Declarando la herencia en el .info.yml:

    View Slide

  78. THEMING CON DRUPAL
    EJERCICIO 17: Vamos a crear un subtheme
    a partir de Bartik
    Referencias:
    https://www.hywel.me/drupal/2016/03/0
    6/drupal-8-sub-themes-and-stylesheets.ht
    ml
    https://www.drupal.org/node/2165673
    https://stackoverflow.com/questions/3619
    5055/creating-a-bartik-sub-theme-in-drup
    al-8
    THEMING CON DRUPAL
    # How to know what is the current theme on your
    Drupal site
    # move inside project root directory var/www
    and then
    drush status theme
    #the above command will tell you the current
    theme set as default for site and admin both
    # Change the site default theme using the below
    command (use theme name of your choice)
    drush vset theme_default garland
    # the above command will make garland as default
    site theme
    # now change admin default theme using the below
    command (use theme name of your choice)
    drush vset admin_theme garland
    # Do Ctrl+r to flush cache and reload your
    Drupal Site

    View Slide

  79. theme.libraries.yml
    global-styling:
    css:
    component:
    css/style.css: {}
    THEMING CON DRUPAL
    # Defines libraries group in wich we can add css/js
    libraries:
    - mytheme/global-styling
    # Regions
    regions:
    header: Header
    primary_menu: 'Primary menu'
    secondary_menu: 'Secondary menu'
    page_top: 'Page top'
    page_bottom: 'Page bottom'
    highlighted: Highlighted
    featured_top: 'Featured top'
    breadcrumb: Breadcrumb
    content: Content
    sidebar_first: 'Sidebar first'
    sidebar_second: 'Sidebar second'
    featured_bottom_first: 'Featured bottom first'
    featured_bottom_second: 'Featured bottom second'
    featured_bottom_third: 'Featured bottom third'
    footer_first: 'Footer first'
    footer_second: 'Footer second'
    footer_third: 'Footer third'
    footer_fourth: 'Footer fourth'
    footer_fifth: 'Footer fifth'

    View Slide

  80. Sesión 6 - Bloque 2: Sitebuilding con Drupal
    EJERCICIO 18 (INTEGRAL): SITEBUILDING CON DRUPAL
    ¿Qué vamos a construir?
    Vamos a hacer un sitio web que muestre noticias y artículos
    de blog.
    ¿Cómo instalar un Theme en Drupal?
    /themes

    View Slide

  81. SITEBUILDING CON DRUPAL
    Vamos a crear un sitio web con Drupal 8
    Probaremos con Zircon, un theme visual preparado para Drupal8:
    https://ftp.drupal.org/files/projects/zircon-8.x-1.0-rc1.tar.gz
    El Theme: zircon_d8-8.1.1.zip
    Instrucciones: https://www.weebpal.com/guides/step-step-guide-install-drupal-8-theme

    View Slide

  82. EJERCICIO INTEGRAL: SITEBUILDING CON DRUPAL
    Características:
    Permite comentarios.
    Tres roles de usuario: administrador, editor de noticias y editor de artículos.
    Necesitamos un logo propio y un nombre del sitio web.
    Necesitamos cambiar colores.
    Necesitamos desplazar la barra de búsqueda.
    Necesitamos módulos SEO: Metatags, sitemapxml, GoogleAnalytics
    Necesitamos un listado de noticias ordenadas por fechas
    Necesitamos varios listados de artículos de blog ordenados por criterios varios.
    ¿Probamos Panels y Quicktabs? :-)

    View Slide

  83. Sesión 6 - Bloque 3: Módulos en Drupal.org
    Retomamos EJERCICIO 13: MÓDULOS DRUPAL EN MODO COLABORATIVO
    0- Configuramos nuestra conexión ssh para el uso de git en Drupal.org
    1- Subimos todos y todas nuestro primer módulo Drupal al Sandbox de Drupal.org.
    2- Volvemos a organizarnos por equipos y a seleccionar un proyecto central.
    3- Checkout del proyecto en entorno local.
    4- Creamos cambios sobre el módulo.
    5- Generamos un parche de cambios y lo subimos al proyecto.
    6- Integramos parches.
    Formato de nombrado de parche en Drupal:
    proyecto-tarea-IssueNumber-CommentNumber.patch
    git diff > geohide-filter-subsystem-by-city-region-country-2901393-3.patch

    View Slide

  84. Pensemos en funciones que podría tener nuestro módulo
    Idea: Distancia de Hamming
    https://es.wikipedia.org/wiki/Distancia_de_Hamming

    View Slide

  85. Implementación de la Distancia de Hamming en PHP
    function distance($a, $b)
    {
    if (strlen($a) != strlen($b)){
    throw new InvalidArgumentException('DNA strands must be of equal length.');
    }
    else{
    $dh = 0;
    $a1 = str_split($a);
    $b1 = str_split($b);
    for($i=0; $i < count($a1); $i++){
    if($a1[$i] != $b1[$i]){
    $dh++;
    }
    }
    }
    return $dh;
    }

    View Slide

  86. ¿Qué necesitamos para
    implementar esas funciones?
    ¿Formulario?
    ¿Campos?
    ¿Ruta de salida?
    ¿Hook_Help?
    ¿Funciones de cálculo?

    View Slide

  87. ¿Cómo nos organizamos
    para el desarrollo?
    Trabajamos por equipos
    Seleccionamos un
    repositorio (Sandbox)
    central
    Tareas atómicas
    Issues
    Prioridades
    Y elaboramos parches

    View Slide

  88. Sesión 7 - Bloque 1: Entidades
    ¿Qué es una Entidad?
    Conceptualicemos de manera intuitiva
    Una entidad no deja de ser en cierta manera, una clase
    abstracta, una especie de contrato elemental en el que
    modelamos a alto nivel una figura que luego iremos
    particularizando.

    View Slide

  89. Para particularizar esa entidad, construimos “bundles” es
    decir, modelos aproximados que generamos mediante el
    añadido de campos que van a tratar con datos e
    información.
    A partir de esos bundles, en último nivel generaríamos
    sucesivos objetos específicos con los que trataríamos.
    Y en última instancia, tomaríamos esos objetos y los
    manejaríamos en modo CRUD, lo habitual.

    View Slide

  90. Hasta ahora, todo lo resolviamos con un “ecosistema”
    preconfigurado formado por Nodos, Usuarios, Tipos de
    contenido, Términos de Taxonomías y/o Comentarios.
    Y sin embargo, en realidad esos elementos también forma
    parte de la estructura de Entidades y Bundles.

    View Slide

  91. View Slide

  92. Haciendo un paralelismo
    entre Drupal / POO

    View Slide

  93. View Slide

  94. ¿Criterios para decidir?
    Un ejemplo:
    Ejemplo recogido en: https://tifon.cl/blog/moncadanicolas/entidades-en-drupal

    View Slide

  95. A nivel de código, necesitamos conocimiento de la Entity
    API de Drupal:
    https://www.drupal.org/docs/8/api/entity-api/working-wit
    h-the-entity-api
    ¿Practicamos?
    EJERCICIO 19: Creación de Tipos de Entidades y bundles
    https://www.drupal.org/project/search_api
    https://www.drupal.org/project/eck

    View Slide

  96. Sesión 7 - Bloque 2: Sitebuilding con Drupal
    Índices y Servidores para búsquedas
    - Server
    - Index
    - Backend (BBDD, Solr)
    - Facet API
    - Better Exposed Filters (BEF)
    - Search API

    View Slide

  97. View Slide

  98. View Slide

  99. View Slide

  100. View Slide

  101. Sesión 8 - Bloque 1: Scaffolding con Drupal
    Scaffolding = ¿Andamiaje?
    Construir estructuras iniciales para elaborar un proyecto

    View Slide

  102. Drupal Code Generator (DCG)
    https://github.com/Chi-teck/drupal-code-generator
    Instalación
    1. Download the latest stable release of the code generator.
    2. Make the file executable.
    3. Move it to a directory that is part of your PATH.
    release_url=https://api.github.com/repos/chi-teck/drupal-code-generator/releases/lates
    t
    wget $(wget -qO- $release_url | awk -F'"' '/browser_download_url/ { print $4 }')
    chmod +x dcg.phar
    sudo mv dcg.phar /usr/local/bin/dcg
    dcg --version

    View Slide

  103. Drupal Code Generator (DCG)
    ¿Qué podemos hacer?

    View Slide

  104. Drupal Code Generator
    (DCG)

    View Slide

  105. View Slide

  106. EJERCICIO 20:
    Creación de
    módulos y Themes
    con DCG

    View Slide

  107. Sesión 8 - Bloque 2: Sitebuilding con Drupal
    ¿Volvemos a nuestro pequeño Drupal?
    Vamos a practicar con vocabularios y taxonomías. EJERCICIO 21: Construcción de taxonomías para
    contenido

    View Slide

  108. Tenemos pendiente
    construir un módulo de
    manera colaborativa que
    resuelva la distancia de
    Hamming entre dos cadenas.
    ¿Retomamos?

    View Slide

  109. EJERCICIO 1: Instalación de Drupal en entorno local
    EJERCICIO 2: Creación de Tipo de Contenido y primeros nodos.
    EJERCICIO 3: Instalación módulo Devel y generación automática de nodos.
    EJERCICIO 4: Configuración de Roles de usuario, TdC, Vistas, Bloques
    EJERCICIO 5: Proyectos colaborativos en Git/Github
    EJERCICIO 6: Localizar módulos interesantes e instalarlos en nuestro Drupal
    EJERCICIO 7: Crear usuarios con Drush
    EJERCICIO 8: Backup de Drupal, instalación de backup (todo vía Drush)
    EJERCICIO 9: Workflow básico en Github
    EJERCICIO 10: Workflow colaborativo en Github
    EJERCICIO 11: Nuestro primer módulo Drupal
    Listado de ejercicios

    View Slide

  110. Listado de ejercicios
    EJERCICIO 12: Cambios en nuestro primer módulo Drupal
    EJERCICIO 13: Módulos Drupal en modo colaborativo
    EJERCICIO 14: Rutas y controladores
    EJERCICIO 15: Variables y plantillas Twig
    EJERCICIO 16: Configurar Views para construir listados de contenidos
    EJERCICIO 17: Crear un subtheme a partir de Bartik
    EJERCICIO 18 (Integral): Sitio web con noticias y artículos de blog
    EJERCICIO 19: Creación de tipos de entidades y bundles
    EJERCICIO 20: Creación de módulos y themes con DCG
    EJERCICIO 21: Construcción de taxonomías para contenido
    EJERCICIO FINAL: Retrospectiva

    View Slide

  111. Retrospectiva Final
    Hemos llegado al ejercicio final:
    Retrospectiva

    View Slide

  112. Compañeros y compañeras, me temo que ha llegado…
    THE END
    30 HORAS, 8 SESIONES, 20
    EJERCICIOS, TODO UN
    ECOSISTEMA...

    View Slide

  113. Molaría hacer un poco de retrospectiva: hemos compartido
    8 sesiones, treinta horas totales en las que hemos visto y
    hemos practicado muchas cosas de diferentes ámbitos
    dentro del ecosistema Drupal.
    Herramientas: Drush, DCG
    Sitebuilding
    Módulos
    Theming
    Comunidad
    Plataformas
    Stack Tecnológico

    View Slide

  114. Las preguntas serían...
    ¿Hemos sido capaces de
    abordar y afrontar los
    objetivos del curso?
    ¿Se han cumplido vuestras
    expectativas?
    ¿Hemos resuelto bien las
    intersecciones de intereses?

    View Slide

  115. Lo primero es agradeceros a
    vosotros como grupo…
    Lo segundo es agredecer a
    las personas que nos ayudan.
    Estas cosas no las aprendí
    solo, las aprendí
    hablando/escuchando/practi
    cando/observando/leyendo
    a:
    @pcambra
    @juampynr
    @reguiguren
    @alvar0hurtad0

    View Slide

  116. Routing en Drupal “Hacia rutas salvajes” by jansete @jansev3n
    https://docs.google.com/presentation/d/17KVjfmgMtIIIDl0N40Vm1iyaUBg27mGE1hV2
    byIR4OM/edit?usp=sharing
    “Publica tu proyecto en Drupal.org” by Keopx @eguiguren y Alvaro Hurtado
    @alvar0hurtad0
    https://2014.drupalday.es/sites/default/files/publica_tu_proyecto_en_drupal.org_.pdf
    “Docker & Drupal”, by Ignacio López Flores, @ignaciolflores
    https://introbay.github.io/drupalday2017/#/
    “External Entities”, by Rodrigo Aguilera, @marinero
    http://rodrigoaguilera.gitlab.io/external-entities-talk/#/
    “Headless Drupal: The Gizra Way”, by @RoySegall and @David_Baltha
    https://docs.google.com/presentation/d/1RIMBy8Tjf6yn-fZuBVv381n1KfLGEWNs2v56
    l5i1WJw/edit?usp=sharing

    View Slide