BỘ LAO ĐỘNG -THƯƠNG BINH VÀ XÃ HỘI
TRƯỜNG CAO ĐẲNG NGHỀ KỸ THUẬT CƠNG NGHỆ
-----š› & š›-----

GIÁO TRÌNH
MƠ ĐUN: LẬP TRÌNH WEB
NGHỀ: LẬP TRÌNH VIÊN MÁY TÍNH
TRÌNH ĐỘ: CAO ĐẲNG
Ban hành kèm theo Quyết định số: 13A/QĐ-CĐNKTCN ngày 10 tháng 01 năm 2019
của Hiệu trưởng Trường Cao đẳng nghề Kỹ thuật Công nghệ

Hà Nội, năm 2021
(Lưu hành nội bộ)


TUYÊN BỐ BẢN QUYỀN
Tài liệu này thuộc loại sách giáo trình nên các nguồn thơng tin có thể được phép
dùng nguyên bản hoặc trích dùng cho các mục đích về đào tạo và tham khảo.
Mọi mục đích khác mang tính lệch lạc hoặc sử dụng với mục đích kinh doanh thiếu
lành mạnh sẽ bị nghiêm cấm.
MÃ TÀI LIỆU: MĐLTV 22

1


LỜI GIỚI THIỆU
Chương trình khung quốc gia nghề Lập trình viên máy tính đã được xây dựng trên
cơ sở phân tích nghề, phần kỹ thuật nghề được kết cấu theo các môđun, môn học. Để tạo
điều kiện thuận lợi cho các cơ sở dạy nghề trong quá trình thực hiện, việc biên soạn giáo
trình kỹ thuật nghề theo các mơđun, môn học đào tạo nghề là cấp thiết hiện nay.
Mô đun MĐCNTT 22: Lập trình web là mơ đun đào tạo nghề được biên soạn theo

hình thức tích hợp lý thuyết và thực hành. Trong q trình thực hiện, nhóm biên soạn đã
tham khảo nhiều tài liệu thiết kế và lập trình web trong và ngồi nước, kết hợp với kinh
nghiệm trong thực tế sản xuất.
Mặc dầu có rất nhiều cố gắng, nhưng không tránh khỏi những khiếm khuyết, rất
mong nhận được sự đóng góp ý kiến của độc giả để giáo trình được hồn thiện hơn.
Xin chân thành cảm ơn!
Hà Nội, ngày 25 tháng 04 năm 2021
Tham gia biên soạn
1. Chủ biên : Phùng Quốc Cảnh
2. Tập thể Giảng viên khoa CNTT

Mọi thơng tin đóng góp chia sẻ xin gửi về hòm thư: , hoặc liên hệ
số điện thoại: 0359300585

2


MỤC LỤC
GIÁO TRÌNH MƠ ĐUN ............................................................................................. 5
BÀI 1: TỔNG QUAN VỀ ỨNG DỤNG WEB ............................................................ 7
1. Lịch sử phát triển của các ứng dụng Web ............................................................. 7
2. Web container và các thành phần của một ứng dụng web ..................................... 9
2.1. Khái quát về web Container: .......................................................................... 9
2.2. Các thành phần trong ứng dụng web ............................................................ 11
3. Cấu trúc file WAR ..............................................................................................13
3.1. Khái niệm File .WAR .................................................................................. 13
3.2. Cấu trúc thư mục của 1 file *.WAR ............................................................. 14
4. Cấu hình ứng dụng Web ......................................................................................16
4.1. Mơ hình Web Container ............................................................................... 17
4.2. Các bước phát triển và triển khai ứng dụng Web .......................................... 18

5. Quy trình xây dựng Web .....................................................................................20
BÀI 2: NGƠN NGỮ LẬP TRÌNH WEB ................................................................... 22
1. Giới thiệu ............................................................................................................22
1.1. Giới thiệu ngơn ngữ lập trình web ................................................................ 22
1.2. Cài đặt và thiết lập môi trường làm việc phát triển ứng dụng web ................ 25
2. Cấu trúc cú pháp và ngôn ngữ lập trình web ........................................................28
2.1. Các cấu trúc lệnh cơ bản .............................................................................. 28
2.2. Các sự kiện và xử lý sự kiện ......................................................................... 37
3. Lập trình kết nối dữ liệu ......................................................................................43
3.1. Quy trình lập trình kết nối dữ liệu ................................................................ 43
3.2. Các xử lý dữ liệu cơ bản: hiển thị, thêm, sửa, xóa, tìm kiếm, thống kê… ..... 46
4. Framework hỗ trợ phát riển ứng dụng web ..........................................................50
BÀI 3: MƠ HÌNH MVC CHO TRIỂN KHAI ỨNG DỤNG WEB ............................ 55
1. Khái niệm............................................................................................................55
1.1. Nguồn gốc ASP.NET MVC: ........................................................................ 55
1.2. Khái niệm MVC ASP.NET .......................................................................... 55
1.3. Mơ hình MVC trong JAVA:......................................................................... 56
2. Triển khai mơ hình MVC ....................................................................................57
2.1 Cài đặt IIS 7.0 trên window 7 ........................................................................ 57
2.2 Ánh xạ ứng dụng web asp.net MVC .............................................................. 59
3. Làm việc với Model ............................................................................................63
3.1. Khái niệm Model ......................................................................................... 63

3


3.2. Tạo Database: .............................................................................................. 63
4. Làm việc với View ..............................................................................................65
4.1. Khái niệm View ........................................................................................... 65
4.2. Cách sử dụng Views: ................................................................................... 66

5. Làm việc với Controller ......................................................................................68
5.1. Khái niệm Controller.................................................................................... 68
5.2. Controller Actions ........................................................................................ 68
BÀI 4: CÁC ĐỐI TƯỢNG VÀ QUẢN LÝ TRẠNG THÁI....................................... 72
1. Đối tượng Request...............................................................................................72
2. Đối tượng Response ............................................................................................73
3. Đối tượng Server .................................................................................................76
4. ViewState ............................................................................................................78
5. Session ................................................................................................................80
6. Cookie.................................................................................................................83
7. Application..........................................................................................................86
BÀI 5: TRIỂN KHAI ỨNG DỤNG WEB ................................................................. 90
1. Giới thiệu ............................................................................................................90
1.1. Sự ra đời của web services ........................................................................... 90
1.2. Vai trò và đặc điểm của web services ........................................................... 91
2. Quy trình triển khai và quản lý ứng dụng web .....................................................91
2.1. XML - Extensible Markup Language ........................................................... 91
2.2. SOAP - Simple Object Access Protocol ....................................................... 91
2.3. VVSDL - Web Services Description Language ............................................ 92
2.4. UDDI - Universal Description, Discovery, and Integration .......................... 92
3. Xây dựng và quản lý các services ........................................................................92
TÀI LIỆU THAM KHẢO ....................................................................................... 100

