Đồ Án Cơ Sở 1 Đề Tài- Website Travels.pdf

Tuy nhiên, vẫn tồn tại một số thách thức trong việc đặt vé du lịch trực tuyến như tìm kiếm thông tin phức tạp, so sánh giá cả và quá trình thanh toán không thuận tiện.. Website TravelS m

TRUONG DAI HQC CONG NGHE THONG TIN VA

TRUYEN THONG VIET - HAN

KHOA KHOA HOC MAY TINH

VU

ĐỎ ÁN CƠ SỞ 1 pita: WEBSITE TRAVELS

Sinh viên thựchiện : PHAM TRAN NHAT DINH

NGUYEN THANH HAI Giang vién huéng dan: THS TRAN THI NHU NGOC

Da nang, thang 6 nam 2023

TRUONG DAI HOC CONG NGHE THONG TIN VA

TRUYEN THONG VIET — HAN

KHOA KHOA HOC MAY TINH

ĐỎ ÁN CƠ SỞ 1

Website TravelS

Đà Nẵng, tháng 6 năm 2023

LOI CAM ON

Lời đầu tiên nhất cho chúng em xin chân thành cảm ơn sự hướng dẫn tận tâm và nhiệt tình của cô Thị Như Ngọc đã hướng dẫn và giúp đỡ chúng em trong việc thực hiện đề tài này trong suốt thời gian qua

Chúng em cũng xin chân thành cảm ơn các thầy cô giáo trong khoa CNTT trường Đại học CNTT & Truyền thông Việt Hàn đã hết lòng dạy bảo, giúp đỡ chúng em trong những năm học đại học, giúp em có những kiến thức và kinh nghiệm quý giá trong chuyên môn và cuộc sống Những hành trang đó là một tài sản vô giá nâng bước cho em tới được với những thành công trong tương lai

Trong quá trình nghiên cứu để tải, chúng em vẫn còn nhiều điều hạn chế trong

khâu tìm hiểu, đánh giá và trình bảy cũng như là kiến thức về chuyên ngành vẫn còn nhiều điều thiếu sót Rất mong nhận được sự quan tâm và góp ý từ các thầy/cô giang viên bộ môn để đề tài của chúng em được đầy đủ và hoàn chỉnh hơn

Một lân nữa chúng em xin chân thành cảm ơn!

NHAN XET GIAO VIEN HUONG DAN

MUC LUC

LOI CAM ON

NHAN XÉT GIÁO VIÊN HƯỚNG ĐẨNN 2-2 se cscse sEcs he eeee sec cereseecre

)h):8/1098:ià).00).0 Ô DANH MỤC CỤM TỪ VIẾT' TẮTT - << << 2S se SE se grseesersrserecsee DANH MỤC TÀI LIỆU THAM KHẢO 2 5° 5° s52 8 se eesesezse scce

PWYT Tn an viii

MO DAU

CHUONG 1 NGUYEN CUU TONG QUAN

1.1 COng cut thiét ké WebSite.cccccccsscssssssssssssssssssssssssssssssssssssessssssssssssesssssssssessesees 3

12.1 Ngôn ngữ HHHIÀL tie neni 3 1.2.1.1 Lich str cla HTML ceeeceeecesececcecececccsccccsececcceesscceesesesentenneess 3

1.2.1.2 4 0 ns5ÝÝÉỶÝÝÝ 3

1.2.1.3 Cách thức hoạt động của ngôn ngữ HMLL 2: 522cc ++22 4

1.2.1.4 Vai trò của HTML trong thiết kế và lập trình Web 5-52 4 1.2.1.5 Ưu điểm của HTML 52 222222212212212711212112212122 de 4

1.2.1.6 Nhược điểm của HTML S2 S21 12121115155 13151212111111555551 1111 sE2 4 1.2.2 N@6n AGI CSS ccc nh ee ee een tiieeeeneieeeeeney J

