Quand on veut créer un projet de site internet, il faut faire en sorte d’avoir du code maintenable et évolutif. Voici quelques règles à respecter.
Règle numéro 1 : faire en sorte de séparer le CSS, le PHP, et le javascript de l’HTML.
Le CSS se met dans des fichiers CSS et le JavaScript dans des fichier JS. Les balises <link> et <script> aidant à inclure les fichiers CSS et JS.
Pour le langage PHP, Le mieux est d’utiliser l’architecture MVC (ou Modèle-Vue-Contrôleur). Il sépare la gestion des données de votre site (Modèle), de l’affichage de ces données (Vue), et du décisionnel (Contrôleur).
Règle numéro 2 : pour le JS et le PHP, langages dans lesquels on peut créer des variables. Il faut obligatoirement donner des noms compréhensibles à vos variables. Bannir les variables ressemblant à $a ou $b car elles ne savent pas à quoi elles correspondent
Dans de rare cas, on peut utiliser les variables $i et $j.
Exemple :
for ($i = 1; $i <= 10; $i++) {
echo $i;
}
Règle numéro 3 : Par extension de la règle 2, donner des noms compréhensible à vos fonctions.
Bannir les fonctions du genre « toto » ou « bigMac ». Choisir les fonctions du genre dateFR (pour une date française) ou dateUS (pour une date anglaise)
Règle numéro 4 : Pour certaines fonctions, posez-vous la question si vous allez le faire en une fois ou en plusieurs fois.
Imaginons qu’en PHP, vous deviez créer une fonction dateFR() qui affiche « 25/01/2013 » et une autre fonction dateUS() qui affiche « 01/25/2013 ». (voir le code ci-dessous)
<?php
function dateFR(){
// Enregistrons les informations de date dans des variables
$jour = date("d" );
$mois = date("m" );
$annee = date("Y" );
// affiche une date au format FR
$today = $jour."/".$mois."/".$annee;
return $today;
}
function dateUS(){
// Enregistrons les informations de date dans des variables
$jour = date("d" );
$mois = date("m" );
$annee = date("Y" );
// affiche une date au format US
$today = $mois."/".$jour."/".$annee;
return $today;
}
echo "Date française : ".dateFR()."<br />";
echo "Date US : ".dateUS();
?>
La moitié du code de chaque fonctions est le même, regroupez ce dans une fonction dateCommun() et appelez cette fonction dans les autres fonctions dateFR() et dateUS(). Comme le montre le code ci-dessous :
<?php
function dateCommun(){
// Enregistrons les informations de date dans des variables
$jour = date("d" );
$mois = date("m" );
$annee = date("Y" );
return array($jour, $mois, $annee);
}
function dateFR(){
list ($jour, $mois, $annee) = dateCommun();
// affiche une date au format fr
$today = $jour."/".$mois."/".$annee;
return $today;
}
function dateUS(){
list ($jour, $mois, $annee) = dateCommun();
// affiche une date au format US
$today = $mois."/".$jour."/".$annee;
return $today;
}
echo "Date française : ".dateFR()."<br />";
echo "Date US : ".dateUS();
?>
A partir du deuxième code, vous améliorez grandement la qualité de votre code.
Règle numéro 5 : commenter votre code, pour n’importe quel langage aussi facile soit-il (CSS, javascript, php, …).
il y a 2 raisons pour cela :
- Si vous ne touchez pas à votre code pendant un certain moment. Cela vous permet de le reprendre plus rapidement et facilement.
- Si quelqu’un reprend votre code, il peut comprendre facilement ce que vous avez fait.
Vous pouvez voir les exemples de la règle 4. Je les ai commenté.
Règle numéro 6 : réduire au maximum le code utilisé.
Si vous pouvez faire en une ligne ce que vous faites normalement en 2 ou 3 lignes, et que votre ligne est compréhensible, faites-le !
Cette règle peut faire la différence quand il y a beaucoup de trafic sur votre site (plusieurs centaines de personnes au même moment.
Règle numéro 7 : Pour les parties communes à toutes vos pages (par exemple le header, le menu, et le footer).
Il faut faire une page spéciale pour chacune de ces parties et appeler ces parties en faisant des inclusions (avec PHP).
Voici un exemple en image :
Faire des inclusions vous fait gagner de la place dans chacune de vos pages. Et si vous faites une modification sur une de ces trois parties, la modification se fera sur toutes les pages de votre site appelant cette partie.
Règle numéro 8 : Avec le CSS, utiliser des langages dynamique comme le Less, le SASS ou le Compass. Ces langages génère le CSS, et vous font gagner du temps.
Le volume de code à maintenir est moindre grâce aux variables, aux fonctions et aux mixins.
Des bibliothèques connu ont été créé à partir de ces langages, comme Twitter Bootstrap.
Règle numéro 9 : Avec le JavaScript, il existe aussi un langage dynamique : le coffeescript. le javascript généré à partir du coffeescript est lisible et le volume de code à maintenir est moindre que si vous l’aviez fait à la main.
J’ai réussi à trouver 9 règles pour faire du code maintenable et évolutif. Si vous avez des règles qui ne sont pas listé ici, vous pouvez me les donner en commentaire.
Dans l’article d’aujourd’hui, je vous présente les extensions de Firefox que j’utilise le plus souvent dans mon métier de développeur.