This repository has been archived by the owner on Jan 2, 2024. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 2
/
Copy pathindex.html
144 lines (127 loc) · 6.3 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
---
layout: page
title: TrainDrop
slug: home
---
<div class="spotlight">
<h2 id="en-resume">En résumé</h2>
<ul>
<li>Projet collaboratif sur GitHub</li>
<li>À destination des enseignants front-end</li>
<li>Enseigner avant tout les grands principes du web (pérennité)</li>
<li>Une entrée par la pratique pour ne pas lasser</li>
<li>Des fiches à partager, améliorer, créer</li>
</ul>
</div>
<div id="pageTOC">
<p>Sommaire de la page :</p>
<ul>
<li><a href="#les-grandes-lignes-du-projet">Les grandes lignes du projet</a>
<ul>
<li><a href="#public">Public</a>
<li><a href="#pedagogie">Pédagogie</a>
<ul>
<li><a href="#les-grands-principes">Les grands principes</a></li>
</ul>
</li>
<li><a href="#outil">Outil</a>
<ul>
<li><a href="#gabarit-de-fiche-pedagogique">Gabarit de fiche pédagogique</a></li>
<li><a href="#projets-similaires-ou-en-rapport">Projets similaires ou en rapport</a></li>
</ul>
</li>
</ul>
</li>
<li><a href="#la-mise-en-place-du-projet">La mise en place du projet</a></li>
<li><a href="#liens">Liens</a></li>
</ul>
</div>
<h2 id="les-grandes-lignes-du-projet">Les grandes lignes du projet</h2>
<h3 id="public">Public</h3>
<p>TrainDrop ne s'adresse pas aux personnes qui veulent apprendre le code.
<br />TrainDrop s'adresse à <strong>ceux qui l'enseignent</strong>.</p>
<h3 id="pedagogie">Pédagogie</h3>
<p>TrainDrop s'articule autour des points suivants :</p>
<ul>
<li>L'enseignement du font-end ne peut se faire qu'en transmettant la <strong>culture générale</strong> du web et ses <strong>grands principes</strong>.</li>
<li>Il faut rapidement être <strong>concret</strong> et faire des <strong>exercices pratiques</strong> pour ne pas perdre l'intérêt des étudiants.</li>
<li>Il s'agit plus d'<strong>apprendre à apprendre</strong> que de donner un enseignement dogmatique qui sera vite obsolète.</li>
</ul>
<h4 id="les-grands-principes">Les grands principes</h4>
<p>
Les grands principes indispensables à transmettre que nous avons identifiés sont :
</p>
<ul>
<li>l'accessibilité ;</li>
<li>l'interopérabilité ;</li>
<li>la maintenabilité ;</li>
<li>le référencement ;</li>
<li>les standards du web ;</li>
<li>la sémantique ;</li>
<li>la performance ;</li>
<li>l'expérience Utilisateur.</li>
</ul>
<p>
À cela s'ajoutent des compétences :
</p>
<ul>
<li>Apprendre à apprendre ;</li>
<li>Tester, vérifier, valider.</li>
</ul>
<p>
Enfin, il y a aussi un certain savoir-être à transmettre :
</p>
<ul>
<li>Savoir se remettre en cause</li>
<li>Échanger avec ses pairs</li>
<li>S’adapter au contexte.</li>
</ul>
<h3 id="outil">Outil</h3>
<p>
Le but est donc de mettre en place un outil conçu et partagé par « la communauté ». GitHub semble être le bon endroit pour réunir tout ça et assurer la cohérence de l'ensemble par la validation des <em>commits</em>.
</p>
<p>
L'outil consiste en un ensemble de fiches construites sur un même modèle pédagogique qui permettent à un enseignant de construire et conduire son cours.
</p>
<h4 id="gabarit-de-fiche-pedagogique">Gabarit de fiche pédagogique</h4>
<ul><li><a href="https://github.com/TrainDrop/fiches/tree/gh-pages/_new/pseudoGitHub_001">TrainDrop > fiches > _new > speudoGitHub_001</a></li></ul>
<h4 id="projets-similaires-ou-en-rapport">Projets similaires ou en rapport</h4>
<ul>
<li><a href="https://webmaker.org/">Webmaker</a></li>
<li><a href="https://developers.google.com/web/fundamentals/">Fundamentals (par Google)</a>
<br /><a href="https://github.com/google/WebFundamentals">Fundamentals sur GitHub</a></li>
</ul>
<h2 id="la-mise-en-place-du-projet">La mise en place du projet</h2>
<p>
« Comment enseigner l'intégration HTML ? » Cette question posée lors de <a href="http://sudweb.fr/2014/">Sud Web 2014</a> a donné envie à Rémi, Delphine et Romy de profiter des élaboratoires pour animer une discussion-débat autour de cette thématique. (Voir la section « Liens » ci-dessous.)
</p>
<p>
Des idées globales se sont dégagées et, parmi elles, le besoin d'un outil pédagogique et adapté sur lequel s'appuyer.
</p>
<p>
Forts de ce premier travail de groupe et avec la grande envie que ça ne s'arrête pas là, Rémi et Delphine ont proposé de construire ensemble cet outil lors d'un atelier à <a href="http://www.paris-web.fr/">Paris Web 2014</a>.
<br />C'est avec cet atelier et de la motivation des participants – <a href="http://borisschapira.com/">Boris Schapira</a> et <a href="http://twikito.com/">Matthieu Bué</a> notamment – qu'est né TrainDrop.
</p>
<h2 id="liens">Liens</h4>
<p>À propos de l'élaboratoire Sud Web et de l'atelier Paris Web :</p>
<ul>
<li><a href="http://www.hteumeuleu.fr/comment-enseigner-integration-web/">Sud Web, l'article de Rémi</a></li>
<li><a href="http://romy.tetue.net/comment-enseigner-int%C3%A9gration-HTML">Sud Web, l'article de Romy</a></li>
<li><a href="http://borisschapira.com/blog/un-outil-pour-enseigner-le-web-front-end/">Sud Web, l'article de Boris</a></li>
<li><a href="http://nissone.com/sudweb2014/EnseignerHTML-ElaboratoireSudWeb.jpg">Sud Web, la photo du tableau-blanc de l'élaboratoire</a></li>
<li><a href="http://articles.nissone.com/2014/11/projet-communautaire-enseigner-front-reste-bilan-personnel-atelier-lancement/">Paris Web, l'article de Delphine</a></li>
<li><a href="http://fr.slideshare.net/DelphineMalassingne/construire-ensemble-un-enseignement-du-frontend-pertinent-pdagogique-et-prenne">Paris Web, le diaporama</a></li>
</ul>
<p>
À propos d'apprendre à apprendre :
</p>
<ul>
<li><a href="https://borisschapira.com/2014/06/le-code-a-change/">Le code a changé</a></li>
</ul>
<p>
À propos de la pédagogie :
</p>
<ul>
<li><a href="http://www.hteumeuleu.fr/mr-meyer/">Mr Meyer</a></li>
<li><a href="https://larlet.fr/david/pro/enseignement/">Cours de David</a></li>
</ul>