-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
562 lines (521 loc) · 48.9 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
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
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="Description" content="Chananchida Fuachai's personal website for resume. Show my skills, past projects, and contact.">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="manifest" href="manifest.json">
<!-- index id -->
<meta property="og:title" content="Chananchida F.">
<title>Chananchida – résumé</title>
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
<link rel="icon" type="image/png" sizes="32x32" href="resource/img/favicon/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="resource/img/favicon/favicon-16x16.png">
<link rel="manifest" href="site.webmanifest">
<!-- CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css"
integrity="sha384-/Y6pD6FV/Vv2HJnA6t+vslU6fwYXjCFtcEpHbNJ0lyAFsXTsjBbfaDjzALeQsN6M" crossorigin="anonymous">
<link href="https://fonts.googleapis.com/css?family=Montserrat:200,400,700" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Varela+Round" rel="stylesheet">
<link rel="stylesheet"
href="https://cdn.rawgit.com/konpa/devicon/df6431e323547add1b4cf45992913f15286456d3/devicon.min.css">
<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/aos.css">
<link rel="stylesheet" href="resource/css/style.css">
<link rel="stylesheet" href="resource/css/logoani.css">
<link rel="stylesheet" href="resource/css/skillcard.css">
</head>
<body>
<!-- Navigation -->
<nav class="navbar navbar-expand-md sidebarNavigation navbar-light fixed-top mx-auto" id="mainNav"
data-sidebarClass="navbar-inverse">
<div class="container">
<a class="navbar-brand" href="index.html">Chananchida F.</a>
<div class="toggle navbar-toggler" data-toggle="collapse" data-target="#navbarResponsive"
aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation"></div>
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav ml-auto">
<li class="nav-item active">
<a class="nav-link" id="atme" href="#me">Me</a>
</li>
<li class="nav-item">
<a class="nav-link" id="exp" href="#experiences">Experiences</a>
</li>
<li class="nav-item">
<a class="nav-link" id="proj" href="#projects">Projects</a>
</li>
<li class="nav-item">
<a class="nav-link" id="cont" href="#contact">Contact</a>
</li>
</ul>
</div>
</div>
</nav>
<header>
<h1 id="header-text"></h1>
</header>
<hr class="separator separator--line" />
<section id="me">
<div class="container">
<div class="row">
<div class="col-lg-10 mx-auto">
<h2 class="secTitle">About me</h2>
<hr class="secTitleline" />
<div class="row item-list">
<div class="col-sm col-lg-4 mx-auto">
<center><img id="mainProfile" src="resource/img/profile.jpg" alt="profile"></center>
</div>
<div class="col-sm col-lg-7 my-auto">
<h2 id="myfullname">Chananchida Fuachai</h2>
<h3 id="myposition">Software Engineer</h3>
<p>You can call me <b>Eye</b>. <br />I am a Software and Knowledge Engineering
student at Kasetsart University. I was passion and interest in programming.
</p>
</div>
<div class="col-sm col-lg-12 mx-auto">
<h2 class="subtitle">SKILLS</h2>
<hr />
<div class="skills">
<div data-aos="zoom-in-up" class="skill-row">
<div class="card-container">
<div class="card">
<svg class="skill-svglogo" viewBox="0 0 128 128">
<path fill="#E44D26" d="M19.037 113.876l-10.005-112.215h109.936l-10.016 112.198-45.019 12.48z"></path><path fill="#F16529" d="M64 116.8l36.378-10.086 8.559-95.878h-44.937z"></path><path fill="#EBEBEB" d="M64 52.455h-18.212l-1.258-14.094h19.47v-13.762h-34.511l.33 3.692 3.382 37.927h30.799zM64 88.198l-.061.017-15.327-4.14-.979-10.975h-13.817l1.928 21.609 28.193 7.826.063-.017z"></path><path fill="#fff" d="M63.952 52.455v13.763h16.947l-1.597 17.849-15.35 4.143v14.319l28.215-7.82.207-2.325 3.234-36.233.335-3.696h-3.708zM63.952 24.599v13.762h33.244l.276-3.092.628-6.978.329-3.692z"></path>
</svg>
<h5>HTML</h5>
<h6>Advanced</h6>
</div>
</div>
<div class="card-container">
<div class="card">
<svg class="skill-svglogo" viewBox="0 0 128 128">
<path fill="#1572B6" d="M18.814 114.123l-10.054-112.771h110.48l-10.064 112.754-45.243 12.543-45.119-12.526z"></path><path fill="#33A9DC" d="M64.001 117.062l36.559-10.136 8.601-96.354h-45.16v106.49z"></path><path fill="#fff" d="M64.001 51.429h18.302l1.264-14.163h-19.566v-13.831h34.681999999999995l-.332 3.711-3.4 38.114h-30.95v-13.831z"></path><path fill="#EBEBEB" d="M64.083 87.349l-.061.018-15.403-4.159-.985-11.031h-13.882l1.937 21.717 28.331 7.863.063-.018v-14.39z"></path><path fill="#fff" d="M81.127 64.675l-1.666 18.522-15.426 4.164v14.39l28.354-7.858.208-2.337 2.406-26.881h-13.876z"></path><path fill="#EBEBEB" d="M64.048 23.435v13.831000000000001h-33.407999999999994l-.277-3.108-.63-7.012-.331-3.711h34.646zM64.001 51.431v13.831000000000001h-15.209l-.277-3.108-.631-7.012-.33-3.711h16.447z"></path>
</svg>
<h5>CSS</h5>
<h6>Advanced</h6>
</div>
</div>
<div class="card-container">
<div class="card">
<svg class="skill-svglogo" viewBox="0 0 128 128">
<path fill="#F0DB4F" d="M1.408 1.408h125.184v125.185h-125.184z"></path><path fill="#323330" d="M116.347 96.736c-.917-5.711-4.641-10.508-15.672-14.981-3.832-1.761-8.104-3.022-9.377-5.926-.452-1.69-.512-2.642-.226-3.665.821-3.32 4.784-4.355 7.925-3.403 2.023.678 3.938 2.237 5.093 4.724 5.402-3.498 5.391-3.475 9.163-5.879-1.381-2.141-2.118-3.129-3.022-4.045-3.249-3.629-7.676-5.498-14.756-5.355l-3.688.477c-3.534.893-6.902 2.748-8.877 5.235-5.926 6.724-4.236 18.492 2.975 23.335 7.104 5.332 17.54 6.545 18.873 11.531 1.297 6.104-4.486 8.08-10.234 7.378-4.236-.881-6.592-3.034-9.139-6.949-4.688 2.713-4.688 2.713-9.508 5.485 1.143 2.499 2.344 3.63 4.26 5.795 9.068 9.198 31.76 8.746 35.83-5.176.165-.478 1.261-3.666.38-8.581zm-46.885-37.793h-11.709l-.048 30.272c0 6.438.333 12.34-.714 14.149-1.713 3.558-6.152 3.117-8.175 2.427-2.059-1.012-3.106-2.451-4.319-4.485-.333-.584-.583-1.036-.667-1.071l-9.52 5.83c1.583 3.249 3.915 6.069 6.902 7.901 4.462 2.678 10.459 3.499 16.731 2.059 4.082-1.189 7.604-3.652 9.448-7.401 2.666-4.915 2.094-10.864 2.07-17.444.06-10.735.001-21.468.001-32.237z"></path>
</svg>
<h5>JavaScript</h5>
<h6>Intermediate</h6>
</div>
</div>
<div class="card-container">
<div class="card">
<i class="devicon-typescript-plain colored skill-fontcard"></i>
<h5>TypeScript</h5>
<h6>Intermediate</h6>
</div>
</div>
<div class="card-container">
<div class="card">
<svg class="skill-svglogo" viewBox="0 0 128 128">
<path fill="#83CD29" d="M112.771 30.334l-44.097-25.605c-2.781-1.584-6.402-1.584-9.205 0l-44.568 25.605c-2.87 1.651-4.901 4.754-4.901 8.073v51.142c0 3.319 2.084 6.423 4.954 8.083l11.775 6.688c5.628 2.772 7.617 2.772 10.178 2.772 8.333 0 13.093-5.039 13.093-13.828v-50.49c0-.713-.371-1.774-1.071-1.774h-5.623c-.712 0-2.306 1.061-2.306 1.773v50.49c0 3.896-3.524 7.773-10.11 4.48l-12.167-7.013c-.424-.23-.723-.693-.723-1.181v-51.142c0-.482.555-.966.982-1.213l44.424-25.561c.415-.235 1.025-.235 1.439 0l43.882 25.555c.42.253.272.722.272 1.219v51.142c0 .488.183.963-.232 1.198l-44.086 25.576c-.378.227-.847.227-1.261 0l-11.307-6.749c-.341-.198-.746-.269-1.073-.086-3.146 1.783-3.726 2.02-6.677 3.043-.726.253-1.797.692.41 1.929l14.798 8.754c1.417.82 3.027 1.246 4.647 1.246 1.642 0 3.25-.426 4.667-1.246l43.885-25.582c2.87-1.672 4.23-4.764 4.23-8.083v-51.142c0-3.319-1.36-6.414-4.229-8.073zM77.91 81.445c-11.726 0-14.309-3.235-15.17-9.066-.1-.628-.633-1.379-1.272-1.379h-5.731c-.709 0-1.279.86-1.279 1.566 0 7.466 4.059 16.512 23.453 16.512 14.039 0 22.088-5.455 22.088-15.109 0-9.572-6.467-12.084-20.082-13.886-13.762-1.819-15.16-2.738-15.16-5.962 0-2.658 1.184-6.203 11.374-6.203 9.105 0 12.461 1.954 13.842 8.091.118.577.645.991 1.24.991h5.754c.354 0 .692-.143.94-.396.24-.272.367-.613.335-.979-.891-10.568-7.912-15.493-22.112-15.493-12.631 0-20.166 5.334-20.166 14.275 0 9.698 7.497 12.378 19.622 13.577 14.505 1.422 15.633 3.542 15.633 6.395 0 4.955-3.978 7.066-13.309 7.066z"></path>
</svg>
<h5>Node.js</h5>
<h6>Intermediate</h6>
</div>
</div>
</div>
<div data-aos="zoom-in-up" class="skill-row">
<div class="card-container">
<div class="card">
<svg class="skill-svglogo" viewBox="0 0 128 128">
<path fill="#0868AC" d="M27.758 20.421c-7.352 10.565-6.437 24.312-.82 35.54l.411.798.263.506.164.291.293.524c.174.307.353.612.536.919l.306.504c.203.326.41.65.622.973l.265.409c.293.437.592.872.901 1.301l.026.033.152.205c.267.368.542.732.821 1.093l.309.393c.249.313.502.623.759.934l.29.346c.345.406.698.812 1.057 1.208l.021.022.041.045c.351.383.71.758 1.075 1.133l.344.347c.282.284.569.563.858.841l.351.334c.387.364.777.722 1.176 1.07l.018.016.205.174c.351.305.708.605 1.068.902l.442.353c.294.235.591.468.89.696l.477.361c.33.243.663.482.999.717l.363.258.101.072c.318.22.645.431.97.642l.42.28c.5.315 1.007.628 1.519.93l.42.237c.377.217.756.431 1.14.639l.631.326.816.424.188.091.334.161c.427.204.858.405 1.293.599l.273.122c.498.218 1.001.427 1.508.628l.368.144c.469.182.945.359 1.423.527l.179.062c.524.184 1.054.353 1.587.52l.383.114c.542.164 1.079.358 1.638.462 35.553 6.483 45.88-21.364 45.88-21.364-8.674 11.3-24.069 14.28-38.656 10.962-.553-.125-1.089-.298-1.628-.456l-.406-.124c-.526-.161-1.049-.33-1.568-.51l-.215-.077c-.465-.164-.924-.336-1.382-.513l-.388-.152c-.501-.198-1-.405-1.492-.62l-.298-.133c-.423-.191-.842-.384-1.259-.585l-.364-.175c-.327-.159-.65-.328-.974-.495l-.649-.341c-.395-.21-.782-.43-1.167-.654l-.394-.219c-.513-.303-1.019-.615-1.52-.932l-.41-.273c-.363-.234-.725-.473-1.081-.719l-.349-.245c-.344-.242-.685-.489-1.022-.738l-.453-.343c-.31-.237-.618-.476-.922-.721l-.411-.33c-.388-.318-.771-.64-1.149-.969l-.126-.105c-.409-.359-.811-.728-1.208-1.098l-.34-.328c-.294-.279-.584-.561-.868-.851l-.34-.34c-.362-.37-.717-.745-1.065-1.126l-.053-.057c-.368-.402-.728-.813-1.08-1.229l-.283-.336c-.263-.316-.523-.638-.777-.961l-.285-.355c-.307-.397-.605-.793-.898-1.195-8.098-11.047-11.008-26.283-4.535-38.795M50.578 11.519c-5.316 7.65-5.028 17.893-.88 25.983.695 1.356 1.477 2.673 2.351 3.925.796 1.143 1.68 2.501 2.737 3.418.383.422.784.834 1.193 1.238l.314.311c.397.385.801.764 1.218 1.132l.05.043.012.012c.462.405.939.794 1.423 1.178l.323.252c.486.372.981.738 1.489 1.087l.043.033.68.447.322.213c.363.233.73.459 1.104.676l.156.092c.322.185.648.367.975.545l.347.18.682.354.103.047c.469.23.941.453 1.424.663l.314.13c.386.163.775.323 1.167.473l.5.184c.356.132.712.253 1.072.373l.484.155c.511.158 1.017.359 1.549.448 27.45 4.547 33.787-16.588 33.787-16.588-5.712 8.228-16.775 12.153-28.58 9.089-.524-.138-1.042-.288-1.555-.449l-.467-.151c-.365-.117-.728-.243-1.087-.374l-.491-.183c-.394-.152-.784-.309-1.171-.473l-.315-.133c-.485-.211-.962-.434-1.432-.666l-.718-.365-.414-.213c-.306-.166-.61-.338-.909-.514l-.217-.123c-.372-.217-.738-.44-1.1-.672l-.332-.221-.712-.472c-.506-.349-.999-.714-1.484-1.085l-.334-.264c-5.167-4.079-9.263-9.655-11.21-15.977-2.041-6.557-1.601-13.917 1.935-19.891M69.771 4.868c-3.134 4.612-3.442 10.341-1.267 15.435 2.293 5.407 6.992 9.648 12.477 11.66l.682.235.3.096c.323.102.644.22.978.282 15.157 2.929 19.268-7.777 20.362-9.354-3.601 5.185-9.653 6.43-17.079 4.627-.586-.142-1.231-.354-1.796-.555-.725-.259-1.439-.553-2.134-.886-1.318-.634-2.575-1.402-3.741-2.282-6.645-5.042-10.772-14.659-6.436-22.492"></path><path fill="#131B28" d="M66.359 96.295h-4.226c-.234 0-.467.188-.517.417l-1.5 6.94-1.5 6.94c-.049.229-.282.417-.516.417h-2.991c-2.959 0-2.617-2.047-2.011-4.851l.018-.085.066-.354.012-.066.135-.72.145-.771.154-.785.682-3.332.683-3.332c.047-.23-.107-.419-.341-.419h-4.337c-.234 0-.466.188-.514.418l-.933 4.424-.932 4.425-.002.006-.086.412c-1.074 4.903-.79 9.58 5.048 9.727l.17.003h9.163c.234 0 .467-.188.516-.417l1.976-9.289 1.976-9.29c.049-.23-.103-.417-.338-.418zM21.103 96.246h-4.64c-.235 0-.469.188-.521.416l-.44 1.942-.44 1.942c-.051.229.098.416.333.416h4.676c.235 0 .468-.188.518-.417l.425-1.941.425-1.941c.049-.229-.101-.417-.336-.417zM19.757 102.29h-4.677c-.234 0-.469.188-.521.416l-.657 2.91-.656 2.909-.183.834-.631 2.97-.63 2.971c-.049.229-.15.599-.225.821 0 0-.874 2.6-2.343 2.57l-.184-.004-1.271-.023h-.001c-.234-.003-.469.18-.524.407l-.485 2.039-.484 2.038c-.055.228.093.416.326.42.833.01 2.699.031 3.828.031 3.669 0 5.604-2.033 6.843-7.883l1.451-6.714 1.361-6.297c.049-.227-.103-.415-.337-.415zM105.874 100.716l-.194-.801-.191-.82-.097-.414c-.38-1.477-1.495-2.328-3.917-2.328l-3.77-.004-3.472-.005h-3.907c-.234 0-.466.188-.515.417l-.173.816-.204.964-.057.271-1.759 8.24-1.67 7.822c-.05.23-.066.512-.038.626.028.115.479.209.713.209h3.524c.235 0 .532-.042.66-.094s.317-.513.364-.742l.626-3.099.627-3.1.001-.005.084-.413.76-3.56.671-3.144c.05-.229.281-.416.515-.417l11.089-.005c.235.002.383-.185.33-.414zM120.149 93.476l-.854.003h-3.549c-.235 0-.536.159-.667.353l-7.849 11.498c-.132.194-.283.166-.335-.062l-.578-2.533c-.052-.229-.287-.416-.522-.416h-5.045c-.235 0-.374.184-.31.409l2.261 7.921c.064.226.069.596.011.824l-.985 3.833c-.059.228.085.413.32.413h4.987c.234 0 .474-.186.532-.413l.986-3.833c.058-.229.221-.567.363-.755l12.742-16.911c.142-.188.065-.341-.169-.339l-1.339.008zM80.063 103.395v-.004c-.029.254-.264.441-.499.441h-6.397c-.222 0-.334-.15-.301-.336l.006-.015-.004.002.003-.021.029-.109c.611-1.624 1.855-2.69 4.194-2.69 2.634-.001 3.148 1.285 2.969 2.732zm-1.877-7.384c-8.211 0-10.157 4.984-11.249 10.015-1.091 5.128-.998 9.921 7.5 9.921h1.03l.256-.001h.06l1.02-.003h.018c2.244-.009 4.495-.026 5.406-.033.233-.004.461-.191.509-.42l.344-1.681.067-.327.41-2.006c.047-.229-.106-.418-.341-.418h-7.639c-3.039 0-3.941-.807-3.608-3.181h12.211l-.001.001.008-.001c.194-.003.374-.137.445-.315l.029-.106-.001.001c1.813-6.839 1.293-11.445-6.474-11.446zM39.376 103.369l-.116.409v.001l-.922 3.268-.922 3.267c-.063.227-.308.411-.543.411h-4.88c-3.702 0-4.604-2.896-3.702-7.166.901-4.368 2.668-7.083 6.312-7.358 4.98-.376 5.976 3.126 4.773 7.168zm3.348 7.105s2.301-5.588 2.823-8.814c.713-4.319-1.45-10.585-9.804-10.585-8.306 0-11.914 5.981-13.29 12.484-1.376 6.55.427 12.293 8.686 12.246l6.516-.024 6.089-.022c.234-.002.474-.188.534-.414l1.061-4.046c.059-.228-.084-.414-.319-.416l-1.017-.006-1.017-.006c-.199-.001-.313-.131-.289-.302l.027-.095zM83.844 106.733c0 .155-.125.281-.28.281-.154 0-.28-.126-.28-.281 0-.154.125-.279.28-.279.155 0 .28.125.28.279z"></path>
</svg>
<h5>jQuery</h5>
<h6>Intermediate</h6>
</div>
</div>
<div class="card-container">
<div class="card">
<i class="devicon-react-original colored skill-fontcard"></i>
<h5>React.js</h5>
<h6>Intermediate</h6>
</div>
</div>
<div class="card-container">
<div class="card">
<svg class="skill-svglogo" viewBox="0 0 128 128">
<path fill="none" d="M0 0h128v128H0z"></path><path d="M88.69 88.11c-9 18.4-24.76 30.78-45.61 34.85a39.73 39.73 0 0 1-9.77 1.14c-12 0-23-5-28.34-13.19C-2.2 100-4.64 76.87 19 59.76c.48 2.61 1.46 6.19 2.11 8.31A38.24 38.24 0 0 0 10 81.1c-4.4 8.64-3.91 17.27 1.3 25.25 3.6 5.38 9.3 8.65 16.63 9.65a44 44 0 0 0 26.55-5c12.71-6.68 21.18-14.66 26.72-25.57a9.32 9.32 0 0 1-2.61-6A9.12 9.12 0 0 1 87.37 70h.34a9.15 9.15 0 0 1 1 18.25zm28.67-20.2c12.21 13.84 12.54 30.13 7.82 39.58-4.4 8.63-16 17.27-31.6 17.27a50.48 50.48 0 0 1-21-5.05c2.29-1.63 5.54-4.24 7.33-5.87a41.54 41.54 0 0 0 16 3.42c10.1 0 17.75-4.72 22.31-13.35 2.93-5.7 3.1-12.38.33-19.22a43.61 43.61 0 0 0-17.27-20.85 62 62 0 0 0-34.74-10.59h-2.93a9.21 9.21 0 0 1-8 5.54h-.31a9.13 9.13 0 0 1-.3-18.25h.33a9 9 0 0 1 8 4.89h2.61c20.8 0 39.06 7.98 51.42 22.48zm-82.75 23a7.31 7.31 0 0 1 1.14-4.73c-9.12-15.8-14-35.83-6.51-56.68C34.61 13.83 48.13 3.24 62.79 3.24c15.64 0 31.93 13.69 33.88 40.07-2.44-.81-6-2-8.14-2.44-.53-8.63-7.82-30.13-25.09-29.81-6.19.17-15.31 3.1-20 9.12a43.69 43.69 0 0 0-9.64 25.25 59.61 59.61 0 0 0 8.47 36.16 2.75 2.75 0 0 1 1.14-.16h.32a9.12 9.12 0 0 1 .33 18.24h-.33a9.16 9.16 0 0 1-9.12-8.79z" fill="#764abc"></path>
</svg>
<h5>Redux</h5>
<h6>Beginner</h6>
</div>
</div>
<div class="card-container">
<div class="card">
<svg class="skill-svglogo" viewBox="0 0 128 128">
<path fill="#FFD845" d="M49.33 62h29.159c8.117 0 14.511-6.868 14.511-15.019v-27.798c0-7.912-6.632-13.856-14.555-15.176-5.014-.835-10.195-1.215-15.187-1.191-4.99.023-9.612.448-13.805 1.191-12.355 2.181-14.453 6.751-14.453 15.176v10.817h29v4h-40.224000000000004c-8.484 0-15.914 5.108-18.237 14.811-2.681 11.12-2.8 17.919 0 29.53 2.075 8.642 7.03 14.659 15.515 14.659h9.946v-13.048c0-9.637 8.428-17.952 18.33-17.952zm-1.838-39.11c-3.026 0-5.478-2.479-5.478-5.545 0-3.079 2.451-5.581 5.478-5.581 3.015 0 5.479 2.502 5.479 5.581-.001 3.066-2.465 5.545-5.479 5.545zM122.281 48.811c-2.098-8.448-6.103-14.811-14.599-14.811h-10.682v12.981c0 10.05-8.794 18.019-18.511 18.019h-29.159c-7.988 0-14.33 7.326-14.33 15.326v27.8c0 7.91 6.745 12.564 14.462 14.834 9.242 2.717 17.994 3.208 29.051 0 7.349-2.129 14.487-6.411 14.487-14.834v-11.126h-29v-4h43.682c8.484 0 11.647-5.776 14.599-14.66 3.047-9.145 2.916-17.799 0-29.529zm-41.955 55.606c3.027 0 5.479 2.479 5.479 5.547 0 3.076-2.451 5.579-5.479 5.579-3.015 0-5.478-2.502-5.478-5.579 0-3.068 2.463-5.547 5.478-5.547z"></path>
</svg>
<h5>Python</h5>
<h6>Advanced</h6>
</div>
</div>
<div class="card-container">
<div class="card">
<svg class="skill-svglogo" viewBox="0 0 128 128">
<path fill="#003A2B" d="M126.5 83.8c0 3.8-3.1 6.9-6.9 6.9h-111.2c-3.8 0-6.9-3.1-6.9-6.9v-39.6c0-3.8 3.1-6.9 6.9-6.9h111.2c3.8 0 6.9 3.1 6.9 6.9v39.6z"></path><path fill="#fff" d="M23 45.6h6v27.4c-3 .6-5.3.8-7.7.8-7.2 0-11-3.3-11-9.5 0-6 4-10 10.2-10 1 0 1.7.1 2.6.3v-9h-.1zm0 13.8c-.7-.2-1.3-.3-2-.3-3 0-4.7 1.8-4.7 5.1 0 3.2 1.7 4.9 4.7 4.9.7 0 1.2 0 2-.2v-9.5zM38.4 54.8v13.7c0 4.7-.3 7-1.4 9-1 1.9-2.2 3.1-4.8 4.4l-5.5-2.6c2.6-1.2 3.9-2.3 4.7-4 .8-1.7 1.1-3.7 1.1-8.8v-11.7h5.9zm-5.9-9.1h5.9v6.1h-5.9v-6.1zM42 56.1c2.6-1.2 5.1-1.8 7.8-1.8 3 0 5 .8 5.9 2.4.5.9.7 2 .7 4.5v12c-2.7.4-6 .7-8.5.7-5 0-7.2-1.7-7.2-5.6 0-4.2 3-6.1 10.2-6.7v-1.3c0-1.1-.5-1.5-2-1.5-2.2 0-4.7.6-7 1.8v-4.5h.1zm9.2 9.4c-3.9.4-5.2 1-5.2 2.5 0 1.2.7 1.7 2.3 1.7.9 0 1.7-.1 2.8-.3v-3.9h.1zM59.3 55.7c3.5-.9 6.4-1.3 9.3-1.3 3 0 5.2.7 6.5 2 1.2 1.3 1.6 2.7 1.6 5.6v11.6h-5.9v-11.4c0-2.3-.8-3.1-2.9-3.1-.8 0-1.5.1-2.7.4v14.1h-5.9v-17.9zM79 76.8c2.1 1.1 4.2 1.6 6.3 1.6 3.9 0 5.5-1.6 5.5-5.3v-.1c-1.2.6-2.3.8-3.8.8-5.2 0-8.5-3.4-8.5-8.8 0-6.7 4.9-10.5 13.5-10.5 2.5 0 4.9.3 7.7.8l-2 4.3c-1.6-.3-.1 0-1.3-.2v.6l.1 2.5v3.2c0 .8 0 1.6.1 2.4v1.6c0 5.1-.4 7.5-1.7 9.4-1.8 2.9-5 4.3-9.6 4.3-2.3 0-4.3-.3-6.4-1.2v-5.4h.1zm11.8-17.6h-.6000000000000001c-1.2 0-2.5.3-3.4.8-1.4.8-2.2 2.3-2.2 4.3 0 3 1.5 4.7 4.1 4.7.8 0 1.5-.2 2.2-.4v-9.4h-.1zM109 54.3c5.9 0 9.5 3.7 9.5 9.8 0 6.2-3.8 10.1-9.8 10.1-5.9 0-9.6-3.7-9.6-9.7.1-6.3 3.9-10.2 9.9-10.2zm-.1 15c2.3 0 3.6-1.9 3.6-5.2 0-3.2-1.3-5.2-3.6-5.2s-3.7 1.9-3.7 5.2c.1 3.4 1.4 5.2 3.7 5.2z"></path>
</svg>
<h5>Django</h5>
<h6>Intermediate</h6>
</div>
</div>
</div>
<div data-aos="zoom-in-up" class="skill-row">
<div class="card-container">
<div class="card">
<svg class="skill-svglogo" viewBox="0 0 128 128">
<path fill="#0074BD" d="M47.617 98.12s-4.767 2.774 3.397 3.71c9.892 1.13 14.947.968 25.845-1.092 0 0 2.871 1.795 6.873 3.351-24.439 10.47-55.308-.607-36.115-5.969zM44.629 84.455s-5.348 3.959 2.823 4.805c10.567 1.091 18.91 1.18 33.354-1.6 0 0 1.993 2.025 5.132 3.131-29.542 8.64-62.446.68-41.309-6.336z"></path><path fill="#EA2D2E" d="M69.802 61.271c6.025 6.935-1.58 13.17-1.58 13.17s15.289-7.891 8.269-17.777c-6.559-9.215-11.587-13.792 15.635-29.58 0 .001-42.731 10.67-22.324 34.187z"></path><path fill="#0074BD" d="M102.123 108.229s3.529 2.91-3.888 5.159c-14.102 4.272-58.706 5.56-71.094.171-4.451-1.938 3.899-4.625 6.526-5.192 2.739-.593 4.303-.485 4.303-.485-4.953-3.487-32.013 6.85-13.743 9.815 49.821 8.076 90.817-3.637 77.896-9.468zM49.912 70.294s-22.686 5.389-8.033 7.348c6.188.828 18.518.638 30.011-.326 9.39-.789 18.813-2.474 18.813-2.474s-3.308 1.419-5.704 3.053c-23.042 6.061-67.544 3.238-54.731-2.958 10.832-5.239 19.644-4.643 19.644-4.643zM90.609 93.041c23.421-12.167 12.591-23.86 5.032-22.285-1.848.385-2.677.72-2.677.72s.688-1.079 2-1.543c14.953-5.255 26.451 15.503-4.823 23.725 0-.002.359-.327.468-.617z"></path><path fill="#EA2D2E" d="M76.491 1.587s12.968 12.976-12.303 32.923c-20.266 16.006-4.621 25.13-.007 35.559-11.831-10.673-20.509-20.07-14.688-28.815 8.548-12.834 32.229-19.059 26.998-39.667z"></path><path fill="#0074BD" d="M52.214 126.021c22.476 1.437 57-.8 57.817-11.436 0 0-1.571 4.032-18.577 7.231-19.186 3.612-42.854 3.191-56.887.874 0 .001 2.875 2.381 17.647 3.331z"></path>
</svg>
<h5>Java</h5>
<h6>Intermediate</h6>
</div>
</div>
<div class="card-container">
<div class="card">
<svg class="skill-svglogo" viewBox="0 0 128 128">
<path fill="#659AD3" d="M115.4 30.7l-48.3-27.8c-.8-.5-1.9-.7-3.1-.7-1.2 0-2.3.3-3.1.7l-48 27.9c-1.7 1-2.9 3.5-2.9 5.4v55.7c0 1.1.2 2.4 1 3.5l106.8-62c-.6-1.2-1.5-2.1-2.4-2.7z"></path><path fill="#03599C" d="M10.7 95.3c.5.8 1.2 1.5 1.9 1.9l48.2 27.9c.8.5 1.9.7 3.1.7 1.2 0 2.3-.3 3.1-.7l48-27.9c1.7-1 2.9-3.5 2.9-5.4v-55.7c0-.9-.1-1.9-.6-2.8l-106.6 62z"></path><path fill="#fff" d="M85.3 76.1c-4.2 7.4-12.2 12.4-21.3 12.4-13.5 0-24.5-11-24.5-24.5s11-24.5 24.5-24.5c9.1 0 17.1 5 21.3 12.5l13-7.5c-6.8-11.9-19.6-20-34.3-20-21.8 0-39.5 17.7-39.5 39.5s17.7 39.5 39.5 39.5c14.6 0 27.4-8 34.2-19.8l-12.9-7.6z"></path>
</svg>
<h5>C</h5>
<h6>Beginner</h6>
</div>
</div>
<div class="card-container">
<div class="card">
<svg class="skill-svglogo" viewBox="0 0 128 128">
<path fill="#9B4F96" d="M115.4 30.7l-48.3-27.8c-.8-.5-1.9-.7-3.1-.7-1.2 0-2.3.3-3.1.7l-48 27.9c-1.7 1-2.9 3.5-2.9 5.4v55.7c0 1.1.2 2.4 1 3.5l106.8-62c-.6-1.2-1.5-2.1-2.4-2.7z"></path><path fill="#68217A" d="M10.7 95.3c.5.8 1.2 1.5 1.9 1.9l48.2 27.9c.8.5 1.9.7 3.1.7 1.2 0 2.3-.3 3.1-.7l48-27.9c1.7-1 2.9-3.5 2.9-5.4v-55.7c0-.9-.1-1.9-.6-2.8l-106.6 62z"></path><path fill="#fff" d="M85.3 76.1c-4.2 7.4-12.2 12.4-21.3 12.4-13.5 0-24.5-11-24.5-24.5s11-24.5 24.5-24.5c9.1 0 17.1 5 21.3 12.5l13-7.5c-6.8-11.9-19.6-20-34.3-20-21.8 0-39.5 17.7-39.5 39.5s17.7 39.5 39.5 39.5c14.6 0 27.4-8 34.2-19.8l-12.9-7.6zM97 66.2l.9-4.3h-4.2v-4.7h5.1l1.2-6.2h4.9l-1.2 6.1h3.8l1.2-6.1h4.8l-1.2 6.1h2.4v4.7h-3.3l-.9 4.3h4.2v4.7h-5.1l-1.2 6h-4.9l1.2-6h-3.8l-1.2 6h-4.8l1.2-6h-2.4v-4.7h3.3zm4.8 0h3.8l.9-4.3h-3.8l-.9 4.3z"></path>
</svg>
<h5>C#</h5>
<h6>Beginner</h6>
</div>
</div>
<div class="card-container">
<div class="card">
<svg class="skill-svglogo" viewBox="0 0 128 128">
<defs><style>.cls-1{fill:#f05138;}.cls-2{fill:#fefefe;}</style></defs><g id="orignal"><path class="cls-1" d="M126.33,34.06a39.32,39.32,0,0,0-.79-7.83,28.78,28.78,0,0,0-2.65-7.58,28.84,28.84,0,0,0-4.76-6.32,23.42,23.42,0,0,0-6.62-4.55,27.27,27.27,0,0,0-7.68-2.53c-2.65-.51-5.56-.51-8.21-.76H30.25A45.46,45.46,0,0,0,24.16,5a21.82,21.82,0,0,0-5.82,1.52c-.53.25-1.32.51-1.85.76a33.82,33.82,0,0,0-5,3.28c-.53.51-1.06.76-1.59,1.26a22.41,22.41,0,0,0-4.76,6.32,23.61,23.61,0,0,0-2.65,7.58,78.5,78.5,0,0,0-.79,7.83V93.94a39.32,39.32,0,0,0,.79,7.83,28.78,28.78,0,0,0,2.65,7.58,28.84,28.84,0,0,0,4.76,6.32,23.42,23.42,0,0,0,6.62,4.55,27.27,27.27,0,0,0,7.68,2.53c2.65.51,5.56.51,8.21.76H95.63a45.08,45.08,0,0,0,8.21-.76,27.27,27.27,0,0,0,7.68-2.53,30.13,30.13,0,0,0,6.62-4.55,22.41,22.41,0,0,0,4.76-6.32,23.61,23.61,0,0,0,2.65-7.58,78.49,78.49,0,0,0,.79-7.83V34.06Z"></path><path class="cls-2" d="M85,96.5c-11.11,6.13-26.38,6.76-41.75.47A64.53,64.53,0,0,1,13.84,73a50,50,0,0,0,10.85,6.32c15.87,7.1,31.73,6.61,42.9,0l0,0C51.69,67.66,38.19,52.5,28.13,40.12a43.47,43.47,0,0,1-5.29-6.82C35,43.91,54.34,57.3,61.22,61.09a271.77,271.77,0,0,1-27-32.34A266.8,266.8,0,0,0,78.69,63.62c.71.38,1.26.7,1.7,1a32.7,32.7,0,0,0,1.21-3.51c3.71-12.89-.53-27.54-9.79-39.67C93.25,33.81,106,57.05,100.66,76.51c-.14.53-.29,1-.45,1.55l.19.22c10.59,12.63,7.68,26,6.35,23.5C101,91,90.37,94.33,85,96.5Z"></path></g>
</svg>
<h5>Swift</h5>
<h6>Intermediate</h6>
</div>
</div>
<div class="card-container">
<div class="card">
<img class="rxswift" src="resource/svg/rxswift.svg" alt="">
<h5>RxSwift</h5>
<h6>Beginner</h6>
</div>
</div>
</div>
<div data-aos="zoom-in-up" class="skill-last-row">
<div class="card-container">
<div class="card">
<img class="firebase"
src="https://cdn.worldvectorlogo.com/logos/firebase-1.svg" alt="">
<h5>Firebase</h5>
<h6>Beginner</h6>
</div>
</div>
<div class="card-container">
<div class="card">
<svg class="skill-svglogo" viewBox="0 0 128 128">
<path fill="#F34F29" d="M124.737 58.378l-55.116-55.114c-3.172-3.174-8.32-3.174-11.497 0l-11.444 11.446 14.518 14.518c3.375-1.139 7.243-.375 9.932 2.314 2.703 2.706 3.461 6.607 2.294 9.993l13.992 13.993c3.385-1.167 7.292-.413 9.994 2.295 3.78 3.777 3.78 9.9 0 13.679-3.78 3.78-9.901 3.78-13.683 0-2.842-2.844-3.545-7.019-2.105-10.521l-13.048-13.048-.002 34.341c.922.455 1.791 1.063 2.559 1.828 3.778 3.777 3.778 9.898 0 13.683-3.779 3.777-9.904 3.777-13.679 0-3.778-3.784-3.778-9.905 0-13.683.934-.933 2.014-1.638 3.167-2.11v-34.659c-1.153-.472-2.231-1.172-3.167-2.111-2.862-2.86-3.551-7.06-2.083-10.576l-14.313-14.313-37.792 37.79c-3.175 3.177-3.175 8.325 0 11.5l55.117 55.114c3.174 3.174 8.32 3.174 11.499 0l54.858-54.858c3.174-3.176 3.174-8.327-.001-11.501z"></path>
</svg>
<h5>Git</h5>
<h6>Intermediate</h6>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<section id="experiences">
<div class="container">
<div class="row">
<div class="col-lg-10 mx-auto">
<h2 class="secTitle">Experiences</h2>
<hr class="secTitleline" />
<div class="row item-list">
<div class="col-sm col-lg-4 mx-auto">
<center><img class="ex-resize" src="resource/img/logo/nimble.jpg" alt=""></center>
</div>
<div class="col-sm col-lg-8 my-auto">
<h4>Internship at Nimble</h4>
<h5>June – December, 2021</h5>
<br />
<ul>
<li>
iOS Developer Intern
</li>
<li>
I worked in the team for an international money transfer app in Thailand.
</li>
<li>
I developed, managed CI/CD, reviewed code, and worked closely with product owners and designers to develop and deliver a high-quality app.
I also worked on some internal tools for people in the company.
</li>
<li>
<p class="white-hashtag hashtag">#Swift</p><i class="devicon-swift-plain colored tapp"></i>
<p class="white-hashtag hashtag">#RxSwift</p><img class="tapp" style="max-width: 4%; margin-bottom: 1%;"
src="resource/svg/rxswift.svg" alt="">
</li>
</ul>
</div>
</div>
<div class="row item-list">
<div class="col-sm col-lg-4 mx-auto">
<center><img class="ex-resize" src="resource/img/logo/Agoda-logo.jpg" alt=""></center>
</div>
<div class="col-sm col-lg-8 my-auto">
<h4>Internship at Agoda</h4>
<h5>June – July, 2020</h5>
<br />
<ul>
<li>
Software Engineer Intern
</li>
<li>
I worked in the team for a cross-platform app for vacation rental platform partners in Thailand.
</li>
<li>
I developed the app, worked on some backend parts and worked closely with the QA, product owner, and designer to develop and deliver a high-quality app.
</li>
<li>
<a target="blank" rel="noopener" href="https://chiiida.github.io/resource/docs/ACT - Intern__Ms. Chananchida Fuachai.pdf">Internship Certificate PDF</a>
</li>
<li>
<p class="white-hashtag hashtag">#ReactNative</p><i class="devicon-react-original colored tapp"></i>
<p class="white-hashtag hashtag">#Redux</p><iconify-icon data-icon="simple-icons:redux" style="color: #764abc;"></iconify-icon></span></i>
<p class="white-hashtag hashtag">#Typescript</p><i class="devicon-typescript-plain colored tapp"></i>
<p class="white-hashtag hashtag">#Csharp</p><i class="devicon-csharp-plain colored tapp"></i>
</li>
</ul>
</div>
</div>
<div class="row item-list">
<div class="col-sm col-lg-4 mx-auto">
<center><img class="ex-resize" src="resource/img/logo/gdg.jpg" alt=""></center>
</div>
<div class="col-sm col-lg-8 my-auto">
<h4>Google Tech Challenge at Bangkok</h4>
<h5>September, 2019</h5>
<br />
<ul>
<li>A competition for computer science and engineering community, giving students a
glimpse into Google’s culture, logical thinking, collaboration, and on-the-spot
coding.</li>
</ul>
</div>
</div>
<div class="row item-list">
<div class="col-sm col-lg-4 mx-auto">
<center><img class="ex-resize" src="resource/img/logo/tedx.jpg" alt=""></center>
</div>
<div class="col-sm col-lg-8 my-auto">
<h4>TED<sup>x</sup>KasetsartU 2019 at Kasetsart University</h4>
<h5>August – October, 2019</h5>
<br />
<ul>
<li>Front-end Developer</li>
</ul>
</div>
</div>
<div class="row item-list">
<div class="col-sm col-lg-4 mx-auto">
<center><img class="ex-resize" src="resource/img/logo/KU_Logo_JPG.jpg" alt=""></center>
</div>
<div class="col-sm col-lg-8 my-auto">
<h4>Teaching Asistant at Kasetsart University</h4>
<h5>August, 2019</h5>
<br />
<ul>
<li>Computer Programming I course</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</section>
<section id="projects">
<div class="container">
<div class="row">
<div class="col-lg-10 mx-auto">
<h2 class="secTitle">Projects</h2>
<hr class="secTitleline" />
<br />
<div class="proj">
<h4>What To Cook <span class="proj-date">– May 2021</span></h4>
<br />
<p class="hashtag">#Swift</p><i class="devicon-swift-plain colored tapp"></i>
<p class="hashtag">#Firebase</p><img alt="" class="tapp" style="max-width: 2.5%; margin-bottom: 1%;"
src="https://img.icons8.com/color/48/000000/firebase.png">
<p class="projdes">An application for finding recipes from ingredients with nutritions,
ingredients, steps how to make, and how it tastes provided.</p>
<div class="whattocook-img">
<img src="resource/img/what-to-cook/login screen_iphone12black_portrait.png" alt="">
<img src="resource/img/what-to-cook/added ingredient_iphone12black_portrait.png" alt="">
<img src="resource/img/what-to-cook/match_iphone12black_portrait.png" alt="">
<img src="resource/img/what-to-cook/recipe screen_iphone12black_portrait.png" alt="">
</div>
</div>
<br />
<hr class="projline" />
<div class="proj">
<h4>Bang Yai Used Car's Line official <span class="proj-date">– August 2019</span></h4>
<br />
<p class="hashtag">#JavaScript</p><i class="devicon-javascript-plain colored tapp"></i>
<p class="hashtag">#Firebase</p><img alt="" class="tapp" style="max-width: 2.5%; margin-bottom: 1%;"
src="https://img.icons8.com/color/48/000000/firebase.png">
<p class="projdes">ChatBot for Bang Yai Used Car’s Line Official using Firebase for API. Also,
have a rich menu with some keywords for the customer to ask for some information. This is my
very first project on ChatBot. <a target="blank" rel="noopener"
href="https://line.me/R/ti/p/%40947uxcyv">Take a look!</a></p>
<div class="projimg">
<img style="max-width: 30%; margin-right: 2%;" src="resource/img/byuc/byuc1.PNG" alt="">
<img style="max-width: 30%;" src="resource/img/byuc/byuc2.PNG" alt="">
</div>
</div>
<br />
<hr class="projline" />
<div class="proj">
<h4>WithU <span class="proj-date">– July 2019</span></h4>
<br />
<p class="hashtag">#HTML5</p><i class="devicon-html5-plain colored tapp"></i>
<p class="hashtag">#CSS3</p><i class="devicon-css3-plain colored tapp"></i>
<p class="hashtag">#JavaScript</p><i class="devicon-javascript-plain colored tapp"></i>
<p class="hashtag">#Boostrap</p><i class="devicon-bootstrap-plain colored tapp"></i>
<p class="hashtag">#Python</p><i class="devicon-python-plain colored tapp"></i>
<p class="projdes">WithU is an IoT Based Heart Rate Monitoring. The ability to collect and
analyses heart rate or beats per minute (BPM) and vibration from sensor and display on the
website, in order to treat mental illness.</p>
<div class="projimg">
<img style="max-width: 60%;" src="resource/img/withu/withu3.png" alt="">
<img style="max-width: 60%;" src="resource/img/withu/withu4.png" alt="">
<img style="max-width: 50%;" src="resource/img/withu/withu5.png" alt="">
</div>
</div>
<br />
<hr class="projline" />
<div class="proj">
<h4>I AM NOT POPCORN! <span class="proj-date">– May 2019</span></h4>
<br />
<p class="hashtag">#Python</p><i class="devicon-python-plain colored tapp"></i>
<p class="projdes">I AM NOT POPCORN! is a 2D platform games create with Python and
Arcade library. The goal of this game is to pass level as many as you can.
While avoid fire and collecting some items. <a
href="https://github.com/chiiida/i-am-not-popcorn">Play now!</a></p>
<div class="projimg">
<img style="max-width: 50%;" src="resource/img/popcorn/popcorn.gif" alt="">
<p></p>
<img style="max-width: 40%;" src="resource/img/popcorn/popcorn1.png" alt="">
<img style="max-width: 40%;" src="resource/img/popcorn/popcorn3.png" alt="">
</div>
</div>
<br />
<hr class="projline" />
<div class="proj">
<h4>Bang Yai Used Car <span class="proj-date">– May 2018</span></h4>
<br />
<p class="hashtag">#HTML5</p><i class="devicon-html5-plain colored tapp"></i>
<p class="hashtag">#WordPress</p><i class="devicon-wordpress-plain"></i>
<p class="projdes">This is my very first website which is made with WordPress and a few HTML.
This
website is to track the status of each car and also give a detail of each car.</p>
<div class="projimg">
<img style="max-width: 50%;" src="resource/img/byuc/byucw2.png" alt="">
<img style="max-width: 50%;" src="resource/img/byuc/byucw1.png" alt="">
</div>
</div>
<br />
</div>
</div>
</div>
</section>
<section id="contact">
<div class="container">
<div class="row">
<div class="col-lg-10 mx-auto">
<h2 class="secTitle">Contact me</h2>
<hr class="secTitleline" />
<form class="contact-form" method="POST" target="_blank" rel="noopener"
action="mailto:[email protected]?subject=Mail from personal website" enctype="text/plain"
spellcheck="true">
<div class="form-group">
<label for="name">Name</label>
<input type="text" class="form-control" placeholder="Enter name" name="name" id="name">
</div>
<div class="form-group">
<label for="email">E-mail</label>
<input type="email" class="form-control" placeholder="Enter Email" name="email" id="email">
</div>
<div class="form-group">
<label for="message">Message</label>
<textarea class="form-control" rows="5" placeholder="Enter a message"
name="message" id="message"></textarea>
</div>
<input id="submit" name="submit" class="btn btn-primary" type="submit" value="Submit">
</form>
</div>
</div>
<br />
<div class="row">
<div class="col-lg-6 mx-auto">
<div class="grid-badge">
<a href="https://chiiida.github.io/resume.pdf" target="_blank" rel="noopener">
<div class="contact-btn">
<img class="svglogo" src="https://cdn.worldvectorlogo.com/logos/adobe-pdf-icon.svg"
alt="">
Résumé
</div>
</a>
<a href="http://github.com/chiiida" target="_blank" rel="noopener">
<div class="contact-btn">
<img class="svglogo" src="https://cdn.worldvectorlogo.com/logos/github-icon-1.svg"
alt="">
GitHub
</div>
</a>
<a href="https://www.linkedin.com/in/chananchidaf/" target="_blank" rel="noopener">
<div class="contact-btn">
<img class="svglogo" src="https://cdn.worldvectorlogo.com/logos/linkedin-icon-2.svg"
alt="">
Linkedin
</div>
</a>
<a href="mailto:[email protected]?subject=Mail from personal website">
<div class="contact-btn">
<img class="svglogo-1" src="https://cdn.worldvectorlogo.com/logos/gmail-icon-2.svg"
alt="">
Gmail
</div>
</a>
</div>
</div>
</div>
</section>
<hr class="separator separator--line" style="margin-bottom: 5px;" />
<!-- Footer -->
<p class="text-secondary container content-container text-center">Code with ♥ by <a
href="http://github.com/chiiida">Chananchida
Fuachai</a><br><small>Last updated: 15<sup>th</sup> Jan 202</small></p>
<!-- JS -->
<script src="https://code.jquery.com/jquery-3.4.1.min.js"
integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/js/bootstrap.min.js"
integrity="sha384-h0AbiXch4ZDo7tp9hKZ4TsHbi047NrKGLO3SEJAg45jXxnGIfYzk4Si90RDIqNm1"
crossorigin="anonymous"></script>
<script src="https://unpkg.com/[email protected]/dist/aos.js"></script>
<script src="resource/js/script.js"></script>
<script src="https://code.iconify.design/1/1.0.7/iconify.min.js"></script>
</body>
</html>