Informatique

Générer une page dans Murph

Murph est un framework open-source pour construire des CMS. Il est développé à l'aide de Symfony et permet de gérer des sites web avec plusieurs noms de domaines et en plusieurs langues.

Cet article fait partie d'une série de tutoriaux pour présenter les fonctionnalités de Murph.

Contrairement à pas mal de CMS, une page permet de rassembler des contenus qui pourront être réutilisés plusieurs fois dans une arborescence, là où certains CMS lient définitivement une page à un élément du menu.

Par ailleurs, une page ne contient que des données qui pourront être présentées comme on le veut. Autrement dit, la manière de rendre une page est indépendante de la façon de rédiger les contenus.

On va créer une nouvelle page ExamplePage avec ces contenus :

  • un titre title qui sera un champ texte
  • un bloc de contenu content avec l'éditeur TinyMCE

On va ensuite enregistrer la page dans Murph et lui donner le nom Page d'exemple.

core:
    site:
        # ...
        pages:
            App\Entity\Page\ExamplePage:
                name: "Page d'exemple"
                templates:
                    - {name: "Default", file: "page/example/default.html.twig"} 

Quand une page est créée, un template par défaut l'est aussi. Une page peut avoir autant de templates qu'on souhaite.

Éditons le template par défaut pour afficher simplement nos contenus :

{% extends 'base.html.twig' %}

{% block page %}
    <h1>{{ _page.title.value }}</h1>

    {{ _page.content.value|raw }}
{% endblock %}

On peut à présent créer un nouvel élément dans le menu, lui attribuer une nouvelle page et commencer à saisir le contenu.

La documentation complète est disponible sur doc.murph-project.org.


Générer un CRUD dans Murph

Murph est un framework open-source pour construire des CMS. Il est développé à l'aide de Symfony et permet de gérer des sites web avec plusieurs noms de domaines et en plusieurs langues.

Je vais entamer une série de tutoriaux pour présenter les fonctionnalités de Murph.

Cet article va pour expliquer comment utiliser Murph et générer des interfaces de CRUD afin de créer, voir, mettre à jour et supprimer des entités.

Dans un premier temps, il faut créer une nouvelle entité Example. Si vous avez déjà réaliser cette opération, vous pouvez passer à l'étape suivante.

dev@project $ php bin/console make:entity Example

j'ai décidé d'ajouter ces attributs :

  • label de type string obligatoire
  • content de type text obligatoire

On doit maintenant éditer App\Entity\Example et implémenter l'interface App\Core\Entity\EntityInterface :

<?php

namespace App\Entity;

use App\Core\Entity\EntityInterface;
use App\Repository\ExampleRepository;
use Doctrine\ORM\Mapping as ORM;

/**
 * @ORM\Entity(repositoryClass=ExampleRepository::class)
 */
class Example implements EntityInterface
{

Puis il faut mettre à jour la base de données :

dev@project $ make doctrine-migration

Ensuite on va générer :

