Xây Dựng Ứng Dụng Đặt Vé Xe Có Hỗ Trợ Thanh Toán Online.pdf

BỘ GIÁO DỤC VÀ ĐÀO TẠO
TRƯỜNG ĐẠI HỌC SƯ PHẠM K THUT
THNH PH H CH MINH

ẩ1771*+,3
1*ơ1+&é1*1*+7+é1*7,1

;ặ<'1*1*'1*79e;(&ẽ+
757+$1+72ẩ121/,1(

*9+'7K6778<7+1*
697+/ầ.,01+
/ầ7,1+ẹ$

SKL008078

Tp. H Chớ Minh, thỏng 7


TRƯỜNG ĐẠI HỌC SƯ PHẠM KỸ THUẬT TP.HCM
KHOA ĐÀO TẠO CHẤT LƯỢNG CAO

ĐỒ ÁN TỐT NGHIỆP

XÂY DỰNG ỨNG DỤNG
ĐẶT VÉ XE CĨ HỖ TRỢ THANH TỐN ONLINE
SVTH: LÊ KIM ĐỈNH

17110123

LÊ TIẾN HỊA

16149048

Khóa:

K17

Ngành: CƠNG NGHỆ THƠNG TIN
GVHD: ThS. TỪ TUYẾT HỒNG

Tp. Hồ Chí Minh, tháng 7 năm 2021


TRƯỜNG ĐẠI HỌC SƯ PHẠM KỸ THUẬT TP.HCM
KHOA ĐÀO TẠO CHẤT LƯỢNG CAO

ĐỒ ÁN TỐT NGHIỆP

XÂY DỰNG ỨNG DỤNG
ĐẶT VÉ XE CĨ HỖ TRỢ THANH TỐN ONLINE
SVTH: LÊ KIM ĐỈNH

17110123

LÊ TIẾN HỊA

16149048

Khóa:

K17

Ngành: CƠNG NGHỆ THƠNG TIN
GVHD: ThS. TỪ TUYẾT HỒNG

Tp. Hồ Chí Minh, tháng 7 năm 2021


CỘNG HÒA XÃ HỘI CHỦ NGHĨA VIỆT NAM
Độc lập – Tự do – Hạnh phúc
----***---Tp. Hồ Chí Minh, ngày

tháng năm 2021

NHIỆM VỤ ĐỒ ÁN TỐT NGHIỆP
Họ và tên sinh viên:
Lê Kim Đỉnh

MSSV: 17110123

Lớp: 17110CLST3

Lê Tiến Hịa

MSSV: 16149048

Lớp: 16110CLST1

Ngành: Cơng nghệ thông tin.
Giảng viên hướng dẫn: ThS. Từ Tuyết Hồng

Ngày nhận đề tài: 15/03/2021

1.
2.
3.
4.

Ngày nộp đề tài: 20/07/2021

Tên đề tài: Xây dựng ứng dụng đặt vé xe có hỗ trợ thanh toán online.
Các số liệu, tài liệu ban đầu: Thu thập và tham khảo từ nhiều nguồn khác nhau.
Nội dung thực hiện đề tài: Phân tích, thiết kế và xây dựng website đặt vé xe.
Sản phẩm: Một website về đặt vé xe hỗ trợ thanh toán trực tuyến.

TRƯỞNG NGÀNH

GIẢNG VIÊN HƯỚNG DẪN


CỘNG HÒA XÃ HỘI CHỦ NGHĨA VIỆT NAM
Độc lập – Tự do – Hạnh phúc
----***----

PHIẾU NHẬN XÉT CỦA GIÁO VIÊN HƯỚNG DẪN
Họ và tên sinh viên: Lê Kim Đỉnh
Lê Tiến Hịa

MSSV: 17110123

Lớp: 17110CLST3

MSSV: 16149048

Lớp: 16110CLST1

Ngành: Cơng nghệ thơng tin.
Tên đề tài: Xây dựng ứng dụng đặt vé xe có hỗ trợ thanh toán online.
Họ và tên giáo viên hướng dẫn: ThS. Từ Tuyết Hồng
NHẬN XÉT
1. Về nội dung đề tài & khối lượng thực hiện:
..............................................................................................................................
..............................................................................................................................
2. Ưu điểm:
..............................................................................................................................
..............................................................................................................................
3. Khuyết điểm:
..............................................................................................................................
..............................................................................................................................
4. Đề nghị cho bảo vệ hay không?
.............................................................................................................................
5. Đánh giá loại:
.............................................................................................................................
6. Điểm: ….…… (Bằng chữ: .....................................................................................)
Tp. Hồ Chí Minh, ngày

tháng

Giáo viên hướng dẫn
(Ký & ghi rõ họ tên)

năm 2021


CỘNG HÒA XÃ HỘI CHỦ NGHĨA VIỆT NAM
Độc lập – Tự do – Hạnh phúc
----***----

PHIẾU NHẬN XÉT CỦA GIÁO VIÊN PHẢN BIỆN
Họ và tên sinh viên: Lê Kim Đỉnh
Lê Tiến Hịa

MSSV: 17110123

Lớp: 17110CLST3

MSSV: 16149048

Lớp: 16110CLST1

Ngành: Cơng nghệ thơng tin.
Tên đề tài: Xây dựng ứng dụng đặt vé xe có hỗ trợ thanh toán online.
Họ và tên giáo viên phản biện: ………………………………………………………
………………………………………………………………………………………..
NHẬN XÉT
1. Về nội dung đề tài & khối lượng thực hiện:
..............................................................................................................................
2. Ưu điểm:
..............................................................................................................................
3. Khuyết điểm:
..............................................................................................................................

..............................................................................................................................
4. Đề nghị cho bảo vệ hay không?
.............................................................................................................................
5. Đánh giá loại:
.............................................................................................................................
6. Điểm: ………… (Bằng chữ: ………........................................................................)
Tp. Hồ Chí Minh, ngày

tháng

Giáo viên phản biện

(Ký & ghi rõ họ tên)

năm 2021


LỜI MỞ ĐẦU
Ngày nay với sự phát triển không ngừng của công nghệ, nhất là ngành công nghệ
thông tin. Công nghệ thơng tin trong giai đoạn hiện tại có những bước phát triển như vũ
bão trên mọi lĩnh vực hoạt động ở khắp nơi trên toàn thế giới, điều xảy ra trong vòng
vài năm vừa qua ở Việt Nam là sự đầu tư ồ ạt vào công nghệ. Công nghệ thông tin được
ứng dụng trong nhiều lĩnh vực khác nhau. Tin học là một trong những vấn đề không thể
thiếu đối với bất kỳ một tổ chức, công ty hay doanh nghiệp nào.
Với khả năng ứng dụng rộng rãi ngành cơng nghệ thơng tin sẽ giúp con người
hồn thành một số công việc một cách nhanh gọn như nhu cầu di chuyển từ nơi này đến
nơi khác, hay cứ mỗi khi dịp ngày lễ và tết thì nhu cầu đi xe khách về quê tăng lên một
cách ồ ạt,việc xử lý thông tin khách hàng cũng như lưu lại những thông tin tuyến xe,vé
đặt sẽ rất phức tạp và đôi khi dẫn tới sự sai sót, gây sự khó chịu cũng như mất đi uy tín
đối với khách hàng.Vì vậy nhóm thực hiện chọn đề tài “đặt vé xe trực tuyến” để giải

quyết những vấn đề ở trên, giúp người dùng đặt vé xe một cách dễ dàng mà không cần
liên hệ trực tiếp với nhà xe để trao đổi, quyết định một cách tương đối mà lại còn mất
thời gian.
Với chuyên ngành công nghệ phần mềm, nhà trường đã tạo điều kiện để cho sinh
viên của ngành công nghệ thơng tin được làm khóa luận tốt nghiệp. Qua đó giúp cho
sinh viên được tiếp xúc những công nghệ mới cùng với những trải nghiệm dự án với đầy
đủ các bước thực hiện. Thông qua sự giúp đỡ cũng như những nhận xét của giáo viên
phản biện sẽ cung cấp cho sinh viên những kinh nghiệm quý báu cũng như những kiến
thức bổ ích, giúp cho việc đánh giá chất lượng sinh viên được đào tạo tại trường. Và
nhóm chúng em sẽ trình bày đề tài dưới đây.


LỜI CẢM ƠN
Lời cảm ơn đầu tiên nhóm thực hiện báo cáo xin gửi đến giảng viên hướng dẫn
là cô Từ Tuyết Hồng – người đã tận tình chỉ dẫn, hỗ trợ và giải đáp thắc mắc của nhóm
trong suốt q trình thực hiện đồ án khóa luận.
Để hồn thành đồ án khóa luận, nhóm em đã khảo sát, thu nhập dữ liệu và tổng
hợp thông tin từ nhiều hướng khác nhau. Nhưng trong quá trình xây dựng chương
trình, nghiên cứu và cố gắng hồn thành, vì kiến thức cịn hạn chế nên cịn gặp nhiều
khó khăn dẫn đến chậm tiến độ. Mặt khác, đề tài tuy đã có sự giúp đỡ của GVHD
nhưng vẫn không thể tránh khỏi những sai sót.
Do đó, nhóm em mong sẽ nhận được sự góp ý chân thành của thầy cơ và các bạn
đọc. Những ý kiến đóng góp về đề tài sẽ được nhóm em tiếp nhận để có thêm kinh
nghiệm khi làm các đề tài nghiên cứu khác. Một lần nữa, nhóm em xin cảm ơn cô Từ
Tuyết Hồng và các bạn.


MỤC LỤC
NHIỆM VỤ ĐỒ ÁN TỐT NGHIỆP ....................................................................... ii
PHIẾU NHẬN XÉT CỦA GIÁO VIÊN HƯỚNG DẪN ........................................ iii

PHIẾU NHẬN XÉT CỦA GIÁO VIÊN PHẢN BIỆN ........................................... iv
LỜI MỞ ĐẦU .........................................................................................................v
LỜI CẢM ƠN ....................................................................................................... vi
CHƯƠNG 1: TỔNG QUAN ....................................................................................1
1.1. Lý do chọn đề tài ...........................................................................................1
1.2. Mục tiêu ........................................................................................................1
1.3. Công nghệ sử dụng ........................................................................................1
CHƯƠNG 2: CƠ SỞ LÝ THUYẾT ........................................................................2
2.1. Java ...............................................................................................................2
2.1.1. Lịch sử ....................................................................................................2
2.1.2. Giới thiệu về Java và SpringBoot ............................................................2
2.1.3. Lý do chọn Java Spring boot ...................................................................2
2.2. Angular..........................................................................................................3
2.2.1. Lịch sử ....................................................................................................3
2.2.2. Giới thiệu về Angular ..............................................................................3
2.2.3. Ưu điểm ..................................................................................................5
2.2.4. Nhược điểm .............................................................................................5
2.2.5. Tại sao lại sử dụng Angular .....................................................................6
2.3. MySql............................................................................................................6
2.3.1. Giới thiệu về MySql ................................................................................6
2.3.2. Tại sao cần sử dụng MySql......................................................................6
CHƯƠNG 3: KHẢO SÁT HIỆN TRẠNG VÀ XÁC ĐỊNH YÊU CẦU ..................7
3.1. Khảo sát hiện trạng ........................................................................................7
3.1.1. Trang web hoamaicar.com.......................................................................7
3.1.2. Trang web tienoanh.com .........................................................................8
3.1.3. Trang web Futabus.vn .............................................................................9
3.1.3. Kết luận ..................................................................................................9


3.2. Xác định yêu cầu .........................................................................................10

3.2.1. Nghiệp vụ ..............................................................................................10
3.2.2. Phạm vi .................................................................................................10
3.3. Đánh giá và lựa chọn công nghệ ..................................................................11
3.3.1. Mục tiêu đề tài.......................................................................................11
3.3.2. Nội dung................................................................................................ 11
3.3.3. Hiện thực hệ thống ................................................................................11
3.3.4. Phương pháp nghiên cứu .......................................................................12
3.3.5. Ý nghĩa khoa học thực tiễn ....................................................................12
3.4. Mơ hình hóa hệ thống ..................................................................................13
3.4.1 Danh sách các Actor ...............................................................................13
3.4.2. Sơ đồ Usecase .......................................................................................13
3.4.3. Mô tả sơ đồ Usecase ..............................................................................14
3.5. Đặt tả một số Usecase chính ........................................................................16
3.5.1. Usecase LogIn (UC_02) ........................................................................16
3.5.2 Usecase Book-Ticket (UC_04) ............................................................... 17
3.5.3. View Invoice (UC_08) ..........................................................................21
3.5.4. Manage Personal Account (UC_12) ......................................................22
3.5.5. Manage Information Individual (UC_11)...............................................23
3.5.6. Manage Bus Station (UC_17) ................................................................ 24
3.5.7. Manage Routes (UC_18) .......................................................................26
3.5.8. Manage Bus (UC_19) ............................................................................30
3.5.9. Export file (UC_20)...............................................................................32
CHƯƠNG 4: THIẾT KẾ PHẦN MỀM..................................................................33
4.1. Thiết kế hệ thống .........................................................................................33
4.1.1. Lược đồ lớp ...........................................................................................33
4.1.2. Lược đồ tuần tự .....................................................................................34
4.2. Thiết kế dữ liệu............................................................................................43
4.2.1. Lược đồ thực thể (ERD) ........................................................................43
4.3. Thiết kế giao diện ........................................................................................43
4.3.1. Danh sách giao diện...............................................................................43

4.3.2. Mô tả giao diện......................................................................................45


CHƯƠNG 5: CÀI ĐẶT VÀ KIỂM THỬ ..............................................................70
5.1. Cài đặt: ........................................................................................................70
5.2. Các bước chạy hệ thống: ..........................................................................70
5.3. Kiểm thử ..................................................................................................71
CHƯƠNG 6: KẾT LUẬN VÀ HƯỚNG PHÁT TRIỂN ........................................85
6.1. Tổng kết ......................................................................................................85
6.2. Về mặt lý thuyết ..........................................................................................85
6.3. Về mặt hiện thực .........................................................................................85
6.4. Hạn chế .......................................................................................................86
6.5. Hướng phát triển ..........................................................................................86
DANH MỤC THAM KHẢO .................................................................................87


DANH MỤC TỪ VIẾT TẮT
CSS: Cascading Style Sheets
ERD: Entity Relationship Diagram
HTML: HyperText Markup Language


DANH MỤC BẢNG
Bảng 1:Lịch sử phiên bản Angular ...........................................................................3
Bảng 2: Bảng mô tả sơ đồ usecase. ........................................................................15
Bảng 3: Usercase LogIn .........................................................................................16
Bảng 4: Usecase Select Route ................................................................................17
Bảng 5: Usecase Select Seat ..................................................................................18
Bảng 6: Usecase Input Information Individual. ......................................................19
Bảng 7: Usecase Pay ..............................................................................................20

Bảng 8: Usecase tra cứu hóa đơn ...........................................................................21
Bảng 9: Usecase đổi mật khẩu ...............................................................................22
Bảng 10: Usecase đổi thông tin cá nhân .................................................................23
Bảng 11: Usecase thêm bến ...................................................................................24
Bảng 12: Usecase sửa bến ......................................................................................25
Bảng 13: Usecase cấm tuyến xe vô thời hạn ..........................................................26
Bảng 14: Usecase cấm tuyến xe thời vụ .................................................................27
Bảng 15: Usecase thêm tuyến ................................................................................28
Bảng 16: Usecase sửa tuyến ...................................................................................29
Bảng 17: Usecase thêm xe .....................................................................................30
Bảng 18: Usecase sửa xe........................................................................................31
Bảng 19: Usecase xuất lịch trình ............................................................................32
Bảng 20: Danh sách giao diện ................................................................................44
Bảng 21: Giao diện trang chủ.................................................................................47
Bảng 22: Giao diện lịch trình .................................................................................48
Bảng 23: Giao điện đặt vé ......................................................................................50
Bảng 24:Giao diện danh sách giường nằm .............................................................52
Bảng 25: Giao diện nhập thông tin khi đặt vé.........................................................53
Bảng 26: Chọn hình thức thanh tốn ......................................................................54
Bảng 27: Chi tiết tuyến xe......................................................................................55
Bảng 28: Giao diện trang Điều khoản ....................................................................56
Bảng 29: Giao diện truy xuất thông tin vé ..............................................................57
Bảng 30: Giao diện trang Đăng nhập .....................................................................58
Bảng 31: Giao diện trang Đăng ký .........................................................................59
Bảng 32: Giao diện trang Lịch sử mua vé ..............................................................60
Bảng 33: Giao diện trang Thông tin đăng nhập ......................................................61
Bảng 34: Giao diện trang Thông tin cá nhân ..........................................................62
Bảng 35: Giao diện trang Tài khoản sau khi admin đăng nhập ............................... 63
Bảng 36: Giao diện trang Dashboard. ....................................................................64
Bảng 37: Giao diện trang Bến ................................................................................64

Bảng 38: Giao diện trang Quản lý bến xe............................................................... 66
Bảng 39: Giao diện trang Xuất lịch ........................................................................68
Bảng 40: Giao diện trang quản lý xe ......................................................................69


Bảng 41: Chức năng Chọn tuyến ...........................................................................72
Bảng 42: Chức năng Chọn chỗ ..............................................................................74
Bảng 43: Chức năng Lưu thông tin khách hàng khi đặt vé .....................................76
Bảng 44: Chức năng Tìm kiếm hóa đơn .................................................................77
Bảng 45: Chức năng tìm kiếm lịch sử mua vé ........................................................77
Bảng 46: Chức năng Đổi mật khẩu ........................................................................79
Bảng 47: Chức năng Đổi thông tin cá nhân ............................................................80
Bảng 48: Chức năng Thêm Bến .............................................................................81
Bảng 49: Chức năng Sửa bến .................................................................................81
Bảng 50: Chức năng Thêm Tuyến..........................................................................82
Bảng 51: Chức năng Sửa bến .................................................................................83
Bảng 52: Chức năng Thêm xe ................................................................................84
Bảng 53: Chức năng Sửa xe ...................................................................................84


DANH MỤC HÌNH
Hình 1: Angular .......................................................................................................4
Hình 2: Giao diện hoamaicai.com ............................................................................7
Hình 3: Trang web tienoanh.com .............................................................................8
Hình 4: Trang web Futabus.vn .................................................................................9
Hình 5: Sơ đồ Usecase ...........................................................................................13
Hình 6: Lược đồ lớp ..............................................................................................33
Hình 7: Lược đồ tuần tự đăng nhập ........................................................................34
Hình 8: Lược đồ tuần tự đăng ký ...........................................................................34
Hình 9: Lược đồ tuần tự xem thơng tin tài khoản ...................................................35

Hình 10: Lược đồ tuần tự lịch sử mua vé ............................................................... 35
Hình 11: Lược đồ tuần tự đổi mật khẩu..................................................................36
Hình 12: Lược đồ tuần tự cập nhập thơng tin .........................................................36
Hình 13: Lược đồ tuần tự mua vé...........................................................................37
Hình 14: Lược đồ tuần tự xem hóa đơn ..................................................................37
Hình 15: Lược đồ tuần tự xem danh sách tài khoản................................................38
Hình 16: Lược đồ tuần tự thêm nhân viên .............................................................38
Hình 17: Lược đồ tuần tự xem tuyến xe .................................................................39
Hình 18: Lược đồ tuần tự thêm tuyến xe ................................................................ 39
Hình 19: Lược đồ tuần tự chỉnh sửa tuyến xe .........................................................40
Hình 20: Lược đồ tuần tự xem bến xe ....................................................................40
Hình 21: Lược đồ tuần tự thêm bến xe ...................................................................41
Hình 22: Lược đồ tuần tự chỉnh sửa biến ............................................................... 41
Hình 23: Lược đồ tuần tự xuất lịch trình ................................................................ 42
Hình 24: Lược đồ tuần tự thống kê ........................................................................42
Hình 25: Lược đồ thực thể ERD ............................................................................43
Hình 26: Giao diện header trang chủ ......................................................................45
Hình 27: Danh sách hiện tuyến phổ biến ................................................................ 45
Hình 28: Giao diện hình ảnh điểm đến ...................................................................46
Hình 29: Giao diện lịch trình .................................................................................48
Hình 30: Giao điện đặt vé ......................................................................................49
Hình 31: Giao diện danh sách giường nằm.............................................................51
Hình 32: Giao diện nhập thơng tin khi đặt vé .........................................................52
Hình 33: Chọn hình thức thanh tốn ......................................................................54
Hình 34: Chi tiết tuyến xe ......................................................................................55
Hình 35: Giao diện trang Điều khoản .....................................................................56
Hình 36: Giao diện truy xuất thơng tin vé theo điều kiện .......................................56
Hình 37: Giao diện trang Đăng nhập ......................................................................57
Hình 38: Giao diện trang Đăng ký .........................................................................58
Hình 39: Giao diện trang Lịch sử mua vé ............................................................... 59

Hình 40: Giao diện trang Thơng tin đăng nhập ......................................................60


Hình 41: Giao diện trang Thơng tin cá nhân...........................................................61
Hình 42: Giao diện trang Tài khoản sau khi admin đăng nhập ............................... 62
Hình 43: Giao diện trang Dashboard. .....................................................................63
Hình 44: Giao diện trang Quản lý tài khoản. ..........................................................64
Hình 45: Giao diện trang Xe ..................................................................................65
Hình 46: Giao diện trang Xuất lịch ........................................................................67
Hình 47: Giao diện trang quản lý xe ......................................................................68
Hình 48: CMD kiểm tra phiên bản node ................................................................ 70


CHƯƠNG 1: TỔNG QUAN
1.1. Lý do chọn đề tài
Hiện nay, với sự bùng nổ và phát triển mạnh mẽ của mạng lưới internet và cơng
nghệ thơng tin thì xuất hiện nhiều phần mềm,công cụ ứng dụng hỗ trợ giúp con người
có thể làm việc một cách chuyên nghiệp, giải được nhiều bài tốn đau đầu mà chỉ có
máy móc mới thực hiện được một cách chính xác.
Con người từ đó cũng có sự thích ứng và phụ thuộc nhiều vào cơng nghệ, thay đổi
thói quen sinh hoạt để có thể tiếp cận và tận dụng được nên tin học hiện đại, giúp cho
cơng việc trở nên thuận lợi, ít bất cập. Vì vậy nhóm em quyết định chọn đề tài này để
cho mọi người có thể đặt vé xe đi chơi hay về quê một cách nhanh chóng, thuận lợi.

1.2. Mục tiêu
Mục tiêu của đồ án là có thể áp dụng các kiến thức đã học để có thể xây dựng lên
một nền tảng web giúp cho khách hàng có thể đặt vé một cách thuận lợi cũng như
quản lý thông tin nhà xe của chủ xe một cách hợp lý.

1.3. Cơng nghệ sử dụng

Trong đề tài này nhóm em đã tìm hiểu và tìm ra và áp dụng những công nghệ sau:
-

Front-end: Ứng dụng web xây dựng bởi Angular.

-

Back-end: Nền tảng Java SpringBoot.

-

Database: sử dụng Mysql.

-

Một số công nghệ khác như: HTML, CSS và JavaScript.

1


CHƯƠNG 2: CƠ SỞ LÝ THUYẾT
2.1. Java
2.1.1. Lịch sử
Java được khởi đầu bởi James Gosling và đồng nghiệp, ban đầu được gọi
là Oak.Java được phát hành vào năm 1994. Sau khi Oracle mua lại của công ty Sun
Microsystems năm 2009 – 2010. Oracle đã mô tả họ là “người quản lý công nghệ Java
với cam kết không ngừng để bồi dưỡng một cộng đồng tham gia và minh bạch”.[1]
2.1.2. Giới thiệu về Java và SpringBoot
Java là một ngôn ngữ lập trình dạng lập trình hướng đối tượng (OOP). Khác với
phần lớn ngơn ngữ lập trình thơng thường, thay vì biên dịch mã nguồn thành mã máy

hoặc thông dịch mã nguồn khi chạy, Java được thiết kế để biên dịch mã nguồn thành
bytecode, bytecode sau đó sẽ được mơi trường thực thi (runtime environment) chạy.
Cú pháp Java được vay mượn nhiều từ C và C++ nhưng có cú pháp hướng đối
tượng đơn giản và ít tính năng xử lý cấp thấp hơn. Do đó việc viết một chương trình
bằng Java dễ dàng hơn, đỡ tốn công sửa lỗi hơn.
Như các bạn cũng đã biết Spring framework có cho ra đời 1 nền tảng làm web
đó là Spring mvc. Tuy nhiên trong quá trình làm việc với spring mvc, nhà cung cấp họ
thấy spring mvc cấu hình q nhiều và có rất nhiều thư viện dùng thường xuyên tuy
nhiên mỗi khi tạo project spring mvc mới chúng ta phải tải lại những thư viện đó vì
vậy rất là mất cơng và mất thời gian. Từ những khó khăn đó, họ cũng nãy ra ý tưởng
xây dựng 1 công nghệ để giảm thiểu cấu hình và tích hợp sẵn những thư viện hay dùng
để mỗi khi tạo project mới khơng phải cấu hình nhiều và tải lại những thư viện dùng
nhiều. Từ đó spring boot được nhà phát triển spring framework cho ra đời. Spring boot
thuộc nhóm module của spring framework, cung cấp tính năng RAD (Rapid
Application Development) Spring boot được sử dụng để tạo ra ứng dụng độc lập dựa
trên spring mà bạn có thể chạy ngay sau khi cấu hình lại spring.
2.1.3. Lý do chọn Java Spring boot
-

Java được thiết kế để biên dịch code thành bytecode và bytecode sẽ chạy trên
mơi trường thực thi. Nên chương trình Java có thể chạy trên nhiều thiết bị,
nhiều hệ điều hành khác nhau.

-

Quá trình cấp phát, giải phóng bộ nhớ thực hiện tự động. Khơng sử dụng con
trỏ hoặc phép tốn con trỏ.

2

-

Do Java phải biên dịch qua máy ảo Java (JVM) nên sẽ được bảo mật cao hơn
khi mọi đối tượng phải qua JVM mới đến hệ điều hành.

-

Java hỗ trợ lập trình cho hệ thống phân tán như client-server, RMI… bằng Java
Web, UDP, TCP.

-

Tạo các ứng dụng độc lập có thể được bắt đầu bằng cách sử dụng java-jar

-

Nhúng trực tiếp Tomcat, Jetty hoặc Undertow. Không cần triển khai các tệp
WAR.

-

Cung cấp starter POMs được đề xuất để đơn giản hóa cấu hình Maven. Tự động
cấu hình Spring bất cứ khi nào có thể.

-

Khơng tự sinh mã và khơng u cầu XML.

2.2. Angular

2.2.1. Lịch sử
AngularJS được phát triển từ năm 2009 bởi Misko Hevery cùng 1 người bạn
khác là Adam Abrons. Nó được xem là một dự án riêng cho đến khi Misko Hevery
tham gia vào dự án Google Feedback dưới tư cách lập trình viên bán thời gian.
Lịch sử phát hành:
Angular Version

Date

Description

AngularJS

20/10/2010

Phiên bản đầu tiên

Angular 2

14/09/2016

Version 2

Angular 4

23/03/2017

Version 4

Angular 5

11/11/2017

Version 5

Angular 6

03/05/2018

Version 6

Angular 7

18/10/2018

Version 7

Angular 8

25/08/2019

Version 8

Angular 9

13/11/2019

Version 9

Angular 10

24/06/2020

Version 10

Bảng 1:Lịch sử phiên bản Angular
2.2.2. Giới thiệu về Angular

3


Hình 1: Angular
-

Angular là một javascript framework do google phát triển để xây dựng các
Single Page Application (SPA) bằng JavaScript, HTML và TypeScript.

-

Code được viết bằng TypeScript biên dịch thành JavaScript và hiển thị tương tự
trong trình duyệt.

2.2.2.1. Component:
Component là phần chính cho các ứng dụng Angular. Mỗi thành phần bao gồm:
-

HTML template khai báo những gì hiển thị trên trang.

-

Typescript class xác định các hành vi.

-

CSS xác định cách thành phần được sử dụng trong template.

2.2.2.2. Template:
-

Trong Angular, một template là một chunk của HTML. Bên trong template có
thể sử dụng nhiều cú pháp đặt biệt để tận dụng nhiều tính năng của Angular.

-

Mỗi Angular template trong ứng dụng là một section của HTML điều đó có thể
bao gồm là một phần của page mà trình duyệt hiển thị.

-

Một Angular HTML template hiển thị chế độ xem hoặc giao diện người dùng
trong browser giống như HTML thông thường nhưng có nhiều chức năng hơn.

-

Cho phép kiểm sốt UX/UI bằng cách phối hợp dữ liệu giữa các lớp và
template.

2.2.2.3. Directives:
Built-in attribute directives lắng nghe và sửa đổi hành vi của các elements,
attributes, properties và components của HTML khác.

Nhiều NgModules như RouterModule và FormsModule xác định các thuộc tính
của riêng chúng. Các attribute directives khác như là:
4


-

NgClass – thêm và xóa bộ các lớp CSS.

-

NgStyles – thêm và xóa bộ các kiểu HTML.

-

NgModel – thêm ràng buộc dữ liệu hai chiều đến HTML form element.

Built-in structural directives có trách nhiệm về bố cục HTML. Định hình hoặc định
hình lại DOM’s structure, thường bằng cách thêm, xóa và thao tác các host elements
mà được gán vào.[2]
Một số built-in structural directives:
-

NgIf – điều kiện tạo hoặc hủy bỏ subviews từ template.

-

NgFor – lặp lại các node duyệt các item trong list.

-

NgSwitch – một tập hợp các lệnh chuyển đổi giữa các chế độ xem thay thế.

2.2.2.4. Dependency injection:
Dependency là những services hoặc objects mà một class cần để thực hiện
những function của nó. Dependency injection là một design pattern trong một class
yêu cầu dependency từ một nguồn bên ngoài tốt hơn là tự tạo.
2.2.3. Ưu điểm
-

Khả năng ràng buộc dữ liệu ở hai chiều: code ở cả JavaScript và HTML đều
được đồng bộ hóa, giúp tiết kiệm thời gian lập trình.

-

Mở rộng, phát triển tính năng của các file HTML nhờ sự hiện diện của các chỉ
thị. Người dùng chỉ cần thêm tiền tố ng- trước thuộc tính HTML để có thể kích
hoạt chỉ thị.

-

Hỗ trợ thiết kế ứng dụng bằng các đoạn code ngắn gọn nhờ các template mà cấu
trúc Code – Angular.

-

Hỗ trợ việc thử nghiệm, tích hợp.

-

Là cơng cụ của tương lai bởi hệ thống chức năng tuyệt vời. Cơ sở của người
dùng được phát triển liên tục, đi kèm với đó là sự cập nhật thường xuyên tài
liệu chuyên sâu.

-

Tương thích với nhiều thiết bị, bao gồm cả di động lẫn để bàn.

2.2.4. Nhược điểm
-

Bảo mật kém, có khả năng bảo mật thấp. Phải có tính năng bảo mật và xác thực
phía server sẽ giúp ứng dụng trở nên an toàn hơn.

5


-

Nếu người sử dụng ứng dụng của bạn vô hiệu hóa JavaScript thì họ chỉ nhìn
được trang cơ bản, khơng thấy gì thêm.

2.2.5. Tại sao lại sử dụng Angular
-

Là một frameworks nên Angular mang đến một kiến trúc rõ ràng.

-

Extensive binding giúp quá trình hiển thị dữ liệu, điều khiển DOM, thực thi các

event một cách trơn tru và dễ dàng.

-

Hỗ trợ đầy đủ các tính năng điều hướng có thể truyền dữ liệu giữa các route.

2.3. MySql
2.3.1. Giới thiệu về MySql
MySQL là chương trình dùng để quản lý hệ thống cơ sở dữ liệu (CSDL), trong
đó CSDL là một hệ thống lưu trữ thông tin. được sắp xếp rõ ràng, phân lớp ngăn nắp
những thơng tin mà mình lưu trữ. Có thể truy cập dữ liệu một cách thuận lợi, nhanh
chóng. MySQL hỗ trợ đa số các ngơn như lập trình.[1]
2.3.2. Tại sao cần sử dụng MySql
-

Khả năng mở rộng và tính linh hoạt.

-

Hiệu năng cao.

-

Tính sẵn sàng cao.

-

Hỗ trợ giao dịch mạnh mẽ.

-

Điểm mạnh của Web và Data Warehouse.

-

Bảo vệ dữ liệu mạnh mẽ.

-

Phát triển ứng dụng toàn diện.

-

Quản lý dễ dàng.

-

Mã nguồn mở tự do và hỗ trợ 24/7.

-

Chi phí sở hữu thấp nhất.

6


CHƯƠNG 3: KHẢO SÁT HIỆN TRẠNG VÀ XÁC ĐỊNH YÊU
CẦU
3.1. Khảo sát hiện trạng
Với cuộc sống phát triển về kinh tế lẫn chất lượng hiện nay, thì hiện trạng ồ ạt

người dân địa phương ở các tỉnh vùng miền đổ xơ vào các thành phố lớn để tìm kiếm
cơng việc và cơng tác, và cứ mỗi khi có dịp lễ, tết, ngày nghỉ thì mọi người lại về q
để đồn tụ gia đình, với những nhu cầu và mang số lượng lớn như vậy thì việc các nhà
xe phải sử dụng các công cụ ứng dụng để giúp giải quyết nhu cầu của người dân, trang
web đặt vé xe giúp cho khách hàng có thể an tâm, và có có thể đặt vé bất cứ nơi đâu có
mạng và máy tính chứ khơng cần phải tới nhà xe hay gọi điện thoại nữa, và việc đặt vé
mang tính chất tự chủ, tùy theo nhu cầu hay lựa chọn cho phù hợp cho mỗi khách hàng.
Việc ra đời của trang web đặt vé xe trực tuyến là việc vô cùng hữu ích.
3.1.1. Trang web hoamaicar.com
Trang web hoamaicar là một trang web cho phép người dùng, khách hàng đặt vé
xe thông qua biểu mẫu.

Hình 2: Giao diện hoamaicai.com
Ưu điểm:
-

Đặt vé xe có thể đặt được nhiều khung giờ trải dài trong một ngày …

-

Thiết kế đơn giản, tóm lược.

-

Có tương đối các chức năng cơ bản.

Nhược điểm:
-

Chỉ được đặt trong khu vực cụ thể, khơng mở rộng ra khu vực khác.

-

Chưa có chức năng thanh tốn online, chỉ có liện hệ để được đặt vé.

7


-

Chưa có giá cụ thể cho từng chuyến xe.

-

Khả năng tương tác và sự tiện lợi còn kém hiệu quả.

3.1.2. Trang web tienoanh.com
Đây là trang web đặt vé xe được thành lập từ năm 2010 cho đến nay, có trên 10
năm kinh nghiệm trong lĩnh vực vận tải, và phục vụ chỉ trên tuyến đường Hồ Chí Minh
– Đăk Lăk.

Hình 3: Trang web tienoanh.com
Ưu điểm:
-

Bộ lọc giá cả, thời gian, khơng gian xe

-

Có vận chuyển hàng hóa ngồi hành khách.

-

Hiện đầy đủ các mục tuyến đi.

-

Giá cả rõ ràng, không mập mờ

Nhược điểm:
-

Thiếu sót lưu trữ thơng tin người dùng.

-

Khơng thể tra cứu được những vé đã từng đi cho khách hàng.

-

Khơng có sự rõ ràng về chức năng thanh toán online như đã đề cập ở đầu trang
web.

8


3.1.3. Trang web Futabus.vn

Hình 4: Trang web Futabus.vn
Ưu điểm:

-

Có giao diện dễ dùng.

-

Hiển đầy đủ thông tin chuyến đi.

-

Xử lý tác vụ nhanh.

Nhược điểm:
-

Khơng có phần chi tiết cho khách hàng

-

Khơng có thơng tin giá vé cụ thể.

-

Thanh tốn chưa đa dạng, gây khó khăn cho người sử dụng phương thức thanh
toán khác.

3.1.3. Kết luận
3.1.3.1. Những vấn đề cần chú ý:
-

Thiết kế giao diện đẹp mắt.

-

Tốc độ load ảnh của website.

-

Thêm các chức năng cơ bản cho người dùng: tìm kiếm tuyến xe, xem thông tin
tuyến xe, đặt vé…

3.1.3.2. Những ưu điểm cần tiếp thu cho sản phẩm:
-

Thiết kế giao diện đơn giản, dễ sử dụng, có bố cục gọn, rõ ràng, dễ nhìn.

9