4


GIÁO TRÌNH MƠ ĐUN
Tên mơ đun: Lập trình web
Mã số mơ đun: MĐLTV22
Vị trí, tính chất, ý nghĩa và vai trị của mơ đun:

- Vị trí: Mơ đun Thiết kế và lập trình web được bố trí sau khi sau khi sinh viên học
xong các mô đun/môn học Tin học cơ bản I, HTML+CSS, JAVASCRIPT, Lập trình cơ
bản, lập trình hướng đối tượng, hệ quản trị cơ sở dữ liệu.
- Tính chất: Mơ đun Lập trình web giúp cung cấp cho người học kiến thức cơ bản
về lập trình web phía Server (Back End). Mơ đun giúp người học xây dựng ứng dụng web
tương đối hồn chình bằng cách kết hợp kiến thức của mô đun/môn học HTML &CSS,
Javascript cho phần Front Page;
- Vai trị và ý nghĩa: Mơ đun là một trong những mô đun nghề quan trọng định
hướng nghề cho sinh viên khi ra trường.
Mục tiêu của mô đun:
- Về kiến thức:
+ Hiểu và trình bày được đặc trưng của ứng dụng Web
+ Trình bày được quy trình xây dựng website cách cấu hình ứng dụng Web và triển khai
một website
+ Trình bày được cấu trúc cơ bản của một trong các ngơn ngữ lập trình web (PHP,
ASP.NET, JSP)
+ Trình bày được các nội dung, các chức năng cơ bản cần xây dựng cho các ứng dụng
web
+ Hiểu và trình bày được quy trình xử lý dữ liệu giữa các WebPage trong các Website.
- Về kỹ năng:
+ Sử dụng được ngơn ngữ lập trình web để xây dựng ứng dụng web kết nối và xử lý dữ
liệu phía server.
+ Sử dụng được Framework phát triển ứng dụng web để hỗ trợ xây dựng ứng dụng web.
+ Sử dụng và quản lý được các đối tượng cơ bản của website như Request, Response,
Cookie, Session, ViewSate, Application…
+ Hiểu và xây dựng được ứng dụng web theo mơ hình MVC
- Về năng lực tự chủ và trách nhiệm:
+ Tham gia các dự án lập trình web trong thực tế.
+ Khả năng tìm tài liệu, đọc hiểu tài liệu
+ Khả năng làm việc nhóm

Nội dung của mơ đun:
Thời gian
Số
Tên các bài trong mô đun
Tổng
Lý
Thực
Kiểm
TT
số
thuyết
hành
tra*
1 Bài 1: Tổng quan về ứng dụng Web
1. Lịch sử phát triển của các ứng dụng
Web
2. Web container và các thành phần của
15
5
10
một ứng dụng web
3. Cấu trúc file WAR
4. Cấu hình ứng dụng Web
5. Quy trình xây dựng Web

5


2


3

4

5

Bài 2: Ngơn ngữ lập trình Web
1. Giới thiệu
2. Cấu trúc cú pháp và ngơn ngữ
3. Lập trình kết nối dữ liệu
4. Framework hỗ trợ phát riển ứng dụng
web
Bài 3: Mơ hình MVC cho triển khai ứng
dụng Web
1. Khái niệm
2. Triển khai mơ hình MVC
3. Làm việc với Model
4. Làm việc với View
5. Làm việc với Controller
Bài 4: Các đối tượng và quản lý trạng
thái
1. Đối tượng Request
2. Đối tượng Response
3. Đối tượng Server
4. ViewState
5. Session
6. Cookie
7. Application
Bài 5: Triển khai ứng dụng Web
1. Giới thiệu

2. Quy trình triển khai và quản lý ứng dụng
web
3. Xây dựng và quản lý các services
Thi kết thúc mô đun
Cộng

6

30

15

14

25

5

20

30

3

26

1

19


1

17

1

87

1
4

1
120

29

1


BÀI 1: TỔNG QUAN VỀ ỨNG DỤNG WEB
Mã bài: MĐLTV22-01
Giới thiệu:
Chúng ta đã quá quen thuộc với việc gõ lên thanh URL trên màn hình Internet
Explorer (IE), Firefox, Chrome những dịng chữ: h blah…com. Từ “Web”
mà chúng ta đang tìm hiểu là tên gọi tắt của “World Wide Web” (chính là chữ www nhìn
thấy trong URL bên trên). Khi mạng máy tính tồn cầu internet ra đời, nó mở ra một mơi
trường mạng lưới ảo kết nối mọi máy tính (như mạng nhện – web). Trong đó, tất cả máy
tính trở thành những đầu mút kết nối lẫn nhau, mỗi đầu mút chia sẻ thơng tin, tài liệu mà
nó lưu trữ để tất cả đầu mút khác có thể truy cập và ngược lại. Khi ta kết nối máy tính của
mình vào bất kỳ đầu mút nào, ta cũng có thể tiếp cận thông tin của tất cả nơi khác trên

