Le tutoriel du capitaine

Bonjour moussaillon. Je t'ai concocté une petite introduction de quelques minutes pour te faire découvrir la programmation. N'attends pas plus et saute à bord en cliquant sur le premier bouton.

Ouvre ce lien dans un nouvel onglet pour commencer : code source

Nous voici maintenant là où seuls les vrais pirates s’aventurent, le dit "code source". C’est là que tout se passe, tout le fonctionnement de ton jeu est écrit là-dedans. Tu peux lancer le jeu en appuyant sur play.

Essaye de rajouter une lettre ici ou là, et tu verras que plus rien ne fonctionne. Heureusement, pour ça tu peux faire cntrl+Z et revenir en arrière. Dans le pire des cas, tu peux toujours ouvrir à nouveau le code source pour repartir de zéro.

La partie de ton jeu que tu as réalisé tout à l’heure s’appelle les assets, ou les ressources. Ce sont tous les fichiers extérieurs au programme tels que la musique ou les images. Ils sont accessibles dans la partie la plus à gauche de la page de ton code source. Trouve dans tes assets le script sketch.js et clique dessus.

Tout ton programme est divisé en plein de petites îles dispersées à droite à gauche dans différents fichiers, on les appelle les fonctions. Voici à quoi elles ressemblent :

function lee(){
  print( "Bravo matelot" );
}

Chaque fonction commence et termine avec ces petits crochets { }.

Maintenant, trouve la fonction setup() dans ton programme.

Trouvé ? Chaque fonction a un rôle spécifique dans ton code. Pour les utiliser, il faut les appeler par leur nom, parfois avec des instructions. Par exemple, rajoute cette ligne quelque part dans la fonction setup():

print( "Salut, moussaillon" );

N’oublie pas le point-virgule, ces petits coquins sont indispensables. Quand tu auras copié la ligne appuie sur play puis regarde ce qui se passe dans la fenêtre grise en bas du code source. Ça y est tu as fait ta première modification dans le programme !

Tout ce qui se passe dans ton jeu à lieu dans des fonctions. Recopie la fonction lee() que je t’ai montré un peu plus haut et colle la dans ton code, en dehors d’une fonction. Remplace ensuite la ligne que tu as rajoutée tout à l’heure par celle-ci :

lee();

Que s’est-il passé ? Tu as créé ta propre fonction et tu l’as appelée. Allez, un autre point et ce sera déjà fini !

Ces petits singes peuvent se retrouver un peu n’importe où, dans une fonction ou même en dehors. Leur place a d’ailleurs un rôle déterminant dans ton programme. Par exemple place la ligne suivante quelque part dans ton code, en dehors d’une fonction :

var captain = "Lee";

Puis dans la fonction lee() que tu as créé à l’instant remplace " bravo matelot " par captain sans guillemets. Tu découvriras alors sans surprise qui est le plus grand des loups de mer.

Je ne vais pas te bassiner plus longtemps. Tu vas maintenant découvrir par toi-même comment tout ça fonctionne. Choisis quelques hacks à rajouter à ton jeu et débrouille-toi pour le faire fonctionner ! Et n’oublie pas, si jamais il t’arrive de tout casser et que plus rien ne fonctionne, tu peux toujours reprendre à zéro en rechargeant la page du code source.

J’oubliais, toutes les lignes qui commencent par // n’ont pas d’influence sur le programme. Tu en trouveras un peu partout dans le code, ce sont des instructions que je t’ai laissé, comme dans cet exemple :

// bon courage matelot !

Fais leur confiance ! Même chose pour les paragraphes compris entre des /* et des */, comme suit :


/*
bientot le monde découvrira le 
super jeu que tu nous prépare
*/