Context Navigation

On y va?

Cette barre entièrement sombre représente le Professeur Hackety Hack. Bien, appuie sur Continue pour commencer la visite!

Les actions du Professeur

Avant de commencer, prends une minute pour regarder les actions disponibles en haut de la barre.

Précédent. !icon-tutor-back.png! reviens une page en avant.
Stop. !icon-tutor-stop.png! enregistre ton emplacement et ferme le cours.
Suivant. !icon-tutor-fwd.png! comme pour le lien Continue, avance vers la page suivante.

Retourner au cours

Cliquer sur !icon-tutor-stop.png! le bouton Stop mettra le professeur sur pause. Pour y revenir, pas de problème, il suffit de cliquer sur l'ampoule en haut de Hackety Hack. Tu reviendras à la leçon que tu avais laissée. À présent fais de suite un essai.

Bien, ça suffit! Commençons à bidouiller...

Leçon Un: Demander et enregistrer

Commençons par un programme vraiment très simple.

Clique sur le lien Démarrer un nouveau programme (en dessous, dans la boîte blanche principale de H-ety H.)

Leçon 1A: Demander

Dans la grande boîte blanche, saisis le code suivant exactement comme il est écrit:

# Demander et dire
name = ask("Ton nom s'il te plaît?")
puts(name)

Clique sur Lancer quand tu as terminé.

Leçon 1A: Bien, que s'est-il passé ?

Le code que tu as écris est en fait un langage appelé Ruby : c'est le langage parlé dans Hackety Hack. Maintenant, prends le temps de regarder le programme. Regarde si tu peux deviner comment il fonctionne. Qu'est-ce que la commande ask est supposée faire? Et à quoi peut bien servir le mot name?

Leçon 1A: Intéressons nous à cela