mạng lưới.
Cùng với sự phát triển không ngừng, theo thời gian tất cả máy tính kết nối trong
mạng lưới được phân hóa theo 2 mục đích chun biệt:
- Server: có dung lượng lưu trữ lớn và cấu hình rất mạnh chỉ nhằm mục tiêu chia sẻ
thơng tin
- Client/Workstation: đây chính là máy tính cá nhân/thiết bị của chúng ta khi kết
nối internet, chỉ nhằm mục đích truy cập thơng tin từ nơi khác và chia sẻ một lượng
rất nhỏ thông tin
Mục tiêu bài học:
- Trình bày được vai trị và tác dụng, sự phát triển của các ứng dụng web.
- Trình bày các thành phần, quy tình xây dựng ứng dụng Web
- Trình bày và thực hiện được cấu hình ứng dụng Web
- Thiết kế được giao diện web
- Trình bày được ưu nhược điểm của một số ngôn ngữ lập trình Web
Nội dung chính:
1. Lịch sử phát triển của các ứng dụng Web
Ngày nay, Internet đã trở thành một phần quan trọng trong cuộc sống của mỗi
người ở hầu hết các quốc gia tiến bộ. Trong mười năm qua, đối tượng sử dụng các lợi ích
của Internet hàng ngày đã vượt quá 50 triệu người dùng và tiếp tục tăng.
Các ứng dụng phần mềm và hệ thống thông tin hiện đại đã đạt đến mức độ phát
triển đến mức thuật ngữ kiến trúc trực tuyến mà áp dụng cho chúng dường như khơng cịn
tồn tại. Tạo ra một hệ thống thông tin hoạt động hiệu quả và đáng tin cậy từ đầu không dễ
hơn là xây dựng và xây dựng một tòa nhà đa chức năng hiện đại. Do đó, thuật ngữ kiến
trúc ứng dụng web.
Trong khi nhiều nhà phát triển hiện đại cố gắng học cách thiết kế một ứng dụng
web sẽ hấp dẫn và có lợi hơn so với các nhà phát triển khác, thì điều quan trọng là làm nổi
bật những lợi thế chính của các ứng dụng đó: Các ứng dụng web có giá cả phải chăng hơn
và dễ cài đặt hơn. Bằng cách sử dụng các ứng dụng như vậy, doanh nghiệp có thể giảm
chi phí duy trì các bộ phận CNTT chịu trách nhiệm cài đặt phần mềm và bảo trì phần
mềm.

Cập nhật ứng dụng web ít phức tạp hơn và ít tốn kém hơn. Chi phí bảo trì phần
mềm ln là một bài viết thiết yếu về chi tiêu cho bất kỳ công ty nào. Một ứng dụng web
phải được cập nhật chỉ trên máy chủ, từ đó mọi người sẽ có thể làm việc với phiên bản
mới ngay lập tức.

7


Các ứng dụng web linh hoạt và thiết thực hơn cho người dùng cuối. Yêu cầu duy
nhất là cài đặt ứng dụng web trên máy chủ hỗ trợ bất kỳ HĐH hiện đại nào (Mac OS,
Windows, Linux, v.v.) và có thể sử dụng ứng dụng này qua Internet trên bất kỳ máy tính
hoặc thiết bị di động nào.
Các ứng dụng web tăng cường tổ chức lưu trữ dữ liệu. Nếu có nhu cầu hoạt động
với cùng một dữ liệu từ các vị trí khác nhau, việc tổ chức lưu trữ của nó ở một nơi cụ thể
sẽ đơn giản hơn nhiều. Nó loại bỏ nhu cầu đồng bộ hóa và tăng tính bảo mật của thơng tin
có giá trị.
Với tất cả những lợi thế này, các nhà phát triển khao khát chỉ phải đối mặt với một
thách thức liên quan đến việc xây dựng các ứng dụng web - loại và thành phần nào của
kiến trúc ứng dụng web sẽ sử dụng
Cùng với sự phát triển mạnh mẽ về công nghệ thông tin, đặc biệt là sự phát triển hệ
thống mạng intranet, internet... Trong các lĩnh vực ngày nay như : thương mại, y tế, giáo
dục..., nhu cầu trao đổi thông tin thực sự là cần thiết, giúp cho công việc được triển khai
nhanh , chính xác, dễ dàng và tiết kiệm chi phí, thơng tin được cập nhật kịp thời. Do đó
vấn đề đặt ra là chúng ta cần phải có một ứng dụng cho phép trao đổi thơng tin mọi lúc,
mọi nơi, dễ sử dụng,. thông qua mạng. Ứng dụng Web đáp ứng được các yêu cầu đặt ra và
sau đây là các lý do tại sao chúng ta phải sử dụng Web :
- Dễ dàng trao đổi và chia sẽ thông tin thông tin qua mạng .
- Sử dụng giao diện đồ họa giúp cho người dùng dễ sử dụng
- Hỗ trợ về multimedia như : hình ảnh , âm thanh, phim ảnh,.
- Hỗ trợ nhiều chương trình(web-browser) để truy cập Web.

- Hỗ trợ truy cập web trên các thiết bị đi động: PocketPC, SmartPhone,.
- Hỗ trợ nhiều ngôn ngữ để phát triển Web: ASP, ASP.NET, JSP, PHP
+ Web client (Browser)
Máy khách(Client) sẽ sử dụng chương trình để truy cập đến các trang web gọi là
trình duyệt web hay browser. Hiện rất nay có nhiều trình duyệt web như : Internet
Explorer , Nescape, Mozila FireFox,..
+ Web server
Các máy chủ(Server) chứa các ứng dụng Web, sẳn sàng truy xuất các trang web
hay các tài liệu và gửi về cho client khi nhận được yêu cầu từ phía Client. Hiện nay có rất
nhiều Web server và chạy trên nhiều hệ thống như : Apache, Microsoft,Sun,.
+ Giao thức HTTP
Quá trình giao tiếp giữa client và server được thực hiện thông qua giao thức chuẩn
HTTP(HyperText Transfer Protocol).Hình minh họa sau mơ tả việc truy cập ứng dụng
Web.

8


Hình 1.1: Minh họa truy cập ứng dụng Web
- Web được phát triển trên mơ hình client-server
- Giao thức HTTP: Quá trình giao tiếp giữa client và server được thực hiện thơng qua
giao thức chuẩn HTTP(HyperText Transfer Protocol).
- Mơ hình gồm hai thành phần chính là: máy khách(client) và máy phục vụ(server). Máy
phục vụ(server) sẽ chứa các ứng dụng Web và các ứng dụng Web này sẽ được quản lý tập
trung bởi trình quản lý gọi là Web Server (IIS,...). Các máy khách(client) truy cập đến
ứng dụng web sử dụng trình duyệt web(browser).
- Client sử dụng giao thức HTTP Request để gửi yêu cầu(trang web) lên Server, Server xử
lý và sử dụng giao thức HTTP Response để gửi kết quả về cho Client.
2. Web container và các thành phần của một ứng dụng web
2.1. Khái quát về web Container:

Servlet không có phương thức main(). Nó được điều khiển bởi một Java app gọi là
Container
Tomcat là mọt ví dụ thể hiện của một container. Khi ứng dụng web server (Ví dụ:
Apache) nhận được một request cho một servlet, server người điều hành request chứ
khơng phải bản thân servlet và Container chính là nơi servlet được triển khai (deployed)
Chính container sẽ đưa cho sevlet HTTP request và response và chính container sẽ gọi các
phương thức của servlet như doget(), dopost().

