PHP, HTML, Javascript et rédaction de bonnes pratiques

10

J'ai réalisé que je devais écrire une spécification de convention sur le codage HTML, JavaScript et PHP pour moi et mon équipe.

Dans le développement Web, tout comme en C ++, je suis définitivement un fan d'indentation et de commentaires.

Néanmoins, souvent dans mon travail, je rencontre du code HTML + JavaScript + PHP qui soulève soudainement le mal de tête.

J'essaie de rendre mon code lisible, mais ce qui semble être mieux pour moi (mettre en retrait et commenter) ne semble pas fasciner mes coéquipiers, donc je me demandais s'il y avait une meilleure ou au moins une bonne pratique partagée lors de l'écriture de "hybride" "des documents comme les pages Web d'aujourd'hui, qui deviennent de jour en jour de plus en plus complexes.

Je suis conscient du fait qu'il est probablement dans la nature du code des pages Web d'aujourd'hui d'être un peu complexe, mais je me demande s'il existe déjà une bonne convention concernant ces aspects.

web-development php html javascript Federico Zancan
la source

Réponses:

19

Quelques règles générales que je respecte:

Général

  • Les retraits sont de 4 espaces.
  • Mettre en retrait de nouveaux niveaux
  • Les commentaires sont <~ 80 caractères du niveau de retrait. Si je suis sur deux niveaux (8 espaces), cela signifie que l'arrêt du curseur sera d'environ 88 caractères.
  • Utilisez des commentaires sur plusieurs lignes. Je préfère le look, cependant c'est un point subjectif .
  • Commentez maintenant plutôt que plus tard lorsque vous ne savez pas ce qui se passe.
  • Bretelles de style Allman . C'est plus propre et plus lisible. Subjective .

Javascript

  • Utilisez une bibliothèque. jQuery en particulier est très bon. Il élimine tous les maux de tête entre navigateurs.
  • Comprenez que les ID sont pour des éléments particuliers, les classes sont pour les styles. Les identifiants ne doivent pas être utilisés plus d'une fois par page et ils auront des crochets particuliers qui leur sont attachés. Utilisez des classes pour des choses comme la navigation.
  • Out source dans les méthodes. Il est tentant de mettre tout le code dans l' bindappel, mais le mettre dans sa propre fonction augmentera la flexibilité de votre code.
  • Utilisez des fonctions au lieu de Evals. Cela signifie setTimeout(function(){ /* Do something */ }, 1000);qu'au lieu desetTimeout('doSomething', 1000);
  • Utilisez des variables locales avec var.

HTML

  • Balisage sémantique. Utilisez des balises appropriées. N'y mettez pas <br />pour ajouter de l'espace, ajuster les marges et les règles CSS.
  • Toutes les balises sont en minuscules .
  • Toutes les balises doivent se terminer par une balise de fermeture ou être à fermeture automatique .
  • Utilisez des classes pour une mise en page similaire. Avoir un couple de classes prédéfinies comme hide, clear, error, etc.
  • Tout (scripts inclus) devrait rentrer <head>. Inquiétez-vous d'optimiser (déplacer des choses) quand cela présente un problème.
  • Les feuilles de style externes et la source JavaScript sont indispensables, sauf si elles sont spécifiques à une page.

PHP

  • Les cadres sont bons, je recommande CodeIgniter.
  • Si vous ne souhaitez pas utiliser de framework, essayez d'utiliser la dernière version de PHP possible. (Cela signifie 5.3).
  • Utilisez includesà votre avantage.
  • Effacer les injections ou utiliser des déclarations préparées.

  • Effectuer si des vérifications sur des valeurs de sécurité préconçues.

    $logged_in = false;
if(check_user($user))
{
     $logged_in = true;
     $user = load_user($_SESSION);
}
  • Connaissez la différence entre les guillemets simples et doubles. Utilisez des guillemets simples lorsque cela est possible.
  • Ne faites pas écho au HTML.
