Bien écrire ses scripts

Statut
N'est pas ouverte pour d'autres réponses.

Fortytwo

Premium
Inscription
19 Juillet 2014
Messages
87
Réactions
52
Points
5 236
RGCoins
25
Salut à tous,

Voici un tutoriel, léger et simple qui pourra aider plus d'un débutant en html et php.

Je vais vous apprendre les bonnes pratique d'écriture d'un script. En effet, il est important d'avoir un script lisible et compréhensible par n'importe quel autre développeur qui pourrait lire vos scripts.

À vos clavier!
Partie 1 : Les bonnes pratique du HTML

-Avoir une bonne architecture de son script :

Comme dit plus haut, il est important de garder son script lisible. Voici quelques conseils très simple.

Pour commencer, un exemple de script à ne jamais reproduire sous peine de vous voir au coté de SATAN :devil:

HTML:
<!DOCTYPE HTML><html><head><title>Mon script n'est pas lisible!</title><meta charset="UTF-8" /></head>
<body><div class="container">Le contenu de ma page se trouve dans cette div!</div></body></html>

Voilà l'exemple type à ne jamais reproduire. Ecrire d'un bloc. N'ayez pas peur à sauter des lignes dans votre script, cela n'as aucun impacte sur le résultat visuel, n'ayez pas peur de rendre les choses espacé comme ceci

HTML:
<!DOCTYPE HTML>

<html>

    <head>

        <title>
            Mon script n'est pas lisible!
        </title>
        <meta charset="UTF-8" />

    </head>


    <body>

        <div class="container">

            Le contenu de ma page se trouve dans cette div!
    
        </div>

    </body>

</html>

Vous voyez la différence? Certes vos scripts seront plus volumineux, mais également plus visible et croyez moi qu'avoir un script bien propre et lisible rend la tâche plus facile pour la modification du script.

Ce que je viens de vous montrez porte un nom, ça se nomme "L'indentation".

Laissons Wikipedia nous donner sa version du mot Indentation
En informatique, l'indentation consiste en l'ajout de tabulations ou d'espaces dans un fichier texte. Le style d'indentation décrit les différentes manières que les programmeurs utilisent pour faire ressortir un bloc de code.

L'indentation se définit par la manière d'arranger les blocs de code, mais surtout par le nombre d'espaces utilisés à chaque niveau
Voilà! Le deuxième script HTML que j'ai fait est exagéré mais c'était pour vous montrez l'utilité flagrante de l'indentation dans le programmation. Voici le script (uniquement html) de la page d'index de mon site web.

HTML:
<!DOCTYPE html>

<html>

    <head>

        <title>Paradis-City</title>

        <link href='Vues/Images/icone.ico' type='image/ico' rel='shortcut icon' />
        <link href="style.css" rel="stylesheet" type="text/css" />
        <link href="./bootstrap/css/bootstrap.css" rel="stylesheet">
        <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet">

        <script src="js/animation-cloud.js"></script>
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
        <script src="https://code.jquery.com/jquery.js"></script>
        <script src="bootstrap/js/bootstrap.min.js"></script>
        <script src='bootstrap/js/bootstrap.js'></script>

        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
        <meta name="keywords" content="paradis-city, mmog, jeu sur navigateur, jeu gratuit, jeu multijoueur, jeu social, simulation de vie"/>
        <meta name="description" content="Paradis-City est un jeu gratuit sur navigateur. Incarner un personnage, gagnez de l'argent, fondez une famille. Vivez votre rêve! Rejoignez nous!"/>

    </head>



    <body>

        <div class='cloud' onclick='window.location.href="/index"'>
            <div class="text-center center-block">

                    <a class="icones" target="blank" href="https://www.facebook.com/JeuParadisCity"><i id="social" class="fa fa-facebook-square fa-3x social-fb"></i></a>
                    <a class="icones" target="blank" href="https://twitter.com/JeuParadisCity"><i id="social" class="fa fa-twitter-square fa-3x social-tw"></i></a>
                    <a class="icones" target="blank" href="https://plus.google.com/paradis-city"><i id="social" class="fa fa-google-plus-square fa-3x social-gp"></i></a>
                    <a class="icones" target="blank" href="mailto:[email protected]"><i id="social" class="fa fa-envelope-square fa-3x social-em"></i></a>
            </div>
        </div>
