-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathapprentice.html
More file actions
481 lines (449 loc) · 50.4 KB
/
apprentice.html
File metadata and controls
481 lines (449 loc) · 50.4 KB
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
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Job Training</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="lib/js/jquery.min.js"></script>
<script src="lib/js/popper.min.js"></script>
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.1/css/all.css"
integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous">
<link rel="stylesheet" type="text/css" media="screen" href="lib/css/bootstrap.min.css" />
<link rel="stylesheet" type="text/css" media="screen" href="lib/css/index.css" />
<link rel="shortcut icon" href="pic/logoss.png" type="image/png">
<script src="lib/js/bootstrap.min.js"></script>
<script src="lib/js/index2.js"></script>
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<script>
(adsbygoogle = window.adsbygoogle || []).push({
google_ad_client: "ca-pub-8959892848914975",
enable_page_level_ads: true
});
</script>
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-default fixed-top">
<a class="navbar-brand" href="index.html"><img src="pic/logos.png" width="90" height="35"></img></a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#myNavbar"
aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"><img src="pic/Ei-navicon.png" width="64" height="28"></span>
</button>
<div class="collapse navbar-collapse" id="myNavbar">
<ul class="navbar-nav mr-auto navbar-right">
<li class="nav-item">
<a href="index.html" class="nav-link">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="About-me.html">About me</a>
</li>
<li class="nav-item">
<a class="nav-link" href="programmer.html">What is Programmer</a>
</li>
<li class="nav-item active">
<a class="nav-link" href="#">Job Training</a>
</li>
<li class="nav-item">
<a class="nav-link" href="by-the-time.html">กว่าจะมาเป็นเว็บนี้</a>
</li>
</ul>
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a href="reference.html" class="nav-link">References</a>
</li>
</ul>
</div>
</nav>
<div class="jumbotron text-center jumbotron-fluid">
<h1>Job Training</h1>
<p id="prompt">ประสบการณ์การฝึกงานในบริษัทจริง</p>
</div>
<div class="container-fluid">
<div class="row slideanim">
<div class="col-sm-2">
</div>
<div class="col-sm-8">
<h2>ประสบการณ์การฝึกงานครั้งแรก</h2>
<p>ผมได้รับโอกาสในการไปฝึกงาน หรือไปเป็นเงาตามงานของอาชีพที่ตนเองสนใจจากการเรียนวิชาโตก่อนโตในช่วง ม.3
ทำให้ได้เห็นหลายสิ่งหลายอย่างเกี่ยวกับอาชีพนั้น ทั้งสิ่งที่รู้อยู่แล้ว
และได้เรียนรู้สิ่งใหม่ๆไม่น้อย บริษัทที่ผมได้ไปฝึกงานก็คือบริษัท SCAP Solutions Co. Ltd.
บริษัทนี้ทำเกี่ยวกับ Web Application ให้กับหน่วยงานต่าง ๆทั่วประเทศ ทั้งรัฐและเอกชน อย่างโรงพยาบาล
หรือธนาคารใหญ่ๆอย่าง CIMB จริงๆแล้วบริษัทในเครือนี้มีอยู่ทั้งหมดสองบริษัท เป็นบริษัทพี่น้องกัน
นั่นก็คือบริษัท SCAP Solutions และ ASAP Solutions ในส่วนของ ASAP จะเก่งเรื่องฐานข้อมูล ขณะเดียวกัน
SCAP ก็จะเก่งเรื่องซอฟต์แวร์ ดังนั้นทั้งสองบริษัทนี้ก็จะคอยช่วยเหลือกันบ่อย ๆ
ในเวลาที่อีกฝั่งทำไม่ได้ บางครั้งก็จะร่วมงานด้วยกัน</p>
<p>
หลายๆคนคงจะคิดสงสัยว่า พวกเนิร์ด ๆ อย่างโปรแกรมเมอร์
คงจะนั่งทำงานอย่างจริงจังอยู่หน้าจอคอมพิวเตอร์อยู่ตลอดเวลา ไม่พูดไม่จากับใคร
นั่นเป็นภาพที่คนส่วนใหญ่คิดเกี่ยวกับอาชีพด้านนี้</p>
<p>
ผมขอบอกไว้ก่อนเลยนะครับ ว่าที่ที่ผมไป <i>มันไม่ใช่อย่างนั้น!</i>
จากประสบการณ์ทำงานของผมที่บริษัทเล็ก ๆ
แห่งนี้ แสดงให้เห็นว่า ที่ทำงานแห่งนี้เต็มไปด้วยความเป็นมิตร ความเป็นกันเองของพี่ๆทุกคน เอาจริง ๆ
แล้วมันก็เหมือนๆพนักงานบริษัททั่วไปแหละครับ มีการคุยเล่นกัน หยอกกันขำๆ ขนาดผู้อาวุโสบางคนยังตลกเลย
จริงอยู่ครับที่ในบางเวลาก็จะมีช่วงจริงจังกันบ้างแต่ก็ไม่ได้ถึงขั้นก้มหน้าก้มตาอยู่คนเดียว
ทุกคนจะคอยช่วยเหลือกันอยู่เสมอ ช่วงเย็นๆเวลาเลิกงานร่วมวงเล่นไพ่กันก็มี(UNO)
ที่นี่เป็นที่ที่ผมคิดว่า
เป็นที่ที่เกิดรอยยิ้มและเสียงหัวเราะได้ตลอดเวลาเลยล่ะครับ</p><br>
<img src="pic/SCAP map.jpg" alt="SCAP Map" width="80%" class="mx-auto d-block">
</div>
<div class="col-sm-2">
</div>
</div>
</div>
<div class="container-fluid">
<div class="row slideanim">
<div class="col-sm-2">
</div>
<div class="col-sm-8">
<h2>วันที่ 1</h2>
<p>
วันนี้เป็นวันแรกของการฝึกงาน เป็นวันที่ผมต้องตื่นเช้าหลังจากที่หลับสบายมาหลายวัน…
ซึ่งนั่นเป็นอย่างหนึ่งที่ทำให้ผมขี้เกียจออกไปฝึกงาน แต่สุดท้ายแล้วผมก็ต้องตื่นมาประมาณ 6 โมงเช้า
ออกจากบ้านประมาณ 7 โมงครึ่ง และมันจะเป็นอย่างนั้นในวันต่อ ๆ ไป</p> <br />
<p>แม่ผมบอกว่าจะพาผมไปส่งที่สถานี BTS ราชเทวีแล้วให้ผมต่อไปพญาไท
โชคดีที่มันเป็นทางผ่านไปที่ทำงานของแม่พอดีก็เลยมาส่งถึงแค่นี้ได้ นี่จึงเป็นเหตุผลที่ผมนั่ง BTS
แค่สถานีเดียว วันแรกในการฝึกงานผมรู้สึกตื่นเต้นมากนะ อยากรู้ว่าพี่ ๆ เค้าจะเป็นคนยังไง
ทำงานอะไรกันแล้วเราจะเข้ากับมันได้ไหม ผมจัดการนั่งรถไฟฟ้าไปยังสถานีพญาไทและออกตามหาออฟฟิศของผม
(ฟังดูยิ่งใหญ่นะ แต่ไม่ขนาดนั้น) แต่ก็นั่นแหละ มันเป็นวันแรก ผมจึงไม่ค่อยแน่ใจว่ามาถูกทางหรือเปล่า
แต่เดินไปเรื่อย ๆ ก็เจอมันจนได้</p><br />
<p>ผมไปถึงที่ทำงานในเวลา 8.30 น. และพบว่าพี่ๆยังมากันแค่ 3 คน หลังจากนั้นเราก็ทำความรู้จักกัน
ซึ่งพี่คนนึงเป็นคนที่เคยคุยโทรศัพท์กับผมตอนโทรไปติดต่อ
ผมตั้งกฎกับตัวเองไว้ว่าเวลาฝึกงานห้ามเล่นโทรศัพท์ โทรศัพท์ของผมจึงไม่มีการต่ออินเตอร์เน็ตเลย
ทำได้แค่การโทรและรับสาย…แต่มันก็เป็นการฝึกตัวเองของผมครับ ที่ต้องทำอะไรแค่นี้ให้ได้
เพื่อจะได้รับความรู้ให้มากที่สุด</p><br />
<img src="pic/environment.jpg" alt="environment" width="100%"><br><br>
<i>
<p class="text-center">สภาพแวดล้อมของบริษัท</p>
</i><br>
<p>ในวันแรกผมได้พบกับคุณอาวุฒิ ซึ่งเป็นผู้บริหารของบริษัท อาเค้าก็ทำการ Brief ว่าเราทำอะไรกันบ้าง
มีตำแหน่งอะไร ในโปรเจกต์หนึ่งต้องมีอะไรบ้าง ผมพอจะสรุปได้มาตามนี้ครับ
ว่าในหนึ่งโปรเจกต์ต้องมีเอกสารอะไรบ้าง</p><br />
<div class="prompt">
<b>
<p>1. Project Plan
</b> – แผนของโปรเจกต์นี้คืออะไร</p>
<b>
<p>2. User requirement specification
</b> - เหมือนกับการยืนยันของลูกค้าว่าต้องการอะไร</p>
<b>
<p>3. Software Design
</b>- ออกแบบซอฟต์แวร์</p>
<div style="text-indent: 3.5em;">
<p>- E/R Diagram</p>
<p>- Program Spec</p>
<p>- Data Dictionary</p>
<p>- Prototype</p>
</div>
<b>
<p>4. Test Report</p>
</b>
<b>
<p>5. User Manual
</b> - คู่มือการใช้งานของส่วนลูกค้า</p>
<b>
<p>6. IT Manual
</b> - คู่มือสำหรับ Developer</p> <br />
<p>หลังจากนั้นพี่อีกคนจึงได้รับหน้าที่มาดูแลผม แต่ยังไม่ใช่โปรแกรมเมอร์แต่เป็น System Engineer
ผมก็ได้เรียนรู้เกี่ยวกับระบบต่าง ๆ ที่ดูค่อนข้างลึกเกี่ยวกับ Network พี่เค้าให้ลองทำเกี่ยวกับการ
ping เครื่องคอมพิวเตอร์ คือการตรวจสอบว่าเครื่อง 2 เครื่องมันติดต่อกันได้ไหมในเครือข่ายเดียวกัน
เครื่องทุกเครื่องจะมี IP เป็นเหมือนหมายเลขเฉพาะ และแต่ละเครื่องจะหมายเลขไม่ซ้ำกันเลย
การที่จะติดต่อกันได้ก็ต้องเชื่อมต่ออยู่กับเครือข่ายเดียวกัน เช่น Wi-Fi เป็นต้น
นอกจากนี้ผมก็ได้เรียนรู้จักกับโปรแกรม Virtual Box
หรือโปรแกรมจำลองว่าเรามีคอมอีกเครื่องและได้ลองลง Windows และโปรแกรมหลายอย่างที่ต้องใช้ในการต่อ ๆ
ไป</p><br />
<p>ได้มาในวันนี้คร่าวๆแล้ว ผมก็คิดว่า ใครเป็นคนบอกกันว่าโปรแกรมเมอร์จะไม่สนอะไรใครเลย
เพราะทุกคนในออฟฟิศก็คุยกันอย่างเป็นมิตรเหมือนกับคนทั่ว ๆ ไป อาจจะมีบ้างที่มีเวลาจริงจัง
แต่เวลาไม่จริงจังก็ไม่มีอะไรแปลกเลย</p><br>
<img src="pic/Day1.jpg" alt="Day1" width="100%" class="mx-auto d-block">
</div>
</div>
<div class="col-sm-2">
</div>
</div>
</div>
<div class="container-fluid">
<div class="row slideanim">
<div class="col-sm-2">
</div>
<div class="col-sm-8">
<h2>วันที่ 2</h2>
<p>
ผมเริ่มรู้สึกสนุกที่ได้มาที่นี่ วันนี้เป็นวันแรกที่ผมได้มานั่งอยู่กับโปรแกรมเมอร์จริง ๆ
วันก่อนผมให้พี่ดูว่าผมเคยทำผลงานอะไรมาบ้าง ซึ่งก็คือเว็บ HTML ที่ผมเคยเขียน
พี่เค้าบอกผมว่าอันนี้มันเป็นแค่การแสดงผลออกมาเท่านั้น และไม่ได้ Responsive </p><br />
<p>Responsive ก็คือการที่เว็บของเราจะสามารถเข้าดูได้ในผู้ใช้ขนาดหน้าจอที่แตกต่างกัน
เช่นจอคอมพิวเตอร์ไม่เล็กเท่าจอโทรศัพท์ การแสดงผลที่ออกมาก็จะได้ต่างกัน ซึ่งถ้าเว็บไม่ Responsive
เวลาคนเข้าดูมันก็จะเละไปเลย ในวันนี้พี่เค้าจึงให้ผมทำแบบฟอร์มฟอร์มหนึ่ง ที่ใช้ Bootstrap แทน HTML
เพราะ Bootstrap ทำให้เว็บสวยงามขึ้น และที่สำคัญคือ Responsive พี่เค้าบอก concept
ง่ายๆของเว็บว่าประกอบด้วยอะไรบ้าง หลังจากจบแล้วก็บอกให้ลงมือทำเลย ตอนแรกผมก็คิดว่าพี่เค้าล้อเล่น
เพราะยังไม่ได้สอนอะไรเลย แต่พี่เค้าให้ทำจริง ๆ โดยให้เราไปหาข้อมูลเองว่าต้องทำยังไง
นั่นก็เป็นการสอนแบบพี่นพครับ ซึ่งมันก็ใช้ได้ผลจริง ๆ </p><br />
<p>หลังจากที่ผมลองทำอยู่ค่อนข้างนาน ในที่สุดมันก็ได้ผล แต่ก็มีปัญหาเล็กน้อย เช่น กล่องไม่ตรงกันบ้าง
ฟอร์มเละ อะไรประมาณนี้แต่ผมให้พี่ ๆ ดูว่าทำได้แล้ว พี่ ๆ เค้าก็คอยช่วย สาเหตุที่ Bootstrap มัน
Responsive ก็เพราะว่ามันใช้ Grid system หรือแบ่งหน้าเว็บให้มีทั้งหมด 12 Column เวลาเราเขียนโค้ด
สมมติอยากให้ที่ใส่ข้อมูลมมีพื้นที่ครึ่งหน้า ก็เขียนเป็น col-sm-6 หรือ 1 ส่วน 4 ของหน้าก็เขียนเป็น
col-sm-3 นั่นเองครับ</p><br />
<p>สิ่งใหม่จริง ๆ เลยที่ผมได้เรียนรู้ในวันนี้ก็คือ การลงมือทำด้วยตัวเองครับ
สำหรับผมการเรียนรู้ด้วยการลงมือทำจะทำให้เรียนรู้ได้ดีที่สุด และการสอนของพี่นพก็ทำให้ผมได้ใช้สิ่งนั้น
นอกจากนี้ ยังไม่ไปรบกวนการทำงานของพี่เค้าเกินไปด้วยครับ</p><br />
<img src="pic/bootstrap.png" alt="Bootstrap" width="100%">
</div>
<div class="col-sm-2">
</div>
</div>
</div>
<div class="container-fluid">
<div class="row slideanim">
<div class="col-sm-2">
</div>
<div class="col-sm-8">
<h2>วันที่ 3</h2>
<p>วันนี้ผมมาเช้ากว่าปกติเล็กน้อย เพราะแม่ต้องออกจากบ้านเช้า แต่ก็เหมือนเคย วันนี้ผมได้รับโจทย์ใหม่
ไม่ใช่แค่การเขียนโค้ดออกมาแสดงผลแล้ว แต่เป็นการมีการกระทำของผู้ใช้แล้วส่งข้อมูลที่กรอกไป
เพียงแค่ยังไม่ได้เก็บลงฐานข้อมูล</p><br />
<img src="pic/Day3.png" alt="day3" width="100%"><br>
<i>
<p class="text-center">สภาพเว็บของผมในตอนนี้</p>
</i><br>
<p>พี่เค้าให้ผมได้ทำความรู้จักกับ Ajax jQuery เขียนเป็นภาษา JavaScript
เพื่อทำการเก็บข้อมูลที่ถูกกรอกลงในฟอร์ม ปกติแล้วการกด Submit form จะทำให้หน้าเว็บของเรารีเฟรช
และข้อมูลที่เราใส่ไว้ก็จะหายไปแต่เก็บลงไปในฐานข้อมูลแล้ว การใช้ Ajax
มาช่วยจะทำให้หน้าเว็บไม่รีเฟรชแต่ยังคงเก็บข้อมูลเหมือนเดิม
ซึ่งเราเรียกการเขียนโค้ดนี้ที่จะทำให้เกิดการตอบสนองกับผู้ใช้ว่า Controller ก็เหมือนเดิมครับ
พี่เค้าบอกโครงสร้างของมันหน้าที่ของมันและให้ผมลงมือหาข้อมูลและทำเองต่อไปจนผมทำได้</p><br />
<img src="pic/eclipse_1LFdZSdSJU.png" alt="code" width="100%"><br><br>
<i>
<p class="text-center">Code ของ Ajax jQuery</p>
</i>
</div>
<div class="col-sm-2">
</div>
</div>
</div>
<div class="container-fluid">
<div class="row slideanim">
<div class="col-sm-2">
</div>
<div class="col-sm-8">
<h2>วันที่ 4</h2>
<p>วันนี้เป็นวันพิเศษ เพราะผมจะได้ออกมาจากออฟฟิศหนึ่งวัน และผมจะได้ไปเรียนรู้เกี่ยวกับอาชีพ DBA
หรือเป็นอาชีพสายฐานข้อมูลนั่นเอง ผมมีนัดเวลา 9 โมงตรงผมจึงพยายามไปให้ถึงก่อนและรอจนพี่เค้ามาถึง</p>
<br>
<p>วันนี้ผมอยู่ที่ธนาคาร CIMB สำนักงานใหญ่ เหมือนกับว่าพี่ๆเค้ามาเป็น Outsource
ให้กับที่นี่เพื่อเป็นผู้ดูแลการย้ายฐานข้อมูล พี่ ๆ ที่นี่มีอยู่ไม่กี่คนที่ผมได้พบ คือ พี่ปัท
พี่หน่อง และพี่ชินครับ นี่คือข้อมูลคร่าวๆของที่ผมได้ทำการสัมภาษณ์พี่ปัทและพี่หน่องมา </p><br />
<div style="text-indent: 2.5em;">
<p>
<b>ชื่อ </b>
ปัทมาพร จิตขจรไพศาล (พี่ปัท)
</p>
<p>
<b>ประวัติการศึกษา </b>
ปริญญาตรีคอมพิวเตอร์ธุรกิจ มหาวิทยาลัยสงขลานครินทร์
</p> <br />
<p><b>ชื่อ </b>ธรรมรักษ์ แย้มมณฑา (พี่หน่อง)</p>
<p><b>ประวัติการศึกษา </b>ปริญญาตรีเทคโนโลยีสารสนเทศและการสื่อสาร สาขาเทคโนโลยีสารสนเทศธุรกิจ</p>
<p><b>ประวัติการทำงาน </b>Software Engineer บริษัท Exzy จำกัด และ DBA ที่ ASAP Solutions จำกัด</p>
<br />
</div>
<div class="row">
<div class="col-sm-6">
<img src="pic/DBA1.jpg" alt="DBA1" width="100%" class="mx-auto d-block">
</div>
<div class="col-sm-6">
<img src="pic/DBA2.jpg" alt="DBA2" width="100%" class="mx-auto d-block">
</div>
</div><br>
<i>
<p class="text-center">สภาพห้องทำงานที่นั่น</p>
</i><br>
<p>พี่ปัทเป็นผู้หญิง พี่หน่องและพี่ชินเป็นผู้ชาย ผมจะคุยกับพี่หน่องถูกคอหน่อยเพราะเล่นเกมเหมือนกัน
พี่เค้าก็เล่นมาตั้งแต่เด็ก ๆ และคงจะเป็นแรงบันดาลใจให้มันทำอาชีพพวกนี้ด้วย
ในช่วงเช้าผมก็ไม่ค่อยได้ทำอะไรมาก ในช่วงบ่ายพี่ชินก็เข้ามาที่ทำงานและสอนผมเกี่ยวกับระบบฐานข้อมูล
นี่เป็นประเด็นส่วนใหญ่ครับ</p><br />
<div style="text-indent: 2.5em;">
<p>- หน้าที่ของพี่ๆเค้าก็คือการย้ายข้อมูลจากฐานข้อมูลเก่าไปฐานข้อมูลใหม่ และทำมาเป็นหลายเดือนแล้ว
ที่ต้องใช้เวลานานก็เพราะว่าเป็นการทดสอบว่าระหว่างย้ายจะมีข้อผิดพลาดอะไรไหม
เวลาย้ายจริงจะได้มีข้อผิดพลาดมากที่สุด</p>
<p>- ห้องเก็บฐานข้อมูลทำงานอยู่ตลอดเวลา จึงต้องมีอุณหภูมิที่เย็น เพราะจะเกิดความร้อนอยู่ตลอดเวลา
ห้องจะเป็นระบบที่ทำให้อากาศวนไปเป็นเหมือนวัฏจักร</p>
<p>- ฐานข้อมูลจำเป็นต้องมีมากกว่าหนึ่งเสมอ เพราะอีกเครื่องอาจจะพังได้ตลอดเวลา</p>
<p>- ห้องฐานข้อมูลห้ามมีฝุ่นเข้าไปเด็ดขาด</p><br />
</div>
<p>ผมลองถามพี่เค้าว่า เวลาไม่ได้ทำงานแล้วทำอะไร พี่ชินก็ตอบว่าชอบไปเดินป่า อยู่กับธรรมชาติ
เพราะเราอยู่หน้าจอคอมมาทั้งวันแล้ว เวลาไม่ได้ทำงานก็อยากทำอย่างอื่นบ้าง
ผมคิดว่างานนี้เป็นงานที่น่าเบื่อเล็กน้อยสำหรับผม แต่ก็เป็นประสบการณ์ที่ดีในการมาครับ</p>
</div>
<div class="col-sm-2">
</div>
</div>
</div>
<div class="container-fluid">
<div class="row slideanim">
<div class="col-sm-2">
</div>
<div class="col-sm-8">
<h2>วันที่ 5</h2>
<p>วันนี้เป็นวันที่ผมต้องรีบตัดสินใจแล้วว่าจะมาต่อหรือไม่
เพราะโรงเรียนกำหนดไว้ให้แค่อาทิตย์เดียวเท่านั้น ผมคิดว่าอยู่ที่นี่มันก็สนุกดีนะ
อยู่ต่อก็ไม่มีอะไรเสียหายและยังได้ฝึกต่อด้วย สุดท้ายแล้วผมจึงตัดสินใจที่จะอยู่ต่ออีก 4 วันครับ
ความจริงอยากอยู่นานกว่านี้แต่จะไม่มีเวลาทำรายงาน</p><br />
<p>หลังจากที่ได้ไปดูงาน DBA มาเมื่อวาน วันนี้ผมก็ได้ทำเกี่ยวกับฐานข้อมูล แต่ไม่เหมือนกับเมื่อวาน
แต่เป็นการเก็บข้อมูลที่ถูกกรอกใส่ในฐานข้อมูลจริง ๆ การเชื่อมต่อฐานข้อมูลกับเว็บมันค่อนข้างงงสำหรับผม
ต้องเขียนพอร์ต สร้างฐานข้อมูลเยอะแยะไปหมด แต่ถ้าไม่ทำเราจะไปเก็บข้อมูลของลูกค้าได้ยังไง
ความจริงการเขียนโค้ดหลาย ๆ อย่างก็ต้อง Import Library ก่อนไม่งั้นโค้ดจะไปสามารถทำงานได้
การเชื่อมต่อฐานข้อมูลก็เหมือนกัน มันต้องลงอะไรเยอะแยะ โปรแกรมฐานข้อมูลที่ผมมได้ใช้คือ SQL Server
2014 แต่ก็ไม่ได้ทำอะไรมาก แค่สร้าง Table แล้วให้ใส่ข้อมูลลงมาได้ สรุปการทำงานของเว็บไซต์ที่ผมได้ทำมา
มีหลายส่วนดังนี้ครับ</p><br />
<div style="text-indent:2.5em;">
<p>1. หน้าจอแบบฟอร์มของเรา เป็น HTML bootstrap</p>
<p>2. JavaScript ที่เมื่อผู้ใช้กดปุ่มแล้วจะตอบสนองไปยังส่วนต่อไปคือ Controller ส่วนนี้เรียกว่า
Action</p>
<p>3. JavaScript ไปเรียก Controller มาซึ่งทำหน้าทีประมวลผล</p>
<p>4. Controller ส่งต่อไปยังไฟล์ที่เราใช้ในการเก็บลงฐานข้อมูลและบันทึกลงในฐานข้อมูลในที่สุด</p><br>
</div>
<div class="row">
<div class="col-sm-6">
<img src="pic/ConnectDB.png" alt="Connect Database" width="100%">
</div>
<div class="col-sm-6">
<img src="pic/Table.png" alt="Table" width="100%">
</div>
</div>
</div>
<div class="col-sm-2">
</div>
</div>
</div>
<div class="container-fluid">
<div class="row slideanim">
<div class="col-sm-2">
</div>
<div class="col-sm-8">
<h2>วันที่ 6</h2>
<p>หลังจากที่ได้นอนหลับไม่ต้องตื่นเช้าไปสองสามวันผมก็ต้องลุกขึ้นมาและเตรียมตัวไปออฟฟิศอีก
คิดว่า…คิดถูกไหมเนี่ยที่เลือกมาทำต่อที่นี่ เริ่มจะขี้เกียจไปแล้ว (ฮ่าๆๆ)
ครั้งก่อนผมได้รับโจทย์ในการเก็บข้อมูลจากหน้าเว็บลง Database ไปแล้ว
ครั้งนี้ผมจึงได้รับโจทย์ที่กลับกัน นั่นก็คือการนำข้อมูลจาก Database มาแสดงออกมาในหน้าเว็บ
ผมได้รับโจทย์นี้เป็นการบ้านช่วงวันหยุดก่อนจะมาฝึกต่อที่นี่ ผมทำได้แค่ระดับหนึ่ง
นั่นก็คือไปดึงข้อมูลออกมาได้ แต่ทำให้แสดงออกมาหน้าเว็บไม่ได้…เพราะผมไม่รู้วิธีทำจริง ๆว่าต้องทำยังไง
วันนี้พี่ๆก็มาช่วยอีกแล้ว มีหลายเรื่องที่ผมยังไม่รู้ ซึ่งนั่นเป็นปัญหาในการทำงาน</p><br />
<p>การที่จะนำข้อมูลออกมาแสดงผลได้ต้องแปลงมันเป็น JSON ก่อนสำหรับวิธีที่พี่เค้าบอกผมนะ ผมเพิ่ม Method
ใหม่เข้าไป และพี่นพก็ให้ผมลอกโค้ดอะไรสักอย่างที่พี่เค้าเคยเขียนไว้ เหมือนกับเป็นโค้ดที่ตอบสนอง
รับข้อมูลจากผู้ใช้ ใกล้จะหมดวันในที่สุดผมก็ทำสำเร็จ แต่ผมทำคนเดียวมันก็จะไม่เสร็จแน่ ๆ
ต้องขอขอบคุณพี่ ๆ หลายคนที่ทั้งช่วย ทั้งสอนผมครับ เวลาพี่ ๆ เค้าทำงานกันเองก็เหมือนกัน
ถ้ามีใครทำอะไรไม่ได้ก็จะเข้าไปช่วย</p><br />
<p>Frontend ก็คือส่วนของเว็บของเรา Action และ Controller ของเรา ส่วน Backend ก็เป็นส่วนในด่นของฐานข้อมูล
ถ้าจะให้บอกว่าสิ่งที่ผมได้ทำไปคืออะไร ก็น่าจะเป็นการส่งข้อมูลไป-มาระหว่างโปรแกรมทาง Frontend และ
Backend ครับ ซึ่งใช้เวลาค่อนข้างนานเลยทีเดียวกว่าจะเข้าใจ</p>
</div>
<div class="col-sm-2">
</div>
</div>
</div>
<div class="container-fluid">
<div class="row slideanim">
<div class="col-sm-2">
</div>
<div class="col-sm-8">
<h2>วันที่ 7</h2>
<p>วันที่ 7 ของการมาฝึกงานของผม ผมได้รับโจทย์ใหม่อีกตามเคย คราวนี้เป็นโจทย์ที่ค่อนข้างใหญ่
คือผมต้องสร้างเหมือนเพจ Log in และทำให้มันติดต่อกับฐานข้อมูล ถ้าชื่อที่ใส่มีอยู่จริง
ก็จะให้เข้าไปหน้าแรกที่ผมเคยสร้างมา โจทย์มีอยู่แค่นี้เลยครับ
พอพี่นพพูดจบก็ให้ผมทำความเข้าใจเล็กน้อยและหันไปทำงานต่อ…</p><br />
<p>ผมลองคิดเป็นผังคร่าว ๆ ดูว่าการทำครั้งนี้จำเป็นต้องสร้างอะไรใหม่บ้าง
อันดับแรกที่ผมทำเลยก็คือสร้างเว็บก่อน เพราะเป็นสิ่งที่ผมมถนัดสุดแล้ว
การสร้างใหม่ก็ไม่ยากเพราะต้องมีแค่ช่องใส่ชื่อ 2 ช่องและปุ่มกด Log in
ผมทำอยู่ไม่นานและจัดการสร้างไฟล์อื่น ๆ ต่อ การดำเนินการต่อไปก็ไม่ยากมาก เพราะเคยทำมาแล้ว
แต่มีปัญหาบางอย่างเกิดขึ้น ก็คือ server ที่ผมลงไว้มัน error ด้วยเหตุผลอะไรก็ไม่รู้
ผมพยายามแก้อยู่นานแต่ก็งงมาก ต้องลองลบ Project แล้วก็ใส่เข้าไปใหม่แต่มันก็ยังไม่หาย
สุดท้ายจึงได้รู้ว่าไฟล์ที่ผมสร้างอันนึงมันไปซ้ำกับอันที่มีอยู่แล้ว ทำให้มัน error พอผมลบไป
มันก็หายทันที</p><br />
<img src="pic/login.png" alt="login" width="100%"><br>
<i>
<p class="text-center">หน้าตาของเพจ Log in</p>
</i><br>
<p>ในการทำครั้งนี้ผมยังทำได้เท่านี้ เพราะพี่ ๆ เค้ามีประชุมกันก่อน ผมจึงได้เข้าร่วมประชุมด้วย
ผมก็ได้เห็นบรรยากาศการคุยกันของพี่เค้า ได้รู้ว่าก่อนที่เราจะมาเขียนโปรแกรมต้องทำอะไรก่อนบ้าง
ต้องวางแผน วิเคราะห์อีกว่าลูกค้าต้องการอะไร ทำไม ซึ่งเนื้อหาส่วนใหญ่ผมก็ไม่ค่อยเข้าใจ
เพราะจะเป็นศัพท์ลึก ๆ ที่พี่เค้าเคยคุยกับลูกค้ามาแล้ว แต่ประเด็นของการประชุมนี้ก็คือ การทำความเข้าใจ
มอบหมายหน้าที่ต่าง ๆ ให้กับแต่ละคนครับ</p><br>
<img src="pic/meet.jpg" alt="meet" width="50%" class="mx-auto d-block"><br>
<i>
<p class="text-center">เข้าร่วมการประชุม</p>
</i>
</div>
<div class="col-sm-2">
</div>
</div>
</div>
<div class="container-fluid">
<div class="row slideanim">
<div class="col-sm-2">
</div>
<div class="col-sm-8">
<h2>วันที่ 8</h2>
<p>วันนี้ผมได้มาทำงานที่ค้างว่าตั้งแต่เมื่อวาน พี่นพสอนเพิ่มเติมเรื่องการ return
ข้อมูลเมื่อผมนำงานที่ทำเสร็จแล้วไปให้ดู การ return จะช่วยให้โปรแกรมดูว่าชื่อไหนสมัครไปแล้ว
อันไหนยังไม่สมัครสำหรับงานที่ผมกำลังทำอยู่</p><br />
<p>ปัญหาความติดขัดของผมในวันนี้ก็คือ ช่องใส่ชื่อของผมมี 2 ช่อง ได้แก่ชื่อจริงและนามสกุล
ผมทำได้ถึงแค่ให้มันตรวจสอบชื่อชื่อเดียวถ้ามีก็เข้าไปได้เลย ไม่สามารถให้มันใส่รวมกันแล้วเข้าไปได้
คือใส่ชื่อจริงถูกอย่างเดียวก็ผ่าน แต่ถ้าใส่ชื่อจริงถูก แต่นามสกุลไม่ถูก ก็ผ่านอยู่ดี
ทำให้ผมต้องการความช่วยเหลือจากพี่นพอีกรอบ</p><br />
<p>ความจริงผมมาถูกทางแล้ว เขียนอีกแค่นิดเดียวมันก็ได้ แต่ด้วยความรู้ด้านภาษา Java ที่ผมไม่มีพื้นฐาน
ซึ่งต้องใช้เวลาในการทำความเข้าใจ ผมจึงไม่สามารถทำต่อได้ แต่สิ่งที่ต้องเติมเข้าไปก็นิดเดียวเองครับ
แค่คำสองคำโค้ดก็ทำงานได้แล้ว แต่ในที่สุดผมก็ทำมันจนเสร็จอีกจนได้</p><br />
<p>อีกเรื่องที่ผมได้ลองทำครั้งนี้ก็คือ การ Export Project เพื่อนำไปทำงานต่อไป เช่นกลับไปทำที่บ้าน ฯลฯ
และเนื่องจากผมทำข้อมูลใน HDD ผมหายจึงไม่ค่อยสมาธิในการทำงานมาก เพราะมีความกังวลว่าไฟล์จะหายไปไหม
ซึ่งนั่นทำให้ช่วงหนึ่งของการทำงานวันนั้นไม่มีสมาธิเลยครับ</p>
</div>
<div class="col-sm-2">
</div>
</div>
</div>
<div class="container-fluid">
<div class="row slideanim">
<div class="col-sm-2">
</div>
<div class="col-sm-8">
<h2>วันที่ 9</h2>
<p>วันสุดท้ายของการมาที่นี่ วันสุดท้ายของการฝึกงาน… หากจะถามว่าผมอยากอยู่ต่อไหม ก็ตอบได้เลยว่าอยาก
แต่ด้วยเหตุผล(หลาย)ประการ ทำให้ผมตัดสินใจหยุดแค่นี้
เหตุผลใหญ่ๆเลยก็คือผมต้องการที่จะทำรายงานให้เสร็จ</p><br />
<p>วันนี้ผมไม่ค่อยได้ทำอะไรมาก มันเป็นเหมือนการทบทวนสิ่งที่เคยทำมาทั้งหมด ลง VM Virtual Box ลง Windows
ใหม่ ลงโปรแกรม Database เอง ลง Eclipse และตัว Server ที่ผมเคยใช้
บอกได้เลยว่าถ้าไม่มีวันนี้ผมก็อาจจะกลับมาลงเองที่บ้านไม่ได้ เพราะมันค่อนข้างเยอะ</p><br />
<p>ผมได้รับใบ Certificate มาจากคุณอาวุฒิ เป็นการรับรองว่าเคยมาฝึกงานที่นี่แล้ว ต้องขอบคุณมากครับ
ผมต้องลองแก้ปัญหาที่เกิดขึ้นจากการลงโปรแกรมใหม่ซึ่งมันก็งง ๆ เล็กน้อย
แต่ถ้าเราผ่านขั้นนี้ไปไม่ได้เราก็คงเขียนโปรแกรมไม่ได้ใช่ไหมล่ะครับ ช่วงเย็นผมบอกลาพี่ ๆ
หลายคนที่ที่ทำงาน พี่ ๆ บางคนก็ไม่อยู่ในวันนี้ ผมขอบคุณพี่ ๆ ทุกคนที่ช่วยดูแลผมจนมาถึงวันนี้
และกลับบ้านไปอย่างสบายใจครับ</p><br>
<img src="pic/S__4169780.jpg" alt="ของที่ระลึก" width="100%"><br><br>
<i>
<p class="text-center">มอบของที่ระลึกให้กับพี่นพ</p>
</i><br>
</div>
<div class="col-sm-2">
</div>
</div>
</div>
<!--Footer-->
<div class="container-fluid black" style="padding:30px">
<div class="text-left">
</div>
<div class="text-center">
<a href="https://www.facebook.com/phacharachira" target="_blank" alt="Facebook" title="Facebook"
id="icon"><i class="fab fa-facebook-f"></i></a>
<a href="https://www.youtube.com/channel/UCJz2YaGGNtwkH9-N3VtRaLg" alt="Youtube Channel" target="_blank"
title="Youtube Channel" id="icon"><i class="fab fa-youtube"></i></a>
<a href="http://www.facebook.com/sharer.php?u=https://whatdoesprogrammerdo.000webhostapp.com/index.html"
target="_blank" alt="Share Website" title="Share Website" id="icon"><i class="fas fa-share"></i></a>
<a href="mailto:moddaeng.pps@gmail.com ?Subject=What Does Programmer Do&Body=I%20saw%20this%20and%20thought%20of%20you!%20 https://whatdoesprogrammerdo.000webhostapp.com/index.html"
alt="Email" title="Email" id="icon">
<i class="far fa-envelope"></i>
</a>
</div>
</div>
</body>
</html>