Báo cáo đồ án phát triển ứng dụng web đặt vé máy bay

- Khi người dùng truy cập vào website, trang chủ sẽ có giao diện như hình .1, ngườ2 i dùng có thể tìm kiếm chuyến bay một chiều với 5 thành phố mà nhóm đã chọn đểlàm bao gồm Hồ Chí Minh,

TRƯỜNG ĐẠ I H ỌC CÔNG NGHỆ THÔNG TIN



     

ĐỀ TÀI: ĐẶT VÉ MÁY BAY

Lớp: Phát triển ứng dụng Web IS207.M12

Nhóm thực hiện: Nhóm 16

Thành viên nhóm:

Nguyễn Đạt Huy Hoàng 19521536

Giảng viên hướ ng d ẫn: ThS Võ Minh Quân

TP H Ồ CHÍ MINH - 12/2021

LỜI CẢM ƠN

Đầu tiên, nhóm chúng em xin gửi l i cờ ảm ơn chân thành đến quý thầy cô giảng viên Trường Đạ ọc Công nghệ thông tin –i h Đại h c Qu c gia TP H ọ ố ồ Chí Minh và quý thầy cô khoa H ệ thống Thông tin đã giúp cho nhóm chúng em có những ki n thế ức cơ bản làm nền tảng để thực hiện đề tài này

Đặc biệt, nhóm chúng em xin gửi l i cảm ơn và lòng biết ơn sâu sắc nhất t i thầy – ờ ớThs Võ Minh Quân, người đã hướng dẫn cho nhóm em suốt thời gian làm đề tài Thầy đã trực tiếp hướng d n tẫ ận tình, sửa chữa và đóng góp nhiều ý kiến quý báu giúp nhóm em hoàn thành tốt báo cáo môn học của nhóm Một lần nữa nhóm em chân thành cảm ơn thầy

và chúc thầy dồi dào sức khỏe

Trong th i gian m t h c kờ ộ ọ ỳ thực hiện đề tài, nhóm chúng em đã vận d ng nh ng ụ ữkiến th c n n tứ ề ảng đã tích lũy đồng thời k t h p v i vi c h c hế ợ ớ ệ ọ ỏi và nghiên cứu nh ng kiữ ến

thức m i tớ ừ ầy cô, bạn bè cũng như nhiềth u nguồn tài liệu tham tham khảo Từ đó, nhóm chúng em vận dụng tối đa những gì đã thu nhập được để hoàn thành một báo cáo đồ án tốt nhất Tuy nhiên, vì kiến thức chuyên môn còn hạn ch ế và bản thân còn nhiều thiếu xót kinh nghiệm th c tiự ễn nên nội dung của báo cáo không tránh khỏi những thiếu xót, nhóm em rất mong nhận được sự góp ý, chỉ bảo thêm của quý thầy cô nhằm hoàn thiện những ki n thế ức của mình để nhóm chúng em có thể dùng làm hành trang thực hiện tiếp các đềtài khác trong tương lai cũng như là trong việc học tập và làm việc sau này

Một lần n a xin gữ ửi đến thầy cô, bạn bè ời cảm ơn chân thành và tốt đẹp nhất! l

Thành phố Hồ Chí Minh, tháng năm

NHẬN XÉT CỦA GIẢNG VIÊN

MỤC LỤC

LỜI CẢM ƠN 1

NHẬN XÉT CỦA GIẢNG VIÊN 2

MỤC LỤC 3

I Tổng quan đề tài 5

1.1 Giới thiệu đề tài 5

1.2 Lý do chọn đề tài 5

II Kịch bản và thiết kế xây dựng trang web 5

2.1 Kịch bản đặt vé 5

2.2 Kịch bản đăng ký Dịch vụ chuyến bay 9

2.3 Kịch bản kiểm tra thông tin ở Chuy n bay cế ủa tôi 10

2.4 Kịch bản Check-in Online 11

III Các công nghệ sử dụng trong trang web 15

3.1 FrontEnd Bootstrap 15–

3.2 BackEnd NodeJS 16–

3.3 Database – MySQL 17

IV Thiết kế d ữ liệu bằng sơ đồ ớ l p 17

4.1 Bảng quan hệ các lớp trong hệ thống 18

4.1.1 L ớp chuyenbay 18

4.1.2 L ớp vemaybay 18

