Histoire d'un site #5 - Projets, Culture & Contact

Histoire d'un site #5 - Projets, Culture & Contact

Voilà quelques pages, beaucoup moins intéressantes techniquement et au niveau de la recherche que celles présentées dans les 4 précédents articles, mais qui valent la peine d'être un peu détaillées.

Projets

 

Cette page est pour l'instant assez vide, mais devrait se remplir dans un futur proche. J'ai voulu faire simple : titre, description, lien. Il n'y a pas besoin de plus, car de toute façon il y a généralement un site / dépôt Github derrière chaque projet.

 

Niveau technique, pas bien compliqué : côté admin j'ai un formulaire d'ajout, côté client (donc sur cette page) je liste les projets et voilà, c'est fini.

Culture

 

Certainement une des pages les plus ennuyeuses à réaliser côté serveur (je parle de page et non d'un bundle complet tel que pour le blog). En effet, cette simple page communique avec l'API de LastFM ainsi qu'avec celle de Spotify, le tout ayant 24h de cache et tout ce qu'il va bien.

LastFM

 
Le logo de LastFM
 

Pour commencer, toutes les 24h une cron va lancer une commande Symfony2 qui va aller chercher mon top artistes et mon top chansons, le tout est renvoyé au format JSON, jusque là tout va bien. Seulement, en ce qui concerne le top chansons, pour avoir le nom de l'album, il faut aller checker l'API pour chaque piste pour avoir des renseignements précis ainsi que l'image de l'album. Donc si on résume, je vais checker une fois pour avoir le top artistes, et une fois pour le top pistes et pour chaque piste (j'ai limité à 10) il faut aller chercker encore une fois. On est déjà à 1 + 1 + 10 actions sur l'API, autant vous dire que ça fait déjà pas mal.

Spotify

Le logo de Spotify
 

Ensuite, j'aimais bien le fait que l'on puisse écouter les musiques directement. J'avais le choix de mettre un player officiel Spotify / Deezer, mais niveau design ça n'est pas du tout personnalisable. J'ai donc préféré utiliser les URI Spotify. Le hic, c'est que ceux qui n'auraient pas Spotify ne pourraient pas l'écouter. J'ai donc changé pour utiliser le lecteur web de Spotify, qui permet à ceux qui ont un compte de cliquer sur lecture et de lancer ça directement et à ceux qui ne l'ont pas d'avoir toutes les informations sur la piste / artiste en question.

 

Mais pour récupérer l'URL pour Spotify, il faut aller checker l'API de Spotify... pour chaque artiste et pour chaque piste. Ce qui fait donc 10 + 10 checks. Le soucis c'est qu'il y a une limitation au niveau du nombre de check de l'API par seconde. Pour contourner cela j'ai mis un sleep dans mon script PHP entre les artistes et les chansons. De ce fait, la commande va faire 10 checks, attendre une seconde et aller faire 10 checks de nouveau.

 

Au final, rien de vraiment complexe, mais plutôt une accumulation de soucis qui se résolvent par de multiples accès sur chacune des APIs.

Contact

 

Sur cette page, on peut y voir : un formulaire de contact, une suite de liens, mon dernier tweet et mes dernières vidéos. Le formulaire de contact est tout simplement un formulaire qui va aller enregistrer les messages dans ma base de données et qui seront lisibles depuis l'admin, histoire qu'on me flood pas ma boite de courriels.

 

Pour le dernier tweet, il est issu du cache généré par la page d'accueil. Cela évite d'aller recherche le tweet sur Twitter à chaque chargement de page, et je suppose que les visiteurs passent par l'accueil avant d'aller sur la page contact. Si jamais le cache mémoire de 1h expire, alors c'est le cache fichier qui prends le relais car il est lui de durée infinie pour palier à une éventuelle indisponibilité de l'API de Twitter. Il est à noter que l'API de Twitter est passée de la version 1.0 à la 1.1 il y a peu, je vous invite à voir le tuto de Grafikart à cette adresse  pour comprendre le fonctionnement de OAuth et ainsi récupérer vos Tweets, car l'ancienne API a été désactivée.

 

En ce qui concerne les vidéos, je parse tout simplement avec SimpleXML (objet natif de PHP) le flux RSS de mes vidéos sur YouTube, pour obtenir le titre, l'URL et l'image.

 

Pour la petite astuce des tooltip au survol, sans JavaScript j'ai utilisé un petit code libre nommé hint qui est vraiment pratique. Il vous permet de faire des infobulles (tooltips) simplement en ajoutant un ou deux data-element à l'élément concerné qui affichera alors vos quelques mots au survol de celui-ci. Avantages : pas de JavaScript, léger. Inconvénients : ne fonctionne pas les anciens navigateurs (mais vu que je ne les gère pas sur mon site, ça n'est plus un soucis).

 

Voilà pour les quelques pages beaucoup plus légères que les autres mais qui méritaient un petit article, pour qu'elles ne soient pas jalouses.

Votre gravatar