Container mang đến những lợi ích sau:

9


+ Hỗ trợ giao tiếp (Communication support) : Container đưa ra cho bạn một cách thức
rất dễ dàng để giao tiếp với webserver. Bạn không cần phải tạo socket, lắng nghe port hay
tạo stream … Container tự biết được giao thức giữa server và chính nó vì vậy servlet
khơng phải lo lắng về API giữa serverweb và webapp. Tất cả bạn cần phải quan tâm chính
là nghiệp vụ (business) logic của chính bạn, cái mà bạn sẽ đặt trong servlet
+ Quản lý chu kỳ sống (Lifecycle management): Container điều khiển việc sống hay
chết của servlet. Trong coi việc tải các classe, đưa ra các phiên bản (instantiating) và khởi
tạo servlet, gọi các phương thức của servlet và đưa các servlet không sử dụng vào garbage
collection. Dưới sự điều khiển của container, bạn không cần quan tâm quá nhiều đến việc
quản lý tài nguyên.
+ Hỗ trợ đa luồng (multithreading support): Container tự động khởi tạo một thread
mới cho bất kỳ một servlet nào mà nó nhận được. Khi việc xử lý HTTP service của servlet
được hồn tất, thread đó cũng sẽ kết thúc. Tuy nhiên, điều đó khơng có nghĩa rằng thread
bạn đang chạy là an toàn tuyệt đối, bạn vân có thế gặp phải các vấn đề về đồng
bộ (synchronization). Nhưng dù sao, có một server để tạo và quản lý nhiều request cũng
giúp bạn tiết kiệm được khá nhiều thời gian.
+ Bảo mật khai báo (declarative sercurity): Với container bạn có thể sử dụng file XML

deployment descriptor để định hình và thay đổi các khai báo một cách an tồn mà khơng
cần phải set cứng giá trị trong class hay servlet. Bạn có thể quản lý và thay đổi khai báo
một cách an tồn mà khơng cần phải chỉnh sủa hay biên dịch lại phần java code
+ Hỗ trợ JSP: Đơn giản là container có thể chuyển từ JSP code sang Javacode.
Thành phần trong Web Container

+ ckeditor: trình soạn thảo văn bản trên web application.
+ com: thư mục lưu các file jsp mặc định của WAK (bao gồm các tính năng cảnh báo, quy
trình, trang web).
+ customize: bao gồm những file ảnh và 4 file jsp thực hiện việc customize trước khi
login vào hệ thống.
+ dbutil: thư mục lưu các file jsp hỗ trợ tiện ích CSDL.
+ fonts: Lưu fonts của WAK.

10


+ images: thư mục chứa ảnh.
+ include: tập hợp những file để xây dựng lên các thành phần của web.
+ install: Lưu các file hỗ trợ khi cài gói WAK.
+ js: Lưu các file javascript .js của web.
+ layout: tổng hợp cấu trúc xây dựng lên các layout của web.
+ module: tổng hợp các file xây dựng lên các kiến trúc của web như thống kê, biểu đồ…
+ olap: Hỗ trợ báo cáo Olap.
+ skin: chứa các file css của web
+ resource: lưu file index.jsp.
+ Các file khác như:
- access_denined.jsp: Thực hiện nhiệm vụ hiển thị thơng báo khơng có quyền truy
cập
- basic_auth.jsp

- browser.jsp: hiển thị chi tiết thông tin web
- change_password.jsp, login.jsp, logout.jsp, restart_webserver.jsp
…
2.2. Các thành phần trong ứng dụng web
Ứng dụng web là một loại chương trình chọn lọc được xây dựng trên kiến trúc máy
khách-máy chủ. Điểm đặc biệt của nó nằm ở chỗ ứng dụng web được định vị và thực thi
trên máy chủ, trong khi máy khách chỉ nhận được kết quả hoạt động. Công việc của một
ứng dụng như vậy dựa trên việc nhận yêu cầu từ người dùng, quá trình xử lý và phân phối
kết quả của họ. Việc chuyển yêu cầu và hậu quả của việc xử lý chúng được thực hiện
thông qua Internet. Một trong những điểm cộng của phương pháp này là việc khách hàng
không phụ thuộc vào hệ điều hành cụ thể của người dùng, do đó, tạo ra các ứng dụng web
cho các dịch vụ đa nền tảng.
Một ứng dụng cụ thể - trình duyệt (Google Chrome, Safari, Opera, v.v.) - thường
tham gia vào việc hiển thị kết quả yêu cầu của khách hàng, cũng như nhận dữ liệu từ anh
ấy / cô ấy và gửi đến máy chủ. Một trong những chức năng chính của trình duyệt là hiển
thị dữ liệu được thu thập từ Internet dưới dạng một trang được mơ tả bằng HTML. Do đó,
kết quả được truyền bởi máy chủ đến máy khách phải được trình bày bằng ngơn ngữ này.
Ứng dụng web của phía máy chủ thực hiện, với sự trợ giúp của phần mềm đặc biệt (máy
chủ web) nhận yêu cầu của người dùng, xử lý chúng, tạo phản hồi dưới dạng trang được
mô tả trong HTML và gửi cho khách hàng.
Các loại máy khách trong một URL cụ thể.
Trình duyệt nhận được yêu cầu, xác định vị trí của trang web cần thiết (được cung
cấp bởi một máy tính có truy cập Internet) và yêu cầu truy cập vào trang web đó.
Máy chủ truyền thơng tin đến trình duyệt.
Trình duyệt có nghĩa là dịch dữ liệu đã gửi, do đó người dùng sẽ có thể hiển thị kết quả
yêu cầu của mình trên máy tính của họ.
Các giải pháp kiến trúc nằm trong cốt lõi của bất kỳ ứng dụng web nào, kể cả những ứng
dụng có tải trọng cao. Điều quan trọng là phải hiểu rằng kiến trúc ứng dụng web quyết
định 95% thành công của hoạt động, bao gồm khả năng đối phó với tải trọng cao.
Kiến trúc ứng dụng web hoạt động:

Như đã nói trước đây, các ứng dụng web hoạt động theo nguyên tắc tương tác giữa
máy khách và máy chủ, địi hỏi hai chương trình hoạt động đồng thời. Một trong số họ xử