<br/>
        <div id="Container">
 
            <div class="gauche">MENU</div>
     
            <div style="width:auto;" id="main">
     
                <div id="marge">
     
                    SCRIPT DES PAGE APPELLES EN PHP

                </div>

            </div>

            <p style="clear: both"><br /></p>

            <div class="footer">
                INCLUSION DU FOOT
            </div>

            <br />

        </div>
 
        <a id="back-to-top" href="#" class="btn btn-primary btn-lg back-to-top"  role="button" title="Cliquez pour retourner en haut de la page." data-toggle="tooltip" data-placement="left">
            <span style="margin-left: 9px;" class="glyphicon glyphicon-chevron-up"></span>
        </a>

    </body>

</html>
Voilà, alors c'est loin de la réalité du fichier puisque il y a normalement du php avec des fonction toussa toussa mais je vais vous le montrez dans la deuxième partie ;)

Donc comme vous pouvez le voir, mon script est ranger, de sorte à ce que tout les développeurs qui lirait ce scripts, comprenne et savent tout de suite de quel élément du script correspond à l'élément généré par le navigateur.

Vous voyez que j'ai plusieurs blocs bien distincts, et ce n'est pas par hasard qu'ils sont ranger comme ceci, les trois gros blocs que l'ont voient bien se trouvent de le <head></head> Ce sont les appels CSS, JS et les <meta>. Chaque appelle CSS est ranger dans le premier bloc, chaque appelle JS est ranger dans le second et ainsi de suite, comme ça, si par exemple j'ai fait une faut dans le nom d'un fichier javascript, au lieu de passer 10 à 15 secondes pour retrouvez la ligne, je met 5 secondes! Dans la programmation, chaque gain de temps, ne serait-ce qu'une poignée de seconde, est important ;)

Ensuite j'ai un bloc de lien dans le <body>, ce sont les liens vers les réseaux sociaux du jeu, et bien, ils sont grouper, comme ça, si il y a un changement d'adresse ou autre... Vous avez compris le principe! :p

Et un dernier petit point! Pour savoir si votre script html est bien indenté, il faut que, dès lors où vous faites des espaces ou retour à la ligne, l'ouverture de votre balise doit être verticalement aligné avec votre balise de fermeture.

Pour sublim text et notepad++ il existe une fonction qui se nomme "guide d'indentation" et qui est activer par défaut, cette fonction trace une ligne en pointillé lorsque vous faite des blocs dans votre script afin de savoir si votre balise d'ouverture et de fermeture sont bien alignés.

Partie 2 : Les bonnes pratique du PHP

-Avoir une bonne architecture de son script :

Cette 2ème partie vas être très rapide si vous avez compris la première partie. Mais restez tout de même attentif, car dans cette deuxième partie je vais aborder des points plus sensible et plus important.

Passons maintenant à l'indentation php. Sachez qu'il est beaucoup plus important d'indenté un script php qu'html. Mieux vaut un exemple qu'un long discours. Voici un petit exercice :

Je vais vous mettre un code php non indenté. Le code contiendra une erreur que je vais vous donner (avec sa signification en même temps au cas où vous débutez en php).

Une fois que vous aurez lu l'erreur, regarder le script et compter en combien de seconde vous avez trouvez l'erreur. (Puis, pour jouer le jeu jusqu'au bout, notez le dans un coin de votre tête ou sur votre main pour le mettre en commentaire une fois le tutoriel terminer! Ne notez pas tout de suite votre score puisqu'un deuxième jeu arrive après celui là!)