4.1.3 L ớp ghengoi 19

4.1.4 L ớp khachhang 19

4.1.5 L ớp dichvuchuyenbay 20

4.2 Sơ đồ ổng quát t 21

4.3 Các mối liên kết trong sơ đồ 21

V Nhận xét và kết luận 24

5.1 Nhận xét 24

5.1.1 K ết quả đạt được 24

5.1.2 Ưu điểm 24

5.1.3 Hạn chế 25

5.2 Hướng phát triển 25

VI Tài liệu tham khảo và phân công công việc 25

6.1 Tài liệu tham kh o 25ả 6.2 Bảng phân công công việc 26

I Tổng quan đề tài

1.1 Giới thiệu đề tài

- Trong thời đại phát triển m nh m c a Internet, nhạ ẽ ủ ững website bán hàng đóng góp một phần vô cùng quan trọng trong đời s ng c a mố ủ ọi người, giúp con người ti p cế ận

dễ dàng hơn đố ới v i nh ng s n phữ ả ẩm thay vì phải trực tiếp đi đến những gian hàng Hiện nay tình hình dịch bệnh đã tuyên giảm và những chuyến bay cũng đã được mở lại nhưng nhiều người vẫn muốn mua vé máy bay và làm thủ tục trực tuyến để tiết kiệm thời gian đồng thời giữ khoảng cách phòng dịch bệnh

- Trong đề tài này, nhóm chọn phát triển một website bán vé máy bay trực tuyến đơn giản cùng với những chức năng như đăng ký dịch vụ, kiểm tra thông tin và làm thủtục tr c tuyự ến, phù hợp với nhu cầu của khách hàng hiện nay

1.2 Lý do chọn đề tài

- Với mong muốn có thêm những kinh nghiệm tích luỹ thực tế để ểu hơn về ảng hi mlập trình và phát triển một dự án ng dứ ụng web cũng như nâng cao khả năng làm việc nhóm Vì vậy, các thành viên đều đồng ý tham gia phát triển một website bán

vé máy bay trực tuyến

- Trong khuôn khổ môn Phát triển ứng dụng web, được sự hướng d n c a thẫ ủ ầy và đóng góp ý kiến của các bạn, nhóm muốn nghiên cứu và phát triển website này đểhoàn thành đồ án môn học, hiểu thêm về cách Phát triển ứng dụng web cũng như rèn luyện các kỹ năng lập trình, nghiên cứu, tu duy, làm việc nhóm, …

II Kịch b ản và thiết kế xây dự ng trang web

2.1 Kịch bản đặt vé

- Khi người dùng truy cập vào website, trang chủ sẽ có giao diện như hình 1, ngườ2 i dùng có thể tìm kiếm chuyến bay một chiều với 5 thành phố mà nhóm đã chọn đểlàm bao gồm Hồ Chí Minh, Hà Nội, Đã Nẵng, Hải Phòng, Phú Quố Nhóm hiệc n tại ch tỉ ạo cơ sở ữ liệu các chuyế d n bay từ 5 địa điểm trên trong các ngày từ01/01/2022 đến ngày 20/01/2022 Trang ch ủ hiện có các button bao g m CHUYồ ẾN BAY CỦA TÔI, CHECK-IN ONLINE, D CH V CHUYỊ Ụ ẾN BAY để người dùng điều hướng trang web sang các dịch vụ liên quan Ngoài ra người dùng có thể chọn địa điểm khởi hành và địa điểm đến ở các select option cũng như ngày khởi hành

và bấm nút tìm chuyến bay để tìm kiếm chuyến bay dựa trên thông tin đã chọn

Hình 2.1: Trang chủ website bán vé máy bay

- Sau khi ch n chuy n chuy n bay cọ ế ế ần tìm, người dùng bấm Tìm chuyến bay và sẽ

được chuyển tiếp đến giao diện kết quả tìm kiếm chuyến bay hình 2.2 và có thể ởlựa chọn chuy n bay tuế ỳ theo khung gi vờ ới giá vé mong muốn Giao diện như ởhình 2.2 bao gồm button Quay lại để người dùng trở về trang chủ trước đó hoặc

Tiếp tục để tiến hành điền thông tin cá nhân và thanh toán Ngoài ra kết quả tìm kiếm chuyến bay còn cho phép người dùng xem cùng một chuy n bay ế đã nhập và

