Thimble

Introduction

Thimble est un éditeur de code en ligne, gratuit et open source proposé par Mozilla. Ce dernier permet de créer et de publier des pages web tout en suivant une série de tutoriels sur le langage HTML, CSS et le JavaScript.

Description de Thimble

Thimble permet de créer de nouveau projet, d'importer et d'éditer vos pages de code avec une preview live. Il est entièrement possible de travailler dans Thimble sans créer de compte, mais un compte reste nécessaire pour enregistrer et publier son travail.

Créer un projet

Pour créer un projet, il suffit simplement de se rendre sur la page de Thimble et de cliquer sur le bouton créer un nouveau projet.

Créer un projet dans Thimble

Interface

L'interface de Thimble est divisée en trois section. La première section permet de visualiser nos fichier et dossier. La seconde section permet de voir le code de la page sélectionnée dans la première section. La Troisième section est une prévisualisation live du code que nous sommes en train d'éditer.

Inteface de Thimble

Importer et exporter des fichiers

• Pour importer des fichiers dans Thimble, il suffit des glisser les fichiers depuis votre bureau (ou autre dossier) sur la page web de Thimble, votre fichier apparaîtra dans la première section de l'interface la page Thimble.

Importer un fichier dans Thimble

• Pour exporter un fichier ou un dossier, il suffit de faire un clic droit sur le fichier ou le dossier en question (dans la première section de l'interface) et choisir l'option télécharger.

Exporter un fichier de Thimble

Publier et remixer

Thimble permet de travailler à plusieurs de façon asynchrone et à distance ou de simplement publier son code pour le partager (il est nécessaire de créer un compte pour faire cela).

• Pour publier un code, il suffit d'utiliser le bouton Publier en haut à droite de votre interface Thimble. Cela vous permettra de partager via un lien votre projet à tout ceux avec qui vous partager le lien.
• Depuis un lien publié, vous pouvez cliquer sur le bouton Remixer en haut à droite de la page web publier, ce qui importe le projet dans votre éditeur. Vous pouvez dès alors faire des modification avant de republier le code.

Accéder à ses projets

Pour accèder à ses différents projets, il suffit de cliquer sur l'onglet en haut à droite Bonjour, nomDeCompte et de choisir l'option Mes projets (il est nécessaire de créer un compte pour faire cela).