PHP:
function decoIfChangeInBdd(){ if ($_SESSION['pseudo'] !="")
{ global $bdd; $getChangeBdd=$bdd->prepare("SELECT grade FROM membres WHERE id= :id "); $getChangeBdd->execute(array(':id' => $_SESSION['id'] ));
$getChangeBddBan=$bdd->prepare("SELECT COUNT(*) AS nbBan FROM ban_membres WHERE id_j= :id_j AND duree> :duree ");
$getChangeBddBan->execute(array(':id_j' => $_SESSION['id'],    ':duree'=> time() )); $checkBan = $getChangeBddBan->fetch(); $nbBan = $checkBan['nbBan']; $check = $getChangeBdd->fetch();
echo $check['grade'] . '<br/>';
echo $_SESSION['grade'].' == '$check['grade'];

if ($_SESSION['grade'] != $check['grade'] ||  $check['grade'] == 0 ) { echo "<script>document.location.href=\"index?page=deconnexion\"</script>";}
if ($nbBan != 0){echo "<script>document.location.href=\"index?page=deconnexion&raison=ban\"</script>";}
}
}function contenuGetAmis($getAmis){echo '<h3>Mes amis : </h3>';if(empty($getAmis)){    echo '<h5 style="text-align:left">Vous n\'avez aucun amis.</h5>';}
else{    echo '<table width="63%" border="1" style="border-collapse:collapse;">
<tr><td><center><strong>Pseudo</strong></center></td><td><center><strong>M&eacute;tier</strong></center></td>
<td><center><strong>Amis depuis</strong></center></tf>    <td></td></tr>';$i = 0; foreach($getAmis as $amis){
$i++;
echo "<tr><td><center>".$amis['prenom']." ".$amis['nom']."</center></td>      <td><center>".$amis['emploi']."</center></td> <td><center>5 minutes</center></td>  <td><center>SUPPRIMER</center></td></tr>
";
}
echo "</table>";
}
Ça vous fait mal aux yeux? C'est normal. Vous restez indifférent? Vous êtes le sbire du :devil: !

Alors, je vais maintenant vous donner l'erreur!

Parse error: syntax error, unexpected $end

Traduction : Erreur de syntaxe. Fin de fichier inattendu
Vous avez trouvez? Félicitations! Gardez en tête en combien de seconde vous avez trouvez l'erreur pour nous le dire en commentaire!

Deuxième exercice, avec un script, cette fois ci indenté!