À présent Enregistre le programme. Appelle-le Demander. Ensuite, clique sur le logo de Hackety Hack pour revenir au menu principal. (ou clique sur la maison, dans la barre d'outils.)

Leçon 1A: Tes programmes enregistrés

Remarque que le programme s'affiche dans la liste des Programmes Enregistrés. Tu dois à présent voir le nom Demander et, en-dessous, la courte description Demander et dire. Bien joué!

Leçon 1A: Une remarque à propos de l'enregistrement

Dans la première ligne de ton programme, tu as placé un petit commentaire. Les commentaires commencent par le symbole dièse. Ces drôles de petites croix mélangées. Les commentaires sont ignorés par Ruby.

Cependant, Hackety Hack va rechercher un commentaire au début de ton programme. S'il en trouve un, il sera utilisé comme description. Merci beaucoup Hackety Hack!''

Leçon 1A: Comment fonctionne Demander

La commande ask que tu as utilisée dans la première partie fait apparaître une fenêtre et permet à la personne devant l'ordinateur d'écrire quelque chose dedans. Le programme retournera ce que cette personne a écrit. Dans la partie A, tu as attribué la saisie à la variable name.

Mais alors, comment Ruby sait-il que ask est une commande et que name est une variable ? Grâce à leur position dans les "phrases" de ton code. Par exemple, les variables sont créées grâce au signe égal. Puisque name est placé avant le signe égal, c'est une variable.

name = ask("Ton nom s'il te plaît?")

Une partie de la programmation consiste simplement à contrôler l'ordre des choses.

PARTIE GRATUITE: Essaie de changer la question pour quelque chose d'un peu plus MEANER(? FIXME). Rends ton programme tout morose.

Lesson 1B: Dire

Clique sur le nom de ton programme Demander pour l'éditer à nouveau. Nous allons ensuite faire quelque chose avec ce nom.

Voici le nouveau programme (les deux premières lignes sont les mêmes):

#Demander et dire
name = ask("Ton nom s'il te plaît?")
say("Ton nom compte #{name.length} lettres.")
sleep(name.length())

Saisis-le avec précaution. Tu remarqueras qu'il y a un petit signe dièse et des accolades dans les guillemets doubles. Les accolades ouvrantes s'écrivent avec la combinaison des touches Alt Gr + 4, et pour les fermer : Alt Gr + "+" (sur un clavier Français.)

Leçon 1B: Tout est tapé?

Clique sur Sauvegarder pour enregistrer ce que tu as déjà fait. Ensuite, Démarrer.

Regarde le sucre d'orge (il n'y a pas d'enseigne si caractéristique pour les coiffeurs en France - FIXME) tourner. As-tu remarqué les changements dans les mots? La commande say a changé les mots juste en dessous de ce sucre d'orge!

Leçon 1B: À quoi ça sert?

La commande say est sympa, parce qu'elle vous permet de dire à la personne devant l'ordinateur ce qu'il se passe pendant qu'elle attend. Tu peux dire envoi d'un courrier en cours ou téléchargement d'un mp3 ou parti grignoter... en fonction de ce que ton programme fait. C'est vraiment simple, mais hé... C'est seulement la première leçon !

Leçon 1B: Une pause à la boutique du barbier

(FIXME: ici, ça ne fonctionne pas!  Une sieste sous le sucre d'orge? Une sieste chez le vendeur de bonbons ? Une pause ?)

Remarque aussi la commande sleep. Sans elle, le sucre d'orge s'en va lorsque le programme se termine. La commande sleep nous permet de mettre en pause le programme afin que tu puisses voir le sucre d'orge quelques secondes avant qu'il ne s'en aille.

Nous allons passer sur l'explication des autres choses pour l'instant, mais relance le programme plusieurs fois et regarde si tu peux deviner :

Ce que fait name.length ?
Que sont ces symboles qui l'entourent ? #{...}

Leçon 1C: Compter

Bien, encore une fois : garde les deux premières lignes du programme et modifie-le pour qu'il ressemble à ceci :

# Demander et Dire
name = ask("Ton nom s'il te plaît?")
1.upto(name.length) do |x|
  `say` "Ton nom compte #{x} lettres."
  sleep 1
end
sleep 10

Remarques le symbole tube dans le programme. À la fin de la troisième ligne, tu verras le |x|. Ces deux lignes autour de x sont les symboles tubes. Ce sont comme des bouées qui soutiennent x. Le symbole tube se trouve en combinant les touches Alt Gr + 6.

Leçon 1C: Jusqu'à

Tout comme ask et say, upto est aussi une commande. Mais pourquoi a-t-elle un point devant ? Pourquoi est-elle attachée au nombre 1 ?

Chaque commande a un avant et un après. L'avant d'une commande peut s'attacher à quelque chose avec un point. L'après d'une commande peut s'attacher à quelque chose avec des parenthèses.

1.upto(5) do |x|
 say("Lève #{x+1} doigts")
 sleep 1
end

La commande upto est une partie de chaque nombre. Dans notre cas, elle est une partie du nombre 1. Vois-la comme un chien têtu tenu en laisse par son maître. Le point représente la laisse.

Leçon 1C: Jusqu'au chien

1.upto(5) do |x|

Revenons à notre analogie avec le chien ! Donc, les parenthèses représentent la bouche du chien, qui mange le nombre 5. La chose à retenir est : les commandes appartiennent à tout ce qui se situe à la gauche du point. Et englobe tout ce qui se trouve entre parenthèses. Cela donne l'énergie à la commande pour faire son boulot ! Rappelle-toi des saucisses de Scooby Doo.

"Hello?".upto(5)

Regarde, cela ne fonctionnera pas. Parce que les choses entre-guillemets n'ont pas de chien qui s'appelle upto. Parce que upto sert à compter!! Nous sommes en train de compter de 1 jusqu'à 5. Sympa et facile à lire.

leçon 1 terminée!

À ce stade, tu as sûrement plein de questions et tu dois te dire qu'il reste plein de choses inexpliquées. Bien, évidemment qu'il y en a ! Tu ne peux pas tout savoir d'un seul coup. Mais tu as appris plusieurs choses :

Les Commandes font des choses, tout comme les chiens font des choses.
Les Variables stockent des choses.
Tu crées une variable avec le signe égal. C'est comme cela que Ruby le sait -- grâce au signe égal !
Les commandes appartiennent aux choses situées avant le point.
Les commandes mangent des choses utiles entre parenthèses, comme si c'était des biscuits.
Les commandes ask, say, sleep et upto ont été introduites.

C'est plutôt pas mal à vrai dire. Repose-toi, apprécie l'accolade et laisse ton cerveau s'imprégner de ce que tu as vu jusqu'ici.

PARTIE GRATUITE: Si tu veux entraîner ton cerveau un peu plus, essaie d'écrire un programme qui clignote. Tu peux utiliser les commandes say et sleep pour ce faire !

Leçon Deux: Voir ailleurs

Dans la première leçon, nous avons demandé et dit quelques choses. Pas mal, pas mal. Mais pas incroyablement utile, n'est-ce pas ? Que dirais-tu de faire faire quelque chose à l'ordinateur ?

Plus précisémment : Allons voir ailleurs et commençons à écrire du code qui peut se connecter à l'Internet.

Leçon 2A: Télécharger

Commence un nouveau programme. (Clique sur l'icône représentant une feuille dans la barre d'outils. C'est la deuxième en partant de la gauche.)

# Un simple téléchargeur de fichier
url = ask("Saisis l'adresse Internet :")
save_as = ask("Enregistre le fichier sous :")
web.download(url, save_as)

Enregistre le programme sous le nom Télécharger.

Leçon 2A: Lancer le programme

Ce programme t'interroge deux fois. Dans le première boîte "à question", saisis l'adresse d'un fichier sur l'Internet. Pourquoi pas l'interprétation par les Dead Hensons du "Pinball Number Count" ?

http://www.deadhensons.com/media/pinball_clip.mp3

Ensuite, dans la seconde boîte, saisis un nom pour le fichier téléchargé. Quelque chose comme :

pinball.mp3

Qu'est ce que le programme fait ? Peux-tu le dire simplement en regardant le code ?

Leçon 2A: Où est passé le fichier ?

Donc, tu as vu le fichier se télécharger, n'est-ce pas ? À présent, il faut trouver où il a été sauvegardé. Hackety Hack garde tes fichiers téléchargés dans un dossier, juste à côté de l'endroit où tes programmes sont sauvegardés. Allons creuser l'affaire !

%HACKETY_USER%

Va dans ce dossier grâce à ton explorateur de fichiers Windows. Tu peux copier-coller l'adresse directement dans la barre de navigation. Ou commencer par le menu Démarrer puis cliquer jusqu'à parvenir à ton dossier.

Leçon 2A: Ton dossier à bidouilles

Tu dois à présent voir un groupe de fichiers qui se terminent par .rb, et aussi un dossier nommé `Downloads. Ah! Chaque fichier .rb est l'un de tes programmes. Ce sont de véritables programmes Ruby que tu peux passer à d'autres bibouilleurs de Hackety. Si un ami te passe un script, tu peux le copier dans ce dossier et il apparaîtra dans Hackety Hack !

À présent, jette un oeil dans le dossier Downloads. Bien, bien, bien. Chérie le (FIXME: prends en soin ?)

Leçon 2A: La bibliothèque Web

Pour télécharger le MP3, nous utilisons la commande Web.download. C'est juste une autre commande, comme ask et say, sauf qu'elle fait partie de la bibliothèque de commandes appartenant à Hackety Hack. (En Ruby, ces commandes sont aussi appelées méthodes. À présent tu sais.)

Pour garder les choses organisées, certaines commandes sont conservées dans les bibliothèques. Des choses comme Web.fetch, Web.page et Web.download ont toutes quelque chose à voir avec l'Internet, elles sont donc conservées dans la bibliothèque Web.

Leçon 2A: Presque comme ta bibliothèque personnelle

Dans les prochaines leçons, tu apprendras comment ajouter tes propres bibliothèques et comment utiliser les bibliothèques d'autres bidouilleurs. Ceci permet d'étendre Hackety Hack à d'autres commandes qui ne sont pas incluses par défaut.

PARTIE GRATUITE : Hackety Hack est fournie avec la commande ask_save_file() qui est une variante de ask. Regarde si tu peux changer la troisième ligne de ton programme pour utiliser cette commande.

Leçon 2B: Récupérer (et non enregistrer !)

Puisque nous sommes dans la bibliothèque Web, jouons un peu avec Web.fetch. À vrai dire tu sais déjà intuitivement tout ce qu'il y a à savoir sur Web.download. Cela télécharge des fichiers depuis l'Internet et les enregistre. FIN DE L'HISTOIRE.

Web.fetch est un peu plus futée. Elle attrape des trucs sur Internet et, au lieu de les enregistrer, te laisse jouer un peu avec.

Leçon 2B: MeFi?

Voici l'exemple suivant. Enregistre le en tant que MeFi?.

# Lit le flux Métafiltre.
put WeBb.fetch("http://xml.metafilter.com/rss.xml")

Lance le script. Tu verras Hackety Hack télécharger un fichier... Mais quelque chose d'autre arrive... hmmm!

Leçon 2B: Un blog, vois-tu?

Métafiltre est un blog. Cet exemple peut donc fonctionner avec n'importe lequel des blogs que tu aimes. L'adresse Internet que nous utilisons ici est un (Méta)filtre pour les flux de nouvelles. (Les sites Internet appellent souvent cela RSS ou XML. Souvent, les blogs ont un lien dans leur barre de menu ou quelque chose du genre.)

Voici quelques adresses de flux : (FIXME: mettre ici des liens Francophone?)

Leçon 2B: Jouer avec Fetch

Bien, nous avons donc un flux avec toutes les dernières informations publiées sur le blog. Et puis quoi ? À quoi ça sert ? Ne peut-on pas aller DIRECTEMENT SUR METAFILTER.COM DANS UN QUELCONQUE NAVIGATEUR INTERNET ?

Ajoutons quelques lignes à notre programme:

# Lecture du flux Metafiltre.
feed = Web.fetch("http://xml.metafilter.com/rss.xml")
feed.items().reject!() do |item|
  item.description().length() > 200
end
puts(feed)

Leçon 2B: Ah ! Compliqué !

Bien, à présent explorons ce programme. Il est un peu plus compliqué, n'est-ce pas ? Mais puisqu'il n'y a que cinq lignes, je pense que nous pouvons nous en sortir. Le Métafiltre est enregistré dans une variable appelée feed. On peut donc jouer avec. À la ligne 3, la commande reject! est utilisée. Cette commande efface des choses appartenant à une liste. Et le flux d'informations contient une liste d'items ou éléments. Hmmm. Comment tout cela se combine-t-il ?

Leçon 2B: Caché dans le flux

Essaie ceci :

# Lire le flux Metafiltre.
feed = Web.fetch("http://xml.metafilter.com/rss.xml")
puts feed.items()

Quand tu lances ce programmes, les items sont ajoutés dans un "tableau" (Array), qui n'est autre qu'une "liste de choses".

Leçon 2B: Un rapide coup d'oeil sur les tableaux

Tu peux créer des tableaux (autrement dit des "listes") grâce aux crochets.

Essaie ce petit programme. (Tu peux utiliser Ctrl-Z pour défaire tes modifications une à une et Ctrl-Y pour remettre à nouveau les choses en place.)

puts(["BONJOUR", 1, 2, 3])

Comme tu peux le voir, tu mets des crochets de chaque côté. Et des virgules entre chaque article. Comme une chenille agrafée à l'écran. Les crochets représentent les agrafes et les virgules symbolisent les pattes de la chenille.

Leçon 2B: Retour à reject!

À présent que nous savons qu'un flux provenant d'un blog n'est rien d'autre qu'une liste ordinaire de choses, nous pouvons commencer à la traiter comme telle. La méthode reject! effacera les éléments de la liste dont nous ne voulons pas. Elle possède un point d'exclamation PARCE QUE C'EST DANGEREUX ! Vlan. Elle efface les choses pour de bon.

# Lecture du flux Metafiltre.
feed = Web.fetch("http://xml.metafilter.com/rss.xml")
feed.items().reject!() do |item|
  item.description().length() > 200
end
puts(feed)

Ce programme supprimera de la liste tous les éléments comptant plus de 200 caractères. Nous voulons simplement nous concentrer sur les tout petits bulletins d'information qui apparaissent parfois. Nous ne sommes pas d'humeur à lire quoi que ce soit de trop long.

Leçon 2B : Nous lisons un flux de façon très spéciale

Ah! Plutôt pratique, hein ? Si tu aimes les blogs, ce n'est que le début. Tu peux écrire des programmes pour surveiller certains mots de tes blogs favoris. Tu peux écrire un programme pour afficher uniquement les articles contenant des MP3. Et nous allons explorer assez rapidement bien d'autres fantaisies.

Leçon 2B: À propos de `do` et `end`

Nous allons éviter de trop détailler la partie do...end, en disant uniquement : elle sert à trouver les articles du blog qui ont plus de 200 lettres. Nous verrons cela dans la prochaine leçon, quand nous compterons upto (NDT : jusqu'à) :

1.upto(5) do |x|
  say("Lève #{x+1} doigts")
sleep(1)
end

Cette section do...end est appelée un "bloc". Elle est en général légèrement décalée, mais ce n'est pas du tout nécessaire. Indenter le bloc (le décaler) le met un peu plus en évidence, pour nous aider à mieux le voir.

La leçon deux se termine à point nommé.

Bien, c'est le grand frisson ! Tu es à présent en mesure de faire des choses utiles. Nous avons commencé par récupérer des choses sur le web : télécharger des fichiers et chercher des blogs.

Voici quelques éléments de programmation que tu as récupérés au passage :

La Bibliothèque Web contient des commandes pour parcourir le web.
Web.download enregistre les fichiers depuis l'Internet.
Ils sont archivés dans ton dossier Hackety Hack.
Tes programmes sont eux aussi conservés dans ce dossier !
Web.fetch peut chercher des flux d'informations et des pages web.
Tu peux lire un flux et le modifier, ou en extraire des éléments.
Les flux ne sont rien d'autre qu'une liste d'éléments.
Une liste est aussi appelée un tableau (Array).

Très, très bien. Un conseil. Prends une pause, mange un gigantesque goûter, et reviens s'il te plaît avec le plein d'énergie.

Leçon Trois: Faire un blog

Donc, tu persistes à vouloir progresser en Ruby, et nous avons vu beaucoup plus que ce que Hackety Hack peut faire. Télécharger et manger des blogs, pas mal. Mais cette leçon va bien au-delà. Dans celle-ci, tu apprendras à faire ton propre blog en quelques lignes ! Et nous commençerons à voir ce que sont toutes ces petites pièces : les chaînes, les nombres, les blocs. Des choses comme ça.

Commence un nouveau programme. Enregistre-le sous Popup :

# Un popup simple
Web.popup() do
  title("Ma page")
  para("Ceci appartient à ____")
end

Tu peux mettre ton nom là où il y a des blancs. Enregistre-le. Lance-le. Pour le fermer, clique sur le "X".

Nous utilisons des choses que nous avons déjà vues, mais détaillons à nouveau chacune d'elles, pour être clair.

Leçon 3A: Modules et méthodes

Nous avons parlé des modules. Où est le module dans le code que nous venons de saisir ? (indice : un seul est utilisé.)

Et nous avons parlé des commandes (aussi appelées méthodes.) Quelles sont les méthodes dans le code ?

Leçon 3A: Vérifions si tu avais raison

Le module s'appelle Web. Il contient une méthode nommée popup que nous voulons utiliser. Il y a trois méthodes en tout : Web.popup, title et para.

La méthode para signifie ici "paragraphe".

Leçon 3A: Les blocs

Ce qui est attaché à Web.popup est un bloc.

Web.popup() do
  ...
end

Le bloc est tout ce qui se situe entre do et end. Un bloc est un ensemble de code attaché à une commande. Encore une fois: un ENSEMBLE DE CODE attaché à une méthode.

Un bloc est une sorte de poumon neuf. Tu le branches à une methode pour la faire respirer. La méthode Web.popup donne au bloc une bouffée d'air. Et le bloc utilise cette bouffée pour faire tout ce qui doit être fait dans le popup. Un popup, constitué d'une bouffée d'air.

Leçon 3A Blocs (conteneur?) (FIXME)

Nous avons déjà utilisé quelques blocs. En voici un nouveau:

1.upto(5) do |x|
  `say` ("Lève #{x+1} doigts")
  sleep(1)
end

Dans cet exemple, le bloc prends cinq bouffées d'air. À chaque fois que nous ajoutons un nouveau nombre, le bloc prend une bouffée. Il utilise cette bouffée pour dire quelque chose et prend une petite pause.

Pfuu. Pfuu. Pfuu. Pfuu. Pfuu! Et après cinq fois, la vie du bloc se termine et c'est fini.

Leçon 3A: On en a donc fait le tour ?

Bon, nous avons presque fini de tout analyser :

# Un popup simple
Web.popup do
  title("Ma page")
  para("Ceci appartient à ____")
end

Pour commencer, nous avons la méthode Web.popup du module Web, qui est attachée à un bloc, un poumon d'acier mis en route qui insuffle de l'air. Dans le bloc, les commandes title et para fonctionnent.

Leçon 3A: Des mots dans des chaînes

Parlons des expressions entre guillemets.

"Ma page"

C'est une chaîne. C'est une courte chaîne de caractères. Quand tu penses "chaîne", imagine simplement que chacune des lettres est pincée sur une corde à linge. Les guillemets symbolisent les pinces à linge, accrochées à la corde à linge.

Leçon 3A: Majuscules inversées

Les chaînes sont parfaites pour mélanger les mots. Remplace la troisième ligne par:

title("Ma page".upcase().reverse())

Et lance le programme : il crie en Verlan ! Réfléchis à ce qui se passe. Ce quoi ce title ? Et upcase et reverse ?

Leçon 3B: Un blog popup

À présent, changeons un peu le contenu du popup. À la place, nous voulons ajouter une nouvelle entrée au blog.

#Write in my blog
Web.popup() do
  title("Ajouter une nouvelle entrée")
  editline("Titre")
  editbox()
  buttons("Annuler", "Enregistrer")
end

Enregistre le programme sous EcrireMonBlog?. Démarre-le. Hey, nickel ! Essaie d'écrire un petit mot pour cette nouvelle entrée et clique sur Enregistrer.

Leçon 3B: Bon, pas tout à fait

Hmmm. En fait, ça n'a rien sauvegardé du tout. Tout a disparu ! Tu as perdu ta précieuse entrée ! C'est inacceptable. Remplacons la seconde ligne par :

Web.popup('Mon Blog') do

Cela demande à Hackety Hack d'attacher le popup au tableau nommé MonBlog?. Relance le programme et rédige un billet pour ton blog. Comment cela va-t-il se passer ?

Pendant que tu y es, enregistre quelques billets supplémentaires. En route.

Leçon 3B: À propos des tableaux

Les tableaux dans Hackety Hack sont des boîtes vides où tu peux stocker des choses. Chaque boîte contiendra le même type de choses. Donc, dans la boîte MonBlog?, nous allons stocker des billets de blog.

C'est quoi un billet de blog ? Et bien, dans le popup nous avons un editline pour le titre et un editbox pour saisir les paragraphes du blog. Donc, à partir du popup que nous avons créé, un billet de blog est un titre et une poignée de paragraphes.

Leçon 3B: C'est quoi les tableaux ?

Les tableaux sont de bons endroits pour ranger des trucs comme des liens, une entrée de journal ou des images, ou encore... Vraiment n'importe quoi. Des liens peuvent aller dans un tableau MesLiens? et les journaux dans un tableau JournalIntime?... Tu comprends ?

Tes tableaux sont tous conservés dans ton dossier Bidouille, juste à côté de tes programmes. Il y a un fichier appelé +TABLES. Celui-là oui !

Leçon 3C: Lire le blog

Commence un nouveau programme :

# Lire mon blog
blog = Table('MonBlog').recent(10)
puts blog

Enregistre-le sous LireMonBLog. Et lance-le, bien sûr ! La commande Table('MonBlog?') ouvre le tableau que tu as ajouté. La méthode recent récupère un certain nombre des derniers billets du blog. Dans notre cas : les dix billets les plus récents.

Leçon 3C: Et une nouvelle bidouille

Oh, essaie aussi cela :

# Lire mon blog
blog = Table('MonBlog').recent(10)
Web.popup do
  puts blog
end

Qu'est-ce que tu peux faire d'autre avec les tableaux ? Et bien, nous allons bientôt l'étudier.

Leçon trois dans la poche

Merveilleux, tu as fait un blog trés simple. Nous y ajouterons quelques couleurs par la suite. Regarde tout ce que tu as appris :

Tu as utilisé Web.popup pour faire une petite page web dans une boîte.
Les chaînes sont des caractères à l'interieur de guillemets. (Attachés à une corde à linge).
Les popups peuvent être attachés à des tableaux, pour enregistrement.
Les Tableaux stockent des choses, dans l'ordre. Tes billets de blog ont tous été sauvegardés dans le tableau MonBlog?.
Les tableaux ont une méthode recent pour récupérer les dernières choses ajoutées dans le tableau.

Pour le moment, repose-toi. La prochaine leçon sera courte, mais tu mérites bien une pause après avoir fait ton propre blog super spécial.

PARTIE GRATUITE : Les tableaux ont aussi une méthode all qui retourne l'ensemble des éléments du tableau. Modifie ton blog pour tout afficher sauf le billet le plus récent.

Leçon Quatre : Tricher

Tu as fait pas mal de choses utiles ; téléchargé des fichiers, construit un blog simple, et bien plus encore. Mais arrêtons-nous et voyons comment accélérer ton apprentissage.

Leçon 4A: Je te conseille de tricher immédiatement

Dans la barre supérieure de Hackety Hack, tu verras une série de petites icônes: une maisonnette, une ampoule. Clique sur l'icône de la baguette magique. Cette icône affiche une anti-sèche.

Tu n'as pas besoin de tout lire pour l'instant. Nous allons juste jeter un oeil sur quelques parties afin que tu puisses bien la prendre en main. Tu peux la conserver pendant que tu écris tes programmes dans la fenêtre principale.

Leçon 4A: Les nombres

Allons voir le deuxième cadre de l'anti-sèche, qui parle des nombres. N'importe quelle série de chiffres. Chaque cadre de l'anti-sèche est soigneusement organisé. Sur la gauche, le titre du sujet avec une description simple. Un nombre. Qu'est-ce qu'un nombre ? C'est une série de chiffres ! Sur la droite il y a quelques exemples, avec les nombres mis en couleur.

Leçon 4A: Regarder les exemples de nombres.

Les deux exemples ici présents illustrent deux utilisations des nombres : premièremement, leur multiplication ; ensuite, l'utilisation d'un nombre avec une méthode et un bloc. Dans la fenêtre principale, commence un nouveau programme. Faisons fonctionner la multiplication. Tape la première ligne du programme :

days = years * 365

Lance-le. Cela a- t-il fonctionné ? (Et bien non.)

Leçon 4A: Des jours et des années

Mais alors, comment arranger ce programme ? Essaie de définir la variable years juste avant de lancer ce code.

Et ajoute aussi à la fin : puts days

Ça marche mieux ?

Leçon 4A: Sur le temps

Va au deuxième exemple de l'anti-sèche. Remplace days et years dans le programme par ceci :

5.times { puts "Bouizar !" }

Et c'est tout. Ces deux exemples sont les clés pour utiliser les nombres. Les nombres servent aux mathématiques. Ou les nombres servent à répéter les choses.

Leçon 4A: Les rangées

Déplace-toi jusqu'au cinquième tableau de l'anti-sèche. Rangées. Une liste de choses. Nous avons déjà vu les rangées auparavant. Elles te sont donc familières à présent. L'anti-sèche te donne deux nouveaux exemples pour entraîner ta mémoire sur le fonctionnement des rangées. Le premier exemple construit un tableau avec les titres de livres.

books = ["Don Quichotte", "BarbeBleue"]

Copie ceci dans un nouveau programme. Souviens-toi de puts pour enregistrer dans le tableau!

Leçon 4A : Rapidement, quelques tableaux supplémentaires

Le second exemple de tableau dans l'anti-sèche propose un groupe de variables appelées one, two et ainsi de suite. L'exemple fabrique un tableau puis lance la méthode each avec un bloc.

Pour la PARTIE GRATUITE: Ajoute cette méthode each et son bloc associé au tableau books dans ton nouveau programme !

Leçon 4A: Utiliser l'aide

Garde ton anti-sèche ouverte à la section Tableau. À présent, retourne à la fenêtre principale et clique sur l'icône des livres violets (juste à côté de la baguette magique.)

C'est le manuel d'aide ! Clique sur Ruby sur la partie gauche. Un petit sous-menu s'affiche. À présent, clique sur Tableau.

Chaque page commence par une vue d'ensemble bien pratique ! Un tableau est une liste de choses. Particulièrement pratique lorsque tu as quelque chose que tu désires conserver dans un ordre bien précis.

Leçon 4A: Déroulement

La section de l'anti-sèche au sujet des tableaux est un simple cadre. Pas grand chose ici, juste assez pour te laisser réfléchir.

Mais dans les pages d'aide sur les tableaux, tu peux dérouler plusieurs pages, qui expliquent les différentes méthodes mises à la disposition d'un tableau.

En résumé : si tu as simplement besoin de te remémorer les bases, jette un oeil à l'anti-sèche. Si tu veux en savoir beaucoup plus, fait un saut jusqu'aux pages d'aide.

Leçon 4B: Echantillon de programmes

Ferme les pages d'aide et retourne à la fenêtre de l'anti-sèche. Déroule-la, en regardant les différents cadres. Il y a ici environ dix boîtes -- blocs, méthodes, choses diverses. C'est tellement pratique ! Toutes les bases de Ruby emballées dans une seule page.

Après ces exemples on trouve des programmes illustratifs bien pratiques. En fait, il s'agit des programmes que tu as écrit lors des quelques leçons précédentes. Tu peux sans crainte effacer les programmes dont tu ne veux plus, puisqu'ils sont ici sur l'anti-sèche, au cas où tu en aurais à nouveau besoin.

Leçon 4B: Effacer les programmes et les tableaux

Nous en avons fini avec l'anti-sèche, tu peux la ranger. Retourne à la page principale de Hackety Hack en cliquant sur l'icône de la maisonnette.

Chaque programme et chaque tableau enregistrés ont leurs propres petites icônes. Deplace ta souris sur l'un de ces icônes. Un menu apparaît alors !

Dans chaque menu, il y a un lien Delete this. Utilise ce liens pour effacer n'importe lequel de tes programmes ou tableaux. Une fois éffacés, ils disparaîtront à jamais, mais c'est bien là le but, n'est-ce pas ?

Leçon 4B: Vider le blog

Si tu cherches à supprimer tes billets de blog, sélectionne et efface le tableau MonBLog en cliquant sur son lien delete.

PARTIE GRATUITE : essaie de changer le nom de ton blog dans le programme de la dernière leçon. Ajoute quelques entrées et reviens à la page d'accueil. Est-ce que les modifications s'affichent ?

Adieu à l'éphémère leçon quatre

C'était une rapide petite leçon, non?

tu as découvert l'anti-sèche, qui est pratique si tu oublies comment faire un tableau ou une chaîne et lorsque tu as besoin de te rafraîchir la mémoire.
Les pages d'aide sont beaucoup, beaucoup plus détaillées, avec de longues pages d'aide sur tout ce dont tu pourrais avoir besoin.
Chaque programme et tableau possède son propre menu.
Dans ce menu, tu trouves un lien Effacer.

Prêt à aller encore un peu plus loin ?

Leçon Cinq: La bibliothèque YouTube? de Why

Pendant que tu étais en train d'écrire ton blog et de récupérer entre autres des pages web, J'étais à Greenland à travailler sur ma propre bibliothèque qui me permet de conserver des copies de mes vidéos YouTube? favorites. Ca fonctionne tellement bien que je veux absolument que tu l'essaies !

Dans cette leçon, je vais partager mon programme avec toi et c'est à toi de jouer pour en faire bon usage. Cela va être une leçon super-défi, mais tu vas devenir un meilleur bidouilleur, cela vaut donc le coup, tu ne trouves pas ?

Leçon 5A: Obtenir le programme de Why

Commence un nouveau programme. Voilà comment tu vas démarrer:

# Jouer avec le programme YouTube de Why.
Hacker('Why').load_program('youtube.rb')
youtube_vid = ask("Entre le lien vers une vidéo YouTube :")
save_as = ask("Le nom de cette vidéo :")
YouTube.download(youtube_vid, save_as + ".flv")

Enregistre ce programme sous YouTubeur?. Nous continuerons à l'améliorer tout au long de cette leçon.

Leçon 5A: L'heure pour l'Aventure

Continue et lance ce script.

Il te demande alors un lien YouTube?. Téléchargeons un dessin-animé, d'accord?

http://youtube.com/watch?v=LNVYWJOEy9A

Lorsqu'il te demande un nom, saisi L'heure pour l'Aventure et clique sur Ok. Ensuite, pendant qu'il télécharge, clique sur Continue.

Leçon 5A: Un moyen de pomper, mon pote

Alors, il commence à télécharger la vidéo ? Laisse-le faire, cela peut prendre un moment.

Dans la première ligne, tu charges un programme depuis mon lot de programmes partagés. L'expression Hacker('Why') crée un objet Hacker. Tu pourras utiliser cet objet plus tard pour envoyer des messages aux autres bidouilleurs et pour partager des programmes entre vous. Par exemple, l'objet Hacker à une méthode appelée load_program qui est utilisée pour récupérer mes programmes YouTube?.

Leçon 5A: À vrai dire, il y a eu deux téléchargements

As tu remarqué comment Hackety Hack à téléchargé mon programme avant de lancer le reste de ton programme ? D'où provient mon programme ? Comment Hackety Hack sait-il où trouver youtube.rb ?

http://why.hacketyhack.net/program/youtube.rb

Chaque utilisateur de Hackety Hack, s'il le veut, peut disposer de son propre espace sur HacketyHack?.net afin de partager des programmes. Le mien est [http://why.hacketyhack.net] (cela ouvre une nouvelle fenêtre.)

Donc, comme tu peux le voir, les programmes sont simplement partagés au travers de l'Internet. C'est pratique car tu peux lire le code des mes programmes depuis hacketyhack.net avant de les télécharger.

Leçon 5A: Retour à l'heure pour l'Aventure

Donc, le téléchargement de la vidéo est terminé. Mais qu'est-ce que tu peux faire avec ? Nous l'avons enregistrés sous L'heure pour l'Aventure.flv, mais qu'est-ce qu'un fichier .flv?

Il y a un moyen de regarder la vidéo :

puts Video("Downloads/Heure pour l'Aventure.flv")

TU peux mettre cela dans un nouveau programme et le lancer.

PARTIE GRATUITE : Cette fois-ci, essaie de faire apparaître la vidéo dans un popup.

Leçon 5B: Bien sûr, des vidéos, et ensuite ?

D'accord, nous en sommes au même point que lorsque nous avons vu le blog. Ton blog a un programme pour ajouter des billets. Et un autre programme pour lire le blog. C'était marrant et tout, mais ce serait mieux d'avoir un seul programme appelé YouTubeur? qui serve à télécharger, regarder et organiser tes vidéos !

Leçon 5B: Lister tes vidéos

Commençons avec un simple popup. Tu peux simplement faire un nouveau programme YouTuber?.

# Conserver un catalogue des vidéos YouTube.
vid = Web.popup() {
  title("Mes vidéos téléchargées")
  bullet() do
    Dir["Downloads/*.flv"].each() do |file|
      link_to(file)
    end
    link_to("Télécharger une nouvelle vidéo")
  end
}
puts "Veux-tu regarder  #{vid}?"

Bon, il y a plein de choses familières ici. Tu connais Web.popup et son title. Par contre, un tas de nouvelles choses comme bullet, link_to et Dir.

Lesson 5B: Secouer les puces et les liens

Lance ce programme plusieurs fois pour le prendre en mains. Évidemment, nous n'avons pas terminé. Mais demande-toi ce qui arrive lorsque tu cliques sur un lien ? Parcours le programme et regarde si tu ne peux pas voir par toi même comment il fonctionne.

Bien, parfait. Parlons un peu des trois nouvelles parties de ce programme :

1. bullets est une méthode qui crée une liste à puces. Chaque fois que tu fais un nouveau lien, un paragraphe ou encore un titre à l'intérieur de la liste, cela ajoute une nouvelle puce.

2. link_to ajoute simplement un lien. Lorsque tu cliques dessus, le popup se ferme et le nom du lien est sauvegardé dans vid. Vois-tu où la variable vid est initialisée ?

Leçon 5B: Dir[]

3. Dir[] est une commande spécialisée dans la recherche des dossiers. Nous voulons trouver tous les fichiers .flv du répertoire Downloads. Nous utilisons donc :

Dir["Downloads/*.flv"]

Si nous avions voulu lister tous les fichiers du répertoire Downloads, et pas seulement les fichiers .flv, nous aurions alors utilisé :

Dir["Downloads/*"]

L'étoile est un caractère joker. Elle trouve n'importe quelle combinaison de mots, tel que L'heure pour l'Aventure dans "L'heure pour l'Aventure.flv".

Leçon 5B: La fenêtre popup principale est prête

Ce popup va devenir le menu principal pour nos programmes. Nous serons capables de regarder ou de télécharger de nouvelles vidéos depuis celle-ci. Puis la variable vid nous indiquera la suite.

PARTIE GRATUITE : essaie d'ajouter un title dans les puces. Ou de changer les puces en nombres avec la méthode list.

Leçon 5B: main_menu()

Bien, à présent nous allons emballer les commandes du menu principal.

# Conserver un catalogue des vidéos YouTube.
def main_menu()
  # ... DÉPLACE LE POPUP ICI ...
end

vid = main_menu()

Et quand je dis DÉPLACE LE POPUP ICI, je suis sérieux. Copie le code de Web.popup exactement à l'emplacement de cette ligne.

Lance-le, assure-toi qu'il continue à fonctionner avant de poursuivre.

Leçon 5c: Les deux autres popups

Puisque c'est une leçon réellement difficile et que tu fais un boulot sensationnel, je vais juste tricher et te donner les deux autres popups. Tu peux coller ceux-ci juste en dessous du popup main_menu().

def download_video_popup()
  Web.popup() {
    title("Télécharger une vidéo")
    p("(Fonctionne avec YouTube, Google Video, Revver, etc.)")
    editline("URL")
    editline("Nom de la vidéo")
    buttons("Annuler", "Valider")
  }
end

def show_video_popup(video_title)
  Web.popup {
    title video_title
    puts Video(video_title)
  }
end

PARTIE GRATUITE : Avant que je ne te montre autre chose, vérifie que tu peux faire apparaître ces deux popups en les appelant à la place du main_menu() de la dernière ligne du programme.

Leçon 5C: Mêne l'enquête toi-même

Regardes ces deux nouveaux popups. Que font-ils ?

Le premier popup ressemble fort à la fenêtre que tu as créé auparavant pour ton blog ! Mais il n'est pas attaché au tableau MonBLog. Ni à aucun tableau à vrai dire.

Le second popup joue les vidéos ! Trop facile !

Leçon 5C: Tout mettre ensemble

Voici la dernière pièce du puzzle. Place-la en dessous des trois commandes popups. Tu dois obtenir les trois commandes puis ensuite ceci.

vid = main_menu()
if vid.equal?("Télécharger une nouvelle vidéo?")
  new_vid = download_video_popup()
  Hacker('why').load_program('youtube.rb')
  YouTube.download(new_vid["URL"], new_vid["Nom de la vidéo"] + ".flv")
else
  show_video_popup(vid)
end

Leçon 5C: Ouah ! ÇA c'est de la vraie bidouille

Ca devient un programme vraiment sérieux. Plus intense que tes autres programmes. Je vais maintenant passer un peu plus de temps afin d'être certain de bien comprendre ce qui se passe.

Dans ce code, nous utilisons un if. Ce if va contrôler la sélection du menu principal main_menu. if (NDT: si) nous choisissons "Télécharger une nouvelle vidéo", le programme va continuer et utiliser le module YouTube? de Why pour télécharger une nouvelle vidéo.

Sinon, nous allons à else (NDT: sinon), qui dit à Hackety Hack ce qu'il doit faire si nous sélectionnons l'un des autres liens. Comme ces autres liens sont tous des noms de fichiers vidéo, nous pouvons envoyer ce nom directement dans le popup show_video_popup().

Leçon 5C: Mettre cette bidouille en mouvement

Essaie de Lancer ce programme. Télécharge quelques vidéos supplémentaires, étudie encore un peu, fait une pause, etc. Tu l'auras bien en main si tu le lances plusieurs fois et si tu le lis et relis encore.

PARTIE GRATUITE : Bien, maintenant que tu es initié aux commandes sur les popups, je vais vraiment te mettre au défi ! Reprends ton blog et transforme-le en un unique programme. Avec un popup pour lire ton blog et un lien "Ajouter un nouvel article" en haut !

Leçon 5C: L'intégral YouTubeur?

Voici le code complet pour le popup YouTube?, pour le cas où tu ne t'en serais pas sorti(e) du tout :

# Conserver un catalogue des vidéoes YouTube.
def main_menu()
  Web.popup() {
    title("Mes vidéos téléchargées")
    bullets() do
      Dir["Downloads/*.flv"].each() do |file|
        link_to(file)
      end
      link_to("Télécharger une nouvelle vidéo")
    end
  }
end

def download_video_popup()
  Web.popup() {
    title("Télécharger une nouvelle vidéo")
    p("(Fonctionne avec YouTube, Google Video, Revver, etc.)")
    editline("URL")
    editline("Nom de la vidéo")
    buttons("Annuler", "Valider")
  }
end

def show_video_popup(video_title)
  Web.popup {
    title video_title
    puts Video(video_title)
  }
end

video_title = main_menu()
if video_title == "Télécharger une nouvelle vidéo"
  new_vid = download_video_popup()
  Hacker('why').load_program('youtube.rb')
  YouTube.download(new_vid["URL"], new_vid["Nom de la vidéo"] + ".flv")
else
  show_video_popup(video_title)
end

Blam-m-k-k-k! Tu gagne le badge de la Leçon Cinq!

C'était une leçon de folie. C'est probablement encore un peu flou ! Ne t'inquiète pas si tu n'as pas encore tout capté. Le but de cette leçon était surtout de te mettre à l'aise en bidouillant ensemble un peu plus de code qu'à l'habitude.

Assure-toi d'avoir bien compris les points suivants :

Les programmes peuvent être partagés sur Hacketyhack.net.
Par exemple celui-ci: Hacker('why');load_program('youtube.rb')
La méthode Video() peut être utilisé pour regarder des vidéos.
Les fenêtres popups peuvent contenir des bullets et des link_to.
La méthode Dir[] liste les fichiers d'un dossier.
Les popups peuvent se transformer en commande avec def.

Très bien! À partir de là, tu sais tout ce dont tu as vraiment besoin pour commencer à programmer seul des choses marrantes, mais nous allons continuer. Juste pour s'en assurer.

Lesson 6A: Configurer le combiné

Commence par aller à la page d'accueil et clique sur Mes paramètres. C'est juste sur cette première page en dessous de Hacky la souris. Sur cette page, saisis ton nom Hackety Hack et ton mot de passe. (Si tu n'as pas encore de nom et de mot de passe, va faire un tour sur [la page d'inscription].)

Enregistre tes préférences. Maintenant, commence un nouveau programme et nomme-le TalkieWalkie?.

# Tester mon canal
chan = Hacker('tonnom').channel("test")
puts chan.start

Remplace par ton nom d'utilisateur Hackety Hack l'emplacement indiqué par 'tonnom' . Tu vas alors démarrer ton propre salon appelé "test".

Leçon 6A: Vérification du micro

Bien, Lance ton programme à présent. Tu dois voir apparaître le message :

(test du salon tonnom)

Un salon est un endroit où tu peux bavarder. Tu vas adorer. C'est trop facile !

Leçon 6A: Tester, tester, haut et fort

Bon, maintenant envoyons quelques messages:

# Tester mon salon de clavardage
chan = Hacker('monnom').channel('test')
chan.say("Il y a quelqu'un ?")
chan.say("ALLOOOOOO !")

La méthode say envoie un message instantané vers le salon. Et même si c'est ton propre salon, n'importe qui peut venir et discuter sur ce salon, si tu lui donnes le nom de celui-ci.

Leçon 6A: Oh, Oh, qu'est-ce que tu dis ?

Commençons par lire les messages:

# Test de mon salon de clavardage.
chan = Hacker('monnom').channel('test')
chan.say("Hmm, ce camion vient d'exploser.")
puts chan.hear()

La méthode hear récupère la liste des messages du salon. Tu dois voir à présent tous les messages que tu viens d'envoyer. Les messages disparaitront du salon au bout de dix minutes, donc continue de bavarder sinon ton salon va mourir !

Leçon 6A: Tu ne peux être seul à présent

Maintenant, va chercher un pote pour installer Hackety Hack sur sa machine. (Il peuvent même être sur l'Internet.) Et essaie de jouer avec le dernier programme, en envoyant et en lisant des messages.

Souviens-toi cependant que ton pote devra utiliser ton salon. Si ton nom est Klapaucius, ton copain va faire ceci :

Hacker('klapaucius').channel('test')

Chacun de vous dois discuter sur le salon que tu as créé. Pigé ?

Leçon 6A: Bavard ?

PARTIE GRATUITE : Tente d'envoyer un objet image depuis l'Internet. Les images sont créées comme ceci :

Picture("http://hacketyhack.net/hackety.png")

Encore une autre partie gratuite, essayez maintenant de vous envoyer l'un l'autre quelques tableaux et symboles.

Leçon 6B: L'étendre

Bon, say et hear sont plutôt sympas. Mais c'est un peu ennuyeux d'avoir à lancer le programme encore et encore juste pour bavarder, n'est-ce pas ? Es-tu d'accord pour écrire une popup de bavardage ?

Leçon 6B: La boîte de défilement

Faisons un popup qui affiche le salon :

# Test de mon salon de discussion.
chan = Hacker('monnom').channel('test')
Web.popup() do
  title('Boîte à discussion')
  box = scrollbox()
  editline('Parler')
end

Bien, Enregistre-le. Lance-le. Ça ressemble à quoi ? Pas encore vraiment à une discussion, alors commencons par lire ces messages...

Toutes les deux secondes

Juste après editline('Parler'), mais avant end, ajoute ceci :

every(2) do
  chan.hear().each() do |message|
    update('scrollbox', message)
  end
end

C'est un petit bout de code vraiment impec ! La méthode every tournera en boucle à l'arrière plan. Cela signifie que ton popup peut s'afficher et que la méthode every peut faire son travail sans arrêter le programme. Le 2 signifie toutes les 2 secondes.

Leçon 6B: Le Talkie-Walkie complet

Maintenant faisons fonctionner la boîte Parler afin que tu puisses répondre. Voici le programme complet :

# Tester mon salon de discussion
chan = Hacker('monnom').channel('test')
Web.popup() do
  title('Boîte à discussions')
  box = scrollbox()
  editline('Parler')
  buttons('Envoyer') do |popup|
    chan.say(popup['Parler'])
  end
  every(1) do
    chan.hear().each() do |message|
      update('scrollbox', message)
    end
  end
end

La dernière partie s'accroche au boutton Envoyer. Si tu attaches un bloc à un bouton, ce bloc sera appelé lorsque tu appuieras sur le bouton.

Leçon 6B: Mais as-tu réellement dit tout ce que tu avais à dire ?

Bon, tu es en train de discuter ! Nous allons nous amuser un peu avec ton salon de discussion, mais pour l'instant, joue un peu avec.

PARTIE GRATUITE #1 : Les chaînes ont une méthode reverse, tu t'en souviens ? Donc "HacketyHack?".reverse() donne "kcaHytekcaH". Modifie le programme pour que tout ce que tu racontes soit inversé !

PARTIE GRATUITE #2: Essaie d'envoyer un billet de blog dans le salon. Est-ce que tu te souviens comment lire le blog MetaFiltre? ? Envoi : blog.items[0] à ton pote bidouilleur et observe ce qui se passe.

Oh, et si tu n'as pas de copain, tu peux voir si je suis présent dans mon salon : (NDT : salon en Anglais)

chan = Hacker('why').channel('lobby')

C'était sympa, la leçon Six, à plus

Leçon très productive. Tu as appris :

à te connecter à un salon de discussion.
à envoyer des messages avec say.
et à écouter des messages avec hear.
à utiliser every pour faire tourner un bloc toutes les deux secondes en tâche de fond.
à ajouter des messages à la scrollbox.
et finalement, tu as accroché un bloc au bouton Envoyer.

La prochaine leçon est la dernière. Je continue à travailler sur trois leçons supplémentaires qui seront ajoutées dans une future version de Hackety Hack. Pendant ce temps, diffuse l'information autour de toi afin que je puisse avoir de l'aide et pouvoir continuer !

Leçon Sept: Partager tes affaires

Dans les deux dernières leçons, tu as fabriqué deux nouveaux programmes à partir de rien : un visionneur de vidéo YouTube? et un programme de discussion. Et si tu as fait les parties gratuites, tes programmes font même un peu plus que cela. Tu as accompli un fantastique boulot !

Mais coder n'est pas partir de zéro. Le plaisir vient principalement en construisant par dessus de vieux programmes. Ou alors en améliorant les programmes d'autres bidouilleurs alentours.

Leçon 7A: Retour au bavardage

Parlons maintenant du partage de tes programmes. Une bonne façon d'avoir de l'aide sur tes programmes est de les partager sur ton espace Hackety Hack.

Retourne donc à la page d'accueil et récupère le programme de bavardage de ta dernière leçon. (Si tu t'en es débarrassé, utilise n'importe quel autre programme.) Déplace la souris sur l'icône situé à la gauche du nom de ton programme.

Un menu devrait apparaître. Selectionne Partage-le dans ce menu. Ton programme sera téléchargé sur le site Hackety hack à ce moment là.

Leçon 7A: Votre coin de Hackety Hack point Net

Pour être certain que le programme est partagé, visite [ta page HH personnelle].

Tu devrais voir ton programme listé dans ta page. Clique sur le nom du programme. Le navigateur internet devrait ouvrir une fenêtre te demandant si tu veux ouvrir le fichier : clique sur OK. Après quelques secondes, Hackety Hack apparaîtra et demandera si tu veux importer le programme. Continue en cliquant sur OK. Tu devrais ensuite voir un message t'indiquant que ton programme est déjà présent. C'est vrai.

Leçon 7A: L'essence de H-ety H

Bon, très bien. C'est l'essence du partage. Tu as partagé un programme sur ton site. Maintenant d'autres bidouilleurs peuvent cliquer sur le programme et l'importer dans Hackety Hack. Le programme apparaîtra dans leur liste.

Leçon 7A: Retour à mon programme YouTubeur?

C'est exactement comment j'ai partagé pon programme YouTube?. Tu le verra dans ma liste [ici].

Sauf que tu n'as pas vraiment obtenu une copie du programme. Tu as utilisé ce morceau de code :

Hacker('why').load_program('youtube.rb')

Leçon 7A: En bref, tu as le choix

Tu peux donc obtenir des programmes de deux façons :

En cliquant sur le programme listé sur le site Hackety Hack. (ce qui enregistre le fichier dans tes Programmes Sauvegardés.)
En utilisant Hacker.load_program. (ce qui chargera le fichier à chaque fois que tu en as besoin.)

Essaie avec le programme que tu viens de partager. Admettons qu'il se nomme Chat.rb.

Leçon 7A: Charger ton programme

Commence un nouveau programme. Tape la ligne Hacker.load_program pour obtenir ton programme Chat.rb. Clique sur Lancer.

Est-ce que ton programme se lance ? Est-ce qu'il fonctionne ? Assure-toi d'avoir bien mis ton pseudo et le nom de ton programme. Est-ce que tu vois comment cela fonctionne ?

Leçon 7B: Construire sur mes bases

Bon, il est temps de me voler encore un peu de code. Et c'est plutôt bien. C'est super de piquer le code d'autres programmeurs, c'est même la quintessence de l'apprentissage. Tu dois construire sur les bases des autres : cela t'épargne un peu de boulot.

Donc, fonce sur mon site Hackety Hack et clique sur mon programme QuickMark?.rb. Importe-le dans hackety Hack, il doit apparaître parmis tes Programmes Partagés.

Leçon 7B: Que penses-tu de mon QuickyMarks? ?

Lance le programme. C'est un simple gestionnaire de signets. Saisi un lien (comme par exemple http://why.hacketyhack.net) et une description (comme Où j'ai récupéré QuickyMark.) Quand tu as finis de jouer avec, ferme-le en cliquant sur le bouton "X" de la fenêtre popup.

Maintenant, clique sur le programme QuickyMark? et observe le code. Il comporte une paire de fenêtres popups. Et sauvegarde dans un tableau appelé QuickyMark?.

Leçon 7B: Partager son tableau QuickyMark?

Un petit détour. Nous allons publier le tableau QuickyMark? dans ton espace Hackety Hack. Déplace la souris au dessus de l'icône du tableau QuickMark? et sélectionne Partage-le.

Quand le partage est terminé, clique sur l'icône de la maisonnette dans la barre d'outils d'Hackety Hack. Le tableau QuickMark? doit avoir une icône différente à présent : un tableau avec un lien chaîné. Ce lien signifie que la table est liée à ton espace Hackety Hack.

Leçon 7B: Partagé où ? Lié où ?

Visite ton site Hackety Hack et clique sur QuickyMark? en dessous des tableaux partagés. Il semble que tes signets ont été copiés.

Bon, VOILÀ LE TOPO: Maintenant, tout ce que tu enregistres dans le tableau QuickyMark? (qui est à présent partagé) sera partagé sur internet.

Maintenant tu devrais ajouter quelques signets supplémentaires et vérifier s'ils apparaissent dans le tableau partagé de ton site Hackety hack.

Leçon 7C: Couleurs et designs

Essayons d'améliorer ce programme QuickyMark?. Cette stupide plaine blanche m'assèche la vie.

Voici comment nous allons faire : tu peux utiliser la commande design à l'intérieur de n'importe quel popup pour changer son apparence. Ajoute ta propre touche à la fenêtre grâce à la méthode bookmark_list. Colle ceci sous la ligne Web.popup do:

design("font-size" => "15px", "font-family" => "arial",
  "color" => "white",
  "background-color" => "green",
  "padding" => "16px")

Leçon 7C: Le nouveau manteau de QuickyMark?

Lance le programme QuickyMark?. Regarde comment cela fonctionne...

Beurk, les liens sont trop moches. Comment le mettre en blanc ? Essaie d'attacher un "design" avec un point :

a(mark[:Link], :href => mark[:Link]).design("color" => "white")

Qu'est-ce que le design peut changer ? Et bien, tout ce qui est un attribut CSS. Une liste complète des attributs CSS est [ici].

PARTIE GRATUITE : Hackety Hack est livré avec une méthode ask_color() qui ouvre un sélecteur de couleur. Essaie d'écrire un petit programme qui demandera la couleur puis affichera un popup en utilisant cette couleur comme couleur d'arrière-plan.

Leçon 7D: Atteindre tes propres tableaux

Nous avons pas mal utilisé les popups pour remplir des tableaux, mais il se passe beaucoup de choses que tu ne vois pas. Comme par exemple la méthode save.

Si tu préfères faire des ajouts à tes tableaux sans passer par un popup, tu peux simplement écrire du code qui utilise Table.save. Ici, nous allons ajouter un signet à ton tableau partagé QuickyMark? :

 #!ruby
 Table('QuickyMark').save('Link' => "http://google.com/",
   'Description' => "Google, au cas où j'oublierais...")

Leçon 7D: Une bonne raison

C'est pratique dans le cas où tu veux, admettons, copier tout mes bookmarks de del.icio.us vers QuickyMark?. Ou bien en récupérer depuis mon application de bavardage : lorsque quelqu'un met un lien dans une discussion, je peux l'enregistrer dans QuickyMark?.

PARTIE GRATUITE : Peux-tu charger le flux de boingboing.net pour ensuite conserver tous les articles dans ton tableau QuickyMark? en seulement quatre lignes de code ? (Réponse page suivante.)

Leçon 7D: Comment j'ai enregistré tout mes Del.icio.us

Au lieu de sauvegarder tous mes liens Boing Boing, je vais récupérer mes dernières affaires depuis mes liens del.icio.us.

# Boing Boing -> QuickyMark
feed = Web.fetch('http://del.icio.us/why', :as => Web::Feed)
feed.items.each do |item|
  Table('QuickyMark').save('Link' => item.link, 'Description' => item.title)
end

Jeu terminé, recharge tes crédits

Tu as été IMPRESSIONNANT(E) !

Cette dernière leçon a couvert :

le partage de tes propres porgrammes.
l'importation des programmes d'autres bidouilleurs.
la modification de QuickyMark? en utilisant design pour changer les couleurs.
la méthode save des tableaux, de façon à pouvoir mettre des choses dans tes tableaux sans avoir besoin de passer par un popup.
l'importation des liens depuis un flux dans un tableau.

Bon, et maintenant, on va où ? Et bien, tu devrais essayer [Talkety Talk], le forum en ligne d'Hackety Hack pour rencontrer d'autres bidouilleurs. Ou encore la zone des [Programmes Partagés], où de populaires et astucieux programmes sont proposés.

Ou encore tout simplement expérimenter. Tu as les pages d'aide. Et tu sais où trouver l'anti-sèche. Va bidouiller maintenant.

Download in other formats:

Plain Text