Josh K
la source
4
Excellente liste. Pour PHP, j'ajouterais 1) utiliser des modèles, ne pas mélanger php et html (dans les applications, au moins) 2) ne pas utiliser includes () comme appels de fonction 3) garder autant de code en dehors de la portée globale que possible.
GrandmasterB
quiconque recommande CodeIgniter et jQuery perd toute intégrité à mes yeux.
mefisto
4
@teresko: Vous condamnez sans donner de raisons ni d'alternatives.
Josh K
+1. Une liste de points discutables et discutables, mais une assez bonne liste néanmoins.
haylem
jQuery élimine tous les maux de tête entre navigateurs?
James Adam
3

Il y a quelques lectures d'inspiration:

  • Zend Framework - style de codage php : liste des pratiques pour écrire du code php maintenable (formatage de fichiers PHP, conventions de dénomination, style de codage: tableaux, chaîne, classe, méthode, par exemple).
  • Google - guide de style de code : liste des pratiques pour écrire du code javascript maintenable (règles: constans, points-virgules, fonction imbriquée ..., style de codage: dénomination, portée, chaîne, champs de visibilité, etc.).
tomascejka
la source
Pourriez-vous expliquer davantage ce que font ces ressources et pourquoi recommandez-vous ces réponses pour répondre à la question posée? Les "réponses en lien uniquement" ne sont pas tout à fait les bienvenues à Stack Exchange
gnat
1
@gnat edit / correct answer
tomascejka
2

Gardez les 3 séparés. Le code le moins facile à gérer que je traite est toujours quand il y a du PHP qui fait écho à beaucoup de HTML et JavaScript, probablement avec du SQL jeté autour pour faire bonne mesure.

Le fait de les garder tous séparés rendra le code beaucoup plus facile à maintenir et rendra les choses beaucoup plus rationalisées si vous avez des personnes travaillant sur différentes parties de l'application, comme un concepteur qui n'a besoin que de travailler avec HTML / CSS.

GSto
la source
2

Le moyen le plus simple de coder une application Web PHP est certainement de tout écraser. Cependant, vous vous retrouvez rapidement avec un gâchis incontrôlable si vous faites les choses de cette façon.

Voici quelques bonnes pratiques:

1) Mettez votre JavaScript dans la <head> d'un document (ou, mieux encore, dans des fichiers séparés référencés dans l'en-tête). Apprenez à lier des écouteurs d'événements dans un événement document.onload, plutôt que de les disperser dans votre html. (Mieux encore, apprenez à utiliser un framework comme Jquery; cela rendra votre JavaScript beaucoup, beaucoup plus joli).

2) Recherchez des modèles de conception comme MVC. Vous souhaitez séparer autant que possible votre logique métier, écrite en PHP, de votre HTML. Idéalement, vous finissez par utiliser un joli langage de template pour assembler vos pages HTML; à tout le moins, le PHP dans votre HTML devrait être concis - appelant principalement des variables et parcourant des listes qui sont construites ailleurs.

3) Commentaires, indentation ... ce n'est que des bonnes pratiques de programmation de base. J'ai tendance à laisser la longueur de ma ligne dépasser 80 caractères lorsque j'écris du HTML, juste parce que la langue est tellement verbeuse, mais c'est à peu près la seule pratique traditionnelle que vous devriez laisser glisser - si le reste de l'équipe est bâclé, ils ont besoin de le sucer et de se mettre en forme.

Pièce
la source
Bon commentaire! Il y a une faute de frappe: "Mettez votre JavaScript dans le document"
DL
Oups. Je vous remercie. (J'ai oublié de coder par des crochets. Silly me.)
Patch
1
Javascript doit apparaître à la fin de votre page pour des raisons de performances.
Toby
0

Voici quelques morceaux:

Javascript: à utiliser varlors de l'initialisation de variables.

HTML: incluez les scripts au bas du fichier pour qu'ils se chargent en dernier.

PHP: divisez les fichiers. Ne placez pas toutes vos classes dans un seul fichier, comme vous ne le feriez pas dans un développement C ++ normal. Commentez autant que possible et notez également le but de vos fonctions / classes.

Harry
la source
J'ai essayé de suivre le guide de style Google Javascript: google-styleguide.googlecode.com/svn/trunk/javascriptguide.xml
Fosco