Retournez à
Accueil /
Recueil d'astuces de programmation
0
Avec cet article, mon idée de faire un petit recueil d'informations et autres astuces de programmation.
Je l'étofferai au fur et à mesure de mes découvertes.
Mise à jour : 19/12/2019
HTML5
La balise HTML5 <time> et son attribut datetime utilise la norme d'affichage ISO 8601, aussi appelé date W3C. Idéal pour améliorer son référencement.
La balise input type=email permet de vérifier rapidement la validité d'une adresse email. Les navigateurs récents utilisent de façon opaque une expression régulière pour la tester.
La voici (trouvé dans la doc. HTML5 W3C) :
La voici (trouvé dans la doc. HTML5 W3C) :
/^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*$/
CSS
En CSS, il existe une valeur pour toutes les propriétés, un énigmatique inherit.
Dans un fonctionnement normal et simplifié, les enfants héritent des propriétés des parents.
Malheureusement, quand on utilise des frameworks, ils leur arrivent de sur-contraindre un certain nombre d'éléments ou de classes comme <p> ou <a>.
Du coup, certains peuvent être difficilement accessibles, en particulier quand on laisse la main à un utilisateur. Inherit permet de forcer l'heritage d'une propriété, sans cibler au cas par cas.
Par exemple, je souhaite réduire la taille de la police de mes articles. Mais les balises générées par mon éditeur de texte sont directement affectées par un framework ou le style par défaut du navigateur.
Le code suivant permet de répondre, en parti, à ce souci.
article { font-size: 12px; }
article * { font-size: inherit; }
Un peu de doc :
inherit - developer.mozilla.org/fr
Il existe une règle CSS pour cibler les périphériques à écrans tactiles, du moins ceux possédant une précision moins importante avec le pointeur.
C'est encore expérimental, mais permet, par exemple, de rentre des liens plus facilement cliquable sur ces machines.
J'ai eu l'occasion de voir son bon fonctionnement avec Chrome desktop sur tablette ainsi que CM browser, par contre, rien sur Internet Explorer 11 sur tablette.
@media (pointer: coarse) { a { line-height: 2.5; } }
Quelques précisions : pointer Media Query - davidwalsh.name
On notera aussi que les pseudo-éléments ::after et ::before ne peuvent cibler qu'un élément de type conteneur comme span, div, p ou a et pas des éléments comme input ou img, car ce sont des éléments vides, ils ne peuvent avoir d'enfants.
PHP
Il n'est pas impossible que certains parmi vous est utilisé une solution de paiement en ligne du type Paybox.
Prenons l'exemple d'un panier de 30 et 30,12€.
Il faut transformer pour l'envoi vers la banque 30 en 3000 et 30,12 en 3012, pour faire apparaître les centimes.
Il existe une fonction PHP, très simplement pour faire cela :
string number_format ( float $number , int $decimals = 0 , string $dec_point = "." , string $thousands_sep = "," );
Donc notre cas, il suffit de passer :
number_format ( 30 , 2 , "" , "" );
On gérera aussi les paniers pour les milliers, millions, etc.
Il est possible de reclasser un tableau avec la fonction sort(), mais elle recrée les clés du tableau. Pour éviter ce changement, il est possible d'utiliser ksort() qui conserve les clés originales.
Il est possible de reclasser un tableau avec la fonction sort(), mais elle recrée les clés du tableau. Pour éviter ce changement, il est possible d'utiliser ksort() qui conserve les clés originales.
Il doit aussi vous arriver de manipuler des tableaux, or il est possible que la valeur correspondante à une clé soit égale à null.
Donc notre clé existe bien, mais la valeur est égale à null. Donc ce n'est pas détecté par isset() ou empty().
Donc notre clé existe bien, mais la valeur est égale à null. Donc ce n'est pas détecté par isset() ou empty().
La solution est utilisation de array_key_exists qui lui vérifie l’existence de la clé, quel qu’en soit sa valeur.
array_key_exists ( mixed $key , array $array ) : bool
JAVASCRIPT
Les requêtes AJAX sont fort pratiques, mais comme souvent, j'avais lu la documentation par-dessus la jambe.
AJAX signifiant Asynchronous JavaScript and XML, cela veut aussi dire que les retours que l'on attend ne sont traité qu'à leurs moments d'arrivée. Bref, on n'attend pas d'avoir un retour, tel qu'il soit, pour continuer l'exécution de la suite du programme.
Il est possible de passer en mode synchrone pour attendre par exemple, si un login existe déjà et indiquer son indisponibilité à l'utilisateur (exemple pas des plus optimum).
Retrouver des explications et solutions dans les liens suivants :
Appel AJAX synchrone en jQuery - finalclap.com
jQuery: effectuer une requête AJAX synchrone - php-geek.fr
MYSQL
Petite astuce que j'avais oubliée. N’hésitez pas à mettre un index sur les colonnes qui demande ou demanderont de faire des recherches sur un nombre important de données. Par exemple, sortir des utilisateurs avec leurs périodes d'abonnements.
Si l'intérêt est faible sur des jointures entre des tables modestes, il est énorme voire indispensable sur des plus gros traitements. Je suis tombé sur le cas où une jointure du type JOIN LEFT ne fonctionnait pas sans un index.
L'excellent site OpenClassRooms résume bien mieux que moi les avantages et inconvénients des index (et autres) :
Administrez vos bases de données avec MySQL / Index - openclassrooms.com
Administrez vos bases de données avec MySQL / Clés primaires et étrangères - openclassrooms.com
REGEX
Voici une liste d'expressions régulières qui peuvent toujours être utile :
Date française (00/00/0000) : /(0[1-9]|[12][0-9]|3[01])[- /.](0[1-9]|1[012])[- /.](19|20)\d\d/