thêm kết qu cả ủa ba ngày tiếp theo để người dùng thoải mái lựa chọn ngày bay khác nếu muốn

Hình 2.2: Kết quả tìm kiếm chuyến bay trả về theo thông tin đã nhập

- Một khi l a ch n xong chuyự ọ ến bay và chọn Tiếp tục, người dùng sẽ điền nh ng ữthông tin cá nhân như hình 2.3 bao gồm Họ và tên, số điện thoại, email, … và lựa chọn một trong hai hình thức thanh toán:

o Thanh toán tại phòng vé: Người dùng sẽ nhận vé và thanh toán tại phòng

vé Người dùng chỉ cần khai báo họ tên và số điện tho i tạ ại phòng vé để được nhân viên tiến hành thanh toán

o Thanh toán tại địa chỉ quý khách yêu cầu: Vé sẽ được gửi đến địa chỉ mà người dùng đã nhập và sẽ được nhân viên giao vé tiến hành thanh toán tận nơi

Hình 2.3: Người dùng nhập thông tin cá nhân

- Khi người dùng hoàn tất các bước trên và bấm button Xác nhận, trang web s ẽ thông báo kết quả đặt vé thành công cùng với những thông tin người dùng đã nhập và Mã

đặt chỗ như hình 2.4 (Người dùng cần ghi lại Mã đặt chỗ để có thể làm những thủ tục như Check-in Online hoặc đặt thêm các Dịch vụ chuyến bay)

Hình 2.4: Kết quả đặt vé máy bay thành công

2.2 Kịch bản đăng ký Dịch v ụ chuy n bay ế

- Một khi người dùng đã đăng ký chuyến bay thành công và nhận được Mã đặt chỗ, người dùng có thể truy c p phầậ n Dịch vụ chuy n bay trang chủ và nhập thông tin ế ở

Họ tên cùng với Mã đặt chỗ như hình 2.5 để tiếp t c tiụ ến hành đăng ký các dịch v ụ

kèm theo

Hình 2.5: Nhập thông tin để tiến hành đăng ký dịch vụ

- Sau khi b m button ấ Tiếp theo, ở giao diện như hình 2.6, người dùng có thể chọn

mua thêm số ký cho hành lý theo bảng giá có sẵn hoặc mua thêm các suất ăn trên máy bay theo menu bên dưới Tổng tiền thanh toán sẽ hiển thị bên dưới trang Sau

khi hoàn tất lựa chọn, người dùng sẽ chọn Xác nhận để hoàn tất đăng ký dịch vụ và

thanh toán tại quầy vé ở sân bay

Hình 2.6: Giao diện các dịch vụ đặt thêm

2.3 Kịch b n kiả ểm tra thông tin ở Chuy n bay cế ủa tôi

- Người dùng muốn kiểm tra lại thông tin cá nhân và chuyến bay của mình cũng như những Dịch vụ đã đăng ký có thể truy c p ph n Chuy n bay cậ ầ ế ủa tôi và nhập thông tin Họ tên và Mã đặt chỗ như hình 2.7

Hình 2.7: Giao diện nhập thông tin

- Sau khi nh n button ấ Tìm kiếm, nếu người dùng có trong cơ sở d ữ liệu, những thông tin chi tiết mà người dùng đã khai báo sẽ được hiển thị như hình 2.8

Hình 2.8: Kết quả kiểm tra thông tin Chuyế n bay của tôi

2.4 Kịch b n Check-in Online ả

- Người dùng có thể truy c p ph n Check-in Onậ ầ line để chọn gh ng i c a chuy n bay ế ồ ủ ếmình từ trang chủ Sau khi điền các thông tin Họ tên và Mã đặt ch ỗ như hình 2.9 và

nhấn button Xem chuy n bayế , n u ế người dùng có trong hệ thống, trang web s ẽ được chuyến đến giao diện như hình 2.10 để kiểm tra thông tin và nhấn button Tiếp tục

tiến hành chọn ghế Nếu không người dùng có thể bấm button Huỷ để về trang chủ

Hình 2.9: Giao diện nhập thông tin

Hình 2.10: Giao diện kiểm tra thông tin cá nhân

- Ở giao diện như hình 2.11, người dùng có thể chon gh bế ằng cách bấm vào các

