-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathcours3.html
322 lines (320 loc) · 15.2 KB
/
cours3.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
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8"/>
<link rel="stylesheet" href="etapes.css"/>
<script src="etapes.js"></script>
<title>Étapes</title>
</head>
<body>
<div class="interface">
<header>
<h1>Un site Web avec Laravel</h1>
<h2>Les étapes</h2>
</header>
<nav></nav>
<footer>Les vidéos sont disponibles sur <a href="https://www.youtube.com/channel/UCFWzWuHnqYOlBN2lJhBIGNg">la chaîne Youtube</a></footer>
<div class="body">
<ol>
<li value="27" id="installer_form" data-video="7EEGVGmQlew">
<h2>Installation du plugin</h2>
<ol>
<li>Faire la recherche <span class="string">Form Laravel Collective</span> dans Google.</li>
<li>Suivre le lien vers <cite>Laravel Collective</cite>.</li>
<li>Suivre les instructions <b>de la version voulue</b> en fonction de la version de Laravel.</li>
<li>À la maison
<ol style="list-style-type: lower-roman">
<li>Exécuter dans le terminal <code class="commande copiable">composer require laravelcollective/html</code></li>
</ol>
</li>
<li value="4">Dans les laboratoires du Cégep
<ol style="list-style-type: lower-roman">
<li>Ouvrir le fichier <span class="fichier">/composer.json</span></li>
<li>Ajouter dans la section <code>'require'</code> la ligne suivante (avec la virgule) :
<div class="bloccode php copiable">
<div><samp>"laravel/tinker": "~1.0"</samp>,</div>
<div>"laravelcollective/html":"^5.4.0"</div>
</div>
</li>
<li>Dans le terminal faire <code class="commande copiable">composer update</code>.</li>
<li>Ouvrir le fichier <span class="fichier">/config/app.php</span> et l'adapter comme suit :
<div class="bloccode php copiable">
<div><samp>App\Providers\RouteServiceProvider::class,</samp></div>
<div>Collective\Html\HtmlServiceProvider::class,</div>
</div>
<div class="bloccode php copiable">
<div><samp>'View' => Illuminate\Support\Facades\View::class,</samp></div>
<div>'Form' => Collective\Html\FormFacade::class,</div>
<div>'Html' => Collective\Html\HtmlFacade::class,</div>
</div>
</li>
</ol>
</li>
<li>Tester l'installation en mettant <code class="blade copiable">{{Form::open()}}</code> dans une view. Si l'execution de la <cite>view</cite> ne cause pas d'erreur, l'installation est correcte.</li>
</ol>
</li>
<li id="lien_ajouter" data-video="ScE25faGK8w">
<h2>Ajouter le lien et la route</h2>
<ol>
<li>Dans la <cite>view</cite> <span class="view">interface.menu</span>, modifier un des liens pour mener vers l'action <span class="controller">UserController@create</span> : <code class="blade copiable" style="white-space: normal"><a href="{{action('UserController@create')}}">Ajouter un usager</a></code></li>
<li>Créer la route correspondante.
<div class="bloccode php copiable">
<div><samp>Route::get('/users/{user}', "UserController@show");</samp></div>
<div>Route::get('/users/create', "UserController@create");</div>
</div>
</li>
<li>Tester et constater l'erreur</li>
</ol>
</li>
<li id="contraintes_route" data-video="YpUCU8B9vCQ">
<h2>Ajouter la contrainte de route</h2>
<ol>
<li>Tester en inversant les routes <cite>show</cite> et <cite>create</cite>.</li>
<li>À la fin de la route <cite>show</cite> ajouter la contrainte de route.
<div class="bloccode php copiable">
<div><samp>Route::get('/users/{user}', "UserController@show")</samp></div>
<div> ->where('user', '[0-9]+')<samp>;</samp></div>
</div>
</li>
<li>Tester différentes adresses : <span class="fichier">/users/1</span>, <span class="fichier">/users/create</span> et <span class="fichier">/users/patate</span>.</li>
</ol>
</li>
<li id="view_form" data-video="BRYrug1Aclg">
<h2>Le formulaire vide</h2>
<ol>
<li>Dans le controller, ajouter l'appel à la <cite>view</cite> <span class="view">users.create</span>.</li>
<li>Créer un user vide et créer l'envoyer avec la view.</li>
<li>Ajouter une valeur à la propriété <var>province</var>.
<div class="bloccode php copiable">
<div><samp>public function create()</samp></div>
<div><samp>{</samp></div>
<div> $user = new User();</div>
<div> $user->province = "Québec";</div>
<div> return view('users.create', ['user'=>$user]);</div>
<div><samp>}</samp></div>
</div>
</li>
<li>Créer la <cite>view</cite> <span class="view">users.create</span>.</li>
<li>Ajouter le titre et inclure la <cite>view</cite> <span class="view">users.form</span>.</li>
<li>Constater le non-besoin d'envoyer la variable <var>$user</var> lors de l'inclusion.</li>
<li>Créer la <cite>view</cite> <span class="view">users.form</span>.</li>
<li>Y ajouter l'ouverture et la fermeture du formulaire : <code class="blade copiable">{{Form::open()}}</code> et <code class="blade copiable">{{Form::close()}}</code>.</li>
<li>Regarder le code HTML du formulaire vide.</li>
</ol>
</li>
<li id="premierschamps" data-video="TdYvcJZovCI">
<h2>Les premiers champs</h2>
<ol>
<li>Dans la <cite>view</cite> form, créer le tableau vide avec une rangée, un <code><th></code> pour le label et un <code><td></code> pour champ de formulaire.
<div class="bloccode blade copiable">
<div><table border="1"></div>
<div> <tbody></div>
<div> <tr></div>
<div> <th></th></div>
<div> <td></td></div>
<div> </tr></div>
<div> </tbody></div>
<div></table></div>
</div>
</li>
<li>Dans le <code><th></code>, ajouter le label pour le champ <var>nom</var> en utilisant la classe Form. <code class="blade copiable">{{Form::label('nom', 'Nom')}}</code></li>
<li>Dans le <code><td></code>, ajouter le champ text pour le nom. <code class="blade">{{Form::text('nom')}}</code></li>
<li>Ajouter une valeur par défaut comme 2e paramètre. <code class="blade">{{Form::text('nom', 'Raté')}}</code>.</li>
<li>Ajouter l'attribute <cite>placeholder</cite> en ajoutant un <cite>array</cite> comme 3e paramètre. <code class="blade copiable">{{Form::text('nom', 'Raté', ['placeholder'=>'Nom'])}}</code>.</li>
<li>Répéter pour ajouter le champ <code>province</code>.</li>
<li>Faire afficher les valeurs par défaut provenant de la variable $user : remplacer <code class="blade">'Raté'</code> par <code class="blade">$user->nom</code>.</li>
<li>Utiliser <code class="blade">model</code> à la place de <code class="blade">open</code> pour ouvrir le formulaire. <code class="blade copiable">{{Form::model($user)}}</code></li>
<li>Enlever les <code>placeholder</code> et les valeurs par défaut. Tester et constater que la province s'affiche encore.</li>
</ol>
</li>
<li id="autresschamps" data-video="StEiwcFgcgg">
<h2>Les autres champs</h2>
<ol>
<li>Ajouter les autres champs.
<div class="bloccode blade copiable">
<div><tr></div>
<div> <th>{{Form::label('nom', 'Nom')}}</th></div>
<div> <td>{{Form::text('nom')}}</td></div>
<div></tr></div>
<div><tr></div>
<div> <th>{{Form::label('prenom', 'Prénom')}}</th></div>
<div> <td>{{Form::text('prenom')}}</td></div>
<div></tr></div>
<div><tr></div>
<div> <th>{{Form::label('name', 'Nom d\'usager')}}</th></div>
<div> <td>{{Form::text('name')}}</td></div>
<div></tr></div>
<div><tr></div>
<div> <th>{{Form::label('password', 'Mot de passe')}}</th></div>
<div> <td>{{Form::password('password')}}</td></div>
<div></tr></div>
<div><tr></div>
<div> <th>{{Form::label('email', 'Courriel')}}</th></div>
<div> <td>{{Form::email('email')}}</td></div>
<div></tr></div>
<div><tr></div>
<div> <th>{{Form::label('tel', 'Téléphone')}}</th></div>
<div> <td>{{Form::text('tel')}}</td></div>
<div></tr></div>
<div><tr></div>
<div> <th>{{Form::label('adresse', 'Adresse')}}</th></div>
<div> <td>{{Form::text('adresse')}}</td></div>
<div></tr></div>
<div><tr></div>
<div> <th>{{Form::label('ville', 'Ville')}}</th></div>
<div> <td>{{Form::text('ville')}}</td></div>
<div></tr></div>
<div><tr></div>
<div> <th>{{Form::label('province', 'Province')}}</th></div>
<div> <td>{{Form::text('province')}}</td></div>
<div></tr></div>
<div><tr></div>
<div> <th>{{Form::label('codepostal', 'Code Postal')}}</th></div>
<div> <td>{{Form::text('codepostal')}}</td></div>
<div></tr></div>
<div><tr></div>
<div> <th>{{Form::label('citation', 'Citation')}}</th></div>
<div> <td>{{Form::textarea('citation')}}</td></div>
<div></tr></div>
</div>
</li>
<li>Utiliser le faker à la place d'un user vide dans le controller pour les tests (modifier le controller).</li>
<li>Ajouter une rangée à la fin avec un seul <th></li>
<li>Mettre un champ <code>submit</code>.</li>
</ol>
</li>
<li id="reception" data-video="mpJGpVCKZRU">
<h2>La réception des données</h2>
<ol>
<li>Tester la page et constater l'erreur. Il manque la route pour l'action <span class="controller">UserController@store</span>.</li>
<li>Dupliquer la route pour <span class="controller">UserController@create</span> et mettre <span class="controller">store</span></li>
<li>Remplacer <span class="php">get</span> pour <span class="php">post</span> afin que la route réagisse lorsque des données sont envoyées. Ne pas changer l'adresse de la route. <span class="php copiable">Route::post('/users/create', "UserController@store");</span></li>
<li>Dans l'action <span class="controller">UserController@store</span>, constater la variable <var class="php">$request</var>. Faire retourner cette variable.</li>
<li>Faire <code class="php copiable">return $request->get('nom');</code></li>
<li>Créer un nouveau <code>user</code>, y mettre le nom et le retourner.
<div class="bloccode php copiable">
<div>$user = new User();</div>
<div> $user->nom = $request->get('nom');</div>
<div>return $user;</div>
</div>
</li>
<li>Récupérer toutes les données à l'aide de <code class="php">all</code>. <code class="php copiable">$donnees = $request->all();</code></li>
<li>Appliquer les données au <code>user</code> à l'aide de <code class="php">fill</code>. <code class="php copiable">$user->fill($donnees);</code></li>
<li>Constater l'absence des nouvelles données dans le <code>user</code>.</li>
</ol>
</li>
<li id="fillsave" data-video="xdWYNS6du-Y">
<h2>La sauvegarde du user</h2>
<ol>
<li>Dans le <cite>model</cite> <code class="fichier">User.php</code>, ajouter les noms des champs dans la propriété <code>fillable</code>.
<div class="bloccode php copiable">
<div><samp>protected $fillable = [</samp></div>
<div> 'nom',</div>
<div> 'prenom',</div>
<div> 'name',</div>
<div> 'password',</div>
<div> 'email',</div>
<div> 'tel',</div>
<div> 'adresse',</div>
<div> 'ville',</div>
<div> 'province',</div>
<div> 'codepostal',</div>
<div> 'citation',</div>
<div><samp>];</samp></div>
</div>
</li>
<li>Tester et constater le résultat.</li>
<li>Faire sauvegarder le <code>user</code> <code class="php copiable">$user->save();</code> et constater l'erreur.</li>
<li>Réessayer avec le mot de passe dans le formulaire.</li>
</ol>
</li>
<li id="redirection" data-video="zHQ4YKiyeWU">
<h2>La redirection</h2>
<ol>
<li>Dans l'action <span class="controller">UserController@store</span> ajouter la redirection. <code class="php copiable">return redirect()->action("UserController@show", $user);</code></li>
<li>Tester avec un nouveau <code>user</code>.</li>
</ol>
</li>
<li id="editdestroy" data-video="_jE2CA_rWg4">
<h2>La modification et la suppression</h2>
<ol>
<li>Utiliser l'étape terminée pour voir les changements apportés.</li>
<li>Tester la modification et la suppression dans le fureteur.</li>
<li>Regarder la <cite>view</cite> <span class="view">users.show</span>. Deux liens ont été ajoutés.
<div class="bloccode blade copiable">
<div><p></div>
<div> <a href="{{action('UserController@edit', $user)}}"></div>
<div> Modifier</div>
<div> </a></div>
<div> |</div>
<div> <a</div>
<div> href="{{action('UserController@destroy', $user)}}"</div>
<div> onclick="return confirm('Voulez-vous vraiment supprimer cet usager?')"</div>
<div> ></div>
<div> Supprimer</div>
<div> </a></div>
<div></p></div>
</div>
</li>
<li>Analyser les 3 routes ajoutées.
<div class="bloccode php copiable">
<div>Route::get('/users/{user}/edit', "UserController@edit")</div>
<div> ->where('user', '[0-9]+');</div>
<div>Route::post('/users/{user}/edit', "UserController@update")</div>
<div> ->where('user', '[0-9]+');</div>
<div>Route::get('/users/{user}/destroy', "UserController@destroy")</div>
<div> ->where('user', '[0-9]+');</div>
</div>
</li>
<li>Examiner les 3 méthodes correspondantes du controller <span class="controller">UserController</span>.
<div class="bloccode php copiable">
<div><samp>public function edit(<b>User $user</b>)</samp></div>
<div><samp>{</samp></div>
<div>return view("users.edit", ['user'=>$user]);</div>
<div><samp>}</samp></div>
</div>
<div class="bloccode php copiable">
<div><samp>public function update(Request $request, <b>User $user</b>)</samp></div>
<div><samp>{</samp></div>
<div> $donnees = $request->except(['password']);</div>
<div> if ($request->get('password')) {</div>
<div> $user->password = $request->get('password');</div>
<div> }</div>
<div> $user->fill($donnees);</div>
<div> $user->save();</div>
<div> return redirect()</div>
<div> ->action('UserController@show', $user);</div>
<div><samp>}</samp></div>
</div>
<div class="bloccode php copiable">
<div><samp>public function destroy(<b>User $user</b>)</samp></div>
<div><samp>{</samp></div>
<div> // Temporaire : si on n'a pas fait les liaisons entre les tables</div>
<div> \App\Post::where('user_id', $user->id)->delete();</div>
<div> </div>
<div> // Quand les liaisons sont faites</div>
<div> // $user->posts()->delete();</div>
<div> </div>
<div> $user->delete();</div>
<div> return redirect()</div>
<div> ->action('UserController@index');</div>
<div><samp>}</samp></div>
</div>
</li>
<li>Constater la modification de la <cite>view</cite> <span class="view">users.create</span> et la création de la <cite>view</cite> <span class="view">users.edit</span>, dont voici le contenu :
<div class="bloccode blade copiable">
<div>@extends('interface.index')</div>
<div>@section('contenu')</div>
<div> <h2>Modifier un usager</h2></div>
<div> @include('users.form')</div>
<div>@endsection</div>
</div>
</li>
<li>Tester!</li>
</ol>
</li>
</ol>
</div>
</div>
</body>
</html>