Web, Applications agiles et Ruby on Rails

Un premier avis sur Spree (plateforme Ecommerce pour Ruby on Rails)

Depuis bientôt trois ans que je pratique quotidiennement Ruby on Rails, il est toujours resté pour moi une problématique encore non résolue : "et pour le E-Commerce, on fait comment ?". Je dois bien le dire, pour l'instant : "je fais comme je peux". En clair : Prestashop pour les grosses boutiques, et Rails maison pour les boutiques plus modestes mais avec des besoins très particuliers (produits sur mesures, système de promo. avancé...). Quoi qu'il en soit, la conclusion -à ce jour- n'a pas changé : IL FAUT UN MAGENTO EN RAILS.

J'ai bien essayé ForgeOS, en son temps, mais il s'est depuis perdu dans une plateforme beaucoup trop généraliste. Je cherche un sabre laser du E-Commerce, pas un couteau Suisse. Il y a eu aussi substruct... mais là encore, c'est plus "un CMS avec un panier" qu'autre chose, peu de monde semble d'ailleurs avoir suivi.

Nous voila donc fin 2011, et j'apprends que Spree vient de lever 1,5 Million USD, le site Web est tout beau tout neuf et il semble y avoir une communauté derrière. Cool. J'essaye la demo en ligne... allez, je l'installe, et je vois ce qu'il y a dedans...

• Rails 3.1.1, HAML, SASS/LESS, JQuery. On est vraiment dans ce qui se fait de mieux. En tout cas dans le mainstream de la communauté Rails
• 55 tables dans la BDD... seulement ??! Pour situer, Prestashop est autour de 135 tables "out of the box", et Magento 218. Bon, ok, ça ne veut pas dire grand chose. Moui, mais bon... quand même, 55 tables, ça "tend quand même à signifier" (notez les guillemets, svp) que pas mal de features seront en add-on, ou bien tout simplement absentes par rapport aux deux autres poids lourds du secteur sus-nommés.
• Hooo, y'a une API ! Bon signe, ça prouve qu'on est proche des besoins des grosses boutiques.

• La doc. Ou plutôt : LA doc. Rien à redire concernant ce qu'on trouve sur le site, propre, net, précis (en Anglais, ça va de soit). Ok, mais _ailleurs_ ? Les tutos ? Les Blogs posts ?! Ben... pas grand chose. Quelques bribes éparses sur des forums, à prendre avec des pincettes tellement Spree semble avoir changé ces dernières années mois. "On est dans le cutting edge, man !". En clair : va falloir s'accrocher.