11


lý các u cầu của người dùng thơng qua trình duyệt web, hiển thị cho họ kết quả tìm
kiếm. Một cái khác, dựa trên máy chủ, xử lý yêu cầu HTTP đã được gửi đi.
Vì cả trình duyệt (máy khách) và người trả lời (máy chủ) đều hoạt động với các mã
cụ thể, nên việc lựa chọn ngôn ngữ lập trình phải dựa trên sự tương tác của các mã này liệu mã máy chủ có tương tác thành cơng với mã trình duyệt khơng? Chun gia làm việc
trong lĩnh vực này có xu hướng sử dụng các ngơn ngữ sau ở phía máy chủ:
+ JavaScript
+ PHP
+ Ruby on Rails , v.v.
Đối với mã phía người dùng, các ngơn ngữ máy tính phổ biến nhất là:
+ HTML
+ JavaScript
+ CSS.
Điều đáng chú ý là mã trình duyệt trên máy tính có thể được mở và thay đổi bởi
máy khách, không giống như các tập lệnh của máy chủ. Trình duyệt chỉ hoạt động với yêu
cầu HTTP, đáp ứng dữ liệu được nhập bởi người dùng.
Tại sao bạn cần kiến trúc ứng dụng web?
Thiết kế kiến trúc web là một phần quan trọng trong việc tạo ra các dự án web nhỏ
nhất. Khơng có điều này, gần như khơng thể tưởng tượng được để xây dựng một đại diện
tốt của một mô hình phần mềm hoạt động ổn định với hiệu suất thỏa đáng.
Các ứng dụng web đáng tin cậy chỉ có thể được tạo thông qua bố cục chất lượng cao. Nếu
ứng dụng có thể được sử dụng trên nhiều thiết bị khác nhau, nếu cả tập lệnh máy chủ và
người dùng có thể hợp tác thành cơng với nhau, một ứng dụng như vậy sẽ ln có nhu cầu
cao. Vì các chương trình được xây dựng với việc sử dụng kiến trúc web hiện đại phù hợp
có thể hoạt động an tồn với thơng tin của khách hàng, cung cấp các tùy chọn bổ sung (ủy

quyền, cập nhật và loại bỏ dữ liệu của người dùng), mọi doanh nghiệp đáng tin cậy nên
đặc biệt chú ý đến vấn đề này.
Các thành phần của kiến trúc ứng dụng web
Tính năng này của xây dựng ứng dụng web bao gồm một số khía cạnh đảm bảo
hiệu suất kỹ thuật số của nó. Các thành phần như vậy có thể được chia thành hai loại: nội
bộ (giao diện máy khách) và các yếu tố xây dựng. Thiết kế giao diện người dùng tập trung
chủ yếu vào nhu cầu thẩm mỹ và thực dụng của khách hàng. Trải nghiệm thoải mái khơng
thể có được nếu khơng có tùy chọn xác thực thuận tiện và các cài đặt hữu ích khác. Các
thành phần ứng dụng web quan trọng hơn được đại diện bởi:
Các máy chủ của cơ sở dữ liệu. Máy chủ cơ sở dữ liệu lưu giữ tất cả các thông tin
cần thiết sẽ được xử lý thêm bởi máy chủ ứng dụng.
Trình duyệt được sử dụng bởi khách hàng. Chương trình này kiểm soát giao tiếp giữa máy
khách và ứng dụng web.
Các ứng dụng web, trên đó máy chủ dựa trên. Điều này thực hiện các quy tắc và hạn chế
đối với các hoạt động tự động và cung cấp sự kiên trì dữ liệu.
Các loại kiến trúc ứng dụng web
Những loại kiến trúc web hiện đại nào được các nhà phát triển ngày nay áp dụng
rộng rãi?
Microservice là một loại kiến trúc hướng dịch vụ (SOA) được áp dụng để hình
thành các hệ thống phần mềm phân tán. Các mơ hình thành phần trong loại kiến trúc ứng
dụng web này tương tác qua mạng trong khi hoàn thành một mục tiêu chung. Điều quan

12


trọng là phải hiểu rằng microservice là sự phân mảnh chức năng để nó có sẵn cho các
phần khác của hệ thống. Hơn nữa, sự phân mảnh chức năng này kỹ lưỡng đến mức một số
lượng chức năng tối thiểu được triển khai trong mỗi microservice.
Các ứng dụng trang đơn hoặc SPA có phần gợi nhớ đến các ứng dụng máy tính để bàn.
Kiểu thiết kế kiến trúc web này được tổ chức theo cách mà khi người dùng tiến tới một

trang mới, chỉ một phần nội dung được cập nhật. Do đó, khách hàng khơng phải tải lại các
thành phần tương tự. Nó là vơ cùng thuận tiện cho cả nhà phát triển và người dùng. Một
trong những ngôn ngữ lập trình phổ biến nhất - JavaScript - được sử dụng để phát triển
SPA.
Kiến trúc khơng có máy chủ. Một kiểu kiến trúc ứng dụng web như vậy có nghĩa là
các nhà phát triển khơng cịn cần phải định cấu hình và quản trị các máy chủ chạy phần
mềm quản lý. Tuy nhiên, nó khơng có nghĩa là hồn toàn thiếu máy chủ. Về bản chất, các
nhà cung cấp bên thứ ba hỗ trợ toàn bộ cơ sở hạ tầng, trong khi các chức năng cần thiết
được cung cấp dưới dạng dịch vụ chịu trách nhiệm cho các quy trình ủy quyền, truyền tin
nhắn, v.v.
3. Cấu trúc file WAR
3.1. Khái niệm File .WAR
WAR là Compressed Files - Java Web Archive, dưới định dạng Binary được phát
triển bởi Oracle.
Một tập tin WAR là một gói phần mềm nén chứa các thành phần web dựa trên Java
và các ứng dụng đang chạy trên một máy chủ web. Nó được định dạng theo cùng một
cách như là một file .JAR, nhưng bao gồm thông tin bổ sung cho các máy chủ ứng dụng
mà lớp Java servlet để chạy
Cách mở .WAR file
Để mở file .WAR click đúp (double click) vào tập tin. Hoặc phải chuột (right click)
vào tập tin và chọn Mở (Open) Một số file mở rộng cần cài phần mềm chuyên dụng để
mở. Trong một số trường hợp file .WAR bị lỗi cần phải sửa (fix) mới có thể mở được.
Dùng các phần mềm/hoặc công cụ dưới đây để mở và sửa file lỗi.
Phần mềm mở file .WAR
Dưới đây là danh sách các phần mềm có thể mở, chuyển đổi hoặc sửa file file .WAR
do người dùng sử dụng
· Smith Micro StuffIt Deluxe Mac 16
· File Viewer Plus
· File Viewer Plus
· RARLAB WinRAR

