Chuong6-HUNG-HeThongWeb&HTML

Download Report

Transcript Chuong6-HUNG-HeThongWeb&HTML

Slide 1

Hệ thống World Wide Web
& Lập trình Web chạy ở phía client
dùng DHTML và JavaScript
Nguyễn Quang Hùng
E-mail: [email protected]
Website: www.dit.hcmut.edu.vn/~hungnq/courses.htm


Slide 2

Mục tiêu buổi học (3 tiết)
Tìm hiểu về hệ thống World Wide Web:

1.
a.

b.
c.

2.

3.

Mô hình hoạt động: Web browser/Web server
HyperText Transfer Protocol (HTTP)
HyperText Markup Language (HTML)

Lập trình Web chạy ở phía client bằng
DHTML và Javascript, Java Applet, XML
Bài tập: tạo ứng dụng VnIE cho phép
duyệt Web như một trình duyệt thông
thường.

Faculty of Information Technology, HCM University of Technology


Slide 3

Giới thiệu mạng Internet


Mạng LAN (Local Area Network)





Mạng WAN (Wide Area Network)






Mạng cục bộ có bán kính giới hạn về mặt địa lý
Tốc độ truyền dữ liệu cao
Mạng nối kết các mạng LANs, không giới hạn về mặt
địa lý.
Có tốc độ truyền tương đối thấp

Mạng Internet là mạng máy tính toàn cầu, kết nối
các mạng của các tổ chức, cá nhân trên thế giới


Các dịch vụ phổ biến trên Internet: web, e-mail, chat,
FTP,…

Faculty of Information Technology, HCM University of Technology


Slide 4

Giới thiệu hệ thống World Wide Web
(WWW)


Mô hình hoạt động: Web client/Web server

Web client

HTTP

Faculty of Information Technology, HCM University of Technology

Web server


Slide 5

Hệ thống WWW ở góc nhìn lập trình




Web server lắng nghe ở
port 80 (port mặc định)
Web browser và web
server sẽ tạo 1 cầu nối
TCP để trao đổi thông tin;
và dùng giao thức HTTP
(HyperText
Transfer
Protocol) để truyền tài
nguyên web (web page,
image, order data, credit
card…).

Faculty of Information Technology, HCM University of Technology


Slide 6

Các phần tử trong hệ thống WWW






Web server: chương trình quản lý một cây thứ bậc các trang
Web và phục vụ yêu cầu truy xuất chúng từ các client từ xa.
VD: Apache Http server, IIS, PWS…
Web Browser: chương trình giao tiếp với người dùng, nhận
yêu cầu từ user rồi truy xuất trang Web ở server tương ứng
để phân giải và hiển thị nội dung lên màn hình. VD:
firefox, IE, Mozilla…
Web page: đơn vị gởi nhận giữa Web server và Web client,
nó là 1 file văn bản được viết bằng ngôn ngữ HTML,
DHML, XML

Faculty of Information Technology, HCM University of Technology


Slide 7

CẤU TRÚC MỘT GIAO DỊCH HTTP 1.x










Bước 1: HTTP client mở kết nối đến HTTP
server
Bước 2: HTTP client gửi request message
đến HTTP server
Bước 3: HTTP server trả response mesage
về cho HTTP client, chứa resource mà
HTTP client yêu cầu
Bước 4: HTTP server đóng kết nối
Lưu ý: HTTP 1.1 còn cho phép keep-alive
trên cầu nối TCP này

Faculty of Information Technology, HCM University of Technology


Slide 8

Ví dụ về một HTTP request/response


Client: GET http://www.w3c.org/index.html HTTP/1.1
From: [email protected]
User-Agent: HTTPTool/1.0
[blank line here]



Server: HTTP/1.0 200 OK
Date: Fri, 31 Dec 1999 23:59:59 GMT
Content-Type: text/html
Content-Length: 1354
[blank line here]




Faculty of Information Technology, HCM University of Technology


Slide 9

Uniform Resource Locator (URL)


Địa chỉ URL bao gồm 3 phần:




protocol, host và path

Ví dụ:

http://www.hcmut.edu.vn/index.htm

Faculty of Information Technology, HCM University of Technology


Slide 10

Các lệnh trong HTTP 1.x


GET




POST




Gửi dữ liệu từ web client về server.