PHP:
public function verifierDonnees($mdp,$mdpConfirm,$pseudo,$nom,$prenom,$sexe)
    {
        $this->verifPseudo->execute(array(
        ':pseudo' => $pseudo));
        $erreur=array();
        $rows = $this->verifPseudo->rowCount();
   
        if($rows!=0)
        {
            $erreur[count($erreur)] = "Un joueur poss&egrave;de d&eacute;j&agrave; ce pseudo.";
        }

        if(strlen($pseudo)>=5)
        {
            if(strlen($pseudo)>=24)
            {
                $erreur[count($erreur)] = "Votre pseudo est trop long.";
       
        }
        else
        {
            $erreur[count($erreur)] = "Votre pseudo est trop court.";
        }
   
        if(strlen($mdp)<6)
        {
            $erreur[count($erreur)] = "Votre mot de passe doit contenir au moins 6 caract&egrave;res.";
        }
   
        if($mdp!=$mdpConfirm)
        {
            $erreur[count($erreur)] = "Les 2 mots de passe sont diff&eacute;rents.";
        }

        $this->verifPerso->execute(array(
        ':nom' => $nom,
        ':prenom' => $prenom));   
        $rows2 = $this->verifPerso->rowCount();

        if($rows2!=0)
        {
            $erreur[count($erreur)] = "Un joueur poss&egrave;de d&eacute;j&agrave; un personnage nommé ".$personnage.".";
        }
   
        if(!isset($sexe))
        {
            $erreur[count($erreur)] = "Vous avez oublié de sélectionner la civilité de votre personnage.";
        }
        return $erreur;
    }



public function enregistrerCompte($pseudo, $password,$email)
    {
        $this->enregistrerCompte->execute(array(
        ':pseudo' => $pseudo,
        ':grade' => "1",
        ':password'=> getCryptMdp($password),
        ':mail' => $email,
        ':valid'=> "0",
        ':ip'=>$_SERVER['REMOTE_ADDR'],
        ':date_inscription'=> time(),
        ':supprimer'=> '0'));
   
        return $this->enregistrerCompte->rowCount();
    }

C'est déjà plus propre et plus beau non? Je suis sûr que vous avez trouvez l'erreur avant même que je vous la donne!

Parse error: syntax error, unexpected $end

Traduction : Erreur de syntaxe. Fin de fichier inattendu
Alors combien de seconde pour le deuxième exercice? Dites nous en répondant avec votre temps pour l'exercice 1 et pour l'exercice 2.

Voilà pour les petits exercices! Vous avez maintenant compris le principe de l'indentation et son importance en php? Il est évident qu'un script indenté ai plus de chance d'être maintenu qu'un script non indenté!

Un deuxième point et c'est la fin ! (--')

Me dites pas que vous dormez déjà? Donnez tout ce que vous avez, c'est la dernière ligne droite! :dodo:

-Commentez ses scripts :