· ESTsoft ALZip
· Apache Tomcat
· Apache Tomcat
Chuyển đổi file .WAR
File .WAR có thể được chuyển đổi sang định dạng khác để phù hợp với mục đích sử
dụng. Thơng thường các phần mềm có thể mở file có thể chuyển đổi được định dạng khác.
+File .jar: là viết tắt của Java Archive, là tệp được đóng gói từ các class đã được biên
dịch sẵn chỉ việc chạy trên máy tính hoặc được dùng để làm thư viện cho các chương
trình.

13


+ File .pom: hay pom.xml là nơi chứa các config cho project và chứa các dependencies
của project.
+ File .war: cũng là một file đóng gói dạng như jar nhưng dùng ở trên máy chủ web.
dùng jsp/servlet, spring core hay spring mvc đều phải cấu hình đóng gói dưới dạng war để
deploy(cấu hình trong pom.xml - ảnh dứoi). chỉ có spring boot là ko cần thiết.
· jar: đây là các gói thư viện được thêm vào để sử dụng các function.
· pom: chưa các đường dẫn, setting để download các file jar về.
· war: thường là các file khi build project sẽ tự sinh.

Cả cấu trúc của jar và war đều là định dạng nén zip. Lúc trước hay dùng trình nén
mặc định của Windows để giải nén/nén các tập tin jar của các trị chơi J2ME.
Ứng dụng Web có thể được triển khai ở 2 dạng
+ Một file *.war
+ Một thư mục, cấu trúc giống file *.war file (thư
mục build)
+ Sử dụng dạng file *.war khi muốn triển khai
trên 1 remote machine

File .WAR : Là gói triển khai được trên web container
+ Tương tự như file *.jar
+ Chứa tất cả thành phần cần thiết:
+ Web components (servlets hoặc JSP)
+ Các Class tiện ích
+ Nội dung tĩnh (HTML, image, …)
+ Các lớp phía Client (applets và các lớp tiện ích)
+ Có nội dung giống như thư mục build
3.2. Cấu trúc thư mục của 1 file *.WAR

14


Tạo 1 file *.WAR
3 cách khác nhau:
+ Sử dụng IDE (NetBeans)
+ Sử dụng công cụ ant
+ “asant create-war” (J2EE 1.4 tutorial)
+ Sử dụng lệnh “jar cvf <filename>.war .” khi ở
trong thư mục build
Ví dụ 1: Tạo file hello2.war với lệnh “asant create-war”
C:\j2eetutorial14\examples\web\hello2>asant create-war
Buildfile: build.xml
...
create-war:
[echo] Creating the WAR....
[delete] Deleting:
C:\j2eetutorial14\examples\web\hello2\assemble\war\hello2.war
[delete] Deleting directory
C:\j2eetutorial14\examples\web\hello2\assemble\war\WEB-INF

[copy] Copying 1 file to
C:\j2eetutorial14\examples\web\hello2\assemble\war\WEB-INF
[copy] Copying 2 files to
C:\j2eetutorial14\examples\web\hello2\assemble\war\WEB-INF\classes
[war] Building war:
C:\j2eetutorial14\examples\web\hello2\assemble\war\hello2.war
[copy] Copying 1 file to C:\j2eetutorial14\examples\web\hello2
Ví dụ 2: Tạo file hello2.war sử dụng lệnh ja
C:\j2eetutorial14\examples\web\hello2\build>jar cvf hello2.war .
added manifest
adding: duke.waving.gif(in = 1305) (out= 1295)(deflated 0%)
adding: servlets/(in = 0) (out= 0)(stored 0%)
adding: servlets/GreetingServlet.class(in = 1680) (out= 887)(deflated 47%)
adding: servlets/ResponseServlet.class(in = 1090) (out= 572)(deflated 47%)
C:\j2eetutorial14\examples\web\hello2\build>jar xvf hello2.war

15


created: META-INF/
extracted: META-INF/MANIFEST.MF
extracted: duke.waving.gif
created: servlets/
extracted: servlets/GreetingServlet.class
extracted: servlets/ResponseServlet.class
Thư mục WEB-INF
Chứa:
+ web.xml : Web application deployment descriptor
+ Các file JSP tag library descriptor
+ Classes : là thư mục chứa các lớp phía server:

