| title |
|---|
Comment ARTE a simplifié le développement multi-plateforme à l’aide d’une API orientée front |
- disponible en 6 langues (FR, DE, EN, ES, PL et IT)
- programmes disponibles sur internet depuis 2007
- sur le web (arte.tv)
- sur mobile et tablette (iOS et Android)
- sur TV connectée (HbbTV, Apple TV et Android TV)
- sur les box FAI (Free et Orange)
- même catalogue de programmes
- structures d'application similaires
Chaque plateforme dispose de ses propres codes et contraintes :
- contrôle à la souris, au doigt ou à la télécommande
- vitesse du réseau (fibre vs 4G)
- format et résolution d'écran variable
- navigation par urls ou par liens profonds
À chaque url correspond un lien profond.
{
"url": "https://www.arte.tv/fr/videos/097461-000-A/robe-noire/",
"deeplink": "arte://program/097461-000-A"
}- permet d'accéder directement au contenu
- compatible iOS, Android, tvOS et Android TV
La structure des premières APIs d'ARTE reflète les entités de la base de données :
- un endpoint par type d'entité (vidéos, collections, ...)
- un même endpoint peut servir pour plusieurs cas d'utilisation
Pour récupérer les vidéos les plus vues :
https://api-arte/videos?sort=-viewsPour récupérer les vidéos les plus récentes :
https://api-arte/videos?sort=-availabilityDate- beaucoup d'appels API par écran
- API complexe (de nombreux paramètres à maîtriser)
- contenu des apps front difficile à uniformiser
Le BFF (ou Back-end For Front-end) n'est pas un reflet de la base de données mais un reflet de l'application front :
- renvoie des objets
pageconsolidés - récupère les données auprès des APIs orientées métier
- pré-process les données pour les apps front
structure de l'API = structure des apps front
[Page]
- title
[Zones]
- title
- description
[Teasers]
- title
- subtitle
- image
- url
- deeplink- 1 appel API pour récupérer l'intégralité d'un écran
- ne renvoie que les champs utiles
- même call pour tous les supports
- limiter les appels API
- offrir plus de liberté aux front
- mettre fin au versioning
GraphQL semble plus adapté à une API publique qu'à une API interne.
- une seule API à maîtriser
- plus besoin de se soucier des problématiques métier
- routing simple
https://bff-arte/fr/web/pages/home
https://bff-arte/de/app/pages/concert
https://bff-arte/en/tv/pages/categories/cinema
https://bff-arte/it/orange/pages/programs/programId
https://bff-arte/pl/free/zones/zoneId?page=2&limit=10- découple les apps front des APIs métier
- structure éditable sans mise-à-jour côté front
{
"zones": [
{
"displayOptions": {
"itemTemplate": "landscape"
...
}
{
"zones": [
{
"displayOptions": {
"itemTemplate": "portrait"
...
}
| Avant | Après | |
|---|---|---|
| Nombre d'APIs à implémenter / app front | 5 | 2 |
| Nombre d'appels pour afficher la page d'accueil | 20 | 1 |
| Nombre de déploiements nécessaires pour modifier la page d'accueil | 8 | 0 |
- nécessite une bonne proximité entre les équipes back et front-end
- l'approche est-elle encore pertinente depuis HTTP/2 ?
- un service de plus à maintenir
- 2 chefs de projet du côté d'ARTE
- 3 développeurs du côté de Marmelab
Une équipe proche du front, orientée web mais en concertation régulière avec les équipes mobile et TV.
- ARTE’s API strategy & architecture - Matthieu BREEN : https://www.youtube.com/watch?v=bsCOU7131lM
- 6play_API-v2-Final(1).doc - Benoit VIGUIER : https://www.youtube.com/watch?v=Y_umU8mTWho
- BFFs and GraphQL, terms you should know and why - Chris BAILEY : https://www.youtube.com/watch?v=B5OdK21ZevI