checkbox theo sơ đồ như hình bên và b m button ấ Xác nhận hoàn thành thủ t c trụ ực tuyến Khi đó người dùng sẽ được thông báo lần cu i v ố ề thông tin chuyến bay và số ghế đã chọn như hình 2.12 và bấm button Kết thúc để v lề ại trang chủ

Hình 2.11: Giao diệ n ch n ghọ ế ngồi

Hình 2.12: Thông báo hoàn tất thủ tục

III Các công nghệ sử d ng trong trang web ụ

3.1 FrontEnd Bootstrap –

- Bootstrap là một framework HTML, CSS, và JavaScript cho phép người dùng dễ dàng thiết kế website theo một chuẩn nhất định, tạo các website thân thiện với các thiết bị cầm tay như điện thoại, tablet, …

- Đối v i giao diớ ện FrontEnd, nhóm lựa chọn framework Bootstrap để thiết k phế ần giao di n cệ ủa website vì những tiện ích mà framework này mang lại như:

o Rất dễ để s dử ụng: Nó đơn giản vì nó được base trên HTML, CSS và Javascript chỉ cẩn có kiến thức cơ bản v ề 3 cái đó là có thể s d ng bootstrap ử ụtốt

o Responsive: Bootstrap xây dựng sẵn responsive css trên các thiết bị Iphones, tablets, và desktops Tính năng này khiến cho người dùng tiết kiệm được rất

nhiều th i gian trong vi c t o ra m t websờ ệ ạ ộ ite thân thiện với các thiế ị điện t b

tử, thiết bị c m tay ầ

o Tương thích với trình duyệt: Nó tương thích với tất cả các trình duyệt (Chrome, Firefox, Internet Explorer, Safari, and Opera) Tuy nhiên, với IE browser, Bootstrap ch h ỉ ỗ trợ từ IE9 tr ở lên Điều này vô cùng dễ hiểu vì IE8 không hỗ trợ HTML5 và CSS3

ứng dụng về d liệu thời gian th c chạy trên các thiết bị ữ ự phân tán

- Đối v i phớ ần BackEnd, nhóm lựa ch n k t họ ế ợp cơ sở ữ liệu MySQL cùng với nền d tảng NodeJS nh ờ vào những tiện ích của công cụ này:

o Không đồng bộ và hướng sự kiện (Event Driven): Tất các các APIs của thư viện NodeJS đều không đồng b , nộ ghĩa là không blocking (khóa) Nó rất cần thiết vì NodeJS không bao giờ đợi một API trả về dự ệu Server chuy n li ểsang m t API sau khi gộ ọi nó và có cơ chế thông báo về ự ệ s ki n c a NodeJS ủgiúp Server nhận được phản hồi từ các API gọi trước đó

o Chạy r t nhanh: Dấ ựa trên V8 Javascript Engine của Google Chrome, thư viện NodeJS rất nhanh trong các quá trình thực hiện code

o Các tiến trình đơn giản nhưng hiệu năng cao: NodeJS sử dụng một mô hình luồng đơn (single thread) với các sự ki n lệ ặp Các cơ chế sự kiện giúp Server

trả lại các phản hồi với một cách không khóa và tạo cho Server hi u qu ệ ả cao ngược lại với các cách truyền thống tạo ra một số lư ng luồng hữu hợ ạn đểquản lý request Nodejs sử ụng các chương trình đơn luồng và các chương dtrình này cung cấp các dịch vụ cho số lượng request nhiều hơn so với các Server truy n thề ống như Apache HTTP Server.

o Không đệm: Ứng dụng NodeJS không lưu trữ các dữ liệu buffer

3.3 Database – MySQL

- MySQL là một hệ thống qu n trả ị cơ sở ữ liệu mã nguồn mở (gọi tắt là RDBMS) dhoạt động theo mô hình client-server Với RDBMS là viết tắt của Relational Database Management System MySQL được tích hợp Apache, PHP MySQL qu n ả

lý dữ ệu thông qua các cơ sở li dữ liệu Mỗi cơ sở d ữ liệu có thể có nhiều bảng quan

hệ chứa dữ liệu

- Đối v i ph n Database cớ ầ ủa website, nhóm đã lựa ch n h qu n trọ ệ ả ị cơ sở ữ liệu dMySQL với th mế ạnh đã tích hợp sẵn Apache và PHP đã được gi ng dả ạy trong quá trình học đ ng thồ ời MySQL còn có những đặc điểm:

o Dễ s dử ụng: MySQL là cơ sở dữ liệu tốc độ cao, ổn định, d s dễ ử ụng và hoạt động trên nhiều hệ điều hành cung cấp một hệ thống lớn các hàm tiện ích rất mạnh

o Độ bảo mật cao: MySQL rất thích hợp cho các ứng dụng có truy cập CSDL trên Internet khi sở hữu nhi u nhiề ều tính năng bảo mật thậm chí là ở c p cao ấNhanh chóng: Việc đưa ra m t s ộ ố tiêu chuẩn cho phép MySQL để làm việc r t hi u qu ấ ệ ả và

tiết kiệm chi phí, do đó nó làm tăng tốc độ ực thi th

IV Thiết kế d ữ liệ u bằng sơ đồ ớ l p

4.1 Bảng quan h ệ các lớ p trong h ệ thống

4.1.1 Lớp chuyenbay

• Thuộc tính

STT Tên thuộc tính Kiểu dữ liệu Mô tả

1 MaChuyenBay varchar(10) Mã chuyến bay (khóa chính)

2 GioKhoiHanh time Giờ khởi hành

5 NoiDi varchar(20) Nơi khởi hành

6 NoiDen varchar(20) Nơi đến

• Phương thức

1 Thêm chuyến bay Người quản lý có thể thêm chuyến bay vào hệ th ng ố

2 Xóa chuyến bay Người quản lý có thể xóa chuyến bay vào hệ th ng ố

3 Sửa chuyến bay Người quản lý có thể sửa chuyến bay vào hệ thống

4 Tìm kiếm chuy n bay Người dùng có thể tìm kiếm chuyến ế bay trên hệ

thống

4.1.2 Lớp vemaybay

• Thuộc tính

STT Tên thuộc tính Kiểu dữ liệu Mô tả

1 MaVe varchar(10) Mã vé đặt (khóa chính)

2 MaChuyenBay varchar(10) Mã chuyến bay (khóa ngoại)

3 Hạng vé varchar(10) Có hai hạng vé là ạng thường và hạh ng

thương gia

4 Giá vé int(11) Tùy vào hạng vé sẽ có giá vé khác nhau

Giá vé hạng thương gia sẽ đắt hơn 30% so

với vé thư ng ờ

4.1.3 Lớp ghengoi

• Thuộc tính

STT Tên thuộc tính Kiểu dữ liệu Mô tả

1 MaGhe varchar(10) Mã ghế hành khách trên chuyến bay (khóa

chính)

2 MaChuyenBay varchar(10) Mã chuyến bay (khóa ngoại)

4.1.4 Lớp khachhang

• Thuộc tính

STT Tên thuộc tính Kiểu dữ liệu Mô tả

1 MaDatCho varchar(10) Mã đặt chố (khóa chính) Sau khi đặt vé

hành khách sẽ nhận được mã đặt chỗ để có thể chọn d ch v khi tham gia chuy n bay ị ụ ếcũng như xem thông tin chuyến bay của mình

2 MaVe varchar(10) Mã vé đặt (khóa ngoại)

3 SDT varchar(20) Số điện thoại khách hàng

4 HoTen varchar(30) Họ tên khách hàng

5 Email varchar(40) Email khách hàng

4.1.5 Lớp dichvuchuyenbay

• Thuộc tính

STT Tên thuộc tính Kiểu dữ liệu Mô tả

1 MaDatCho varchar(10) Mã đặt chố (khóa chính) Sau khi đặt vé

hành khách sẽ nhận được mã đặt chỗ để có thể chọn d ch v khi tham gia chuy n bay ị ụ ếcũng như xem thông tin chuyến bay của mình

2 MaDatCho varchar(10) Mã dịch vụ (thuộc tính khóa)

3 SoKy tinyint(4) Dịch vụ s ố ký hành lý khách hàng mua

(tương ứng với số ký trong danh sách, số ký

sẽ là số thứ ự ừ trên xuố t t ng)

4 LoaiDoAn varchar(30) Dịch vụ đồ ăn (tương ứng với danh sách đồ

ăn, loại đồ ăn sẽ là số thứ tự các món được chọn từ trên xuống dưới)