  • le générateur de requête App\Repository\ExampleRepositoryQuery
  • la fabrique App\Factory\ExampleFactory
  • le formulaire d'édition App\Form\ExampleType
dev@project $ php bin/console make:repository-query ExampleRepository
dev@project $ php bin/console make:factory ExampleFactory Example
dev@project $ php bin/console make:form ExampleType Example

Générons à présent le CRUD :

dev@project $ php bin/console make:crud-controller \
  ExampleAdminController \
  Example \
  ExampleRepositoryQuery \
  ExampleFactory \
  ExampleType

Enfin, ajoutons le lien dans le menu du backoffice :

{{ include('@Core/admin/module/_menu_section.html.twig', {label: 'My section'}) }}

<ul class="nav flex-column">
    {{ include('@Core/admin/module/_menu_item.html.twig', {
        id: 'example',
        label: 'Examples',
        route: path('admin_example_index'),
        icon: 'fa fa-pen'
    }) }}
</ul>

…et c'est terminé !

Vous pouvez commencer à personnaliser le CRUD en modifiant ExampleAdminController et sa methode getConfiguration. La documentation est ici.


Les projets à Tinternet & Cie

L'énergie qui anime Tinternet & Cie est formidable et donne l'opportunité à l'équipe de faire beaucoup de projets !

Ce début d’année a été un véritable virage pour l’association. En effet, nous avons décidé de renforcer notre équipe d’intervenants et d’employer une coordinatrice et nous en sommes très fiers !

Cela a été notamment possible grâce à un projet monté conjointement avec le département. Plus de 150 interventions ont été planifiées ce premier semestre dans de nombreux collèges et lycées. Nous abordons quatre grandes thématiques avec les élèves : la cyberdépendance, le cyberharcèlement, la désinformation et l'identité numérique.

C’est un projet fort, portant sur des sujets compliqués et nous espérons accompagner à nouveau le département dès la rentrée prochaine, mais aussi créer et travailler sur de nouveaux projets et partenariats toujours plus utiles et efficaces.

En plus de cela, l'association a mis en place et continue d'animer une permanence numérique les 2ème et 4ème mercredis de chaque mois au bar Le Pixel à Besançon. C'est un moment privilégié pour échanger sur un Internet plus ouvert, éthique et respectueux de la vie privée. Un véritable laboratoire, où la pratique de l’éducation populaire est plus que jamais de mise. À ces occasions, un travail de fond est mené et permet d’ores et déjà de répondre à bon nombre de questions au sujet des outils qui, selon nous, peuvent répondre aux besoins communs des Internautes, quels qu’ils soient.

Enfin, vous le savez, le mois dernier, nous vous avions invité à suivre une conférence très particulière au sujet du Web 2.0. L'évènement était organisé à l'occasion du festival « D'Autres formes » réalisé par La Rodia. La conférence a rencontré un réel succès. Nous avons eu l'occasion de travailler avec des gens formidables et répondre à de vrai challenges techniques. La conférence mêlait des séquences vidéos enregistrées et du live sur fond vert dans le but de faire naitre une interaction insoupçonnée avec le public. Si vous avez loupé l'évènement, voici une courte vidéo avec les moments forts.

Bon visionnage !

Tinternet & Cie au festival « D'Autres Formes »


Murph v1.13 intègre l'éditeur GrapesJS

L'une des forces de Wordpress est sa ribambelle de plugins dont Elementor qui permet de créer des pages sans toucher au code.

Pour permettre d'éditer du contenu de la même façon, GrapesJS est maintenant nativement intégré dans Murph depuis la version v1.13. Les blocs permettent de créer n'importe quel contenu en s'appuyant sur les composants Bootstrap 4. La version de développement de Murph intègre d'ores et déjà d'autres outils comme les presets webpage et newsletter pour se passer de Bootstrap.

Si vous voulez essayer, un site de démo a été mis en ligne 😏

GrapesJS dans Murph

Pour mettre à jour Murph, rien de plus simple :

$ composer update
$ yarn upgrade
$ make build

Nouveautés dans Murph v1.12

Murph est un framework open-source pour construire des CMS. Il est développé à l'aide de Symfony et permet de gérer des sites web avec plusieurs noms de domaines et en plusieurs langues.

Voici un aperçu des changements depuis la version 1.7 pour laquelle j'avais réalisé un article.

Dépendances

Dans un premier temps et c'est sans doute le changement le plus important, le core du projet a été migré vers un dépôt dédié. Par conséquent, le moteur de Murph peut être installée comme une dépendance classique via composer.

Ainsi, le fichier composer.json du projet murph/murph-skeleton a été réduit au strict nécessaire et permet de mettre à jour facilement Murph.

Dans cette même démarche à faciliter le développement et surtout la mise à jour des dépendances javascript, toutes les dépendances du fichiers package.json ont été migré vers un package node dédié.

À la suite de ces changements, mettre à jour une instance de Murph est très simple :

composer update
yarn upgrade
make build

Nouvelles fonctionnalités et correctifs

Globalement, pas mal de petites corrections ont été apportées. Voici les fonctionnalités implémentées depuis la v1.7.

Le gestionnaire de fichiers permet à présent de renommer un fichier. Seule l'extension du fichier ne peut pas être modifiée pour des questions de sécurité.
Son affichage est également mieux géré dans le cas où plusieurs modales sont affichées (ajout d'un flou sur les modales du dessus).

Il est possible d'indiquer des rôles dans la configuration de Murph afin de définir des permissions sur des éléments d'un menu. Ainsi, une page pourra être restreinte à des utilisateur⋅trices spécifiques.

Afin de réaliser des liens dans un template Twig vers des éléments de la navigation, quatre nouvelles fonctions twig ont été ajoutées : code_url, code_path. Pour gérer les cas d'exceptions, vous pouvez également utiliser : safe_code_url et safe_code_path.
Ces fonctions prennent en paramètres le code du menu et le code du nœud. Le moteur va détecter la navigation courante pour générer le lien. Cette fonctionnalité est très pratique quand plusieurs navigations partagent une arborescence commune et qu'on souhaite faciliter le développement des templates. 

Un nouveau maker symfony a été créé pour générer facilement une nouvelle page. Au même titre que pour générer une entité en ligne de commande, vous pourrez créer et paramétrer une page avec php bin/console make:page.

L'éditeur EditorJS a été ajouté dans Murph et ajoute approche complémentaire à TinyMce pour rédiger du contenu. Comme cet éditeur s'appuie sur l'idée de blocs, un nouvelle fonction twig permet de rendre un contenu édité avec EditorJS : editorjs_to_html. Cette fonction peut prendre un tableau de blocs autorisés à être rendus. Par ailleurs, bien que des vues par défaut existent pour rendre chaque bloc, vous pourrez paramétrer des vues spécifiques pour vos blocs. Cet article est d'ailleurs rédigé avec EditorJS.

La gestion du menu de l'administration de Murph a été simplifiée par l'utilisation de vues pour créer des sections et des éléments de menu.

Enfin, la version de Murph a été ajoutée dans l'interface d'administration en haut à droite.

Installation de Murph

Pour installer et Murph et commencer à développer son CMS, le processus est ultra simple :

composer create-project murph/murph-skeleton MonProjet # Installation du projet
cd MonProjet
cp .env .env.local
vim .env.local 
make build # On génère les données du CMF (base de données, assets, etc.)
php bin/console murph:user:create # Création d'un compte
symfony server:start -d # On lance le serveur web de dev

J'espère que ça vous plaira ☺️