servlets, lớp tiện ích, các JavaBeans
+ lib : là thư mục chứa các file thư viện JAR (tag
libraries, các thư viện tiện ích được gọi bởi các
lớp phía server)
4. Cấu hình ứng dụng Web
Thơng số cấu hình được đặc tả trong file web.xml (Web Applications
Deployment Descriptor)
Prolog (web.xml)
Tất cả tài liệu XML cần có prolog
<?xml version="1.0" encoding="UTF-8"?>
xmlns=" />xmlns:xsi=" />xsi:schemaLocation= />s/javaee
version="3.0">
Alias Paths (web.xml)
Khi 1 Servlet container nhận 1 request, nó cần biết
Web component nào trong ứng dụng Web sẽ xử lý
request này.
+ Thực hiện map URL path trong request tới 1 Web
component
+ Alias Path có thể có 2 dạng
+ /alias-string (cho servlet) hoặc
+ /*.jsp (cho JSP)
Đoạn mã code :web.xml
<servlet>
<servlet-name>GreetingServlet</servlet-name>
<servlet-class>servlets.GreetingServlet</servlet-class>
</servlet>
<servlet>
<servlet-name>ResponseServlet</servlet-name>
<servlet-class>servlets.ResponseServlet</servlet-class>

</servlet>
<servlet-mapping>

16


<servlet-name>GreetingServlet</servlet-name>
<url-pattern>/greeting</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>ResponseServlet</servlet-name>
<url-pattern>/response</url-pattern>
</servlet-mapping>
4.1. Mơ hình Web Container

17


4.2. Các bước phát triển và triển khai ứng dụng Web
Viết code (và biên dịch) cho các Web component
Servlet/JSP sử dụng trong web component
- Tạo các tài nguyên tĩnh (Images, các trang HTML)
- Viết file deployment descriptor (web.xml)
- Build ứng dụng Web (Tạo file *.war hoặc thư mục
dạng chưa đóng gói nhưng triển khai được)
- Triển khai ứng dụng Web trên 1 Web container
- Web clients có thể truy cập ứng dụng qua URL
Tạo cấu trúc cây thư mục:
Tạo cấu trúc cây thư mục (Development Tree
Structure) cho việc viết ứng dụng web

- Thư mục gốc bao gồm:
- src: Mã nguồn Java cho các servlets và các
JavaBeans
+ web: các trang JSP, HTML, images
+ Có thể sử dụng IDE Netbeans để hỗ trợ
Ví dụ: Cấu trúc cây project ch1

18


Đoạn mã code: Ch1Servlet.java
import java.io.*;
import javax.servlet.*;
import javax.servlet.http.*;
public class Ch1Servlet extends HttpServlet {
@Override
protected void doGet(HttpServletRequest request, HttpServletResponse
response) throws ServletException, IOException {
PrintWriter out = response.getWriter();
java.util.Date today = new java.util.Date();
out.println("<html> " + "<body> "
+ "

Servlet

"
+ "
" + today + "</body>" + "</html>" );
}
}
Đoạn mã code: web.xml
<?xml version="1.0" encoding="UTF-8"?>
<web-app version="3.0" xmlns=" />xmlns:xsi=" />xsi:schemaLocation=" /> /><servlet>
<servlet-name>Chuong 1 Servlet</servlet-name>
<servlet-class>Ch1Servlet</servlet-class>

</servlet>
<servlet-mapping>
<servlet-name>Chuong 1 Servlet</servlet-name>
<url-pattern>/Serv</url-pattern>
</servlet-mapping>
</web-app>
Biên dịch & triển khai trong Netb
iên dịch
+ Các file được biên dịch thành file .class

Request từ client

19


Trên trình duyệt gõ:
http://localhost:8084/ch1/Serv

5. Quy trình xây dựng Web

Hình 1.2. Vị trí của nhóm thiết kế triển khai trong bộ phận thiết kế
Chúng ta đã có tài liệu về yêu cầu mơ hình cơ sở dữ liệu, các trách nhiệm đối với
từng khối thông tin một cách chi tiết. Tại bước này chọn ra các phần tử thiết kế vật lý, các
modul chương trình và phương thức tích hợp hệ thống.
Từ tài liệu về kiến trúc hệ thống đã chọn hệ thống của chúng ta chạy trên máy ảo,
hệ điều hành nào, các phương thức xử lý được viết bằng ngơn ngữ gì, kết nối giữa các lớp
từ giao diện người sử dụng đến lớp dữ liệu.
Bây giờ tổng hợp toàn bộ các tài liệu trên và làm minh họa chúng một lần nữa, và
cần xem lại có cần thêm bớt phần tử nào khơng. Ví dụ nếu ta sử dụng một Component nào
có sẵn liên kết vào chương trình của chúng ta chẳng hạn.

Để tiếp tục triển khai việc thực hiện xây dựng phải lập ra một kế hoạch thực hiện
xây dựng hệ thống. Phân công cho từng người hoặc nhóm người thực hiện. Như thế chúng
ta phải nắm được mọi hoạt động của các khâu xây dựng. Với mỗi khâu cần xác định chi

20


tiết các công việc phải làm và định ra khoảng thời gian cho cơng việc đó. Quan đó có thể
kết hợp làm việc song song để rút ngắn thời gian thực hiện

Hình 1.3. Các hoạt động của các nhóm khác trong q trình sản xuất web
Câu hỏi ơn tập bài 1
Câu 1: Trình bày được vai trị và tác dụng, sự phát triển của các ứng dụng web?
Câu 2: Trình bày các thành phần, quy tình xây dựng ứng dụng Web?
Câu 3: Trình bày và thực hiện được cấu hình ứng dụng Web?
Câu 4: Trình bày được ưu nhược điểm của một số ngơn ngữ lập trình Web?
Bài tập thực hành: Dùng chức năng table và image thiết kế trang web sau:

21


BÀI 2: NGƠN NGỮ LẬP TRÌNH WEB
Mã bài: MĐLTV22-02
Mục tiêu:
- Trình bày được cú pháp, cấu trúc cơ bản một ngơn ngữ lập trình web: PHP, JSP,
ASP.NET
- Thiết lập được môi trường làm việc để phát triển ứng dụng web theo ngôn ngữ lựa chọn
- Sử dụng được ngôn ngữ lập trình Web để lập trình kết nối và xử lý dữ liệu phía Server
(hiển thị, thêm, sửa, xóa dữ liệu…).
- Sử dụng được Framework phát triển ứng dụng web phổ biến phù hợp với ngơn ngữ lập

trình lựa chọn để xây dựng website theo yêu cầu.
Nội dung chính:
1. Giới thiệu
1.1. Giới thiệu ngơn ngữ lập trình web
+ Ngơn ngữ lập trình PHP:
- PHP viết tắt của PHP Hypertext Preprocessor : là ngôn ngữ server-side script, tương tự
như ASP, JSP, … thực thi ở phía WebServer, tập tin PHP có phần mở rộng là .php,
cú pháp ngôn ngữ giống ngôn ngữ C & Perl
- PHP : Rasmus Lerdorf in 1994 (được phát triển để phát sinh các form đăng nhập sử
dụng giao thức HTTP của Unix)
- PHP 2 (1995) : Chuyển sang ngôn ngữ script xử lý trên server. Hỗ trợ CSDL, Upload
File, khai báo biến, mảng, hàm đệ quy, câu điều kiện, biểu thức, …
- PHP 3 (1998) : Hỗ trợ ODBC, đa hệ điều hành, giao thức email (SNMP, IMAP), bộ
phân tích mã PHP (parser) của Zeev Suraski và Andi Gutmans
- PHP 4 (2000) : Trợ thành một thành phần độc lập cho các webserver. Parse đổi tên thành
Zend Engine. Bổ sung các tính năng bảo mật cho PHP
- PHP 5 (2005) : Bổ sung Zend Engine II hỗ trợ lập trình HĐT, XML, SOAP cho Web
Services, SQLite
- Phiên bản mới nhất của PHP là version PHP 7.4 là phiên bản PHP mới nhất được phát
hành ngày 28 tháng 11, 2019. Nó giờ đã sẵn sàng để dùng trên toàn bộ Hostinger serve
(www.php.net)
+ Ưu điểm của PHP:
PHP được sử dụng làm:
- Server Side Scripting
- CommandLine Scripting (cron – Linux, Task Scheduler – Windows, Text Processing)
- Xây dựng ứng Desktop – PHP GTK
Đa môi trường (Multi-Platform):
- Web Servers: Apache, Microsoft IIS, Caudium, Netscape Enterprise Server
- Hệ điều hành: UNIX (HP-UX, OpenBSD, Solaris, Linux), Mac OSX, Windows
NT/98/2000/XP/2003/vista

- Hệ QTCSDL: Adabas D, dBase,Empress, FilePro (read-only), Hyperwave, IBM DB2,
Informix, Ingres, InterBase, FrontBase, mSQL, Direct MS-SQL, MySQL, ODBC, Oracle
(OCI7 and OCI8), Ovrimos, PostgreSQL, SQLite, Solid, Sybase, Velocis,Unix dbm
Miễn phí:

22


PHP
Software

Free

Platform

Free (Linux)

Development Tools

Free (PHP Coder, jEdit, …)

Được sử dụng rộng rãi trong môi trường phát triển web
- 20,917,850 domains (chiếm hơn 32% tên miền website)
- 1,224,183 IP addresses
(04/2007 Netcraft Survey – />
+ Ngơn ngữ lập trình JSP:
Là một ngơn ngữ lập trình Script giúp cho người lập trình có thể viết các đoạn mã
Java nhúng trực tiếp trong trang HTML. JSP là sự lựa chọn thông minh cho các ứng dụng
chạy trên cả Window và Unix

Hình 2.1. Mơ hình ứng dụng web với ngôn ngữ JPS
Mô tả: Người sử dụng(Client) gửi một yêu cầu HTTP Request(bằng cách truy nhập
vào một trang Web) lên Webserver. WebServer sẽ kiểm tra phần mở rộng của file và nếu
là có phần mở rộng là .JSP, Webserver chuyển yêu cầu đến cho JSP container để dịch và
chạy, sau đó gửi kết quả đến cho người sử dụng. Trong q trình xử lý, JSP container có
thể phải tương tác với các thành phần khác như Cơ sở dữ liệu (thông qua JDBC), các đối
tượng Java(JavaBean). Để dịch và chạy được một trang JSP, Webserver cần được cấu
hình hợp lý để nhận ra thư viện các lớp Java.
Cấu trúc của một trang JSP có dạng như sau:
<HTML>

23


<BODY>
Hello! The time is now<%=new java.util.Date()%>
<BODY>
<HTML>
Kết quả hiển thị:
Hello! The time is now 04/05/2021
+ Ngơn ngữ lập trình ASP.NET:
Như chúng ta đã biết, ASP vẫn còn tồn đọng một số khó khăn như Code ASP và HTML
lẫn lộn, điều này làm cho q trình viết code khó khăn, thể hiện và trình bày code khơng
trong sáng, hạn chế khả năng sử dụng lại code. Bên cạnh đó, khi triển khai cài đặt, do
không được biên dịch trước nên dễ bị mất source code. Thêm vào đó, ASP khơng có hỗ
trợ cache, không được biên dịch trước nên phần nào hạn chế về mặt tốc độ thực hiện. Quá
trình xử lý Postback khó khăn, .
Đầu năm 2002, Microsoft giới thiệu một kỹ thuật lập trình Web khá mới mẻ với tên gọi
ban đầu là ASP+, tên chính thức sau này là ASP.Net. Với ASP.Net, khơng những khơng
cần địi hỏi bạn phải biết các tag HTML, thiết kế web, mà nó cịn hỗ trợ mạnh lập trình

hướng đối tượng trong quá trình xây dựng và phát triển ứng dụng Web.
ASP.Net là kỹ thuật lập trình và phát triển ứng dụng web ở phía Server (Server-side) dựa
trên nền tảng của Microsoft .Net Framework.
Hầu hết, những người mới đến với lập trình web đều bắt đầu tìm hiểu những kỹ thuật ở
phía Client (Client-side) như: HTML, Java Script, CSS (Cascading Style Sheets). Khi
Web browser yêu cầu một trang web (trang web sử dụng kỹ thuật client-side), Web server
tìm trang web mà Client yêu cầu, sau đó gởi về cho Client. Client nhận kết quả trả về từ
Server và hiển thị lên màn hình.
ASP.Net sử dụng kỹ thuật lập trình ở phía server thì hồn tồn khác, mã lệnh ở phía server
(ví dụ: mã lệnh trong trang ASP) sẽ được biên dịch và thi hành tại Web Server. Sau khi
được Server đọc, biên dịch và thi hành, kết quả tự động được chuyển sang
HTML/JavaScript/CSS và trả về cho Client. Tất cả các xử lý lệnh ASP.Net đều được thực
hiện tại Server và do đó, gọi là kỹ thuật lập trình ở phía server.
ASP.Net được Microsoft phát triển qua nhiều phiên bản từ ASP.Net 1.0 , 1.1, 2.0 và gần
đây nhất là phiên bản ASP.Net 3.5 chạy trên .Net Framework 3.5 sử dụng môi trường phát
triển tích hợp (IDE) Visual Studio.Net 2008
+ Các ưu điểm của ASP.Net
- ASP chỉ sử dụng VBScript và JavaScript mà không sử dụng được các ngôn ngữ mạnh
khác : Visual Basic, C++... Trong khi đó ASP.NET cho phép viết nhiều ngơn ngữ :
VBScriptJavaScript, C#, Visual Basic.Net,...
- ASP.Net sử dụng phong cách lập trình mới: Code behide. Tách code riêng, giao diện
riêng . Dễ đọc, dễ quản lý và bảo trì.
- Trong các trang ASP chúng ta phải viết mã để kiểm tra dữ liệu nhập từ người dùng ,
ASP.NET hỗ trợ các validation controls để kiểm tra chúng ta không cần viết mã,...
- Hỗ trợ phát triển Web được truy cập trên các thiết bị di động: PocketPC,
Smartphone...
- Hỗ trợ nhiều web server control .
- Hỗ trợ thiết kế và xây dựng MasterPage lồng nhau.
- Hỗ trợ bẫy lỗi (debug) JavaScript……

24