Mise à jour de mon site personnel

Publié le , dans Programmation.
Dernière mise à jour le

Après une longue période d'inactivité, voici venu le temps de dévoiler au monde la toute dernière version de mon porte-folio en ligne. Respectueux des derniers standards du Web, ce nouveau site s'articule autour des grandes technologies d'Internet : HTML5, CSS3, JavaScript et le couple PHP / MySQL. Bonne visite.

Ce site a pour but de permettre à d'éventuels employeurs d'en apprendre plus sur mon parcours et d'avoir quelques aperçus de mes réalisations. Son contenu sera enrichi régulièrement, je vous invite donc à multiplier les passages. Je suis ouvert à toutes suggestions, concernant ce site ou bien mes réalisations. N'hésitez pas à me contacter, vous trouverez mon adresse mail dans la partie Curriculum Vitae.

Marion-maxime.com, ancienne version

Ils me manquent ces deux petits gugus bleus et rouges, pas vous ?

Crédits : Maxime Marion

[section=le concept|titre=L'idée : ré-utilisabilité et "CMS" perso !]

Afin de rendre la mise à jour et l'amélioration de mon porte-folio plus simple et de rendre possible la ré-utilisation des articles, images et autres médias, j'ai souhaiter séparer son apparence de son contenu.
Des CMS comme SPIP ou WordPress permettent cela et sont très simple à mettre en place, mais beaucoup de leurs fonctionnalités semblent inutiles pour un site administré et alimenté par une seule et unique personne (moi).
Qu'à cela ne tienne, on est jamais mieux servi que par soi même, je me suis donc lancé dans la création d'un système de management de contenu personnel et répondant à mes besoins.

Pour ce faire, et contrairement à l'ancienne version de ce site où le contenu était stocké dans un fichier XML, j'ai fait appel à la puissance des bases de données. Pour le moment, la mécanique de génération dynamique du contenu s'appuie sur trois tables principales :

_ Une table contenant le texte de l'article et sa mise en page, la liste et l'emplacement des médias liés à cet article,
_ Une table contenant les différents médias,
_ Une table contenant les tags associés aux éléments de contenu.

Plusieurs tables secondaires permettent de faire la liaison entre les différents éléments de ces trois tables, et d'autres seront ajoutés en fonctions des nouveaux éléments de contenu à intégrer à ce site.

[/section][section=ce qui est fait|titre=Ce qui est fait et fonctionnel]

_ La gestion des articles (ajout, modification, suppression) et leurs statuts (brouillon, publié, à la corbeille),
_ La gestion des tags (ajout, suppression) et la possibilité de les associer à n'importe quel élément du site (article, image, vidéo, rubrique...),
_ La gestion des rubriques "par tag" : une rubrique n'est en fait qu'un tag possédant un statut supplémentaire. Il est ainsi possible d'ajouter ou supprimer une rubrique (et lier ou délier les éléments pouvant lui être associés) en une seule opération,
_ La gestion des médias et leurs liens avec les articles du site,
_ La création de diaporama par glissé / déposé des images le composant,
_ La mise en page et l'insertion de médias facilités par l'utilisation d'un BBcode perso,
_ La création à la volée d'un sommaire pour naviguer dans les différentes sections d'un article.

[/section][section=à faire|titre=Ce qu'il reste à faire, améliorer ou corriger]

_ Alimenter le site bien entendu !
_ Importer les anciens articles,
_ Passer définitivement de l'ancienne version à celle-ci,
_ Créer des règles de réécriture (URL Rewriting) pour avoir des adresses plus propres,
_ Corriger et épurer le CSS, s'assurer que le site reste fonctionnel pour toutes les tailles d'écran (Responsive),
_ Corriger et améliorer la lisibilité du code retourné par PHP,
_ Terminer et activer la fonction JavaScript permettant d'adapter la taille et la source des images en fonction de la taille de l'écran (en attendant la prise en charge par tous les navigateurs de srcset),
_ Corriger et améliorer le parsing du BBcode composant les articles (balises mortes, expressions régulières incomplètes...),
_ Implémenter les fonctions de recherche (par mots, tags, types...),
_ Vérifier la validation du code HTML / CSS auprès du W3C, et corriger les erreurs détectés,
_ Remplissage du pied de page,
_ Et bien d'autres choses encore...

[/section]