Commenter ses scripts est assez capital dans la programmation. Que vous soyez tout seul à développer ou que vous soyez en équipe (encore plus important d'apprendre à commenter lorsque vous travailler en équipe).

Il existe trois façons de commenter un script :

PHP:
//Un commentaire uniquement sur cette ligne

/* Un commentaire sur plusieurs lignes - Un commentaire sur plusieurs lignes - Un commentaire sur plusieurs lignes - Un commentaire sur plusieurs lignes - Un commentaire sur plusieurs lignes - Un commentaire sur plusieurs lignes - Un commentaire sur plusieurs lignes  */

/**
*      Un commentaire sur plusieurs ligne mais de style bloc
*
*/

Voilà l'exemple d'un script bien commenter et je vous conseil de prendre sur cet exemple.

PHP:
/**

*
* @author Liight Man
* @version 1.0.1 En developpement...
* @todo implementer la connexion automatique par cookies, bug fix, getter/setter
*/
class Connexion{
  private $pseudo; // Utiliser uniquement pour le pseudo transmis par le formulaire, ne doit pas etre utiliser après la verication des donnees
  private $password; // Utiliser uniquement pour le pseudo transmis par le formulaire, ne doit pas etre utiliser après la verication des donnees
  private $remember;
  private $user = null;
  private $ban = false;
  private $cookieStatus;
  private $bdd;
  /**
  * Crée un object de connexion pour un utilisateur
  *
  * @param Object $bdd Object PDO pour la base de données
  */
  public function __construct($bdd){
    $this->bdd = $bdd;
  }

  /**
  *  Vérification des donnees lors de la connexion d'un utilisateur
  *
  * @param Array $post Le $_POST résultant du formulaire de connexion
  * @return bool Retourne vrai si l'utilisateur a saisi les bonnes informations, faux sinon
  */
  public function verifDonnees(Array $post)
  {
    $this->pseudo = (isset($post['pseudo'])) ? $post['pseudo'] : null;
    $this->password = (isset($post['password'])) ? $post['password'] : null;
    $this->remember = (isset($post['remember'])) ? $post['remember'] : false;
    $verifDonnees = $this->bdd->prepare("SELECT id,pseudo, id_perso, grade, password, mail, valid, ip,date_inscription, supprimer, vu_profil, m.piece, nom, prenom, emploi
      FROM membres m, personnages_membres pm
      WHERE pseudo= :pseudo
      AND password= :password
      AND m.id = pm.id_compte");

    $verifDonnees->execute(array(
    ':pseudo' => $this->pseudo,
    ':password' => getCryptMdp($this->password)));

    $resultat = $verifDonnees->fetch(PDO::FETCH_OBJ);
    $rows = $verifDonnees->rowCount();

    if($rows==1)
    {
      $this->user['pseudo']=$resultat->pseudo;
      $this->user['id']=$resultat->id;
      $this->user['grade']=$resultat->grade;
      $this->user['personnage']=$resultat->prenom .' '. $resultat->nom;
      $this->user['emploi']=$resultat->emploi;
      $this->user['email']=$resultat->mail;
      $this->user['tchat'] = "open";
      $this->user['emploi'] = ucwords(preg_replace('/_/', ' ',$resultat->emploi)); // Replace les _ par des espaces et met la première lettre de chaque mot en maj
      return true;
    }
    return false;
  }

  /**
  * Crée une session par rapport a un tableaux associatif d'un utilisateur
  *
  * @param Array $user Array d'un utilisateur
  * @return bool Retourne vrai si la session est créer, faux sinon
  */
  public function sessionCreate(){
    if($this->user != null){
      foreach($this->user as $param => $value){
        $_SESSION[$param] = $value;
      }
      return true;
    } else {
      return false;
    }
  }

  /**
  * Vérifie si un joueur est banni ou pas
  *
  * @param Array $user les données de l'utilisateur
  * @return bool Retourne faux si l'utilisateur n'est pas banni, vrai s'il l'est
  */
  public function verifBan($user) // Verification des ban
  {
    $verifBan=$this->bdd->prepare("SELECT * FROM ban_membres WHERE id_j= :id_j AND duree> :duree");
    $verifBan->execute(array(
      ':id_j' => $user['id'],
      ':duree' => time()));

    $rows_ban = $verifBan->rowCount();
    $resultats_ban=$verifBan->fetch();

    if($rows_ban!=0)
    {
      // on récupere les informations concernant le banissement
      $times = date("<b>d.m.y</b> à H:i",$resultats_ban['duree']);
      $date = date("<b>d.m.y</b> à H:i",$resultats_ban['date']);
      $modo = $resultats_ban['par'];
      $motif = $resultats_ban['motif'];
      $this->ban = array("times"=>$times,"date"=>$date,"modo"=>$modo,"motif"=>$motif); // On le stock pour pouvoir le récuperer plus tard
      return true;
    }
    return false;
  }

  /**
  * Vérifie que l'utilisateur a activer son compte
  *
  * @param int $id L'identifiant de l'utilisateur
  * @return bool Retourne true si le compte est activé, ou faux sinon
  *
  */
  public function verifActivationCompte($id) // on verifie quil a activer son compte
  {
    $verifActivationCompte = $this->bdd->prepare("SELECT * FROM cles_comptes WHERE id_j= :id_j");
    $verifActivationCompte->execute(array(
    ":id_j"=> $id));
    $rows= $verifActivationCompte->rowCount();

    if ($rows != 0)
    {    // on lui renvoie le lien d'activation
      return false;
    }
    return true;
  }

Regardons ça se plus près :
PHP:
/**
*
* @author Liight Man
* @version 1.0.1 En developpement...
* @todo implementer la connexion automatique par cookies, bug fix, getter/setter
*/

// Utiliser uniquement pour le pseudo transmis par le formulaire, ne doit pas etre utiliser après la verication des donnees

/**
  * Crée un object de connexion pour un utilisateur
  *
  * @param Object $bdd Object PDO pour la base de données
  */

/**
  *  Vérification des donnees lors de la connexion d'un utilisateur
  *
  * @param Array $post Le $_POST résultant du formulaire de connexion
  * @return bool Retourne vrai si l'utilisateur a saisi les bonnes informations, faux sinon
  */

Le premier bloc comporte les informations du script : son auteur, sa version, ce qu'il reste à faire sur le fichier. (On peut également y ajouter la dernière date de modification ou autre informations utiles)

Le deuxième commentaire et là juste pour donner une informations sur la variable.

Le deuxième bloc introduis le script qui suis en dessous et donne les information, ici, les paramètres de la fonction (en l’occurrence, un seul paramètre)

Et le dernier bloque c'est pareil que pour le deuxième sauf qu'il contient une information en plus, cette information, c'est ce que vas retourner le script qui ce trouve en dessous.

Le fait de commenter un script à une importance dont il faut tenir compte. Si vous êtes seul à développer, ça vas vous aider en un rien de temps à vous souvenir à quoi sert tel variable ou tel fonction.

Si vous êtes en groupe, ça à le même avantage que le fait d'être seul mais ça permet également aux collègues qui sont avec vous de comprendre votre travail pour pouvoir vous aider, sans que pour autant, vous soyez là, en conversation avec eux en tentant de leur expliquer votre travail!


Et bien, c'est la fin! Je vous remercie d'avoir lu ce tutoriel et désolé pour les fautes, je corrigerai ça plus tard x)!

Si vous avez aimer ce tutoriel laisser un remerciement en commentaire ou encore un "pouce vers le haut" :mdr:

Copyright : Ce tutoriel a été dans son intégralité rédiger par moi-même, merci de demander la permission en message privé pour poster ce tutoriel sur un autre forum. Les scripts mis en valeur dans ce tutoriel font partie de la propriété intellectuel des développeur du jeu Paradis-City. Merci de respecter ce travail.
 
Dernière édition:
Ou sinon un logiciel comme text wrangler ou notepad++ qui fait les lignes de couleurs différentes ;)
 
Bien expliqué ;)
Néanmoins, du moins en PHP, les commentaires ne sont jamais très grands. :)
 
