Soyez acteur du Web

publicité
Soyez acteur du Web !
Géraldine Del Mondo
Préparation au développement HTML
Le processus complet
Etape 1 : créer son fichier dans un éditeur de texte
Le processus complet
Etape 2 : s'inscrire sur le serveur https://mooc-saw.insa-rouen.fr
Le processus complet
1- de déposer son fichier sur le serveur via FileZilla
Permet :
Le processus complet
2- D'obtenir les informations nécessaires par e-mail afin de...
Permet :
Visualiser la page web
Visualiser le source
de la page web
Le fichier texte
●
« un fichier texte ou fichier texte brut ou fichier texte
simple est un fichier dont le contenu représente
uniquement une suite de caractères » [Wikipedia,
octobre 2016]
●
Un fichier texte peut se ranger dans un répertoire
●
Un éditeur de texte suffit pour créer un fichier texte
●
Un éditeur de texte n'est pas un traitement de texte
L'éditeur de texte
●
●
Un éditeur de texte est une application qui permet de
créer/modifier un fichier texte
Il existe beaucoup d'applications de ce type, par exemple :
https://wiki.gnome.org/Apps/Gedit#gedit
https://www.geany.org/Main/HomePage
Geany
→ éditeur de texte conseillé : ATOM
https://atom.io/
Création d'un premier fichier html
●
Ouvrir l'éditeur de texte
●
Recopier l'exemple :
<!DOCTYPE HTML>
<HTML>
mon premier fichier html
</HTML>
●
Enregistrer le fichier avec une extension en .html
●
Ranger le fichier dans un répertoire
Visualiser un fichier en local
●
●
Pour faire des tests (éventuellement sans connexion web)
Accessible seulement pour soi
Inscription sur le serveur
●
●
S'inscrire sur le serveur permet :
–
De pouvoir déposer ses projets
–
De disposer d'un serveur web pour interpréter ses pages
HTML
https://mooc-saw.insa-rouen.fr/
Inscription sur le serveur
●
Pour s'inscrire il faut :
–
le pseudo utilisé sur la plateforme FUN
–
Une adresse e-mail
Inscription sur le serveur
Dépôt du fichier sur le serveur
Ouvrir l'application FileZilla (téléchargeable ici : https://filezilla-project.org/download.php?type=client)
Hôte : mooc-saw.insa-rouen.fr
Identifiant : l'identifiant reçu
par mail
Mot de passe : le mot de passe
reçu par mail (que vous avez
dû changer)
Port : 22
Dépôt du fichier sur le serveur
Choisissez le répertoire du projet dans lequel vous souhaitez déposer votre fichier...
… Et glissez-déposez
votre fichier
Visualisation via le navigateur
https://mooc-saw.insa-rouen.fr/identifiantDuProjet/nomDuFichier.html
1. Voir le résultat
de votre mini-site
(ou de celui de l'étudiant
que vous devez évaluer)
Visualisation via le navigateur
https://mooc-saw-sources.insa-rouen.fr/identifiantDuProjet/nomDuFichier.html
2. Voir les sources de
votre mini-site
(ou de celui de l'étudiant
que vous devez évaluer)
En résumé
●
●
●
Connaissance des outils de base pour
maîtriser l'environnement informatique de
travail
Processus de création et de dépôt du
fichier HTML sur le serveur
Visualisation de la page HTML via un
navigateur
Téléchargement