Avant d'expliquer ce qu'il se cache derrière mon site, je trouve qu'il est important de faire un petit historique de mon site et de mon parcours.

L'histoire de babeuloula.fr

Ne travaillant pas au collège, j'ai été privé de tous jeux vidéo quel qu'ils soient. Le seul logiciel qu'il restait sur l'ordinateur familial était Macromedia Dreamweaver MX 2004. J'avais vu mon frère s'en servir mais ne sachant pas ce que c'était exactement, je l'ai lancé. Et c'est comme cela que j'ai découvert la programmation vers 2004-2005.

La première version de ce site, développé vers 2006, était pour commencer à me faire la main avec l'HTML et le CSS. À l'époque, le site était hébergé chez free.fr grâce à leurs pages perso. Cela m'a permis de découvrir les notions de FTP et comment se servir de Filezilla. Niveau design, il était très simple, une bête template proposée par Dreamweaver. Je gérais le site avec un ami d'enfance où l'on postait des photos, vidéos de tout et n'importe quoi. On voulait juste s'éclater.

En 2008, j'ai commencé à m'intéresser un peu plus à Photoshop, je me suis donc inscrit sur des sites qui proposaient un forum d'aide à Photoshop (Forum Toshop) et tutos de programmations (emob.fr devenu par la suite tuto.com). N'étant pas encore assez à l'aise sur Photoshop et la programmation, j'ai demandé au forum de me réaliser mon premier design ainsi que de m'en faire la découpe.

Le design a été fait par Sweetkisschris et Naelfia et la découpe par Découpe-fr.net. Un grand merci à eux car j'ai enfin pu avoir un vrai site Internet où exposer mes débuts de créations sur Photoshop.

Pendant ma dernière année de lycée, en 2010, je devais préparer les dossiers pour une éventuelle entrée dans les différents IUT et afin de montrer de quoi j'étais capable, j'ai designé et programmé mon propre site. Il me fallait en effet un book ou un portefolio à envoyer. J'ai donc programmé sans relâche pendant 2 semaines afin de sortir ceci, entièrement en HTML et CSS. Aucune trace de JS ni de PHP qui pour le moment ne m'étaient inconnues.

Une fois avoir intégré mon IUT (DUT Services et Réseaux de Communication) en 2011, j'ai pu avoir de vrais cours et avoir des personnes à qui demander des conseils. J'ai sorti quelque temps après une version 3 du site :

Qui fut rapidement remplacée durant l'été 2012 après mon premier stage en entreprise. La v4 et l'ouverture du blog programmé entièrement à la main.

Il m'a permis de trouver mon stage de licence pro dans une agence de communication Stéphanoise. puis en octobre mon premier travail dans une agence Lyonnaise.

En l'espace de quelques mois, j'ai acquis bien plus de connaissances de depuis le début que je programmais. Comme quoi, les études c'est juste pour faire joli sur le papier. Et justement avec ces connaissances, j'ai choisi de repartir de zéro et faire un design qui me ressemblait un peu plus et surtout qui soit dans l'air du temps.

désolé pour le fond noir, je n'ai pas réussi à retrouver l'image de fond

Mais au bout de 2 ans je commençais à me lasser de ce design qui était peut-être complexe et puis surtout avec l'arrivée du flat design, j'ai voulu changer. En 2016 donc, après de long moi à faire et défaire les designs que ma copine me proposait, nous sommes enfin tombé d'accord sur le design du site que vous connaissez actuellement.

Qu'est-ce que babeuloula.fr ?

babeuloula.fr est un blog programmé entièrement à la main qui a pour but premier de stocker des marques pages, des méthodologies, des savoirs faires ... en bref tout ce que j'ai appris une fois, toutes les recherches que j'ai pu faire et pour ne pas oublier comment cela fonctionne. Je suis le seul à le gérer de A à Z (infra, programmation et administration).

Sous le capôt

Niveau infra, il est hébergé chez Scaleway, qui est une filiale de Online.net et qui propose des serveurs payables à l'heure pour des prix plus qu'intéressants. Le serveur en lui-même tourne sous Ubuntu Server avec un reverse proxy nginx qui tourne sous Docker qui permet de gérer les différents sites qui sont hébergés sur le serveur. Le site en lui-même tourne sous Apache2 avec HTTP2, PHP 7.2 et MySQL dans un autre container Docker afin de séparer les différents sites en plusieurs instances, ce qui me permet de les gérer facilement sans risque d'interconnexion entre eux.

Côté programmation, le site est réalisé avec une version modifiée par mes soins de Slim3. Elle me permet d'être plus souple pour gérer les controllers et les modèles. Pour l'affichage, les vues sont générées via Twig.

Depuis peu, la gestion du moteur de recherche est passé d'une recherche dans la BDD à Algolia qui est un service qui propose une indexation rapide des données. Il est basé sur ElasticSeach et propose une API et un SDK PHP très très simple. Il permet de gérer entre autres, les fautes d'orthographe dans les recherches (ce que je ne gérais pas avec l'ancienne méthode).

Les contenus sont écrits en Markdown et parsés par PHP Markdown. Les emails sont gérés par SwiftMailer.

Le tout est versionné grâce à git.

Jusqu'en 2017, les déploiements se faisaient encore à l'ancienne avec Filezilla et grâce au git diff, je savais quels fichiers envoyer. Mais déput 2018, j'ai découvert Dploy qui se base sur l'identifiant des commits pour savoir ce qu'il doit envoyer sur mon serveur. Si vous souhaitez plus d'infos, j'ai écrit un article dessus.

Voilà, j'espère que vous en aurez appris un peu plus dessus et si vous avez des questions, n'hésitez pas.

Source

Si vous souhaitez revoir des différentes versions, vous pouvez les retrouver chez Webarchive