Ou sinon un logiciel comme text wrangler ou notepad++ qui fait les lignes de couleurs différentes ;)

Certes mais c'est toujours intéressant de comprendre l'utilité de l'indentation mais avec une coloration syntaxique.

Bien expliqué ;)
Néanmoins, du moins en PHP, les commentaires ne sont jamais très grands. :)

Merci :D Pour php, en développant seul oui, mais en développant en groupe, les commentaires prennent une place importante et imposante dans les scripts pour que ça reste compréhensible par tout les membres de l'équipe :)
 
Certes mais c'est toujours intéressant de comprendre l'utilité de l'indentation mais avec une coloration syntaxique.



Merci :D Pour php, en développant seul oui, mais en développant en groupe, les commentaires prennent une place importante et imposante dans les scripts pour que ça reste compréhensible par tout les membres de l'équipe :)

Ah oui en groupe je dis pas :)
 
C'est plus tôt Bien !! :D Meci !!
 
C'est hors sujet mais si jamais c'est des extraits de tes scripts, sache que
echo "<script>document.location.href=\"index?page=deconnexion\"</script>"
est très très dégeulasse
 
C'est hors sujet mais si jamais c'est des extraits de tes scripts, sache que
echo "<script>document.location.href=\"index?page=deconnexion\"</script>"
est très très dégeulasse

Merci de faire la remarque, je sais très bien, j'ai un paquet d'année d’expérience en programmation! Les script utilisés pour les exercices sont des script de la première version développer par un développeur débutant, c'est pour ça que j'ai pris ses scripts en exemple (J'ai enlever les quelques indentations qu'il y avait pour les exercices.)
 
Bien éxpliqué :O gg a toi (l)
 
Merci du tuto :)
 
De rien, merci à vous de l'avoir lu :D
 
A peine inscrit et déjà un gros tuto ! Bravo :modo:
 
Statut
N'est pas ouverte pour d'autres réponses.
Retour
Haut