1: Mise en route avec Spck Editor

Qu'allez-vous apprendre ?

Découvrir comment configurer SPCK Editor sur mobile pour coder vos premières pages HTML.

Suivez ce chapitre à la lettre

Dans ce chapitre, nous allons préparer votre environnement sur SPCK Editor, créer votre premier projet HTML et apprendre à utiliser le clavier de codage pour écrire efficacement.

Chapitre 01 : Mise en route avec Spck Editor

Avant d’écrire la moindre ligne de code HTML, il est indispensable de bien préparer ton environnement de travail. Lorsque l’on apprend la programmation uniquement avec un smartphone, le choix de l’outil est très important. SPCK Editor est un éditeur de code puissant et léger qui permet de créer des sites web directement sur mobile, sans ordinateur. Il offre des fonctionnalités proches d’un éditeur professionnel comme la gestion des fichiers, l’édition de code et la prévisualisation en temps réel.

Dans ce premier chapitre, tu vas apprendre à installer SPCK Editor, comprendre son interface, créer ton premier projet HTML et utiliser correctement le clavier de codage. Ces bases sont essentielles : sans elles, il sera difficile de progresser efficacement dans l’apprentissage du HTML.

  1. Installation de SPCK Editor : Télécharge SPCK Editor depuis le Play Store, ouvre l’application et autorise l’accès au stockage afin de pouvoir créer et modifier des fichiers.
  2. Découverte de l’interface : L’interface est composée d’un explorateur de fichiers, d’une zone d’écriture du code et d’un bouton Play (▶) permettant de visualiser le résultat dans le navigateur.
  3. Création du premier projet : Crée un dossier pour ton site, puis à l’intérieur crée un fichier nommé obligatoirement index.html. Ce fichier représente la page principale du site.
  4. Importance du nom index.html : Les navigateurs reconnaissent automatiquement ce fichier comme page d’accueil. Sans ce nom exact, ton site risque de ne pas s’afficher correctement.
  5. Utilisation du clavier de codage : SPCK propose une barre d’outils avec les symboles < > / = indispensables pour écrire les balises HTML plus rapidement.
  6. Premier exemple HTML : 
    <!DOCTYPE html>
<html>
</html>
  7. Structure minimale : 
    <!DOCTYPE html>
<html>
  <body>
  </body>
</html>
  8. Ajouter du contenu : 
    <p>Bonjour le monde</p>
  9. Tester avec le bouton Play : Après chaque modification, sauvegarde ton fichier et clique sur ▶ pour voir le résultat.
  10. Organisation du code : Utilise toujours des indentations pour rendre ton code lisible et facile à comprendre.

Exemples pratiques supplémentaires :

<h1>Mon premier site</h1>
<p>Créé avec SPCK Editor</p>
      
<!-- Ceci est un commentaire HTML -->

Exercices pratiques :

  1. Installe SPCK Editor sur ton smartphone.
  2. Crée un dossier nommé mon-site-html.
  3. Crée un fichier index.html.
  4. Écris une phrase simple avec la balise <p>.
  5. Ajoute un titre <h1> avec ton prénom.
  6. Teste ton fichier avec le bouton Play.
  7. Ajoute un commentaire HTML.
  8. Corrige volontairement une erreur puis répare-la.
  9. Améliore l’indentation de ton code.
  10. Sauvegarde ton projet et rouvre-le.

Une bonne maîtrise de SPCK Editor te permettra d’apprendre le HTML plus facilement, plus rapidement et sans dépendre d’un ordinateur. Pratique chaque jour, même quelques minutes, et avance étape par étape.

Passer au chaitre 02-->