L'installation se déroule facilement, puisque... toute l'application est contenue dans des Gems. Autant le dire franchement : je n'aime pas du tout cette approche (que j'ai déja vu ailleurs :-/). Les Gems, à mon sens (et sauf erreur de ma part, j'ai lu DHH dire la même chose) sont là pour étendre des fonctionnalités à l'échelle de Ruby. Perso, je ne comprends pas qu'on utilise ce moyen pour distribuer toute une appli, qui plus est une appli tournant non au niveau du language, mais bien en dessous dans un Framework ! Concrétement, après installation, vous vous retrouvez donc avec une application... vide, puisque tout est dans des Gems.

Ok, bon, admettons, commençons à modifier une vue ou deux pour se mettre en jambes : que dit la doc ? Qu'il faut créer d'autres Gems pour y mettre sa customisation, même au niveau des simples vues :-/ Donc, si je suis bien tout ça : mon appli est, et restera vide. En fait, Spree, c'est un Framework de Gems, quoi...

Là dessus, j'ai levé la tête du guidon et suis parti à la recherche de boutiques déja montées avec Spree : quelques "something went wrong" (si si) et quelques customisations de vues vraiment simplettes plus tard, j'ai décidé de laisser Spree dans un coin de mon /var/www, et d'y revenir dans quelques mois. Peut-être. Ou plutôt : j'espère.

Ce Post ne représente que ma modeste opinion après quelques heures de survol rapide de Spree. Si vous arrivez à me convaincre de m'accrocher encore un peu avec cette appli, libre à vous d'exposer vos arguments en commentaire, je n'attends que ça ;-)

5 commentaires

Initialiser un repo Git pour les nuls

Admettons que vous soyez dans la situtation suivante :

• Vous disposez d'un serveur dédié sur lequel vous hébergez (ou voulez héberger) une working copy et votre repository SVN
• Vous voulez quitter SVN pour GIT, mais n'êtes pas encore un expert en la matière
• Vous n'avez que faire de l'historique de vos commit, de vos branches... vous voulez juste repartir de 0 avec Git (sinon, voyez plutôt Git-SVN)
• Vous souhaitez simplement créer un dépot Git et démarrer du bon pied rapidement

Vous êtes aussi dans ce même cas de figure ?! Dans cette exemple, j'utilise deux machines : @server via SSH et @local qui est mon PC, au chaud chez moi.

# Côté serveur, on commence par se créer un répertoire qui hébergera le serveur "bare" (=le dépot SVN)

guillaume@server:$ mkdir /var/local/git/repos/my_app

# On initialise ce repo

guillaume@server:$ cd /var/local/git/repos/my_app && git --bare init
Initialized empty Git repository in /var/local/git/repos/my_app/

# Nous voila maintenant avec un repo GIT "bare", un peu comme un repo SVN. Si on regarde à l'intérieur, ça donne ça :

$ ls
branches config description HEAD hooks info objects refs

# On revient chez soi, en local, et on supprime récursivement tous les .svn du projet

guillaume@local:$ cd /home/guillaume/my_app/ 
guillaume@local:$ rm -rf `find . -type d -name .svn`

# Puis on initialise le projet, cela va créer un répertoire .git à la racine, contenant -entre autre- les fichiers de conf

guillaume@local:$ git init
Initialized empty Git repository in /home/guillaume/my_app/.git/

# On informe maintenant la copie locale de l'existence du repo sur notre serveur (évidemment, remplacez 81.81.81.81 par l'adresse de votre serveur). Par convention on appellera ce repo "origin"

guillaume@local:$ git remote add origin ssh://81.81.81.81/var/local/git/repos/my_app

# On informe Git des fichiers qu'il faut tracker. Dans notre cas, on ajoute tout le répertoire, soit simplement "."

guillaume@local:$ git add .

# Ok, on peut faire notre premier commit :

guillaume@local:$ git commit -a -m 'initialize repo'
[master (root-commit) 7871087] initialize repo
23 files changed, 500 insertions(+), 0 deletions(-)
create mode 100755 build.properties
create mode 100755 build.xml
.....

# On a presque terminé : il faut maintenant tout monter sur notre repo "origin", dans la branche "master" :

guillaume@local:$ git push origin master
Counting objects: 44, done.
Delta compression using up to 2 threads.
Compressing objects: 100% (31/31), done.
Writing objects: 100% (44/44), 1.65 MiB, done.
Total 44 (delta 1), reused 0 (delta 0)
To ssh://81.81.81.81/var/local/git/repos/my_app
* [new branch] master -> master 

# Et voila ! Si on retourne sur notre serveur, on a plus qu'à "cloner" (= checkout sur SVN) notre appli :

guillaume@server:$ git clone file:///var/local/git/repos/my_app

# On peut vérifier que tout marche en faisant quelques modifs dans des fichiers en local, puis :

guillaume@local:$ git commit -a -m "Add some killer features"
[master 51401e0] add
 1 files changed, 2 insertions(+), 0 deletions(-)
 mode change 100644 => 100755 app/views/demo.html.haml

guillaume@local:$ git push
Counting objects: 13, done.
Delta compression using up to 2 threads.
Compressing objects: 100% (7/7), done.
Writing objects: 100% (7/7), 595 bytes, done.
Total 7 (delta 5), reused 0 (delta 0)
To ssh://81.81.81.81/var/local/git/repos/my_app
   ef4d530..51401e0  master -> master

# On revient sur le serveur, et on on "pull"

guillaume@server:$git pull 
remote: Counting objects: 13, done.
remote: Compressing objects: 100% (7/7), done.
remote: Total 7 (delta 5), reused 0 (delta 0)
Unpacking objects: 100% (7/7), done.
From file:///var/local/git/repos/my_app
   ef4d530..51401e0  master     -> origin/master
Updating ef4d530..51401e0
Fast forward
 controllers/application_controller.rb     |    2 ++
 1 files changed, 2 insertions(+), 0 deletions(-)
 mode change 100644 => 100755 app/views/demo.html.haml

Ce tuto est librement inspiré de celui-ci en Anglais, qui m'a beaucoup aidé à faire mes premiers pas.

Aucun commentaire pour le moment

Cinq bonnes raisons d'aimer Ruby

Cela faisait très longtemps que j'avais ce post en tête, j'avais vraiment envie de mettre à plat quelques unes des raisons qui font qu'il m'est maintenant pénible de revenir à PHP (non, c'est pas un troll, j'explique, c'est tout !). Voici donc 5 aspects particulièrement pratiques à mes yeux en ce qui concerne mon utilisation quotidienne de Ruby :

• Tout est objet
  Oui, je sais, on vous a déja fait le coup avec Java, mais là c'est vrai. Même avec les types primitifs. Le nombre "1" par exemple, est un objet comme les autres.
  Exemple :

  5.times{puts "hello"}
  hello
  hello
  hello
  hello
  hello
  

  Et pour connaitre toutes les méthodes d'un objet, c'est aussi très simple : "1.methods" dans le cas présent vous dira tout ce qu'il est possible de faire avec votre nombre "1".
  Tout ça peut paraitre un peu gadget présenté comme ça, mais le GROS avantage que j'y vois par rapport aux autres languages, c'est qu'on a plus de question à se poser : tout, absolument tout, est objet. Pas d'exception à rajouter dans mon petit cerveau encombré, c'est déja ça de gagné.
  
  
• La syntaxe
  Avec "la syntaxe", je suis vraiment large et regroupe volontairement un paquet de choses, mais ce seul "la syntaxe" est un argument de poids quand vous passez 10 heures/jour devant votre écran. Je ne sais pas vous, mais moi en tout cas, le camelCase les () ; et autres {} ça me fait mal aux yeux.
  Exemple
  

  # Ruby
  if my_flag == true
    Stuff.do_this_little_trick_with "a string"
  else
    Stuff.do_not_do_it
  end
  

  Avouez quand même que par rapport à ça
  

  # PHP
  if(my_flag == true){
    Stuff->doThisLittleTrickWith("a string");
  }
  else {
    Stuff->doNotDoIt();
  }
  

  C'est quand même plus lisible, non ? Cet exemple est archi simple, mais quand vous avez plusieurs centaines de lignes dans une classe codée il y a un plus d'un an, (ou codée par quelqu'un d'autre) croyez moi, on apprécie...
  
  
• Les attributes accessors
  Il y a plusieurs façon de renvoyer plusieurs attributs en sortie d'une classe. La plus évidente est sous forme de tableau. D'ailleurs, bien souvent, vous n'avez pas trop le choix, à moins de créer une méthode uniquement pour pouvoir accéder à vos attributs avec une notation objet plus pratique et élégante. En ce qui me concerne, moins j'en fais et mieux je me porte, d'autant que Ruby met à ma disposition les attr_accessors. Hy-per-pra-tique
  Exemple :

  class User
  
    attr_accessor :phone, :first_name, :last_name
  
    def initialize(phone, first_name, last_name)
      @phone = phone
      @first_name = first_name
      @last_name = last_name
    end
    
  end
    
  => new_user = User.new("0812 01 02 03", "Guillaume", "Barillot")
  => new_user.first_name # => "Guillaume"
  

  Ca n'a l'air de rien, mais l'essayer, c'est l'adopter !
  
  
• La console
  Mon premier language était Python (où la console existe aussi depuis toujours), ceci explique peut être cela, mais j'ai toujours apprécié d'avoir une console sous la main. Vous ne vous rappelez plus de la syntaxe de tel appel ? Vous avez un doute sur ce que va faire votre boucle ? Hop, un petit tour en console et vous êtes fixé, pas besoin de relancer tout votre process et votre page Web.
  Exemple :

  irb > 5.Time.puts "hello"
  NoMethodError: undefined method `Time' for 5:Fixnum
  	from (irb):19
  	from :0
  # Ha bon ? 
  
  irb > 5.times{puts "hello"}
  hello
  hello
  hello
  hello
  hello
  # Vooooila, c'est ça, j'avais juste oublié les brackets
  

  
  
  
• La gestion des dates et du temps
  Alors ça, la première fois que je m'en suis servi, j'ai vraiment eu du mal à y croire ! Quiconque s'est déja essayé à coder un calendrier ou -pire- un outil de gestion de planning s'est forcément cassé les dents là dessus. Avec Ruby, économisez sur votre budget dentiste, tout est simple et intégré d'origine, sans avoir recours à une librairie supplémentaire.
  Exemple :

  # Vous avez besoin des jours compris entre le 27 Février 2011 et le 2 Mars 2011
  (Date.new(2011, 2, 27)..Date.new(2011, 3, 2)).each { |x| puts x.day }
  # => 27 28 1 2
  
  # Même chose en 2012 ?
  (Date.new(2012, 2, 27)..Date.new(2012, 3, 2)).each { |x| puts x.day }
  # => 27 28 29 1 2
  # Hoooo, une année bisextile !
  
  
  

Voila, j'éspère vous avoir donné envie de vous plonger dans cet excellent language qu'est Ruby.

Petite anecdote : devoir quitter PHP pour Ruby était l'un des freins majeur qui me faisait résister au Framework "Ruby on Rails". Finalement, et très honnêtement, je n'ai jamais eu l'impression "d'apprendre" quelque chose, dans le sens "on commence de rien et on suit péniblement la courbe d'apprentissage". En fait, si vous connaissez la Programmation Orientée Objet, que vous êtes déja à l'aise dans un autre language, et si en plus vous avez déja exploré un peu Python, je le dis sans exagérer : il n'y a pas de courbe d'apprentissage ! Vous pouvez réellement prendre en main ce language en quelques heures seulement.

Vous utilisez déja Ruby et j'ai oublié de parler d'un aspect qui vous plait particulièrement ? Laissez votre commentaire !

8 commentaires

La meilleure façon (et la moins chère) de faire des screencasts au format flash

Cela m'aura finalement pris pas loin d'une journée avant d'arriver à une qualité optimale, mais il était vraiment important pour moi de réaliser des screencasts de bonne qualité afin de créer des rubriques d'aides dans mon prochain projet.

Durant cette journée de test, j'ai pu tester les solutions suivantes, pêle-mêle :

• (Linux) Istanbul : plante régulièrement, et qualité d'image pas top
• (Linux) XVidCap : sympa, agréable, mais capture vidéo pas encore optimale
• (Linux) RecordMyDesktop : trop gourmand en resources
• (Linux) OpenshopvideoEditor : plante beaucoup trop régulièrement, inutilisable
• (Linux) Kdenlive : extrement gourmand en ressources et plante tout-le-temps (peut être lié au fait que je n'utilise pas KDE ?!)
• (Windows) Camtasia : Hem, 320$ la license, quand même ! Belle application, mais je ne trouve pas l'ergonomie phénoménale et les fonctionnalités sont somme toutes limitées (en démo du moins, mais ça ne m'a pas vraiment donné envie d'acheter la version payante)
• (Windows) Wink : Fonctionnalitées plutôt limitées, mouais, bof...
• (Windows) Super : arf, le nom d'appli le plus bidon que j'ai jamais vu !!! Bref, pour être sérieux, splendide usine à gaz permettant en théorie de transcoder n'importe quel type de média vers n'importe quel autre type (mov -> avi, mpg -> flv ...), et qui au final vous prend énormément de temps à paramétrer pour un résultat approximatif. Certainement extremement puissant, mais moi, mon but, c'est pas de pouvoir tout faire. Non, je veux juste passer de l'avi vers du flv avec la meilleur qualité possible. Point barre.

Finalement, j'ai trouvé le compromis idéal en utilisant 3 applis :

• Capturer l'écran avec CamStudio, en utilisant le codec "Techsmith" (éditeur de Camtasia ndlr) avec une sortie en AVI : qualité d'image vraiment irréprochable
• Monter sa vidéo, couper/coller / ajouter des titres... avec Windows Movie Maker : gratuit, hyper simple d'utilisation et présentant de très nombreux presets d'effets. Seul (tout petit) regret, le paramétrage de la vitesse de lecture : on a juste la possibilité de faire 2x plus rapide, point. Accélerer de 75% une fraction de film est donc impossible. Je peux me tromper, mais en tout cas jusque là, j'ai pas trouvé comment faire. Quoiqu'il en soit, je ne m'attendais sincérement pas à ce qu'il soit aussi facile de monter une vidéo, synchroniser de l'audio, rajouter des titres... bravo Microsoft (notez le, je ne le dis pas tous les jours !)
• Transcoder la vidéo avec WinFF : bon, dans le fond, c'est toujours du FFMPEG (tout comme Super), mais il y a dans cette GUI en surcouche quelques presets permettant d'encoder en FLV avec une excellente qualité. Ceci dit, il est toujours possible d'utiliser FFMPEG en ligne de commande avec les bonnes options (bon courage, vous n'avez pas fini de tatonner ;-)

Voila, si ça peut vous éviter de perdre votre temps comme j'ai pu le faire, ce petit billet aura rempli son rôle. Désolé de certaines critiques peut être un peu rapides, mais je n'avais pas le temps de rentrer dans les configurations de chaque appli et tout optimiser, ce qui aurait peut être changé mon point de vue sur certains avis. Au final, ce qui ressort ici est juste le résultat d'une journée de tatonnement à la recherche (rapide) d'efficacité. Ne m'en voulez donc pas d'avoir fait l'impasse sur certaines solutions (Camtasia notamment, qui semble bon leader dans ce marché).

Aucun commentaire pour le moment

Excellent aide mémoire pour SVN

Si vous êtes comme moi à toujours rechercher "c'était quoi déja cette commande pour changer un repo ?" et autres manips simples mais pas assez courantes pour vous en rappeler concernant Subversion, je viens de trouver LA doc qu'il vous faut. Et en prime, c'est en Français.

Un grand merci à toi, Julien :-)

Aucun commentaire pour le moment

Ouvrir systématiquement tous les liens extérieurs dans une nouvelle fenêtre

Voila bien une demande systématique de _tous_ les clients : "je veux que les liens s'ouvrent dans une nouvelle fenêtre". Certes, certes, cela fait des années que tout le monde utilise la fonctionnalité "ouvrir dans un nouvel onglet" du navigateur afin de choisir ce que l'on fait avec chaque lien, mais peu importe, c'est le client qui décide. Du coup, la p'tite dificulté que cette demande peut engendrer est sur deux plans :

• L'attribut "target" est maintenant "deprecated", et il serait vraiment idiot de ne pas valider mes pages xhtml 1.0 uniquement pour cette raison. Donc, pas de "target='_blank'" en dur.
• Enfin, avec un CMS, ce sont les clients qui saisissent eux mêmes les liens, au fil de leur contenu, avec (souvent) une quantité non négligeable de liens pointant vers leur propre site. Il y a donc des liens qu'il faut ouvrir dans la même page.

Une solution évidente au premier abord : ajouter un bouton radio dans la boite de dialogue permettant de créer les liens avec un label genre "ouvrir ce lien dans une nouvelle fenêtre". Je crois que c'est typiquement le genre de fausse bonne idée qui va m'amener une floppée de coups de téléphone et de Mails du genre :

• Client : Ce lien ne s'ouvre pas comme je l'avais demandé !!!
• Moi : Avez-vous bien coché la case "ouvrir dans une nouvelle fenêtre" ?
• Client : Heuuuu, quelle case ?...".

Bref, partant de là, j'ai trouvé une idée simple pour tout le monde (et surtout le client), qui fonctionne sans faille, et sans ajouter un seul bouton, tout en restant valide XHTML 1.0. Le truc est tout simplement d'ajouter l'attribut 'target' de façon dynamique au chargement de la page, uniquement sur les liens commençant par "http:". Le tour est joué en seulement 3 lignes de JS (avec prototype) :

function addExtLink(){
  $$('a').each(function(this_link){
    if(/^http:/.test(this_link.readAttribute('href'))){
      this_link.writeAttribute('target', '_blank');
    }
  });
}

Je vous laisse le soin de charger ça sur 'dom:loaded'. Voila, c'était mon bout de code à 10c du jour :-).

Aucun commentaire pour le moment

De belles Fonts dans tous les navigateurs et sans prise de tête avec la Google Font API

Depuis le temps qu'on doit se battre avec des images pour avoir un tant soit peu de variété au niveau des Fonts, c'est avec un vrai grand plaisir que j'ai d'abord accueilli les possibilitées ouvertes par CSS3 et l'attribut @font-face... hélas, je me suis rapidement retrouvé face aux différences d'implémentations entre navigateurs, avec des formats de fonts différents (TTF pour un peu tout le monde, et EOT pour IE), et des rendus plus ou moins approximatifs (étonnant, hein ?!).

Dans ce paysage, une solution devient alors très interessante : Google Font API. Le principe : vous incluez un bout de code, et Google se charge de vous envoyer la bonne font en fonction de votre navigateur. En prime, Google se charge du hosting et de la bande passante nécessaire à cette même font. Sympa, non ?

Un exemple en deux lignes

<head>
...
<link href='http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz:extralight' rel='stylesheet' type='text/css'>
...
</head>

<body>
<h1 style='font-family:Yanone Kaffeesatz'>Foo Bar !<h1>
...

Ce qui nous donne à l'écran :

Vous avez aussi la possibilité d'appeler l'API via Javascript (ce que je fais dans le projet sur lequel je suis), mais je vous laisse voir la doc ainsi que les différentes Fonts actuellement disponibles.

Aucun commentaire pour le moment

(anti)Pub du windows Phone

Hu hu hu, je viens de voir la pub pour le windows phone, et je ne peux m'empêcher de me rappeler les paroles d'un développeur d'applis mobiles rencontré récemment :

• Lui : En fait, je développe essentiellement sur une base de HTML5, c'est plutôt simple, cross-platform et super puissant
• Moi : HTML 5 ? Et tu t'en sort avec les différents terminaux ?!
• Lui : Ho oui, le mobile c'est cool, avec Chrome sur Android et Safari sur Iphone, aucun problème... Enfin, y'a juste le windows phone qui arrive avec IE8 et là j'ai un peu peur que ce soit la m**** beaucoup plus compliqué pour moi

Je crois que tout est dit :-)

Aucun commentaire pour le moment

PDF Generation using Ruby is just a f**** pain

It's been now 20 hours I'm working on a PDF invoice document. Man... 20 hours for a fu**** stupid invoice !!! I am very surprised about the lack of _real_ good solutions. Here's what I have to deal with by now :

PDF-Writer : Well documented grand father I already used, but does not handle PNG transparency, nor UTF-8 (WTF ?!)

Prince : Looks nice but... 3 800 $ per server Licence !!!

HTMLDOC : Absolutly not railysh. Have to turn around again and again to make it work (the ugly way)

Simple ruby PDF Generator : Yeah... simple

PDFKit : Promising idea, but I can't get it to work the "Rails way" using Rack on my box (Rails 2.3.8). Documentation near level 0, and very new kid on the block. Later, maybe ?!

Ruby FPDF : Ruby port of PHP's FPDF lib. I didn't love the original FPDF very much in my PHP years... plus for this ruby port : No documentation at all, no Github repo, very few users, last update two years ago. I don't feel really confident about it. I maybe wrong.

Prawn + prawnto : Fast, efficient pure Ruby lib, and "working the Rails way" using the prawnto plugin. On the other hand : the very bad news about Prawn is its DSL Syntax which is absolutly horrible. Nevermind, read the doc ! And here's the second bad news : I've never ever ever, seen such a confusing Documentation in ten years of programing. Examples given on Github work sometimes (and sometimes... not), official Doc is lacking, althought I've found at least 3 differents docs sources.  Maybe a real good unified and up-to-date documentation should be enough to really understand and use Prawn, but by now, here I am : 20 hours of tough work just to render a simple invoice. Damn !...

If you really (I mean : REALLY) have to generate PDF, I would say... no forget about it, don't use PDF in your rails app. Or wait 2/3 years Prawn to have a decent doc and tutorials.

Aucun commentaire pour le moment

A free, lightweight yet powerfull image magnifier for prototype

Surprisingly, I did not found any image magnifier that can suit me needs :

• prototype based
• lightweight
• unobstrusive JS, simple and clean HTML markup
• free
• easily tweakable (sizes, aspect ratio...)

... So I wrote my own, and as I think I'm not the only one who love this effect, why not publishing it ? You'll find every details, code download and a demo here. Support is not garanteed, but fell free to ask.

Enjoy :-)

5 commentaires

Manipuler (très) facilement les images en PHP

Je viens de découvrir ça : http://www.mawhorter.net/web-development/simple-image-manipulation-in-php-rotate-resize-crop-flip-and-mirror-thumbnails-square-and-regular et de l'intégrer dans un projet Prestashop où j'ai besoin de manipuler facilement des PNG 24 bits semi-transparents.

Franchement, je n'ai qu'un mot à dire : chapeau. La syntaxe des appels aux différentes méthodes de la classe est très simple à assimiler, et ça fonctionne remarquablement bien. La grosse différence avec toutes les autres classes du même genre que j'ai pu essayer, c'est l'excellente gestion des fonds transparents sur les PNG (en fait, c'est très simple : vous n'avez pas à vous en préoccuper. Ca marche, et c'est tout.)

Aucun commentaire pour le moment

Moz-border-radius ? Finalement, je suis pour

Depuis 8 ans maintenant que je code du HTML et de la CSS, j'ai toujours été hostile à tous les attributs propriétaires. Sans racisme aucun, qu'ils soient de chez Microsft comme de tous les autres, ma volonté a toujours été de faire qu'un site Web _devait_ s'afficher sur tous les browsers de la même façon. Mais ça c'était "avant". Avant que les IE (toutes versions cumulées) ne descendent en dessous des 50% de part de marché, avant que Firefox ne s'impose, que Chrome et Safari n'envahissent le terrain avec des possibilitées fort sympathiques, et avant que CSS3 ne déboule.

"It's not a bug, it's a feature !"

"Maintenant", donc, et après moult réflexions, j'ai décidé d'employer progressivement mais sans limite les différents attributs propriétaires de chacun des Browsers... ce qui était avant un bug va sciamment devenir une fonctionnalité

Ce qui va changer :

• Les sites n'auront plus très exactement la même apparence entre les différents navigateurs
• Il est très probable (certain !) que mes sites seront moins beaux lorsqu'ils seront vu avec Internet Explorer
• J'oubli purement et simplement IE6. Fini.
• J'assume, il va falloir convaincre et -je dirais -presque- "former" les clients

Pourquoi ?

• Si tout le monde, petit à petit, se met à agir ainsi, les clients comprendront tout naturellement que le Web est beaucoup plus beau, interactif et interressant avec Firefox, Safari, Opéra ou Chrome
• Je suis fatigué de toujours devoir m'aligner sur le maillon faible (IE 6 !!!), alors que les navigateurs modernes permettent beeeeeaucoup plus de choses, notamment en terme de Design
• J'ai envie d'aller de l'avant, de proposer des choses nouvelles, et à un moment, il faut savoir tourner la page et dire au revoir aux anciennes pratique

Seule exception, le Flash pour les vidéos, où faute d'alternative encore suffisament standardisée, je vais continuer d'utiliser les player embed.... pour combien de temps encore ? Le Web change vraiment ces derniers temps !

Aucun commentaire pour le moment

OVH et RPS : la-men-table

Petit coup de gueule, mais trop c’est trop : j’ai décidé de changer d’hébergeur. Je ne sais pas pourquoi (et c’est peut être bien ça le problème d’ailleurs, de ne pas savoir !) ce que font OVH avec leur offre RPS, mais la qualité de service est globalement en chute libre. Je dis bien -globalement- parce que je gère 3 serveurs de ce type dont deux pour des clients en tant que prestataire : tous connaissent des problèmes de qualité de service.

La dessus, ajoutez qu’il y a des problèmes de consommation de RAM aussi aléatoire que toujours inexpliqués, et pour lesquels la seule réponse à mes appels argumentés de graphs a été : “nous vous conseillons de monitorer votre serveur avec des outils comme ‘top’”. Alors celle là elle vaut son pesant de c*****, hein ?! Je leur met sous les yeux des graphs on ne peut plus explicites et leur seule réponse est “nous vous conseillons de faire des graphs”.Bravo, et merci. Quant aux 6 heures d’interruptions de service qui m’ont obligé à bosser 2 heures dimanche dernier afin d’être certain que les disques se remontent correctement, là non plus : toujours aucune explication. Idem pour les 8 redémarrages que j’ai du faire un deux semaines sur un des RPS de mes clients. Silence total et surtout, aucun geste commercial.

Bref, je vais en rester là avant de m’énerver, d’autant que j’ai un serveur à monter de toutes pièces et rien moins que 23 sites à déménager dans la journée.

Au revoir OVH.

3 commentaires

1 & 1 (& vieux machins…)

Un client m’a demandé de prendre en charge son changement d’hébergeur de OVH vers 1&1, concernant un site en PHP5, et je découvre qu’ils sont encore et toujours en PHP4 ! C’est pas pour dire du mal du plus gros hébergeur en Europe, mais ça fait quand même drôle de lire des trucs comme ça en 2010 :

La version 4 de PHP étant la plus utilisée, chez 1&1 Internet l’extension .php est ainsi prise en charge par PHP4.

PHP4, la version la plus utilisée, sérieusement ??! PHP4 : son modèle objet bien bancal et ses passages par valeurs, ses register_globals à OFF, la gestion cahotique de l’UTF-8… PHP4 qui n’est plus maintenu ni mis à jour depuis Août 2008 !!! Me voila donc à me débrouiller avec un .htaccess pour pouvoir utiliser la version 5. Ca marche, oui, bon, pas de quoi fouetter un chat ; c’est juste qu’en 2010, ça surprend un peu de lire des trucs pareils…

Bon, je fini vite cette commande et je retourne dans mon Rails tout beau tout neuf. Le monde PHP, vraiment, c’est que des vieux (mauvais) souvenirs.

Aucun commentaire pour le moment

Un Slideshow vite-fait-bien-fait® avec Prototype

L’idée est d’avoir préalablement les noms de toutes les images d’un diaporama au sein d’un tableau en JSON (dans mon cas, je génère tout ça en même temps que la page, mais libre à vous d’obtenir ce tableau avec AJAX) ; le JS ci-dessous se charge ensuite d’alterner les images avec le fondu/enchainé qui va bien. Efficace, pratique et concis.

function startSlide(pics,id){
  var a = 1;//la première image est affichée au chargement de la page  
  new PeriodicalExecuter(function(){  
    new Effect.Fade(id, { 
      duration: 1, 
      fps: 50,
      afterFinish: function() {     
        $(id).src = "/images/"+pics[a];
        (a < pics.length-1) ? a++ : a = 0;    
        new Effect.Appear(id, {
          duration: 1,
          fps: 50,
          queue:'end'
        })   
      }
    })       
  }, 5);
  return true
}

Pour les paramètres :

• id : id CSS de votre tag IMG qui affiche les images
• pics : tableau JSON contenant les noms de vos images

N’oubliez pas pas le “return true” à la fin, sans quoi IE va crier au stackoverflow

… et le tout se démarre comme ça

document.observe("dom:loaded", startSlide(
  ['image_1.jpg','image_2.jpg','image_3.jpg'],
  'id_de_mon_tag_IMG'
  )
);

Testé dans IE6/7/8/Safari/Firefox. Enjoy :-)

Aucun commentaire pour le moment

Sauvegarder son RPS en une ligne (et en 20 secondes) avec Rsync

Les sauvegardes, c’est vital ; et avoir à tout moment un backup récent est tout aussi crucial, qu’important et… négligé. Mais on ne peut raisonnablement pas re-copier l’intégralité de son serveur bien au chaud sur son PC par FTP ?! Cela ne prend rien moins qu’un temps monstreux, alors faire ça tous les jours… non, ce qui serait bien, c’est de ne télécharger QUE la différence entre deux sauvegardes. C’est là qu’intervient Rsync, qui va vous permettre d’effectuer ces sauvegardes incrémentielles. Le Net regorge de tutos tous plus complets les uns que les autres et que je vous encourage à lire pour votre culture personnelle. Ceci dit, si tout ce que vous voulez, c’est copier le /home de votre serveur dans le /home de votre PC, et que vous avez une Ubuntu sur un RPS chez OVH, je vais vous faire gagner du temps ; ouvrez un terminal et tapez cette ligne de commande en root :

rsync -e ssh –delete –delete-excluded -avR votre_login_ssh@votre_machine.ovh.net:/home/ /home/mon_repertoire_de_sauvegarde

Voila, cherchez pas plus loin, c’est aussi simple que ça. La première sauvargarde va être énorme et vous prendre un temps fou (puisque c’est la première), mais ensuite vous n’échangerez plus que la différence ! Et hop, à vous les sauvegardes quotidiennes, et les bonnes nuits de sommeil.

Notes : ça doit bien sur marcher avec n’importe quelle autre distribution et ailleurs que chez OVH, mais là, j’ai pas testé, je vous laisse voir…

Et merci à Sylvain pour le tuyau, sans qui je serais toujours avec mes sauvegardes titanesques (et beaucoup trop rares) par FTP.

Aucun commentaire pour le moment

Ho p***… la claque !

J’aurai aussi pu intituler ce post “Avis de décès imminent pour Flash”, ou bien “on y est presque”, mais “ho p*** la claque” est vraiment la première phrase qui m’est venue à l’esprit quand j’ai vu cette démo de Paul Rouget .

Dingue, non ?

Aucun commentaire pour le moment

IE8, opacité et PNG… la couleur d’un Bug

Devant la grande diversité de la gestion de la transparence entre les différents navigateurs et leurs versions respectives, j’ai depuis un moment (depuis l’arrivé d’IE8, en fait) pris l’habitude d’utiliser des PNG 24 Bits afin de créer des effets de transparence. Rien de plus simple, vous créez un PNG de, disons, 2x2 pixels, semi-transparent, puis vous l’appliquez en background repeat. Pour IE6, il suffit de gérer ça à l’ancienne avec “filter : alpha(opacity=80);”. Et hop, en deux lignes, vous avez un effet de transparence Cross Browser qui marche à tous les coups.

Le truc que je viens de découvrir, c’est qu’avec IE7/8, lorsque vous prenez une image de -exactement- 1x1 pixels, vous vous retrouvez avec… un dégradé !!! Etonnant, non ? Cher lecteur, je vais te faire gagner du temps et t’épargner un arrachage de cheveux (non, ne cherche pas de conflit avec JQuery. Non, c’est pas non plus un attribut en surcharge dans ta CSS…) : il suffit uniquement d’utiliser des images de -au moins- 2x2 pixels, et tout fonctionnera normalement.

Envie de surprise ? Envie de perdre du temps ? Internet Explorer !

Un commentaire

Fat Free CRM, un CRM sans gras, mais survitaminé

Cela fait maintenant deux semaines que je teste Fat Free CRM, et jusque là, j’en suis plutôt content. Alors _attention_, il s’agit vraiment d’une application en cours de développement, et pas mal de Bugs surgissent encore de ci de là. Toutefois, certains points me donnent à penser que cette solution pourrait bien devenir crédible dans les années à venir, et notamment :

• Open Source à 100%, avec une communauté motivée, compétente et ouverte (et très internationale)
• Techniquement, c’est du Rails, avec HAML pour les templates. En clair : créer de nouveaux modules et adapter la bête à ses besoins est un régal
• L’utilisation massive d’Ajax, qui rend l’usage de l’application très fluide et agréable
• Il n’y en a pas (encore ?) de partout, et ça, quand on connait Sugar CRM ou VTiger, c’est appréciable (J’aurai l’occasion de revenir sur l’ergonomie des CRM dans un prochain billet).

Bon, par contre, c’est encore une solution extremement jeune (je dirais même : encore dans l’oeuf), il manque encore des choses vitales dans un CRM comme la gestion intégrée des Mails, les tableaux de rapports, une API normalisée pour les plugins (voui, bien sur, il y a les plugins de Rails, mais comment cela s’interface depuis et avec l’admin, rien n’est encore fait de ce côté là)…

Quoi qu’il en soit, j’ai décider de le garder, ce petit CRM, et de m’inscrire à la Mailing list des Développeurs. Il y a des choses à faire avec ce CRM, j’en suis convaincu.

Aucun commentaire pour le moment

HAML : en voila une alternative TRES intéressante !

Au hasard de mon bêta test de Forgeos Commerce, je viens de découvrir HAML. Autant être clair, je n’ai jamais accroché à Smarty, et encore moins Phptemplate, ayant toujours trouvé que cela ne faisaist que rejouter une couche sans grand interêt (si ce n’est pour la localisation, moui, d’accord, bon…) par dessus un autre language de template qu’EST déja PHP. Et puis empiler des classes PHP sur d’autres classes PHP qui elles mêmes surchargent d’autres classes… à la fin ça se termine en Magento, bonjour l’usine à Gaz, et la facture du serveur dédié qu’il va falloir dimensionner en bête de course.

La dessus, est arrivé Rails et ses helpers, et les templates se sont vraiment épurés, commençant enfin à prendre tournure agréable, pragmatique et surtout : standardisées.

Mais alors, c’est quoi exactement là dedans HAML ??! Une façon rien moins que ré-vo-lu-tion-naire (si je vous le dis !) de gérer ses vues. Un language de templates de plus ? Non, LA solution !

Un petit exemple :

HAML

#content
  .left.column
    %h2 Welcome to our site!
    %p= print_information
  .right.column
    = render :partial => "sidebar"

=> HTML

<div id="content">
  <div class="left column">
    <h2>Welcome to our site!</h2>
    <p><%= print_information %></p>
  </div>
  <div class="right column">
    <%= render :partial => "sidebar" %>
  </div>
</div>

Oui, c’est bien ça, l’indentation compte, et les classes CSS sont directement utilisées afin de définir les blocks ! Houuuuuulla, je sens que je vais être vite converti !

Aucun commentaire pour le moment

De l’UTF-8 dans les URL

D’après le monde daté de ce jour, les adresses Web (les URL, donc) vont pouvoir accepter prochainement les caractères spéciaux ! Grande nouvelle pour nos amis Chinois ou Arabes, qui devaient jusqu’alors se débrouiller avec nos caractères latins. Plus proche de nous, cela permettra aussi (logiquement) d’utiliser des accents, et c’est plutôt bien. Petit revers de la médaille, ce grand World Wide Web risque de se fragmenter quelque peu (je fais comment, moi, pour faire une recherche en Arabe avec mon clavier Latin bien classique ?), mais on ne pouvait plus continuer d’ignorer plus longtemps la moitié des 1.6 Milliards d’internautes communiquant avec une langue basée sur un autre alphabet que notre latin occidental.

Aucun commentaire pour le moment

La fonction PHP Mail() et l’antispam d’Orange.fr

Je viens de découvrir à mes dépends que le Mail d’Orange.fr refuse systématiquement les Mails dont le “Return-Path” n’est pas dûment renseigné. Le message n’est même pas passé en Spam, il n’arrive tout simplement… jamais!

La solution pour PHP, est d’utiliser le cinquième argument au moment de l’appel de la fonction mail (je vous passe le formatage du reste du Mail, y’a déja plein d’autres articles là dessus) :

$return_path = "-f" . "postmaster@monsite.fr";
mail($to, $sujet, $message, $header, $return_path);

Quant à Rails, il suffit de bien renseigner son /config/environnement.rb

ActionMailer::Base.delivery_method = :sendmail
ActionMailer::Base.sendmail_settings = {
  :location       => '/usr/sbin/sendmail',
  :arguments      => '-i -t -f postmaster@monsite.fr'
}

En espérant que ça puisse aider quelqu’un afin d’économiser une heure de temps précieux comme je viens de le faire…

Aucun commentaire pour le moment

La mort du flash

Je viens de jeter un oeil attentif au slideshow de Daniel Glazman. Comme d’habitude, son exposé est aussi interessant qu’éclairé. La seule petite chose qui me fait tiquer est le slide 27 dans lequel il assène un très sec “il faut tuer Flash“. Autant annoncer la couleur, je ne suis pas non plus un fan de cette techno, mais tout de même… il faut tuer Flash, c’est un peu tranchant comme point de vue, tellement il n’y a RIEN depuis si longtemps pour faire tant de choses pourtant indispensable (à commencer par la vidéo).Franchement, je ne pense pas (j’en suis même certain), que la révolution se fera rapidement et brutalement.

Il va falloir encore pas mal d’années avant que Flash ne s’éteigne de sa belle mort… mais ce sera looooong, et à petit feu. D’ailleurs, ça a déja commencé.

Aucun commentaire pour le moment

Réferencement : la Meta keywords ne sert à rien

C’est donc maintenant officiel : la balise Meta “Keywords” n’est plus d’aucune utilité dans le réferencement Google. Bon, il n’y a pas que Google dans la vie et de toute façon, nous, on continuera de respecter les bonnes pratiques en l’utilisant à bon escient. Mais c’est le genre d’informations qui est toujours bonne à savoir.

Il n’y a pas de miracle en matière de réferencement, et il ne s’agit rien moins que de bon sens. Si je devais résumer en quelques lignes :

• Le site doit être codé proprement, si possible valide (X)HTML
• L’URL rewriting est o-bli-ga-toire (évitez à tout prix les adresses du genre “www.monsite.fr.php?id=5&lng=fr&PHPSESSID….)
• La balise Meta qui compte le plus est “title“
• Plus encore que les Metas, ce qui compte par dessus tout est le contenu, en lui même, tout simplement
• Il faut se faire connaitre, comme dans la “vraie” vie, il faut faire parler de soi. En l’occurence, le but du jeu est d’obtenir un maximum de liens pointant vers son site depuis des sites déja eux-mêmes bien réferencés
• L’ancienneté est un critère capital. Au début, ne pas hésiter à utiliser Adwords, cela met un coup de boost aux visites bien appréciable lorsque le site est encore un peu jeune
• Faite vivre vote site !!! Modifiez le contenu, rajoutez en,  échangez des liens, créez de nuveaux produits…

En respectant simplement ces quelques points, pour peu que vous soyez doté d’un minimum de patience, et que vous entreteniez régulièrement votre site (adjoindre un blog est de ce côté là un outil hyper efficace), vous êtes à peu près certain d’être rapidement bien classé.

Aucun commentaire pour le moment

Guido Van Rossum à propos de App Engine

En lien direct avec mon dernier Post, je viens de suivre avec attention cette conférence de Guido Van Rossum (Heuu, j’ai besoin de dire qui c’est et où il travail ?), Et là, du coup, je me pose des tas de questions…. un truc qui m’a vraiment touché, à l’heure où je rame avec le Caching et le déploiement d’une appli Rails (pfiouuu, je parle même pas de Scaling ! Je parle de déploiement, de variables globales qui sont pas vraiment globales selon le type de serveur que tu utilises et de configuration d’apache au millimetre pour des pages  qui mettent un temps Moooooonstre à s’afficher malgré un serveur dédié avec 2 Go de Ram !). Cette petite phrase au milieu de plein de choses, c’était anodinement :

You don’t have to worry about scaling, just buy some cloud and (…) some Google internal technology (…) will take care, nevermind 100, 1000 or whatever query per secondes.

La puissance de calcul et de stockage de Google est absoluement monstrueuse, comparée à un OVH ou un 1&1, c’est une autre planète, et je me prends à imaginer que tout ça couplé au Desktop, en ligne direct grâce à Chrome OS et App Engine risque de secouer, peut être même du niveau d’un Windows 3.11 en son temps. Il n’y aura plus de navigateur, qui utilise un OS, pour pointer vers un serveur, non…. il y aura Google.

Mmmmh….? Hein ?! Oui, bon, ça fait un peu peur, d’autant que la concurrence sera quasi atomisé vu l’infrastructure qu’il va falloir déploier en face pour faire front, mais d’un autre côté…. Je suis impatient de voir ça.

(et je me pose des questions concernant App Engine… est-ce que ça vaut le coup que je me mette dedans ?!)

Aucun commentaire pour le moment

Un caroussel / lightbox / modal box avec Prototype/Scriptaculous

Finalement, ça m’aura pris une matinée pour trouver un successeur au vénérable Lightbox, mais je ne regrette pas puisque après avoir longuement épluché ce qui se fait en ce moment, j’ai trouvé “l’arme absolue de l’insertion Multimédia dans une boite modale“, voui, rien que ça : LightWindow . Au départ donc, un lecteur de galeries photo “classique“, utilisant Prototype/Scriptaculous ; sauf que là en prime, vous pouvez lire, entre autres :

• Du Flash
• Du Quicktime
• Du PDF
• Des formulaires, du WMV…

Cerise sur le cake : vous pouvez même ouvrir des pages Web dans la boite modale ! La license est gentille comme tout (MIT, en gros : faites ce que vous voulez). Ca s’installe en un tour de main, et vous disposez d’inombrables options de configurations.

Ha oui… et en plus, c’est beau :-).

Aucun commentaire pour le moment

Prototype : le retour

Après plusieurs mois de test avec JQuery, j’ai décidé de revenir à Prototype/Scriptaculous. Ok, JQuery est plus rapide et plus léger, c’est vrai, mais bon :

• A t’on vraiment besoin de vitesse quand on fait de l’Ajax dans une page Web ? Qu’une boucle mette 12ms ou bien 21ms, lorsque la tâche est en arrière plan de la page : est-ce vraiment ce qui compte ?!
• Question Taille, voici le dernier recensement (sans compression) : JQuery : 118kB / Prototype : 126 kB . Hum… une fois compressé/Gunzippé, vous croyez que le end user va voir la différence ?!

Par contre, question utilisabilité, y’a pas photo :

• J’ai commencé AJAX avec Prototype, ceci explique peut être cela, mais je n’ai jamais été à l’aise avec la syntaxe JQuery. Certes, y’a plein de points communs, mais je passais mon temps dans la doc JQuery, alors qu’avec Prototype, ben… tout me semble “logique“.
• Rails et l’Ajax natif avec Prototype/Scriptaculous !!! C’est d’ailleurs le “trigger point” dans ma décision : j’en ai marre de jongler entre les 2 Frameworks suivant l’appli sur laquelle je bosse(JQuery avec PHP ou Prototype avec Rails). Maintenant que je fais du Rails à 100%, autant harmoniser et faire au plus simple : au revoir JQuery.
• Scriptaculous possède une batterie d’effet impressionnante (qui a dit “Bling bling” ?), alors qu’avec JQuery, on doit passer par des plugins plus ou moins expérimentaux.

Aucun commentaire pour le moment

Open Street Map : une bonne solution

Nous réalisons actuellement une étude de faisabilité concernant le projet d’un de nos client, dont le but est de proposer de façon ludique et fortement interactive des horaires ainsi que des trajets d’autocars en région Rhône-Alpes. L’un des piliers du cahier des charges consiste en une carte réaliste des trajets. Partant de là, plusieurs solutions s’offrent à nous :

• Ajouter une carte statique (une image JPG, ni plus ni moins) pour chaque trajet
• Utiliser un système de géolocalisation en ligne (typiquement : Google Map ou Yahoo Map)
• Chercher une solution libre permettant suffisament d’interactivité niveau utilisateur

La première solution, pour autant très simple à mettre en place au premier abord, s’avère en fait très lourde à maintenir : à chaque modification d’horaire, de ligne ou d’arrêt, c’est inévitablement un coup de téléphone et du travail rébarbatif dans Photoshop en perspective. De plus, ce genre de solution mène tout droit vers des cartes type “plan de métro” , et le client tient à ce que les cartes soient réalistes. Très rapidement donc : mauvaise solution.

La deuxième possibilité est d’utiliser Google Map. Visuellement très agréable, surpuissant (vue satellite, etc…), gratuit et simple à implémenter, tout irait pour le mieux si nous ne devions passer par un intermédiaire de taille : Google. Je n’ai (vraiment !) rien contre Google, mais le fait de confier un projet de cette importance, impliquant des semaines de développement, à un intermédiaire lointain qui peut tout à fait couper le service ou (plus réaliste) ajouter des pubs, ou encore changer son API du jour au lendemain ne m’inspirait guère confiance. Fausse bonne solution, donc.

Enfin, je me suis penché sur Open Street Map . Un beau projet Libre de cartographie en ligne. L’API est simple à implémenter, il existe des solutions gratuites et faciles d’accès pour personnaliser les Maps, et -cerise sur le gâteau- que demander de mieux qu’un projet Open Source pour un site dont le principal mécène est une collectivité locale, qui sera, sans nul doute, heureuse de participer à la cartographie se son territoire.

Open Street Map, une belle solution, viable et fiable, qui vérifie plus que jamais un principe de base dans l’Open Source : “chacun donne un petit peu, tout le monde en retire beaucoup” .

Aucun commentaire pour le moment

Interview de Tim Bray

Beaucoup de boulot ces jours-ci donc pas trop le temps de poster, mais cette interview de Tim Bray méritait de me fendre d’un petit billet. L’homme est forcément d’une certaine sagesse, étant un des créateurs du format XML, ayant siégé au World Wide Web consortium et étant actuellement en charges des “Web Technologies” chez Sun Microsystem.

Pour ceux que l’anglais rebute, je me risque à quelques traductions de mes passages préferés :

“the gap in the ecosystem that lies between what you could achieve with Ajax and what you need something like Flash or JavaFX or Silverlight to achieve it’s not that big enough to be terribly interesting.“

Le fossé entre ce que vous pouvez faire avec AJAX et les besoins qui vous poussent à encore utiliser Flash, JavaFX ou SilverLight se réduit et rend les choses terriblement interessantes.

“The killer app of the Internet is people. There is always people, and I don’t have any reason to think that it is not going to be people.“

La killer app du Web, c’est l’humain. Tout a toujours été tourné vers l’humain et je n’ai aucune raison de penser que l’on s’éloignera de l’humain.

“Interactivity is important but you know what else is really important? The back button. Anything that discards the function of the back button is a step backwards.“

Oui, l’interactivité c’est important (ndr : à propos de Flash,SilverLight…), mais vous savez ce qui est vraiment important ? Le bouton “retour” du navigateur. Tout ce qui ne prend pas en compte le bouton “retour” du navigateur est un retour en arrière

En bref, une interview fort instructive, coup d’bol dis donc, je suis en-ti-è-re-ment d’accord avec toutes ces bonnes paroles !

Bon, sur ce, hop, au boulot !

Aucun commentaire pour le moment

Un peu culotté, quand même, mais ça doit faire du bieeeeeeen…..

Eric (Presse Citron) a donc choisi de trancher dans le vif :

“Concernant l’antique et pénible Internet Explorer 6 (…), depuis mi-2008 j’ai tranché : je demande aux développeurs avec qui je travaille de ne plus perdre leur temps à en tenir compte. Quand il arrive qu’un client fasse une remarque sur un bug d’affichage mineur, j’indique que ce navigateur est “officiellement obsolète”, qu’il ne respecte pas les normes du métier, qu’ils doivent faire la mise à jour vers IE7 pour avoir un affichage correct de leurs pages, et qu’ils devraient inciter gentiment leurs visiteurs à en faire autant.

C’est vrai, il arrive un moment où il faut savoir traiter avec fermeté les cas désespérés et arrêter de se trimballer des casseroles qui plombent votre productivité.“

J’avoue particulièrement apprécier le “qui plombe votre productivité“. Dans mon cas, cette coch*$¨£% d’Internet Explorer 6 me fait perdre jusqu’à 10% du temps passé sur une mise en page, quant il ne me force pas -purement et simplement- à abandonner certaines idées de Design.

On apprend aussi dans le même article que “Internet Explorer 8 bientôt en version finale“…  hu hu hu, voila bien un non évènement pour le Web ! La sortie de la nouvelle version d’Internet Explorer ! Je reprendrai juste l’analyse technique de Tristant Nitot :

“(Internet Explorer 8) c’est l’absence de support de SVG (la spec vient de fêter ses 6 ans), un support très limité de CSS 3, aucun support de HTML 5 (, , Offline, etc.) et l’absence d’un compilateur JIT-Tracin“.

Pour les non initiés, ça veut dire :

“Un navigateur qui rame et qui ne permet pas d’afficher tous les contenus, déja dépassé avant même sa sortie“.

Un navigateur sans intérêt, donc, auquel je vous encourage chaleureusement à préferer ceux-ci (au choix) :

Le plus rapide : Chrome

Le plus ergonomique (quoique…) : Opéra

Le plus “Fashion” : Safari

Le meilleur plus extensible et souple d’utilisation : Firefox

Ha, je dois vous laisser, (anecdote garantie 100% véritable) je viens de recevoir un mail d’une cliente qui aime beaucoup la maquette que je viens de lui faire, mais me signal un bug d’affichage, avec le PC de sa boutique, utilisant…. Internet Explorer 6 (Si !!!! Encore lui, Hargggggg….)

Aucun commentaire pour le moment

Ha tiens, c’est (encore) pas du flash…

Je viens de m’apercevoir que Fotolia aussi utilise AJAX pour son diaporama en page d’accueil, et non du flash… personnellement, j’aime beaucoup cette façon de faire : c’est léger, propre, élégant, et en plus “ça bouge, c’est vivant“, comme disent mes clients.

Ceci dit, bravo Fotolia pour le Design du site Web, le concept des “portes coulissantes” est parfaitement utilisé (astuce de mise en page, permettant entre autre de créer des coins arrondis), la mise en page liquide (qui occupe tout l’écran, quel que soit la taille de celui-ci) est astucieusement conçue, et l’utilisation d’AJAX rend le site très vivant sans aucune lourdeur.

Aucun commentaire pour le moment

Un Slideshow en Ajax avec Prototype/Scriptaculous

Hein ? Quoi ? J’ai dis du mal de Prototype/Scriptaculous ?! Moi ??! Mais si je m’en suis (brièvement) éloigné, ce n’était que pour mieux redécouvrir à quel point il est simple et rapide de créer des effets, animations et autres bidules “Flash-like” !

Je viens donc d’implémenter “crossfade“ (que je vous conseil chaudement), pour un client qui voulait “que ça bouge avec plein d’images“. La solution Flash était beaucoup, beauuucoup trop lourde pour ce genre de chose, alors que cross fade permet en 11 petits Ko d’afficher un splendide diaporama avec fondus enchainés.

Note : ha oui, ne perdez pas de temps à lire le fichier Install.txt joint au package, à moins que vous n’ayez une irrepressible envie de voir à quoi ressemble du code JS traduit en français. Hu hu hu… googletranslate, c’est pas encore au point ! Mais je remercie quand même l’auteur d’avoir eu l’intention de traduire l’install en Français (et c’est bien l’intention qui compte, hein ?)

Aucun commentaire pour le moment

Scriptaculous et moi, c’est plus ce que c’était….

C’est la deuxième fois en moins de quinze jours que je substitue une librairie alternative au génial Scriptaculous/Prototype. Aujourd’hui il s’agissait de faire du Drag’n’Drop dans une interface de gestion (histoire de mettre de l’ordre dans la présentation d’une boutique en ligne). D’ordinaire, je ne me pose pas de question et insère aussitôt 500 Ko de Javascript avant même la première ligne de contenu, mais là j’avais besoin d’alléger au maximum les pages à cause de très nombreuses images alourdissant le contenu… c’est ainsi que j’ai découvert Dom-Drag : 30 Ko seulement !!!

Les Framework Javascript, c’est vraiment pratique, efficace, bluffant même parfois ; mais à l’usage, je me demande si il n’est pas préferable de s’en passer histoire d’alléger _considérablement_ les pages….

Aucun commentaire pour le moment

Pourquoi easyEclipse 4 Php est le meilleur des éditeurs

Ayant longtemps hésité entre différents éditeurs du marché, j’ai fini par _tous_ les essayer, soit, dans l’ordre : notepad, gedit, vi, emacs, notepad++, notepad 2, kate, ultraedit, phpdesigner….. avant de finalement trouver mon bonheur avec EasyEclipse 4 Php. Tout y est, absolument tout, (mais pas trop non plus, ça reste encore simple et accessible comparé à Emacs). Les fonctionnalités dont je ne pourrais plus me séparer :

• Cross-platfrom ! J’ai ENFIN le même éditeur sur mes machines Windows et Linux !
• le repliage de code avec aperçu au survol de la souris
• la vue “outline“, qui vous permet de voir en un coup d’oeil toute l’architecture de votre fichier, qu’il s’agisse d’une classe PHP, ou d’une CSS, vraiment pratique.
• la double vue “design/source” des fichiers XML
• l’approche “projet“, un peu déroutant au début, devient vite un atout génial
• les fonctions de recherches et d’assistance dans les regexp “en live” (si !), qui vous permettent toujours de retrouver vos petits
• La gestion véritablement “sérieuse” de l’encodage, par projet. C’est ce point particulier qui m’a d’ailleurs poussé à abandonner Notepad++, beaucoup trop erratique dans ce domaine, particulièrement depuis que je ne travaille plus qu’en UTF-8.
• enfin, le meilleur du meilleur : l’analyseur syntaxique intégré. Cette fonctionnalité que je n’avais alors vu que dans PHP Designer, vous affiche une jolie petite croix à l’endroit où vous avez oublié ce point virgule, ou omis de fermer cette 4eme parenthèse dans la regexp, qui vous aurait value un impitoyable “Parse error” à l’execution… ici, pas de perte de temps : Eclipse vous signal immédiatement vos erreur.

Aucun commentaire pour le moment

Le Hack CSS du jour

Si il est bien une chose in-dis-pen-sable (parmi tant d’autres…) qui manque dans IE 6, c’est la propriété ’min-height’. Heureusement, il existe cette solution :

min-height:200px;
height:auto !important;
height:200px;

Il y a d’autres Hacks, mais celui ci est (je crois) le plus simple à mettre en oeuvre.

Aucun commentaire pour le moment