HEAD




Lấy toàn bộ một trang web.

Chỉ lấy phần header của một trang web (phần
thẻ …) mà không cần lấy nội
dung.

etc

Faculty of Information Technology, HCM University of Technology


Slide 11

Tham khảo


RFC 1945-HTTP 1.0



RFC 2616-HTTP 1.1



www.jmarshall.com/easy/http/



www.w3.org





Faculty of Information Technology, HCM University of Technology


Slide 12

HyperText Markup Language
& Lập trình trang web động bằng
DHTML và Javascript
Nguyễn Quang Hùng
E-mail: [email protected]
http://www.dit.hcmut.edu.vn/~hungnq/courses.htm

Trích từ tập slide môn Lập trình mạng của T.S Nguyễn Văn Hiệp – Bộ
môn CNPM – Khoa CNTT ĐHBK TPHCM


Slide 13

Mục tiêu



Giới thiệu về lập trình web
Tìm hiểu về ngôn ngữ đánh dấu siêu văn
bản (HTML – HyperText Markup
Language)

Faculty of Information Technology, HCM University of Technology


Slide 14

Mục lục


Lịch sử



Các thẻ (tag) căn bản



Hướng phát triển

Faculty of Information Technology, HCM University of Technology


Slide 15

Giới thiệu về lập trình web


Các đặc điểm của ứng dụng web






Không phải là một ứng dụng độc lập, là ứng
dụng chạy trên nền web-server.
Người lập trình có thể thực hiện các thao tác
trên ứng dụng web như với một ứng dụng độc
lập.
Có thể lấy thông tin từ user.

Faculty of Information Technology, HCM University of Technology


Slide 16

Lịch sử về HTML


1989: dự án đề nghị của CERN về WWW



1992: phân các lớp cơ bản





[email protected]

Các trình duyệt ban đầu rất khó cài đặt…
1993: NCSA Mosaic released, Web cất
cánh bay xa

Faculty of Information Technology, HCM University of Technology


Slide 17

The Internet Engineering Task Force (IETF)


07/93: Internet Draft for HTML+



11/95: RFC1866 - HTML 2.0



11/95: RFC1867 - Form-based file Upload



03/95: HTML 3.0 Draft ổn định hơn HTML
2.0



05/96: RFC1942 - HTML Tables



01/97: RFC2070 - Internationalization of
HTML



Sau 96: IETF HTML WG đóng lại

Faculty of Information Technology, HCM University of Technology


Slide 18

W3C tiếp quản chuẩn HTML




12/95: W3C họp các nhà cung cấp chính yếu.

Công việc ban đầu trên tiêu chí mô hình đối tượng
thông thường:



Tiếp nối đưa ra các nét cơ bản của HTML.



01/97: W3C công bố HTML 3.2 (khuyến cáo).



12/97: W3C công bố HTML 4.0 (khuyến cáo).



05/98: W3C workshop về tương lai của HTML.



02/99: XHTML draft

Faculty of Information Technology, HCM University of Technology


Slide 19

Các thách thức của HTML



Thiếu hệ thống trong ngôn ngữ này.
Nhiều dạng trình duyệt mới như: Digital TV,
Handheld, phone và car…



Các client đơn giản cần tập con của HTML



Các client phức tạp cần mở rộng HTML



HTML đã được kết hợp với tập các thẻ khá
về Toán, Đồ họa, E-Commerce, Metadata….


XHTML, XML, DHTML…

Faculty of Information Technology, HCM University of Technology


Slide 20

HyperText Markup Language
(HTML)







Là một ngôn ngữ đánh dấu siêu văn bản.
Sử dụng các thẻ (tag) để định dạng: văn bản,
đoạn văn, hình ảnh, file âm thanh, Java
applet, đối tượng như file Word, Excel,
JavaBean…
Cho phép chèn các đoạn mã script như
JavaScript thực thi tại trình duyệt (browser).
Là định dạng chuẩn cho trang web.


Mở rộng: XML, WSDL/SOAP…

Faculty of Information Technology, HCM University of Technology


Slide 21

HyperText Markup Language (tiếp)




Các trang web là tài liệu dạng HTML khi
tên file vật lý là:


*.html, *.htm



Ví dụ: index.html, index.htm, courses.htm

Lưu ý:


