Xây dựng website kết nối doanh nghiệp IT việt nam với khách hàng quốc tế

ĈҤ,+Ӑ&Ĉ¬1Ҹ1*
75ѬӠ1*ĈҤ,+Ӑ&6Ѭ3+Ҥ0
KHOA 7,1+Ӑ&

KHĨA LUҰ1
TӔ71*+,
ӊ3

Ĉӄ7¬,
:
XÂY DӴ1*
WEBSITE Kӂ71
Ӕ,'2
ANH NGHIӊ3
IT
VIӊ71$09
Ӟ,.+
ÁCH HÀNG QUӔ&Tӂ
CHUN NGÀNH: CƠNG NGHӊ7+
ÔNG TIN CHҨ7
LѬӦ1*&
AO

SLQKYLrQWKӵFKLӋQ
1JX\ӉQ+ӳX%tQK*LiS
MSV
: 312045161107
/ӟS
: 16CNTTC
&iQEӝK
ѭӟQJGүQ

: PGS TSKH. TrҫQ4X
ӕF&KL
ӃQ

Ĉj1̽QJ
±Tháng 5/2020


/Ӡ,&Ҧ0Ѫ1

(PFKkQWKjQKFҧPѫQFiFWKҫ\F{WURQ
ĈҥLKӑFĈj1ҹQJÿmWұQWuQKWUX\ӅQÿҥW
KӑFYӯDTXDÿӇK{
PQD\HPFyWKӇFyÿҫ\ÿӫNLӃQW
WKӵF
KLӋQ
ÿӅWjL
khóa luұQ
này.

ĈһF ELrW HP [LQ FKkQ WKjQK FҧP
PGS ѫQ
TSKH. TrҫQӕF
4X ӃQ
&KL
ÿm WұQ WuQKJL~S ÿӥ WUӵF WLӃ
WUuQKWKӵFKLӋQÿӅWjLQj\

0һF
Gÿm

FӕJҳQJKRjQWKjQK
khóa luұQ
trong phҥPYL
và kKҧQăQJFKR
phép
nKѭQJ
KҳF
F FKҳQ VӁ NK{QJ WUiQK NKӓL QKӳQJ W
WK{QJFҧPJySêYjWұQWuQKFKӍEҧRFӫD

ĈjQҹQJQJj\
25 tháng 05 QăP

6LQKYLrQWKӵFKLӋQ

NgX\ӉQ+ӳX%tQK*Li
p

2
1JX\ӉQ
+ӳX%t
nh Giáp ±/ӟS&177&
(2016-2020)


/Ӡ,&$0Ĉ
OAN
7{L[LQFDPÿRDQ

1. 1KӳQJQӝLGXQJWURQJEiRFiRQj\OjGR

FӫD
GVHD PGS TSKH. TrҫQ4X
ӕF&KL
ӃQ
.

2. 0ӑLWKDPNKҧRGQJWURQJEiR
cáo Qj\ÿӅXÿѭӧFWU
tFKGүQU}UjQJ
WrQWiFJLҧ
F{QJWUuQKWKӡLJLDQÿӏDÿLӇPF{QJ
Eӕ

3. 0ӑL VDR FKpS NK{QJ KӧS OӋ YL SKҥP TX
KRjQWRjQWUiFKQKLӋP

6LQKYLrQWKӵFKLӋQ

1JX\ӉQ
+ӳX%
ính Giáp

3
1JX\ӉQ
+ӳX%t
nh Giáp ±/ӟS&177&
(2016-2020)


1+Ұ1

XÉT CӪ$&È1%Ӝ
+ѬӞ1*
'Ү1
«««««««««««««««««««««««««««««««««««
«««««««««««««««««««««««««««««««««««
«««««««««««««««««««««««««««««««««««
«««««««««««««««««««««««««««««««««««
«««««««««««««««««««««««««««««««««««
«««««««««««««««««««««««««««««««««««
«««««««««««««««««««««««««««««««««««
«««««««««««««««««««««««««««««««««««
«««««««««««««««««««««««««««««««««««
«««««««««««««««««««««««««««««««««««
«««««««««««««««««««««««««««««««««««
«««««««««««««««««««««««««««««««««««
«««««««««««««««««««««««««««««««««««
«««««««««««««««««««««««««««««««««««
«««««««««««««««««««««««««««««««««««
«««««««««««««««««««««««««««««««««««
«««««««««««««««««««««««««««««««««««
«««««««««««««««««««««««««««««««««««
«««««««««««««««««««««««««««««««««««
«««««««««««««««««««««««««««««««««««
«««««««««««««««««««««««««««««««««««
Ĉj1̽
ng, ngày

tháng nă
m

&iQE͡K˱ͣQJG̳

4
1JX\ӉQ
+ӳX%t
nh Giáp ±/ӟS&177&
(2016-2020)


1+Ұ1;e7&Ӫ$
+Ӝ,ĈӖ1*3+Ҧ1%,ӊ
«««««««««««««««««««««««««««««««««««
«««««««««««««««««««««««««««««««««««
«««««««««««««««««««««««««««««««««««
«««««««««««««««««««««««««««««««««««
«««««««««««««««««««««««««««««««««««
«««««««««««««««««««««««««««««««««««
«««««««««««««««««««««««««««««««««««
«««««««««««««««««««««««««««««««««««
«««««««««««««««««««««««««««««««««««
«««««««««««««««««««««««««««««««««««
«««««««««««««««««««««««««««««««««««
«««««««««««««««««««««««««««««««««««
«««««««««««««««««««««««««««««««««««
«««««««««««««««««««««««««««««««««««
«««««««««««««««««««««««««««««««««««
«««««««««««««««««««««««««««««««««««
«««««««««««««««««««««««««««««««««««
«««««««««««««««««««««««««««««««««««
«««««««««««««««««««««««««««««««««««

«««««««««««««««««««««««««««««««««««
«««««««««««««««««««««««««««««««««««

Ĉj1̽QJQJ
j\WKiQJ

+͡Lÿ͛QJSK̫QEL͏

5
1JX\ӉQ
+ӳX%t
nh Giáp ±/ӟS&177&
(2016-2020)


0өFOөF
'$1+0Ө&&È&%Ҧ1*
................................
................................
............8
'$1+0Ө&
+Ỵ1+Ҧ1+
................................
................................
............9
0ӢĈҪ8
................................
................................
................................
..... 10

%ӕLFҧQKÿӅWjL
...................................................................................... 10
6ѫOѭӧWFiFEѭӟFWURQJÿӅWjL
................................................................ 11
0өFÿtFK
.............................................................................................................. 11
0өFWLrXFӫDÿӅWjL
............................................................................................... 11
.ӃWTXҧGӵNLӃQ
.................................................................................................... 12

&+ѬѪ1*&Ѫ6Ӣ
/é7+8<ӂ7
................................
..........................
13
7әQJTXDQYӅQӅQWҧQJF{QJQJKӋ
...................................................... 14
1.1.1 Material UI ................................................................................................ 14
1.1.2. Nextjs ........................................................................................................ 14
1.1.3. ReactJS ..................................................................................................... 15
1.1.4 NodeJS ....................................................................................................... 15
1.1.5 HapiJS ....................................................................................................... 16
1.1.6 Test Driven Development .......................................................................... 16

1.2. &ѫVӣGӳOLӋX3RVWJUH64/
................................................................. 19
0FtFKVGQJFVGOLX
.................................................................. 19
*LLWKLXY3RVWJUH64/

............................................................................ 20

&+1*3+ặ17ậ&+9ơ7+,7.+7+
........................22
*LLWKLX:HEVLWH
.............................................................................. 22
3KkQWtFKYjWKLWNK
WKQJ
............................................................. 22

3KkQWtFK\rXFXFKFQQJQJL
.................................................... 22
7KLW
NKWKQJ
......................................................................................... 24
68VHFDVHWQJTXiW
............................................................................. 25
6PFQJFQK
................................................................................... 29
6PF
............................................................................................... 30
3KkQUmVFKFQQJ
.............................................................................. 31

......................................................... 34

6
1JX\ӉQ
+ӳX%t

nh Giáp ±/ӟS&177&
(2016-2020)


7KLӃWNӃFѫVӣG
ӳOLӋX
.................................................................................. 38
&ҩXWU~FEҧQJYjUjQJEXӝF
......................................................................... 39

.ӃWTXҧWULӇQNKDL
............................................................................... 45

*LDRGLӋQWUDQJLQGH[
.................................................................................. 45
*LDRGLӋQÿăQJNê
....................................................................................... 46
*LDRGLӋQÿăQJQKұS
.................................................................................... 47
*LDRGLӋQGLVSOD\SURMHFWFӫDGRDQ
......... 48
*LDRGLӋQÿăQJNêGӵiQ
.............................................................................. 49
3.1*LDRGLӋQUHYLHZ%LGGLQJ
............................................................................. 50
*LDRGLӋQSKzQJFKDW
................................................................................... 51
*LDRGLӋQ&RPSDQ\
..................................................................................... 53
*LDRGLӋQ8VHU3URILOH

................................................................................. 54

ĈiQKJLi
............................................................................................. 56
.ӂ7/8Ұ19¬+ѬӞ1*3+È775,ӆ1
................................
.................57
7¬,/,ӊ87+$0.+Ҧ2
................................
................................
..........58

7
1JX\ӉQ
+ӳX%t
nh Giáp ±/ӟS&177&
(2016-2020)


D$1+0Ө&&È&%Ҧ1*

Bҧ
QJ%ҧQJ
P{WҧVӱGөQJZHEVLWHFӫDNKiFK
................................... 34

Bҧ
QJ%ҧQJP{WҧVӱGөQJKӋWKӕQJFӫ
.............. 35

Bҧ
QJ%ҧQJP{WҧVӱGөQJKӋWKӕQJFӫ
.......................... 36

Bҧ
QJ%ҧQJP{WҧVӱGөQJKӋWKӕQJFӫ
.................................... 37
Bҧ
nJ%ҧQJ8VHU$FFRXQWV
.............................................................................. 39
Bҧ
QJ%ҧ
ng Project......................................................................................... 39
Bҧ
QJ%ҧQJ3URMHFW%LGGLQJV
...................................................................... 40
Bҧ
QJ%ҧQJ7ULDO3URMHFWV
............................................................................... 40
Bҧ
QJ%ҧQJ&RPSDQLHV
.................................................................................. 41
Bҧ
QJ%ҧQJ7ULDO3URMHFW3URSRVD
ls ................................................................ 42
Bҧ
QJ%ҧQJ9HULI\&RPSDQLHV
...................................................................... 42
Bҧ
QJ%ҧQJ5ROHV

......................................................................................... 43
Bҧ
QJ%ҧQJ6WDWXV$FFRXQWV
......................................................................... 43
Bҧ
ng 14: Notifications....................................................................................... 43
Bҧ
QJ%ҧQJ8VHU3URILOHV
.............................................................................. 44
Bҧ
QJ%ҧQJ0HVVDJHV
................................................................................... 44
Bҧ
QJĈӅ[XkW
............................................................................................... 44

Bҧ
ng 18: ChӭFQăQJGjQKFKRNKiFKKjQJTXӕF
............................................ 56

Bҧ
QJ&KӭFQăQJGjQKFKR'RDQKQJKL
............................... 56

Bҧ
QJ&KӭFQăQJGjQKFKR4XҧQWUӏY
..................................................... 56

8
1JX\ӉQ

+ӳX%t
nh Giáp ±/ӟS&177&
(2016-2020)


'$1+0Ө&
+Ỵ1+Ҧ1+
Hu
nh 1: Mơ hình chu trình TDD1.1.7 Cypress ................................................... 17
Hu
QK6ѫÿӗ8VH&DVHWәQJTXiW
..................................................................... 25

Hu
QK6ѫÿӗ
8VH&DVHWәQJTXiWFӫDTXҧQWUӏ
.......................................... 26

Hu
nh 46ѫÿӗ
8VH&DVHWәQJTXiWFӫD'RDQK1J
....................................... 27

Hu
QK6ѫÿӗ8VHFDVHWәQJTXiWFӫDN
................................ 28
Hu
QK6ѫÿӗSKkQUmFK
ӭFQăQJFӫDNKiFKYmQJOD
i......................................... 31

Hu
nh 76ѫÿӗSKkQUmFKӭFQăQJFӫDNKiF
............................................. 32

Hu
QK6ѫÿӗSKkQUmFKӭFQăQJFӫDGR
............................................ 33
Hu
QK6ѫÿӗFѫVӣGӳOLӋX
............................................................................... 38
Hu
nh 10: GiDRGLӋQWUDQJFKӫ
............................................................................ 45
Hu
nh 11*LDRGLӋQWUDQJÿăQJNê
...................................................................... 46
Hu
QK*LDRGLӋQWUDQJÿăQJQKұS
.................................................................. 47
Hu
QK*LDRGLӋQWU
ang Display projects ......................................................... 48
Hu
QK*LDRGLӋQWUDQJÿăQJGӵiQ
................................................................. 49

Hu
QK*LDRGLӋQWUDQJUHYLHZ%LGGLQ
.......................................................... 50

Hu
nh 16*LDRGLӋQWUDQJ&KDW
........................................................................... 51

Hu
QK*LDRGLӋQWUDQJFKDWNK{QJWU
....................... 52
Hu
QK*LDRGLӋQWUDQJFRPSDQ
y profile ........................................................ 53
Hu
nK*LDRGLӋQWUDQJ8VHU3URILOH
............................................................... 54
Hu
QK$GPLQ[iFWKӵFGӵiQ
......................................................................... 55

9
1JX\ӉQ
+ӳX%t
nh Giáp ±/ӟS&177&
(2016-2020)


0ӢĈҪ8
1.BӕLFҧQKÿӅWjL
.

1Jj\ QD\ YӟL VӵD
SKiW

&{QJ
WULӇQ
QJKӋ
WLQ
PҥQK
WK{QJ
Yj
QJQKӳ
ӭQJ
PӁ
GөQJ PҥQK PӁ FӫD Qy
QK
WURQJ
ÿLӋQÿӡL
Wӱ NK{QJ
VӕQJ
Kӭ SKѭѫQJ
Oj
0i\O
WLӋQ Oҥ
L
OүP
FRQ
ÿӕL
QJѭӡL
Yӟ Pj Qy GҫQ
ө OjP
WUӣ
YLӋF
WKjQK

Yj
thôQJ GөQJ
tFK
YjFӫD
KӳX FK~QJ WD
à FzQ
NK{QJ
QJD\
FKӍ
g gia Fҧ
ӣWU
F
ÿuQK
7URQJQӅQNLQKWӃKLӋQQD\YӟL[XWKӃ
KyDQӅQNLQKWӃWK
LPһW
FӫD ÿӡL VӕQJ
j\ FjQJ
[m KӝL
ÿѭӧF
QJ QkQJ FDR
WUDR ÿһF
ÿәL KjQ
ELӋ
FӫDF
on QJѭӡLQJj\Fj
QJWăQJFҧYӅVӕOѭӧQJYjFKҩW
Ӌ
n nay các công ty tin
KӑFKj

QJÿҫXWKӃJLӟLNK{QJQJӯQJÿҫXWѭYj
iFJLҧLSKiSFNJQJ
n
SKҭPQKҵPFKRSKpSWLӃQKj
QKWKѭѫQJPҥLKyDWUrQLQWHU
FiFVҧQSK
và công ngKӋ
này, chúng ta GӉGjQJQKұQUDWҫPTXDQWUӑ
tҩW\ӃXFӫDW
PҥLÿLӋQW
ӱ9ӟLQKӳQJWKDRWiFÿѫQJLҧQWUrQ
QJ,QWHUQHWEDQ
ta\QKӳQJJuPuQKFҫQPjNK{QJ
SKҧLPҩWQKLӅXWKӡLJLDQ

ĈӇWLӃSFұQY
jJySSKҫQÿҭ
\PҥQKVӵS
Kә
bLӃQFӫD
WKѭѫ
QJPҥLÿLӋQWӱ
Nam, TXDNKҧRViWW
KӵFWӃ
ӣ9LӋW1DP
thì các cơQJW\QKӓWҫPWUXQJ
RһFQJ
a\FҧFiF
startXSYӅ,
7FNJQJNKiÿ{QJQKѭQJFѫKӝ

LÿӇOjPYLӋFYӟLFiFN
KjQJQѭӟFQJ
WKuUҩW tW
ӅX
PһW
QKkQ
G
Wӕ
UҩW
Ӆ
GүQ
ÿy
QKѭQJ
QKL
ÿӃQ
TXDQ
WәQJ
YҩQ
OҥL
ÿ
WKu
GDQK WLӃQJ
ӇQKұQ
FKѭD
ÿѭӧF
ÿӫ
WѭӣQJ
ÿ
Vӵ
KiFK

WLQ
Wӯ N
KjQJ FKtQK Y
GӵQJPӝWZHEVLWH
OjPFҫXQӕLJLӳDFiFGRDQK
QJKLӋSÿyYӟLNKiFKK
FWӃYӟL
ÿҧP EҧR Wӯ PӝW
GDQK
F{QJ
WLӃQJ
W\ҩW
OӟQ
kKҧ
OjPӝWÿLӅX
Fy
Vì
WKL
vұ\
tơi nghiên U
FӭX
[k\ GӵQJ³
Xây
Yj
dӵQJ
FjL
websitһW
kӃW
ӕL
doanh

Q nghiӋS
IT ViӋW 1DP
ӟL Y
khách hàng quӕFW
Ӄ
´
.

10
1JX\ӉQ
+ӳX%t
nh Giáp ±/ӟS&177&
(2016-2020)


2. 6ѫOѭӧWFi
FEѭӟFWURQJÿӅWjL
MөF
ÿtFK

ĈӅWjLÿѭӧF[k\GӵQJWUrQPөFÿtFK
WҥRUDPӝWZHEVLWHPj
h hàng
qXӕ
c WӃFyQKXFҫXWuPNLӃP
QJXӗQQKkQOӵF,7ӣ9LӋW1DP
ӧQJWӕWYj
WKjQKәQFyWKӇÿăQJWK{Q
g WLQGӵiQYjNKL
ÿyFiFF{Q

JW\,7ӣ9
LӋW1DPFyW
ÿѭӧFFѫKӝLOjPFiFGӵiQSKKӧSYӟLNK
FӫDF{QJW\

0өFWLrXFӫDÿӅWjL

'ӵNLӃQ[
ây GӵQJW
hành công website WKHRÿӅWjLÿăQJNêW
eploy lên
VHUYHUYjÿѭDYjRKRҥWÿӝQJ&iFPөFWLr
FӫDÿӅWjLFҫQÿ
ҥWÿѭӧF

x Xâ\GӵQJWK
jQKF{QJKӋWKӕQJÿăQJNêÿăQ

x ;k\ GӵQJ
hành công W
KӋ WKӕQJ ÿăQJ Nê
qX\ӅQ
ÿăQJ
GjQK
QKұ
F
doanh nghiêS,79LӋW1DPYjNKiFKKjQJTXӕ

x Xây GӵQJFKӭFQăQJÿăQJGӵiQFҫQWuP
XWKҫXFӫDNKiFK

KjQJTXӕF
tӃFKӭFQ
ăQJFKӕWQKjWKҫX

x ;k\GӵQJFKӭFQăQJÿăQJNêÿҩXWKҫX
W\,79LӋW1DP

x ;k\GӵQJFKӭFQăQJ$XGLW/RJ
gKLOҥLWҩWFҧFiFVӵN
OLrQTXDQÿӃ
WUuQKWӯÿăQJGӵiQÿ
ӃQFKӕWGӵiQ
FӫDFҧErQ
x ;k\GӵQJFKӭF
QăQJ&KDWÿӇ
2 brQWѭѫQJWi
FÿjPSK
án.

x 7ULӇQNKDLWKjQKF{QJKӋWKӕQJWURQ
KRҥWÿӝQJ

x 7ѭѫQJWKtFKYӟLFiFWKLӃWEӏQK
ѭ
ÿL
ӋQWKRҥLWK{QJPLQK
\WtQKEҧQJ
tính sách tay, máy tính ÿӇEjQ«

11

1JX\ӉQ
+ӳX%t
nh Giáp ±/ӟS&177&
(2016-2020)


.ӃWTXҧGӵNLӃQ
SDXNKLWKӵFK
LӋQÿӅWjLWKu
Fҫ
QÿҥWÿѭӧF
PӝWVӕFK
ӭFQăQJVDX
x ĈăQJQKұSÿăQJNêWjLNKRҧQ
x 4XҧQOêWjLNKRҧQWjLNK
RҧQQJѭӡLGQJ
x 4XҧQOêEjLÿăQJ'X\ӋW[y
a, VӱDFiFEjLÿăQJ

x Doanh QJKLӋS ,7 9LӋW 1DP
Gӵ
Fy
iQ
WKӇ
SK
WuP
KӧN
NKҧ QăQJ FӫD
muQK
F{QJ

QKҩW
NêÿҩX
W\
ÿӇ ÿăQJ
EҵQJ
WKҫX
K
FiF
ÿѭD UD
FiFEҧQ(VWLPDWHYӅWKӡLJLDQYjJ

x Khách KjQJTXӕFWӃFyWKӇÿăQJGӵiQ
tKҫXSKKӧS
hàng cyWKӇ[HPWUѭӟF(VWLPDWHWӯSKt
XÿăQJNêÿӇFK
WѭӧQJSKK
ӧSQK
ҩW
x 7KӕQJNrVӕO
ѭӧQJQJѭӡL
GQJFNJQJ
QKѭEjLÿăQJ

x 0ӝWVӕFKӭFQăQJFyWKӇÿѭӧFWKrP
OjPÿӅWjL

12
1JX\ӉQ
+ӳX%t
nh Giáp ±/ӟS&177&

(2016-2020)


&+ѬѪ1*&Ѫ6Ӣ/é7+8<ӂ7

Trong FKѭѫQJQj\QӝLGXQJFKtQK
VӁÿѭӧFWUuQKEj\FѫVӣ
\ӃWYӅFi
FQӅQ
WҧQ
JFiFIUDPHZRUNTX\WUuQKTXҧQ
OêF{QJQJKӋVӱ
GөQJÿӇ[k
\GӵQJY
jFjLÿһW
website.

Material UI 1 ±/jPӝWWKѭYLӋQFiF5HDFW&RPS
RQHQWÿmÿѭӧFWtF
Google's Material Design .

Next.js 2 ±Là mӝW5
eact Framework cho phép xây dӵQJ
ӭQJG
өQJK
ӛWU
ӧ
viӋF
xӱO
ý server-side-rendering mӝWF

ách dӉG
àng.

ReactJS 3 ±/jPӝWWKѭYLӋQ-DYDVFUL
SWÿDQJ
QәLOrQWURQJQKӳQ
Yӟ
L [X KѭӟQJ 6LQJOH
Trong 3DJH
khi QKӳQJ
$SSOLFDWLRQ
IUDPHZRUN
JҳQJNK
KѭӟQJÿӃQPӝWP{KuQK09&KRjQWKLӋ
QWKu5HDFWQәLEұWYӟL
Ӊdàng
SKӕLKӧSYӟ
LQKӳQJWKѭYLӋQ-DYDVFULSWNKiF

NodeJS 4 ±Là PӝWQӅ
QWҧQJFKҥ\WUrQP{LWUѭӡQJ
aScript runtime - PӝW
trình thơng GӏFK
ScULSW
-DYD
F QKDQK
Fӵ
WUuQK
FKҥ\ WUrQ
GX\ӋW &KURPH

EҥQ
FNJQJFyWKӇWҧLEӝ9YjQK~QJQyYjR
t FӭWKӭJu1RGH
MVOjPÿLӅXÿy
các web server.

HapiJS 5 ±/jPӝW
framework NodeJS, KӋWKӕQJSOXJ
LQFӫDKDSLY
ô cùng phong
SK~ Yj PҥQK
ho SKpS
PӁ
EҥQ
F WKrP
ăQJFiF
PӟLWtQK
Yj VӱD
Q OӛL Y
HapLFKRSKpSEҥQ[k\GӵQJFiF$3,FyWKӇ
ӣrӝQJÿk\OjPӝW
ÿLӇPFӝQJUҩW
FiFӭQJGөQJOӟQ

Test Driven Development 6- /jPӝWSKѭѫQJWKӭFO
jPYLӋFKD\PӝW
trình
YLӃWPmKLӋQÿҥL
. /ұSWUuQKYLrQVӁWKӵ
c hiӋQWK{QJTXDFiFEѭӟFQ

WLӃQ
ÿӝÿѭӧFÿҧPEҧROLrQWөFEҵQJFiFK
vLӃWYjFK
ҥ\FiFE
jLWHVWWӵÿӝQJD
6ӱGөQJÿӇWHVW
cho back-end.

Cypress 7 - Là front enGWHVWLQJWRROÿѭӧF[k\GӵQJ
ng :HEKLӋQ
ÿҥLĈk\OjPӝW
F{QJFөKӛWUӧKӳXKLӋXFKRGHYHOR
Yj4$WURQJNLӇPW
:HEKLӋQÿҥ
L&\SUHVVÿѭӧF[
k\GӵQJWUrQPӝWNLӃQWU~FP
g
OһS
FKҥ\NKLӭQJGөQJÿDQJÿѭӧFW
KӱQJKLӋP

PostgreSQL 8 - /j PӝW KӋ
Xҧ
n WUӏ
WKӕQJ
Fѫ
OLӋX
TVӣKӋ
Gӳ
TXDQ

-ÿӕL WѭӧQJ
(object-relational database manDJHPHQWV\VWHP
FyPөFÿtFK
WKӕQJFѫVӣ
lLӋXPmQJXӗQPӣWLrQWLӃQQKҩWKLӋQQD\

13
1JX\ӉQ
+ӳX%t
nh Giáp ±/ӟS&177&
(2016-2020)


7әQJTXDQ
YӅQӅ
QWҧQJF{QJQJKӋ
1.1.1 Material UI

Material-UI Oj PӝW WKѭ
ct &RPSRQHQW
YLӋQ FiF 5HD
hÿm
hӧS
ÿѭӧF
WKrP
Wt
F
Google's Material Design. TheR QKѭ
WKLӋX
JLӟLWUrQ WUDQJ

[k\ GӵQJ
FKӫ W
Q
tình FҧPYӟL5HDFWYj*RRJOH
V0DWHULDO'HV
. 'RÿyPj
SKҫQ
KѭӟQJGүQWUr
FKӫFӫD0
DWHULDO8,FNJQJÿmQyLQrQVӱ
GөQJ0DWHULDO
U,YӟL5HDFW
.

Material 8, ÿHP ÿӃQ FKR EҥQ Yj
W JLDR
WUDQJ
GLӋQ
ZHE
K
PӟL YӟL
utton,QKӳQJ
textfield, WRRJOH
E
ÿѭӧF GHVLJQ WKHR
thay vì viӋFQKjQKjQJѭӡLQJѭӡLGQJ%R
RWVWUDSQKѭKLӋQQD\
1.1.2. Nextjs

Ngày nayNKLOjPYLӋFWUrQPӝ

WӭQJGөQJ
JavaScript ÿѭӧFFXQJFҩSE
ct
OjWX\ӋWYӡLFKRÿӃ
QNKLEҥQQKұQU
DUҵQJFyPӝW
vài YҩQÿӅOLrQ
TXDQÿӃQYLӋF
WҩW
FҧQӝLGXQJSKt
a QJѭӡLGQJ
.

ĈҫX WLrQ
WUDQJ
Eҥ
n VӁ
FӫD
WӕQ QKLӅX WKӡL
WKӇtKӏ
KLӇQ
JLDQ
dung
QӝL
cho
KѫQ ÿӇ
QJѭӡL
GQJEӣLY
uWUѭӟFNKLQӝLGXQJÿѭӧFWҧLYӅ
WҩWFҧFi

c file JavaScript FҫQÿѭӧF
WҧL[RQJW
Uѭӟ
c và ӭQJGөQJFӫD
EҥQFҫQFKҥ\ÿӇ[iFÿӏQKQ
ӝLGXQJKLӇQ
thӏtrên trang.

7KӭKDLQ
ӃXEҥQÿDQ
g [k\GӵQJPӝWSXEOLFO\DYDL
lable weEVLWHQӝ
i GXQJFӫ
DEҥQEҳ
EXӝF
SKҧL6(2ÿӇ
QyFyWKӇWӟLÿѭӧFQJѭӡLVӱGөQ
JFҫQFKRQy
QKҩW7X\QJj\
cơQJFөWuPNLӃ
Pÿm
Kӛ
WUӧ6(2W
URQJFiFӭQJGөQJ
JavaScript1KѭQJEҥQW
ӱhình
dung xem, JLӳDPӝ
WӭQJGөQJK
ӛWUӧVҹQ6(
O theo cách trX\ӅQWK{

QJYjPӝW
ӭng GөQJ
PjF{QJFөWuP
NLӃPSKҧL
,QGH[LQJÿӇ[ӱOêWKuF{QJFө
PNLӃPVӁѭX
WLrQSKҫQ
KѫQ"'ƭQK
LrQVӁѭXWLr
n trDQJZHEKӛWU
ӧFRQWHQW6(2+70/QJD\
ÿҫX

&iFKJLҧL
qX\ӃWFӫDFҧ
KDLYҩQÿӅ
trên là server renderingFNJQJFyWKӃÿѭӧ
JӑLYӟLF
tên static pre-rendering.

Next.js cXQJ FҩS PӝW FҩX
KpR
WU~F
EҥQ
FKXQJ
GӉ GjQJ
FKR
GөQJ
[k\
S

Gӵ
Frontend React, vjGƭQKLrQQy
VӁKӛWUӧYLӋFVӱOêVHUYH
r-side rendering PӝWFiFKG
Ӊ
dàng.

14
1JX\ӉQ
+ӳX%t
nh Giáp ±/ӟS&177&
(2016-2020)


1.1.3. ReactJS

5HDFWMVOjPӝWWKѭYLӋQ-DYDVFULSWÿ
әL
lrQWURQJQKӳQJQăP
ҫQÿk\YӟL
hѭӟQJ6LQJOH3DJH$SSOLFDWLRQ
7URQJNKLQKӳQJIUDPHZRUN
NKiFFӕJҳ
QJKѭӟQJÿ
PӝW
P{KuQK09&KRjQWKLӋQWKu5HDFWQәLE
n YjGӉGjQJSK
YӟL QKӳQJ
YLӋQ
WKѭ

-DYDVFULSW
larJS
NKiF
là Pӝ
t Framework
1ӃX
choQKѭ
phép $QJ
nhúng code javasscript trong code html thơng TXD FiF DWWULEXWH
-model, ngQK
repeat«WKu YӟL
W Oj
UHDF
rary
PӝW
cho phép
OLE
nhúng code html trong code javascript
QKӡ YjR -6;
GjQJ
EҥQOӗQJ
Fy WKӇ
FiF
GӉ
ÿRҥQ
JS.Tích hӧS
+70/
gLӳD
YjR
javascript và HTML vào trong JS;OjPFKRFiFFRPSRQHQWGӉ

LӇXKѫQ

5HDFWOjPӝWWKѭYLӋQ8,SKi
WWULӇQWҥL)DFHE
RRNÿӇKӛWUӧYLӋF
WKjQKSKҫQ
(components) 8,FyWtQKWѭѫQJWiFFDRFy
JWKiLYjFyWKӇ
ÿѭӧF
5HDFW
ӧF
sӱ
ÿѭGөQ
J WҥL )DFHERRN
trong production, và www.instagram.com
ÿѭӧF
YLӃWKRjQ
toàn trên React.

0ӝWWURQJQKӳQJÿLӇPKҩSGүQFӫD5HDF
ѭ
YLӋQQj\NK{QJFK
trên phía client, Pj FzQ ÿѭӧF UHQGHU
vj Fy WKӇ
WUrQ
hau.
NӃW
VHUYHU
React QӕL
so

Yӟ
ViQKVӵWKD\ÿәLJLӳDFiFJLi
WUӏFӫDOҫQUHQGHUQj\YӟL
render WUѭӟFYjFұS
t ít
WKD\ÿәLQKҩWWUrQ'207UѭѫFNKLÿӃQFj
ҩX
KuQKFK~QJWDVӁ
kKiLQLӋPFѫEҧQ
1.1.4 NodeJS

Node.js là mӝW
hrWKӕQJSKҫQPӅPÿѭӧ
c WKLӃWNӃÿӇYLӃWFiF
có NKҧ QăQJ Pӣ UӝQJZHE
ÿһF ELӋW
&KѭѫQJ
K ÿѭӧF
Oj
WUuQ
Pi\
YLӃW
FK
-DYD6FULSWVӱGөQJNӻWKXұWÿLӅXNKLӇ
n WKHRVӵNLӋQQKkS[XҩW
Eӝ
ÿӇWӕL
WLӇX WәQJL
FKL
ÿҥL

năQJ
SKt
NKҧ
UӝQJ
Yj
Pӣ
Node.js
Wӕ baR JӗP Fy Y MD
engine FӫD*RRJOH
OLE89YjYjLWKѭYLӋQNKiF

Node.js ÿѭӧF WҥR
'DKO
EӣL Wӯ
5\DQ
QăP
W

WULӇQ
Yj
GѭӟL
SKiV
FӫD
Joyent

0өF WLrX EDQlàm
ÿҫX
cho trang
FӫD
web có'DKO

NKҧ push
QăQJ
Oj
QKѭg WURQ
PӝWVӕӭQJG
өQJZHEQ
hѭ*PDLO6DXNKLWKӱYӟLYjLQJ
FKӑQ-DYDVFU
PӝW$3,1KұS;XҩWN
K{QJÿҫ\ÿӫĈLӅX
Qj\FKRSKpSDQKFyWKӇ
ѭӟF1KұS;X
ҩW
ÿLӇXNKLӇQWKHRVӵNLӋQQRQ
-blocking.

9jL P{LWUѭӡQJroQJ
WѭѫQJ
FiFQJ{Q
Wӵ ÿѭӧF
bDR
QJӳ
JӗP
Twisted
YLӃW
NKiF
W
cho Python, Perl Object Environment cho Perl, libevent cho C và EventMachine
cho RuE\.KiFYӟLKҫXKӃWFiFFKѭѫQJWUuQK
s NK{QJFKҥ\WU

WUuQK GX\ӋW
FKҥ\ Pj
WUrQ 6HUYHU
QKLӅX
1RGHMV
i WLӃW
FK WKXұW
Nӻ
Vӱ G
FӫD
CommonJS. 1y FXQJ FҩS PӝW
Repl cho P{L
kLӇPWUѭӡQJ
WKӱNode.js
WѭѫQJ Wi
ÿѭӧF
InfowoUOGEuQKFKӑQOj
&{QJQJKӋFӫDQăPQăP
15
1JX\ӉQ
+ӳX%t
nh Giáp ±/ӟS&177&
(2016-2020)


1.1.5 HapiJS

Hapi.js là PӝWIUDPHZRUN1RGHMVPҥQKPӁÿӇ
k\GӵQJFiFJLDR
ӭQ

JGөQJ$
PI) và cáFӭQJGөQJSK
ҫQ
mӅPNKiF+DSLMVÿѭӧFJ
EӣL
(UDQ +DPPHU YjR QăP
UW WURQJ

ӱWҥL
Oê
QӛOѭX
OӵF
:DOPD
OѭӧQJ
[
W
PӛLNKL³1Jj\WKӭ6iXÿHQW
ӕL
´GLӉQUD+DSLMVFyPӝWK
SOXJLQPҥQKPӁ
QKӳQJQJ
WtQK
QәL
t QKѭ
QăEұ
idate
YDO
dӳ OLӋX
ҫX YjR
FKӭF

ÿ
QăQJ GӵD WUr
WKӵFK
LӋQEӝQKӟÿӋP[ӱOêOӛLÿăQJQKұ
S«
&KtQKYuYұ\+DSLMV
GӵQJ FiF ӭQJ GөQJ
FҩS
KӳX
FiF
tFK
JLҧL
Yj
SKiS
FXQJ
ӅX ZHEVLW
F{QJ Q
quy P{OӟQQKѭ:DOPDUW'LVQH\
PayPal và Concrete.

HapL Fy FҩX WU~F ÿѫQ JLҧQ
Vӱ GөQJ
GӉ GjQJ
&ӝQJOjP
ÿӗQ
ÿ{QJrQ
ÿҧR
EҥQ
Q
VӁ QKұQ ÿѭӧF QKLӅX VXSSRUW

phong phú và PҥQK PӁ FKR
FiF
SKpS
WtQKQăQJ
EҥQ WKrP
L YӟL
PӟLWӕF
Yj
nhanh. Hapi cho phéSEҥQ[k\GӵQJF
iF$3,FyWKӇPӣUӝQJÿk
LӇPFӝQJU
OӟQFKRFiFӭQJGөQJO
ӟQ
1.1.6 Test Driven Development

7'' 7HVW 'ULYHQ 'HYHORSPHQW
 Oj PӝW
trình YLӃWPmKLӋQÿҥL/ұSWUuQKYLrQVӁW
LӋ
n thơng qua cáFEѭӟFQKӓ%D
Yj WLӃQ ÿӝ ÿѭӧF ÿҧP EҧR OLrQ WөF EҵQJ
(auWRPDWHG WHVWV
 4Xi WUuQK OұS WUuQK
liên
WU
WөFVDX

1. 9LӃWWHV
WFKRKjPPӟLĈҧPEҧRUҵQJWHVWVӁ
il.

2. &KX\ӇQTXD
vLӃWFRGHVѫNKDLQKҩWFKRKjPÿy
3. 7ӕLѭXKyDÿRҥQFRGHFӫDKjPYӯDYLӃWV
QKҩWFKRYLӋFOұSWUuQKNӃWLӃS
4. /һSOҥLFKRFiFKjPNKiFWӯE
ѭӟF

7KӵF WӃ QrQ Vӱ GөQJ
7''
8QLW7HVW)UDPHZR
QKѭ
it trong-8Q
Java),
FK~QJWDFyWKӇFyÿѭӧFP{LWUѭӡQJKLӋX
TXDPjXVҳF
x
x

ĈӓWHVWIDLOFKX\ӇQVDQJYLӃWIXQF
;DQKOiYLӃWPӝWWHVWPӟ
LKRһF
WӕLѭXFRGHÿmYLӃWWUR

ĈLӅXOXұW
khi áp dөQJ
TDD:
x

.K{QJFKRSKpSYLӃWEҩWNǤPӝWPmFK
WHVWEӏIDLOWUӣQrQSDVV

16

1JX\ӉQ
+ӳX%t
nh Giáp ±/ӟS&177&
(2016-2020)


x
x

.K{QJFKRSKpSYLӃWQKLӅXKѫQPӝWXQ
ÿmÿӫÿӇID
il. Hãy FKX\ӇQVDQJYLӃWFRGHIXQFWL
WÿyWUѭӟF
Kh{QJFKRSKpSYLӃWQKLӅXKѫQPmFK
EӏIDLOFKX\ӇQVDQJSDVV

0{KuQKFKXWUuQKVӱGөQJ7''

Hu
nh 1: Mơ hình chu trình TDD

17
1JX\ӉQ
+ӳX%t
nh Giáp ±/ӟS&177&
(2016-2020)

1.1.7 Cypress

&\SUHVVOjIURQWHQGWHVWLQJWRROÿѭӧ
Ĉk\ Oj PӝW F{QJ Fө Kӛ WUӧ KӳX KLӋX FKR
WeEKLӋQ
ÿҥL&\SUHVVÿѭӧF[k\GӵQJWUrQPӝW
~FPӟLYjFK
ҥ\
trong cùng vòng
OһS FKҥ\ NKL ӭQJ GөQJ ÿDQJ ÿѭӧF WKӱ QJ
6HOHQLXP1KѭQJ&\SUHVVKRjQWRjQNKiFE
KҥQFKӃQKѭ6HOHQ
LXPĈL
ӅXQj\JL~SFK~QJWDWKӵFWKL
ѫQ
gLҧQYjGӉGjQJKѫQ
&\SUHVVKӛWUӧFK~QJWD
x

Set up tests

x

Write tests

x

Run tests

x

Debug Tests

ĈҵQJ VDX &\SUHVV Oj PӝWPi\ FKӫ 1RGH
WөFOLrQOҥFÿӗQJEӝ
hóa và WKӵFKLӋQFiFQKLӋPYөWKD\
cұS
YjRFҧKDLSKҫQIURQWDQGEDFN
FKRS
GөQJ WURQJ WKӡL JLDQ WKӵF ÿӗQJ WKӡL KR
\rX FҫX ÿһF. TX\ӅQ
7KѭӡQ
J WKu
FDR
QKӳQJ
KѫQ
ÿӕL WѭӧQJ
GHYHORSHUV
c QA NKL
KRһ[k\ GӵQJ PӝW ӭQJ GөQJ :H
framework.

&\SUHVVFKRSKpSQJѭӡLGQJWKӵFWKLUҩW
x

End-to-end tests

x

Integration tests

x

8QLWWHVWV&\SUHVVFyWKӇWHVWEҩ
WFӭWK
ӭJuFKҥ\WUrQWUuQK

18
1JX\ӉQ
+ӳX%t
nh Giáp ±/ӟS&177&
(2016-2020)


&ѫVӣGӳOLӋX3RVWJU
eSQL
10өFÿtFKVӱGөQJFѫVӣGӳOL

0өFÿtFKVӱGөQJFѫVӣGӳOLӋXEDRJӗ
FұSDFFHVVLELOLW\
WәFKӭFRUJDQL]DWL

/ѭ
XWUӳ
/ѭXWUӳWUrQÿƭDYjFyWKӇFKX\ӇQ
này VDQJFѫV
GӳOLӋXNKiFQӃXEҥQVӱGөQJFKRTX\P{
0LFURVRIW ([HO 0LFURVRIW $FFHVV 0\64/
GөQJFyTX\P{OӟQ
EҥQF

yWKӇFKӑQFѫVӣGӳOLӋXFy
L
serYHU«

7UX\ FұS 7UX\ FұS Gӳ OLӋX SKө WKXӝF
GөQJӣPӭFÿӝPDQJWtQKFөFEӝWUX\Fұ
QKDXQKăPWUDRÿәLKD\[
ӱOêGӳ
OLӋXQJD\ErQWURQJFKtQK
yêu cҫX
QJѭӡLGQJYѭӧWUDQJRjLFѫVӣGӳOL
Gӳ OLӋX JLӳD FiF Fѫ Vӣ Gӳ OLӋX YӟL QKDX
64/6HUYHUYjFѫVӣGӳOLӋX2UD
FOH«

TәFKӭF7әFKӭFFѫVӣGӳOLӋXSKөWK
FѫVӣ
dӳOLӋXSKk
YjWKLӃWNӃFѫVӣGӳOLӋXWӭFOjWәFKӭF
WӯQJ ӭQJ GөQJ 7X\ QKLrQ NKL Wә FKӭF Fѫ
chXҭQFӫD
KӋWKӕQJFѫVӣGӳOLӋXQKҫPWăQJWtQ
X\Fұ
p Yj[ӱOê

;ӱ Oê7\ YjR QKX FҫX WtQKWRiQ Yj
NKiFQKDXFҫQSKҧLVӱGөQJFiFSKiWELӇ
FѫVӣGӳOLӋXÿӇ[
XҩWUD
NӃWTXҧQKѭ\rXFҫXĈӇWKDRW

bên trong
FKtQKFѫVӣGӳOLӋXWDVӱGөQJFiFQJ{Q

19
1JX\ӉQ
+ӳX%t
nh Giáp ±/ӟS&177&
(2016-2020)


*LӟLWKLӋXYӅ3RVWJUH64/

PostgreSQL Oj PӝWKӋ WKӕQJ TXҧQ
-ÿӕL
WUӏ
WѭӧQJ
Fѫ
- Vӣ
R
relatioQDOGDWDEDVHPDQDJHPHQWV\VWHP