1.2.2.1 Khai iQ ccc ccc ccecs esses eessessesseseessessetensieesessseteessnesestsessesanees 5 1.2.2.2 Câu trúc của một đoạn CSS - 2 22 2112112122712112211111211211212 2e 5 1.2.2.3 Vai trò của CSS trong thiết kế và lập trình website 5 1.2.2.4 Ưu điểm của CS§S -52 S5 21222122122122121221121122212 2e 5 1.2.2.5 Nhược điểm của CS§ 552 22211212211211211211221112.21 2212 re 6

12.3 Ngôn ngữ DOOSITQD Là Tnhh KH Khen kế thủ 6

1.2.3.1 Khái niệm 5- 22221 222212221112211212112112112222 re 6

1.2.3.2 Lợi ích của của việc sử đụng Boostrap c c c2 net 6

ll

12.4 Ngôn ngữ JAVASCHIDI cà Tnhh nh Hành Hà tk 6

1.2.4.2 Các lợi thế của ch 07 7

CHUONG 2 CAC KĨ THUẬT THIẾT KẾ WE.BSIT E 2-52 se se=ecscs<e

2.1 Thay đổi màu sáng/tôi của giao diện ec ce<ccĂcceccecreerrsrrererreccee 9 PIN T.íi ng nh a4 9

VI N9 T5 nan ố/e(a ằ 10

VỮ P Nnr s nang nh aA< 5 il 2.2 Ligh BOX eccssssscsssssssssnssessesssnsesesucsessacsunsessenssnssecsessecsacsacsessaussnssacseesenseesesenes il

PP XNNG T nan ốc adẢ 12

2.2.3 Giao điỆH QQQQ n cn TT Tnhh xxx ái 16 PVC) 4s 6 can T 16