Các tài nguyên Web được yêu cầu bằng HTTP request
có thể là một file nhị phân, một trang JSP/Servlet hay
ASP.NET…

Faculty of Information Technology, HCM University of Technology


Slide 22

Một số thẻ cơ bản của HTML

Faculty of Information Technology, HCM University of Technology


Slide 23

Một số thẻ cơ bản của HTML (tiếp)

Faculty of Information Technology, HCM University of Technology


Slide 24

Ví dụ: một trang “hello.htm”đơn giản
1.
2.
3.
4.
5.
6.




Hello World



10.


Hello world !!! Welcome to HyperText Markup Language
(HTML) world !!!


This is a paragraph. You can type any text here.




11.



7.
8.

9.

Show Me

Faculty of Information Technology, HCM University of Technology


Slide 25

Ví dụ: thẻ


2. Ví dụ về thẻ TABLE
3. cellSpacing="1" cellPadding="1" width="528" border="1">
4.


5.

6.

7.

8.


9.

10.

11.

12.


13.

14.

15.

16.
Row 1, column 1Row 1, column 2Row 1, column 3
Row 2, column 1Row 2, column 2Row 2, column 3
Row 3, column 1Row 3, column 2Row 3, column 3

Show
Me
17.
1.

Faculty of Information Technology, HCM University of Technology


Slide 26

Một số thẻ HTML khác
height="52" width="448" alt="A sample picture">Đây là một ảnh
Đây là dòng chữ bình thường.
Đây là đoạn in đậm. Đây là đoạn in
nghiêng.
Đây là đoạn gạch dưới.
Đây là một list box control:


Faculty of Information Technology, HCM University of Technology


Slide 27

Một số thẻ HTML khác (tiếp)





Thẻ tạo liên kết:

Click vào sẽ link đến trang web các môn học của tôi



Faculty of Information Technology, HCM University of Technology


Slide 28

Một số thí dụ về trang web

Faculty of Information Technology, HCM University of Technology


Slide 29

Một số thí dụ về trang web (tiếp)

Faculty of Information Technology, HCM University of Technology


Slide 30

Dùng công cụ tạo các trang Web


Microsoft Visual InterDev 6:




Microsoft Visual Studio.NET 2003:






HTML, JSP, Java Servlet, Java EJB…

Macromedia Dreamweawer MX 2004




HTML…

Jbuilder




HTML, ASP.NET, ASP.NET Webservice, C#, C++…

Microsoft Frontpage




HTML, ASP…

HTML, ASP, JSP, ASP.NET…

EditPlus
Notepad/Wordpad/Unix VIM
….


Faculty of Information Technology, HCM University of Technology


Slide 31

Tạo trang Web bằng Visual InterDev 6

Faculty of Information Technology, HCM University of Technology


Slide 32

Tạo trang Web bằng Visual Studio.NET
2003

Faculty of Information Technology, HCM University of Technology


Slide 33

Tạo trang Web bằng EditPlus

Faculty of Information Technology, HCM University of Technology


Slide 34

Bài tập - Ứng dụng trình duyệt Web đơn
giản




Bài tập này nhằm giúp bạn làm quen với quy trình phát
triển ứng dụng dạng Single Document Interface - SDI bằng
VC++.
Viết 1 trình duyệt Web đơn giản có giao diện sau:

Faculty of Information Technology, HCM University of Technology


Slide 35

URL encoding


Ví dụ:
This
is
a
text



Sau khi URL encoding là:


This%0D%0Ais%0D%0Aa%0D%0Atext%0D
%0A

Faculty of Information Technology, HCM University of Technology


Slide 36

HTML FORM


Cấu trúc cơ bản của một HTML FORM

[]+



Các loại (type) INPUT


TEXT: là textbox dùng để nhập dữ liệu.


Cú pháp:
[MAXLENGTH=nn] [VALUE="default text"]>

Faculty of Information Technology, HCM University of Technology


Slide 37

HTML FORM (tiếp)


Các loại (type) INPUT


SUBMIT: truyền dữ liệu form đến ứng dụng web




RESET:đưa nội dung của form trở về giá trị ban đầu




Cú pháp: [VALUE="text"]>

Cú pháp:

BUTTON: nút nhấn bất kỳ


Cú pháp: [VALUE="text"]>

Faculty of Information Technology, HCM University of Technology


