Jouez avec CoffeeScript sans rien installer
CoffeeScript, câest le langage de script qui compile du JS et qui dĂ©fraye la chronique en ce moment. On aime, on aime pas, mais il est un parfait exemple de ce qui est possible avec JS. Je nâaccroche pas forcĂ©ment avec la syntaxe (un peu trop python-like Ă mon goĂ»t), mais je peux encore changer dâavis. NĂ©anmoins, câest Ă suivre de trĂšs prĂšs : derniĂšrement le papa de JS (Brendan Eich) a expliquĂ© quâil allait sâinspirer de certaines partie du code pour Traceur-Compiler donc pour une future version de JS (vous pouvez lire un ancien article que jâavais Ă©crit : Les Classes arrivent chez JavaScript)
Le but de ce post nâest pas de vous faire un tuto sur CoffeeScript, mais juste de vous expliquer comment le tester sans avoir Ă installer NodeJS. Normalement, vous codez en CoffeeScript, vous compilez en JS avec NodeJS et vous publiez votre code. Mais il existe aussi un mode runtime trĂšs pratique.
PS : le repo CoffeeScript est ici : https://github.com/jashkenas/coffee-script
Comment on fait ?
PremiÚrement, vous récupérez le runtime CoffeeScript ici : https://raw.github.com/jashkenas/coffee-script/master/extras/coffee-script.js.
Ensuite vous vous créez une page html avec le code suivant :
<!DOCTYPE HTML>
<html>
<head>
<title></title>
<script src="coffee-script.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
</body>
</html>
Et pour insérer du code CoffeeScript, vous utilisez la balise <script type="text/coffeescript">, par exemple :
<!DOCTYPE HTML>
<html>
<head>
<title></title>
<script src="coffee-script.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
</body>
<script type="text/coffeescript">
# Some CoffeeScript
Cars = ["Ford", "Dodge", "Chevy", "Toyota", "Honda"]
console.log Cars
</script>
</html>
Et Hop! câest fini
Externaliser les scripts
Si vous ĂȘtes dans un âcontexte httpâ, donc si votre page est accessible via http://mondomaine/mapage.html plutĂŽt que via file:///mapage.html, vous pouvez trĂšs bien faire ceci :
<script src="test.coffee" type="text/coffeescript"></script>
en mode local vous obtiendrez un joli XMLHttpRequest cannot load file://localhost/test.coffee. Cross origin requests are only supported for HTTP..
Externaliser les scripts et les faire fonctionner en mode local
Si, câest possible. Je vous montre comment je fais sous Chrome et sous OSX, aprĂšs vous adaptez. En fait il faut lancer Chrome en mode `allow-file-access-from-files :
open -b com.google.chrome --args --allow-file-access-from-files
Pour que cela fonctionne, il faut dâabord quitter complĂštement Chrome.
Vous pouvez maintenant ouvrir votre page en mode file:///.
Et voilĂ , vous pouvez commencer Ă vous amusez avec CoffeeScript. :)
Au fait vous saviez que lâon peut faire aussi du Ruby dans le navigateur ? ⊠;)
Tweet