Utiliser xhprof avec Drupal et Devel

Rencontrant de gros soucis de performances depuis quelques temps sur un site, j’ai utilisé xhprof pour trouver le souci, et le problème m’a sauté aux yeux grâce à cet outil !

Lire la suite

La petite pause technique s’offre un hébergement dédié !

Eh oui, ras le bol de l’hébergement mutualisé chez online.net, c’est une misère de performance, et en plus, pour un bidouilleur qui aime toucher à tout, l’hébergement dédié et idéal !J’ai donc franchi le pas, d’autant que j’en utilise déjà au boulot…

Ce blog devrait donc être désormais beaucoup plus rapide qu’avant, sans page 404 ou 500 aléatoires, un wordpress qui se met à jour très simplement, et ce n’est qu’un tout petit aperçu des possibilités qu’offre du dédié.

A votre bon plaisir !

 

Mettre en évidence les champs d’édition d’un nœud synchronisés d’une langue à l’autre (i18n_sync)

En multilingue, lorsque votre contenu contient un grand nombre de champs en tous genres, et que certains sont copiés d’une traduction à l’autre, il est souvent utile pour le contributeur de savoir que tel ou tel champ sera écrasé dans les autres langues. De même, il saura ainsi s’il doit aller dans chaque traduction modifier le champ ou s’il sera copié d’une traduction à l’autre.

C’est le rôle du module « i18n_sync » livré avec le module i18n, mais pas activé par défaut.

Lire la suite

Fontello : l’utiliser avec LESS, industrialisation

Fontello est un outil génial pour généré LA webfont contenant uniquement les caractères dont vous avez besoin => gain de poids énorme.

J’en ai déjà parlé dans mon article « Ajouter LESS à un site Drupal existant » : on sélectionne ses icônes et on télécharge un package contenant la font et le CSS associé généré. C’est très bien pensé car parmi les fichiers CSS, l’un comporte TOUTE la définition de la webfont (fontello.css), alors qu’un autre ne comporte que la définition des icones elles-mêmes (fontello-codes.css).

Lire la suite

Convertir une colonne VARCHAR en DATETIME sans perdre les données (MySQL)

Voici le code compatible MySQL 5.5 (BDD que j’utilise), en passant par une colonne intermédiaire.

ALTER TABLE pre_reservation ADD date_dem_old VARCHAR(30) NULL DEFAULT NULL AFTER date_demande;

update pre_reservation set date_dem_old = date_demande;

ALTER TABLE pre_reservation MODIFY date_demande DATETIME NOT NULL;

UPDATE pre_reservation set date_demande = CAST( FROM_UNIXTIME( date_dem_old ) AS DATETIME );

ALTER TABLE pre_reservation DROP date_dem_old;

Il est possible de faire la même chose en passant par une table intermédiaire, mais c’est un peu plus complexe de faire matcher les lignes de la table source et de la table intermédiaire lors de l’UPDATE (selon la clé primaire qu’il y a).

Ajouter LESS à un site Drupal existant

logo lesscssLESS est un langage dynamique pour écrire des CSS. C’est une surcouche en quelques sortes. Cela ajoute ce qui manque aux CSS : les fonctions, les variables, l’imbrication des instructions principalement. L’autre compilateur/language du même style est SASS. Ce sont 2 très bons outils, le choix vous appartient. Pour avoir fait quelques recherche, on trouve pas mal de librairies (type bootstrap, etc) qui utilisent LESS, d’autre part, le site de LESS est plus clair et beau, et lecompilateur est simple à intégrer, notamment dans Drupal. J’ai donc choisi LESS.

Lire la suite

Animations AngularJS depuis la 1.2

AngularJS évolue vite. Les animations sont apparues il y a quelques temps pour combler un vide de cette fabuleuse librairie JS.
Bref, elles ont évoluées en 1.2 pour devenir plus simples : plus besoin d’attribut ng-animate.

Voici tout d’abord les ressources nécessaires pour trouver son bonheur en terme de documentation et d’exemples :

 

Personnellement, je cherchais comment afficher/masquer une carte, avec un effet de déroulé. J’ai galéré un moment avant de trouver qu’il fallait  animer sur la propriété CSS « max-height » et non « height » !

 

Ressources pour débuter avec AngularJS

Si vous avez lu mon article précédent, AngularJS est le framework retenu pour un de mes futurs projets de site web mobile.
Je voulais absolument un site web HTML5 et non une application native, pour des raisons d’équipe de développement trop restreinte pour maintenir une multitude d’applications natives, et puis simplement par intérêt pour les technologies que cela nécessite. (Avis intéressant de Four Kitchens sur le sujet)

Pendant un moment, je me suis demandé si AngularJS était adapté au mobile. En fait, il est plus général que ça, et permet de créer des applications Web. Je mélange d’ailleurs les mots « application » et « site », car en JS, ces deux notions, à mon sens, se rejoignent dans la façon de programmer (événementielle, webservices, beaucoup de choses côté client).
AngularJS répond donc au besoin de création de site mobile.

Lire la suite

Choix d’un framework JS pour site mobile en single-page

Le site Web que je gère au quotidien repose sur Drupal. Pour faire une version mobile, la 1ère idée qui vient est simplement de faire un thème mobile et de continuer de se servir de Drupal pour desservir les pages. Mais je suis joueur, et j’avais envie depuis longtemps d’aller taquiner le JS de façon plus poussée, en faisant autre chose que du jQuery (Article très intéressant sur le sujet), étant une technologie de plus en plus utilisée, tant pour le mobile que pour des applications Web.

L’idée est donc naturellement venue de créer un site mobile « à part », appelant des Web-services Drupal qui retourneront le contenu (et seulement le contenu utilisé = perf). J’espère ainsi apprendre de nouvelle technologies, créer une application structurée, innovante, performante…

Lire la suite

PhoneGap : transformer votre single-page Web en une application mobile native

graphic_build_botC’est bien de ça qu’il s’agit. PhoneGap vous permet de créer une application/site en utilisant uniquement des technologies purement Web : HTML5, JS, CSS.
Votre application sera une page unique, comme par exemple avec jQueryMobile. C’est alors le JS qui s’occupe du routing entre « pages », qui ne sont que des chargements Ajax ou autres pour basculer d’un affichage à l’autre, et non plus des appels à des URLs côté serveur (en tous cas pas directement. S’il y a des appels à des URLs serveurs, c’est en JS, via Ajax ou autre sockets).

PhoneGap vous permet d’aller plus loin que de simplement embarquer votre site web. Il ajoute une librairie/API JavaScript, permettant d’interragir avec les fonctionnalités du téléphone, dans la mesure du possible (géolocalisation, notifications, GPS, caméra, contacts, etc.) : http://docs.phonegap.com/en/3.0.0/index.html

 

Voici les ressources que j’ai pu trouver sur le sujet, lorsque j’ai testé PhoneGap en créant une petite application.