Slide 38

HTML Form – một ví dụ
1.
2.

3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.

14.
15.


A SIMPLE HTML FORM SAMPLE



First name:

Last name:

email:


Male

Female







Faculty of Information Technology, HCM University of Technology


Slide 39

HTML FORM (tiếp)


Các loại (type) INPUT


RATIO: chọn lựa một trong nhiều


Cú pháp: VALUE="choice-id" [checked]>

name="R1">Option 1

name="R1">Option 2


name="R1">Option 3

Faculty of Information Technology, HCM University of Technology


Slide 40

HTML FORM (tiếp)


Các loại (type) INPUT


CHECKBOX: lựa chọn một hoặc nhiều




Cú pháp: NAME="id"
VALUE="choice-id"
[CHECKED]>
Ví dụ:
Check
1
checked>Check 2

Faculty of Information Technology, HCM University of Technology


Slide 41

HTML FORM (tiếp)


Các loại (type) INPUT


HIDDEN: dữ liệu không hiển thị




Cú pháp: VALUE="data">

Nhập vùng văn bản: TEXTAREA




Faculty of Information Technology, HCM University of Technology


Slide 42

HTML FORM (tiếp)


Lựa chọn listbox: SELECT





Faculty of Information Technology, HCM University of Technology


Slide 43

Lập trình Web ở phía client




Các trang HTML có thể được lập trình để thực
hiện các thao tác thực thi trên web client.
Các phương pháp phổ biến để lập trình hiện nay:


Script (Javascript, Vbscript)



Java Applet



ActiveX Control



XML



AJAX…

Faculty of Information Technology, HCM University of Technology


Slide 44

Lập trình Web ở phía client (tiếp)


Cú pháp cho một đoạn code Javascript
<script language=“JavaScript”>
//các khai báo biến
[var variable;]*
//các lệnh gọi hàm và các hàm
function function-name([agrv]*){
//các câu lệnh khai báo và thực thi
[return [value];]
}




Sử dụng file Javascript (*.js) đã có
<script language="JavaScript" src="*.js">

Faculty of Information Technology, HCM University of Technology


Slide 45

Lập trình Web ở phía client (tiếp)


Các đối tượng được xây dựng sẵn trong
JavaScript


window: chứa các thuộc tính liên quan đến cửa
sổ hiện thời



document: chứa các thuộc tính trong trang web



location: các thuộc tính về địa chỉ trang web



history: các thuộc tính về vị trí mà web browser
đã đến

Faculty of Information Technology, HCM University of Technology


Slide 46

Lập trình Web ở phía client (tiếp)


Mỗi phần tử trong trang HTML đều có
thể coi là một đối tượng, có thể khai báo sự
kiện để gọi hàm Javascript.


Cú pháp
[event-name=“procedure call” ]*>

Faculty of Information Technology, HCM University of Technology


Slide 47

Lập trình Web ở phía client (tiếp)


Các sự kiện có thể dùng


onClick: click chuột vào đối tượng.



onFocus: focus vào đối tượng trong form.



onMouseOver: di chuyển chuột vào trên đối tượng.



onMouseOut: di chuyển chuột ra khỏi đối tượng.



onChange: thay đổi giá trị của các đối tượng chứa văn
bản.



onBlur: chuyển focus khỏi đối tượng trong form.



onSelect: chọn phần tử trong listbox.



onLoad: xảy ra khi một document được load.

Faculty of Information Technology, HCM University of Technology


Slide 48

Lập trình Web ở phía client (tiếp)


Kiểm tra phần tử SELECT

