Skip to main navigation Skip to main content Skip to page footer

Des contributeurs issus de la communauté Symfony participent à la documentation de TYPO3 : interface de recherche

Lorsque les fonctionnalités nettement améliorées de docs.typo3.org ont été mises en place, il manquait encore une interface utilisateur attrayante. Ce travail a été mené à bien par deux entreprises françaises issues de l'écosystème Symfony. Voici leur histoire.

Vous avez peut-être déjà lu l’article consacré aux améliorations apportées à la fonctionnalité de recherche sur docs.typo3.org. Cependant, l’histoire de la refonte graphique n’a pas encore été racontée. Elle est le fruit d’une collaboration entre les sociétés JoliCode et Premier Octet. J’ai discuté avec Damien Alexandre, de JoliCode, pour savoir comment tout cela a vu le jour.

Au cœur de l’écosystème Symfony depuis le début

« Nous sommes deux entreprises françaises à taille humaine qui travaillent ensemble », explique Damien. « JoliCode s’occupe du backend et Premier Octet du frontend. Nous croyons fermement à l’open source et y contribuons régulièrement. » Ensemble, les deux entreprises travaillent avec des technologies telles que Symfony, React, Rust, Next.js et Elasticsearch.

« Nous sommes des fossiles de l’écosystème Symfony », déclare Damien. « Certains d’entre nous l’utilisaient déjà avant la sortie de la version 1.0. Nous avons très vite été séduits par Symfony. À l’époque, il nous manquait vraiment un framework solide et affirmé pour industrialiser correctement nos projets. Nous avons constaté une amélioration considérable de la qualité — et nous ne sommes jamais revenus en arrière. » Aujourd’hui, ils sont contributeurs et sponsors du noyau Symfony, et se considèrent comme des experts de ce framework.

TYPO3 repose sur des bases solides

TYPO3 était une nouvelle expérience pour eux, mais Damien était enthousiaste à l’idée de se lancer dans cette aventure. « Je n’avais jamais eu l’occasion de travailler sur un projet TYPO3, c’est donc vraiment intéressant pour nous de faire nos premiers pas dans cet univers. J’apprécie beaucoup le fait que TYPO3 utilise Doctrine et de nombreux composants de Symfony 7. Nous savions dès le départ qu’il reposait sur des bases solides. »

Les deux entreprises ont pris contact avec la responsable de l’équipe de documentation TYPO3, Lina Wolf, car celle-ci avait lancé un appel à contributions et cherchait quelqu’un pour finaliser la partie front-end de la fonctionnalité de suggestions de recherche pour la documentation TYPO3.

« Aider un projet open source qui en a besoin est très gratifiant », explique Damien, « et nous étions convaincus que cela relevait de nos compétences. Nous avons donc conclu un accord pour finaliser l’intégralité de la fonctionnalité moyennant une petite rémunération forfaitaire. » Les 3 000 € provenant du budget de l’équipe de documentation ont finalement couvert environ la moitié du coût, JoliCode et Premier Octet ayant fait don du reste au projet TYPO3.

Bureau partagé, travail partagé

Damien a travaillé en collaboration avec Colin Regourd, de Premier Octet. Les deux hommes partagent un bureau, « ce qui était donc très pratique pour nous », explique Damien.

Ensemble, ils ont travaillé sur deux dépôts au sein de l’organisation GitHub de la documentation TYPO3 : t3docs-search-indexer pour l’API et les suggestions Elasticsearch, et render-guides pour le front-end proprement dit.

« La partie Elasticsearch était déjà très aboutie, donc l’essentiel du travail s’est concentré sur le front-end », précise Damien. « Avec l’aide de Lina Wolf, nous avons réussi à faire fonctionner ces projets en local, puis il ne restait plus qu’à comprendre comment ils interagissaient entre eux. »

Une approche prudente et non intrusive, alliant une bonne expérience utilisateur

Colin et Damien apprécient la façon dont la documentation TYPO3 est conçue. « Il est indispensable de n’avoir que du HTML statique à héberger en ligne », explique Damien. En revanche, cela a également ralenti quelque peu le processus de développement : « Lorsque l’on modifie quelque chose, il faut reconstruire toute la documentation. »

La mise en œuvre finale ajoute un composant React pour le panneau de recherche. Damien explique que leur travail reposait sur quatre motivations principales :

  • Être aussi prudent que possible en matière de dépendances. (« Nous avons ajouté React, react-dom et lodash.debounce, c’est tout », précise Damien.)
  • Ne rien modifier d’autre sur la page.
  • Être le moins intrusif possible.
  • Offrir une bonne expérience utilisateur.

Essayez la fonctionnalité de recherche sur docs.typo3.org

Additional contributors

  • Proofreader
    • Felicity Brand