PS NNNS T.(ị nh aa 17 2.3.2 Code JaVASCTHDI ch HH HH TH TH HH khu 20 2.3.3 Giao điỆH QQ n TT ko nh xxx ng áu 21

CHUONG 3 PHAN TICH HỆ THÓNG - 5° 2 se se csese re cescscee

(U41 1.16 1.1 16 23

“(1:01 1618 .< 23

3.4.1 Đăng nhập/ ĐĂNG ÌÍ ào Tnhh HH HH HH kh kh tt 24

“| 4À an neeAd đ 25

3.4.4 ĐiỂm đẾN ch ha hung 27

? han aa q ai TH 29 3.4.6 Các ứng dụng khác của TraV€ÏỀ: cà nh nh Ho 30

KET LUAN VA HUONG PHAT TRIEN

1

2

Kết luận

e đ* tt AC 6 6e 6 eeeeeee

DANH MUC HINH ANH

Hinh 1.1 Vi du co ban vé Javascript lệnh Alert - L1 22 2121211122 2211111111 112k 7 Hình 2.1 Code HTML của giao diện sáng/tỖI 5 S1 2E 1 S1211211211 1121211111 yeu 9

Hình 2.2 Code CSS của giao diện sáng/tỐi 55 S1 E2 1112118122151 21 2g ng 10

Hình 2.3 Code JavaScript của giao diện sáng/tỐi 5 S1 1121121121212 1e a6 10 Hình 2.4 Giao điện nền đen 2S 1155155515 115151112151512111211111101 1115512 tt ra 11 Hình 2.5 Giao diện nền trắng S1 + 1S E15 12112111111121111212111 210111 1 y0 11 Hinh 2.6 Code JavaScript LieghtBox Form đăng Kí - 0 2 2n 22 11222122 12 Hinh 2.7 Code JavaScript LiphtBOx - 2 0 201211112112 1121112 0111111111 11501 112k rray 13 Hinh 2.8 Code CSS LiphtBox L0 12111211211 121111111111111122 1011111111111 1111k 14

Hình 2.10 Giao diện ban đầu - 56: 2212221122211 1211.2211.211 l6

Hinh 2.11 Giao diện khi sử dụng LiehtBox 2 2 20 0221221121151 211512 128211 r re 16 Hinh 2.12 Code HTML của Form đăng nhập và đăng kí 22 c2, 17 Hinh 2.13 Code HTML của Form đăng nhập và đăng kí - c2 cay 18 Hinh 2.14 Code HTML của Form đăng nhập và đăng kí 22 c2, 19 Hinh 2.15 Code JavaScript cua Form dang nhap va đăng kí - c cà 20 Hinh 2.16 Code JavaScript cua Form dang nhap va dang ki cece 21 Hinh 2.17 Giao diện Form đăng kí 2 22111211 2211211 1222111211111 01 1152811111112 21 Hinh 2.18 Giao diện Form đăng nhập c0 22222211211 121 1222111118111 1 12811 re 22

Hinh 3.2 Trang đăng nhập - - 2 2 220 12211221121 1121111111 12 1Ẹ111111111111 1101111181 Hy 25

Hinh 3.3 Trang 0n 26

Hinh 3.4 Video gidi thigu m6 dau la PLEIKU oo ccccccccceceeceesessteseessesesieteteeenseees 26 Hình 3.5: Video giới thiệu mở đầu là Quảng Ninh 2-5 Sen S21 22x22 xe 27 Hình 3.6: Video giới thiệu mở đầu lả Bình Định 22 S22 2E22E12E5211222222222 3.2 27 Hình 3.7: Video giới thiệu mở đầu là Phan ThiẾt -2 22 2222E+2E£2E22E222E22E22222 222 27 Hình 3.8: Điểm đến 0 222 2222 1222111221112 re 28 Hình 3.9: Điểm đến 20: 222 2222 1222111222112 011gr 28

Hinh 3.10: Form đăng kí tour du lịch - - 2c 22222211211 121 22511511 15115111111 5111 1 re 29 Hinh 3.11: Thông tin tour du lịch 2: 22122211211 12115 221122115211 11 181118121111 11 g2 29

Hinh 3.12: Dich Vi 30

Hinh 3.13: Trat mo hie ccc cccececeseessceseecnecnscensesesesseseseesseeecensetssenseesseeeeeens 30

Hinh 3.15: Thông tin liên hệ khác - G22 2221211211 1231121 12111811551 1111 1111122 rt 31

Vi

DANH MUC CUM TU VIET TAT

STT

Vii

eS

DANH MUC TAI LIEU THAM KHAO

Tài liệu tham khảo

[1] Giáo Trình Công Nghệ Web,2018,Khoa CNTT&TT Đại Học Đà Nẵng

Tài liệu Internet

[1] Wikipedia https://vi wikipedia.org/wiki/HTML

[2] Wikipedia https://vi wikipedia.org/wiki/JavaScript

[3] Wikipedia https://vi wikipedia.org/wiki/CSS

[4] W3school https://www.w3schools.com/css/default.asp

[5] Bootstrap https://www.w3schools.com/bootstrap

[6] W3layout Templates and Themes » W3Layouts

vill

MO DAU

Trong thời đại công nghệ số hiện nay, ngành du lịch đang phát triển mạnh mẽ

và trở thành một trong những ngành kinh doanh sôi động nhất trên thế giới Việc đặt

vé du lịch trực tuyến đã trở thành xu hướng phỏ biến và được nhiều người ưa thích đo tiện lợi và linh hoạt Tuy nhiên, vẫn tồn tại một số thách thức trong việc đặt vé du lịch trực tuyến như tìm kiếm thông tin phức tạp, so sánh giá cả và quá trình thanh toán không thuận tiện Do đó, chủng em nhận thây nhu cầu xây dựng một Website Travel5S

để đặt vé du lịch hiệu quả để giải quyết các vấn đề này

Website TravelS mà chúng em thiết kế nhằm đáp ứng nhu cầu của khách hàng

trong việc tìm kiếm, đặt và thanh toán vé du lịch một cách dễ đàng và tiện lợi Chúng

em nhận thây rằng việc đặt vé truyền thống qua điện thoại hoặc đến các đại ly du lich

có thể gặp khó khăn trong việc tìm thông tin, so sánh giá cả và mắt thời gian Trang web mà chúng em tạo ra sẽ giải quyết những vấn đề này, mang đến cho khách hàng trải nghiệm đặt vé du lịch trực tuyến thuận tiện và nhanh chóng

Để giải quyết vấn đề nêu trên, chúng em đề xuất xây dựng một trang Website TravelS với các chức năng chính sau:

© _ Cung cấp thông tin chi tiết về các tuyến điểm du lịch phố biến, giá vé, lịch trình chuyền đi và các dịch vụ đi kèm

của họ

e _ Cung cấp tính năng so sánh giá cả giữa các tuyến điểm và các công ty du lịch khác nhau

¢ - Hỗ trợ các phương thức thanh toán an toàn và tiện lợi cho người dùng

® - Tạo ra giao diện đơn giản, thân thiện với người dùng và tương thích trên nhiều

thiết bị

® Chúng em tin rằng việc thực hiện đề xuất nội dung trên sẽ giúp nâng cao trải nghiệm đặt vé du lịch trực tuyến và đáp ứng nhu cầu ngày cảng cao của người dùng

Mục tiêu đề ra của TravelS hướng đến là:

® Tạo ra một giao diện đơn giản và thân thiện với người dùng: Chúng em xây dựng một trang web dễ sử dụng vả trực quan, giúp người dùng dé dang tim kiếm, đặt vé du lịch một cách thuận tiện

e Cung cấp thông tin chỉ tiết và đáng tin cậy: TravelS sẽ tập trung vảo việc cung cấp thông tin chỉ tiết về các tuyến điểm du lịch, giá vé, lịch trình chuyến đi và các dịch vụ đi kèm Chúng em đảm bảo rằng thông tin được cập nhật thường xuyên và đáng tin cậy để người dùng có thể đưa ra quyết định thông minh e©_ Tối ưu hóa trải nghiệm người dùng: Website sẽ tạo ra một quy trình đặt vé du lịch mượt mà và nhanh chóng, giảm thiểu số lượng bước cần thiết và yêu cầu tối đa từ người dùng

Phuong phap cua Website TravelS:

e Xác định yêu cầu và phân tích: Tiến hành phân tích yêu cầu của người dùng và xác định các chức năng và tính năng cần có trên trane Web TravelS Từ đó, xây dựng bản thiết kế ban đầu cho giao dién và cơ sở đữ liệu

e _ Thiết kế và phát triển: Dựa trên bản thiết kế ban đầu, xây dựng giao diện người

dùng hấp dẫn, thân thiện và tương thích trên nhiều thiết bị khác nhau Đồng thời, triển khai hệ thống cơ sở đữ liệu để lưu trữ thông tin về vé du lịch, người dùng và các dịch vụ đi kèm

e _ Xây dựng chức năng tìm kiếm và đặt vé: Xây dựng hệ thống tìm kiếm cho phép

người dùng tìm kiếm vé dựa trên các tiêu chí như điểm đến, ngày khởi hành vả

số lượng hành khách Đồng thời, triển khai chức năng đặt vé và lưu trữ thông tin về đơn hàng

Kết quả mà Website TravelS hướng đến:

e©_ Trang web TravelS đã được triển khai thành công với giao diện hấp dẫn và dễ

sử dụng

® Noười dùng có thể tìm kiếm, đặt vé du lịch một cách thuận tiện va an toan

® Trang web hoạt động mượt mà, tải trang nhanh chóng và tương thích trên các trình duyệt và thiết bị khác nhau

e Nhận được phản hỏi tích cực từ người dùng về trải nghiệm sử dụng và tiện ích của trang web

Trong quá trình triển khai đồ án, chúng em sử dụng các công nghệ và ngôn ngữ lập trình như HTML, CSS, JavaScript và các framework hỗ trợ như React để xây đựng giao diện tran web một cách thân thiện với người dùng Chúng em cũng áp dụng các phương pháp phát trién phan mềm như phân tích yêu cầu, thiết kế hệ thống, triển khai

và kiêm thử đề đảm bảo chất lượng và tính ôn định của trang web

Chúng em hy vọng rằng đồ án này sẽ mang lại giá trị cho cả nhóm chúng em và người sử dụng Chúng em sẽ cố gắng hết sức để hoàn thành đỗ án và mang đến một Website chất lượng cao, góp phân nâng cao trải nghiệm du lịch của mọi người Xin chân thành cảm ơn sự hỗ trợ và động viên từ giảng viên Trần Thị Như

Ngọc và các thành viên trong nhóm

Trong quá trình nghiên cứu dé tài nảy, do kiến thức và kinh nghiệm của chúng

em còn hạn chế vì vậy không tránh được những thiếu sót, rất mong được sự nhận xét

và góp ý của Thầy Cô cùng bạn bè

CHUONG 1 TONG QUAN VE DIRECT MEMORY ACCESS

(DMA) 1.1 Khai niém

11.1 Direct Memory Access — DMA Ia gi? Dinh nghia DMA

Direct memory access viết tắt là DMA Đây là một cơ chế truyền đữ liệu với tốc

độ cao từ ngoại vi tới bộ nhớ và từ bộ nhớ tới bộ nhớ Hay Direct memory access là một phương pháp cho phép các thiết bị gửi hoặc nhận (Input/Output) đữ liệu một cách

trực tiếp tới bộ nhớ và từ bộ nhớ mà không cần thông qua CPU

1.12 Chức Năng DMA

DMA thường là một module bô sung trên hệ thông bus Module DMA (Hình 2)

có khả năng bắt chước bộ xử lý, tức là tiếp nhận việc điều khiến hệ thống từ bộ xử lý

Nó cần phải thực hiện điều này để trao đổi dữ liệu với bộ nhớ qua bus hệ thống Với mục đích này, module DMA chỉ sử dụng bus khi bộ xử lý không cần đến nó hoặc DMA phải buộc bộ xử lý phải tạm ngừng hoạt động (gọi là trộm chu kỳ) Kỹ thuật

trộm chu kỳ thường phổ biến hơn Khi bộ xử lý muốn đọc hoặc ghi một khối (block)

dữ liệu, nó sẽ đưa ra một lệnh cho module DMA bằng cach gửi tới module DMA các thông tin sau:

« Yêu cầu Đọc hoặc Ghi bằng cách sử dụng các đường điều khiển READ hoặc

WRITE bộ xử lý và module DMA

« Địa chỉ của thiết bị I/O liên quan, gửi qua các đường dữ liệu

« Địa chỉ vị trí đầu tiên trong bộ nhớ để đọc hoặc ehi lên, truyền qua các đường dữ liệu và được lưu trữ lại bởi module DMA trong Thanh phi địa chỉ (xem hình)

« Số lượng từ cần đọc hoặc ghi, truyền qua các đường đữ liệu và được lưu trữ trong thanh shi Đếm dữ liệu Sau đó, bộ xử lý tiếp tục thực hiện các công việc khác Hoạt động vào/ra được ủy quyền hoàn toàn cho module DMA Module DMA chuyền toàn

bộ khối dữ liệu siữa bộ nhớ và thiết bị ngoại vi mà không cần sự tham gia cua bo xu

lý Khi quá trình trao đôi hoàn tất, module DMA gửi một tín hiệu ngắt tới bộ xử lý Do

đó, bộ xử lý chỉ tham gia vào thời điểm bắt đầu và kết thúc quá trình trao đôi

Như đã nói ở trên, khi DMA cần chiếm bus để truyền, nó sẽ trộm chu kỳ bus, Hình

3 chỉ ra các thời điểm trong chu kỳ lệnh mà bộ xử lý bị treo (trong lic DMA su dung bus) Trong mỗi trường hợp, bộ xử lý bị treo ngay trước khi nó cần sử dụng bus Module

DMA chuyền một từ sau đó trả lại điều khiến cho bộ xử lý Lưu ý rằng đây không phải

là ngắt; bộ xử lý không cần lưu trữ ngữ cảnh hoặc bất cứ thông tin gì Đơn giản là bộ

xử ly chỉ dừng lại một chu kỳ bus Về mặt hiệu năng của bộ xử lý thì nó sẽ hoạt động chậm hơn Tuy nhiên, với việc trao đổi vào/ra nhiều từ, cơ chế DMA hiệu quả hơn rất nhiều so với I/O điều khiển ngắt hoặc I/O chương trình Cơ chế DMA có thể được cấu