var select_value;
function dropDownMenu() {
var
myindex=document.forms[0].menu.selectedIndex;
if (myindex==0) {
alert("\nYou must make a selection from the
drop-down menu.");
document.forms[0].menu.focus();
}
else {
select_value
=document.forms[0].menu.options[myindex].valu
e;
return true;
}
Faculty of Information Technology, HCM University of Technology
}


Slide 49

Lập trình Web ở phía client (tiếp)


Kiểm tra thông tin địa chỉ E-mail nhập vào

function isEmail() {
if (document.forms[0].elements[1].value == '') {
alert ("\n The E-Mail field is blank. \n\n “+
“Please enter your E-Mail address.")
document.forms[0].elements[1].focus();
return false;
}
if (document.forms[0].elements[1].value.indexOf ('@',0) ==
-1 ||
document.forms[0].elements[1].value.indexOf ('.',0) == -1)
{
alert ("\n The E-Mail field requires a \"@\" and a \".\""+
"be used. \n\nPlease re-enter your E-Mail address.")
document.forms[0].elements[1].select();
document.forms[0].elements[1].focus();
return false;
}
return true;
} of Information Technology, HCM University of Technology
Faculty


Slide 50

Dynamic HTML (DHTML)








DHTML là trang HTML có chứa các đoạn
mã JavaScript tạo các hiệu ứng, thay đổi các
phần tử trong trang HTML.
DHTML kết hợp giữa HTML, Javascript và
Cascading Style Sheets(CSS).
CSS là sự kết hợp giữa các tags HTML và
style.
Style có thể chứa nhiều thuộc tính.

Faculty of Information Technology, HCM University of Technology


Slide 51

DHTML (tiếp)







Mọi tags HTML đều có style. Javascript có
thể dựa trên các biến cố để thay đổi các
thuộc tính của style.
Mỗi phần tử trong trang HTML đều có thể
được gán ID (khác với name) và có các
thuộc tính style.
Có thể dùng tag

Mỗi web browser có thể thực thi một số lệnh
khác nhau.

Faculty of Information Technology, HCM University of Technology


Slide 52

DHTML


Phát hiện loại web browser


Dùng các thuộc tính appName và appVersion
của đối tượng navigator
var browser_name= navigator.appName;
var browser_version = navigator.appName;
alert(“You use browser “+browser_name+” version
“+ browser_version);



Phân biệt hai loại chính
if(document.all){ //IE
the_div=eval(“window.document.all.”+div_name+”.
style”);
}else if(document.layers){//Netscape
the_div=eval(“window.document.all.”+div_name);
}

Faculty of Information Technology, HCM University of Technology


Slide 53

DHTML (tiếp)


Javascipt example about timer



Timer :
height="23">
height="23">
height="23">
000
seconds




Faculty of Information Technology, HCM University of Technology


Slide 56

Java Applet








Là một ứng dụng được viết bằng Java, nhúng trong
trang HTML.
Khi trang HTML có chứa tag applet được gọi, class
applet được tải về máy client và thực thi trên máy
client.
Một ứng dụng applet phải thừa kế class
java.applet.Applet
Có thể thực hiện các thao tác như một chương trình
Java, tuy nhiên bị hạn chế một số chức năng vì tính
bảo mật cho máy client.

Faculty of Information Technology, HCM University of Technology


Slide 57

Hoạt động của một Applet









Được web browser tải mã(byte code) về máy
client.
Method init() sẽ được gọi để khởi động các thông
số.
Method start() được gọi để thực thi.
Method stop() được gọi khi người dùng thoát khỏi
applet
Method destroy() được thực thi khi applet kết thúc.

Faculty of Information Technology, HCM University of Technology


Slide 58

Ví dụ về một Java applet
//file SampleApplet.java
import java.applet.*; import java.awt.*;
public class SampleApplet extends Applet {
String text = "error"; int x = 0; int y = 20;
public void init() {
text = getParameter("text");
try {
x =
Integer.parseInt(getParameter("x"));
y = Integer.parseInt(getParameter("y"));
}catch(NumberFormatException ex){ }
}
public void paint(Graphics g) {
g.setFont(new Font("TimesRoman",Font.BOLD+
Font.ITALIC,36));
g.drawString(text,x,y);
}
Faculty of Information Technology, HCM University of Technology
}


Slide 59

Ví dụ về một Java applet
Using the Applet Tag<br />

An Applet that Displays Text at a Designated
Location


WIDTH=300>



Text displayed by browsers that are not Javaenabled.



Faculty of Information Technology, HCM University of Technology


Slide 60

ActiveX Control




Cho phép tạo các hiệu ứng động trên trang web
chạy ở phía trình duyệt.
Tương tự như Java Applet, được viết bởi các công
nghệ của Mircosoft.

Faculty of Information Technology, HCM University of Technology


Slide 61

Tài liệu tham khảo


HTML Homepage on W3c




HTML ver 4.0:




http://www.w3.org/MarkUp/
http://www.w3.org/TR/REC-html40/

HTML Form


http://www.w3.org/TR/REC-html40/interact/forms.html



Dave Raggett’s Introduction to HTML



http://www.w3.org/MarkUp/Guide/Overview.html
 http://www.w3.org/MarkUp/Guide/Advanced
 http://www.w3.org/MarkUp/Guide/Style.html
Javascript & DHTML





http://javascript.internet.com/
http://www.dynamicdrive.com/

Faculty of Information Technology, HCM University of Technology


Slide 62

Tổng kết


Giới thiệu hệ thống Web



Giới thiệu lập trình Web



Lập trình Web phía Client


Javascript



DHTML

Faculty of Information Technology, HCM University of Technology


Slide 63

Thảo luận

Faculty of Information Technology, HCM University of Technology


Slide 64

Viết một trình duyệt Web đơn giản

Faculty of Information Technology, HCM University of Technology


Slide 65

Viết một trình duyệt Web đơn giản
(tiếp)
Từ menu File.New chọn loại dự án là “MFC Application” và đặt tên là
“VnIE”

Faculty of Information Technology, HCM University of Technology


Slide 66

Viết một trình duyệt Web đơn giản
(tiếp)
Chọn loại ứng dụng là Single Document Interface (SDI) với sự hỗ trợ
kiến trúc MFC Doc/View

Faculty of Information Technology, HCM University of Technology


Slide 67

Viết một trình duyệt Web đơn giản
(tiếp)
Chọn mặc định trong MFC AppWizard bước 2 và 3 này

Faculty of Information Technology, HCM University of Technology


Slide 68

Viết một trình duyệt Web đơn giản
(tiếp)
Bước 4: Chọn toolbar kiểu Internet Exployer ReBars
Bước 5: Mặc định

Faculty of Information Technology, HCM University of Technology


Slide 69

Viết một trình duyệt Web đơn giản
(tiếp)
Bước 6: Đổi lớp
cơ sở của lớp
CVnView
từ
Cview
thành
CHtmlView

Faculty of Information Technology, HCM University of Technology


Slide 70

Viết một trình duyệt Web đơn giản
(tiếp)
Bước cuối cùng
xem các thông tin
tóm tắt và chọn
OK hoặc Cancel.

Faculty of Information Technology, HCM University of Technology


Slide 71

Viết một trình duyệt Web đơn giản
(tiếp)
Thiết kế giao diện cho
chương trình và thiết
lập các thuộc tính cho
các phần tử giao diện

Faculty of Information Technology, HCM University of Technology


Slide 72

Chỉnh sửa các Menu
Chọn VnIE resources và chọn chỉnh sửa Menu tại IDR_MAINFRAME.
Xoá hoặc thêm các lệnh vào menu.

Faculty of Information Technology, HCM University of Technology


Slide 73

Chỉnh sửa các Menu (tiếp)

Faculty of Information Technology, HCM University of Technology


Slide 74

Chỉnh sửa Menu View






Chọn menu View
Chọn Fonts có thuộc tính
Pop-up.
Tạo các options sau trong
View:




Stop có thuộc tính bằng
ID=ID_VIEWSTOP, và
thuộc tính Caption =
“Stop”
Refresh có thuộc tính bằng
ID=ID_VIEWREFRESH
và Caption = “Refresh”
Faculty of Information Technology, HCM University of Technology


Slide 75

Chỉnh sửa Menu View


Chọn lại mục Fonts, thêm
các options sau vào menu
con của nó:






Largest: có thuộc tính là
ID_VIEW_FONT_LARGES
T và thuộc tính Caption =
“Largest”
Tương tự cho Large,
Medium, Small và Smallest
có ID_VIEW_FONT_XXX.
Menu Fonts có dạng hình
bên.
Faculty of Information Technology, HCM University of Technology


Slide 76

Tạo menu Go, Favorites

Faculty of Information Technology, HCM University of Technology


Slide 77

Thêm menu IDR_FONT_POPUP




Chọn vào Insert/Resource
để tạo một menu mới.
Đặt tên menu mới là
IDR_FONT_POPUP và
copy mục Fonts trong
View và dán qua menu
này.

Faculty of Information Technology, HCM University of Technology


Slide 78



Thay đổi mục Address:


Tên của nó là
ComboEx

Faculty of Information Technology, HCM University of Technology