LẬP TRÌNH ANDROID CƠ BẢN Đề tài : Xây dựng app đặt đồ ăn HaNoi Food Tour

HỌC VIỆN KỸ THUẬT MẬT MÃ KHOA CÔNG NGHỆ THÔNG TIN LẬP TRÌNH ANDROID CƠ BẢN Đề tài Xây dựng app đặt đồ ăn HaNoi Food Tour Sinh viên thực hiện Bùi Quang Tuấn CT030453 Bùi Việt Kiều CT030428 Nguyễn Việt Tùng CT030454 Nhóm 1 – C3D02 Giảng viên hướng dẫn ThS Lê Bá Cường Hà Nội, 2022 77 LỜI NÓI ĐẦU Ngày nay, với sự phát triển mạnh mẽ của khoa học công nghệ, Công nghệ Thông tin là một trong những ngành có vị thế dẫn đầu và có vai trò rất lớn trong sự phát triển chung đó Các ứng dụng của công nghệ thông.

HỌC VIỆN KỸ THUẬT MẬT MÃ

KHOA CÔNG NGHỆ THÔNG TIN

LẬP TRÌNH ANDROID CƠ BẢN

Đề tài : Xây dựng app đặt đồ ăn HaNoi Food Tour

Sinh viên thực hiện: Bùi Quang Tuấn: CT030453

Bùi Việt Kiều: CT030428 Nguyễn Việt Tùng: CT030454 Nhóm 1 – C3D02

Giảng viên hướng dẫn: ThS Lê Bá Cường

Hà Nội, 2022

LỜI NÓI ĐẦU

Ngày nay, với sự phát triển mạnh mẽ của khoa học công nghệ, Công nghệ Thôngtin là một trong những ngành có vị thế dẫn đầu và có vai trò rất lớn trong sự phát triểnchung đó Các ứng dụng của công nghệ thông tin được áp dụng trong mọi lĩnh vựcnghiên cứu khoa học cũng như trong mọi lĩnh vực của đời sống Là một phần củaCông nghệ Thông tin, Mobile App đang có được sự phát triển mạnh mẽ và phổ biếnrất nhanh bởi những lợi ích mà nó mang lại cho cộng đồng là rất lớn

Bằng việc lựa chọn và thực hiện đề tài “Hanoi Food Tour”, nhóm em muốn tìmhiểu và đưa ra một giải pháp tốt nhằm giới thiệu về những địa điểm và ẩm thực đặctrưng của Hà Nội cho các du khách trong nước cũng như các du khách nước ngoài.Ứng dụng mang lại cho người dùng rất nhiều lợi ich như: khả năng tìm kiếm, đặt hàngcũng như thanh toán những địa điểm ăn uống chất lượng nội thành Hà Nội Ngoài ra,ứng dụng còn là nơi quảng bá các đại điểm, danh lam thắng cảnh và món ăn truyềnthông của người Hà Nội

Ứng dụng giúp cho cửa hàng cung cấp cho khách hàng những lựa chọn linh hoạt vàtiện lợi trong việc tìm mua sản phẩm thông qua chức năng tìm kiếm và giỏ hàng Cácthông tin về sản phẩm được hiển thị chi tiết với từng sản phẩm, từ đó khách hàng dễdàng nhận biết và lựa chọn được thứ mình cần Về phía cửa hàng, hệ thống mang lại

sự tiện dụng trong việc cập nhập và quản lý các thông tin cho app, tạo khả năng liênlạc nhanh và dễ dàng với khách hàng

Tuy đề tài đã hoàn thành nhưng vì điều kiện thời gian không cho phép cũng nhưcác tài liệu không được đầy đủ nên app vẫn còn một số hạn chế nhất định Rất mongnhận được sự đóng góp ý kiến của các thầy, cô và các bạn để app ngày càng hoàn thiệnhơn

Trân trọng và chân thành cảm ơn!

MỤC LỤC

LỜI NÓI ĐẦU 1

MỤC LỤC 2

DANH MỤC HÌNH ẢNH 5

DANH MỤC BẢNG BIỂU 6

CHƯƠNG 1 GIỚI THIỆU VỀ MOBILE APP 7

1.1 Giới thiệu về Mobile App 7

1.1.1 Khái niệm Mobile App 7

1.1.2 Phân loại Mobile App 8

1.1.3 Tầm quan trọng của Mobile App 9

1.1.4 Ngôn ngữ lập trình để tạo ra Mobile App 10

1.2 Các công cụ sử dụng 11

1.2.1 Visual Studio Code IDE 11

1.2.2 Ngôn ngữ JavaScript 14

1.2.3 Giới thiệu về NodeJS 16

1.2.4 ExpressJS 17

1.2.5 React Native 20

1.2.6 MongoDB 22

CHƯƠNG 2 PHÂN TÍCH THIẾT KẾ HỆ THỐNG 25

2.1 Phân tích hệ thống 25

2.1.1 Khảo sát hiện trạng 25

2.1.2 Mục tiêu xây dựng ứng dụng 25

2.2 Biểu đồ Usecase tổng quan 26

2.3 Đặc tả các ca sử dụng 27

2.3.1 Ca sử dụng Quản lý cửa hàng 27

2.3.2 Ca sử dụng Quản lý món ăn 28

2.3.3 Ca sử dụng Quản lý đơn hàng 29

2.3.4 Ca sử dụng Quản lý doanh thu 30

2.3.5 Ca sử dụng quản lý thông tin 30

2.3.6 Ca sử dụng Đặt hàng 31

2.4 Thiết kế cơ sở dữ liệu 32

2.4.1 Bảng quản trị viên 32

2.4.2 Bảng quản lý đơn hàng 33

2.4.3 Bảng món ăn 33

2.4.4 Bảng đơn hàng 34

CHƯƠNG 3 THỰC NGHIỆM 35

3.1 Thiết kế giao diện ứng dụng 35

3.1.1 Giao diện đăng ký 35

3.1.2 Giao diện đăng nhập 37

3.1.3 Giao diện trang chủ 38

3.1.4 Giao diện màn danh mục món ăn 39

3.1.5 Giao diện màn chi tiết cửa hàng 40

3.1.6 Giao diện màn tìm kiếm 41

3.1.7 Giao diện màn đặt hàng 42

3.1.8 Giao diện màn chi tiết đơn hàng 43

3.1.9 Giao diện màn giỏ hàng 44

3.1.10 Giao diện màn thanh toán 45

3.1.11 Giao diện màn quản lý lịch sử đơn hàng 46

3.2 Thiết kế giao diện website quản lý 47

3.2.1 Giao diện đăng ký 47

3.2.2 Giao diện đăng nhập 47

3.2.3 Giao diện trang chủ 48

3.2.4 Giao diện màn chi tiết đơn hàng 49

3.2.5 Giao diện màn quản lý đơn hàng 50

3.2.6 Giao diện màn thống kê doanh thu 50

3.3 Hướng dẫn sử dụng ứng dụng 51

KẾT LUẬN 52

DANH MỤC HÌNH ẢNH

Hình 1-1 Giới thiệu về Mobile App 8

Hình 1-2 Phân loại Mobile App 9

Hình 1-3 Sự phổ biến của Mobile App 10

Hình 1-4 Android và IOS 11

Hình 1-5 Visual Studio Code IDE 13

Hình 1-6 Các tính năng của Visual Studio Code 13

Hình 1-7 React Native 21

Hình 1-8 Ảnh minh họa MongoDB 25

Hình 2-1 Biểu đồ Usecase tổng quan 27

Hình 3-1 Giao diện dăng ký 36

Hình 3-2 Màn hình đăng ký tài khoản thành công 37

Hình 3-3 Giao diện đăng nhập 38

Hình 3-4 Giao diện trang chủ 39

Hình 3-5 Giao diện chi tiết danh mục món ăn 40

Hình 3-6 Giao diện chi tiết cửa hàng 41

Hình 3-7 Giao diện màn tìm kiếm 42

Hình 3-8 Giao diện đặt hàng thành công 43

Hình 3-9 Giao diện màn chi tiết đơn hàng 44

Hình 3-10 Giao diện màn giỏ hàng 45

Hình 3-11 Giao diện màn xác nhận thanh toán 46

Hình 3-12 Giao diện màn thanh toán thành công 46

Hình 3-13 Giao diện màn quản lý lịch sử đơn hàng 47

Hình 3-14 Giao diện màn hình đăng ký 48

Hình 3-15 Giao diện màn hình đăng nhập 48

Hình 3-16 Giao diện màn trang chủ 49

Hình 3-17 Giao diện màn chi tiết đơn hàng 50

Hình 3-18 Giao diện màn quản lý đơn hàng 51

Hình 3-19 Giao diện màn thống kê doanh thu 51

DANH MỤC BẢNG BIỂU Bảng 2.1 Ca sử dụng Quản lý cửa hàng 28

Bảng 2.2 Ca sử dụng Quản lý món ăn 29

Bảng 2.3 Ca sử dụng Quản lý đơn hàng 30

Bảng 2.4 Ca sử dụng Quản lý doanh thu 31

Bảng 2.5 Ca sử dụng Quản lý thông tin 31

Bảng 2.6 Ca sử dụng Đặt hàng 32

Bảng 2.7 Bảng quản trị viên 33

Bảng 2.8 Bảng quản lý đơn hàng 34

Bảng 2.9 Bảng món ăn 34

Bảng 2.10 Bảng đơn hàng 35

CHƯƠNG 1 GIỚI THIỆU VỀ MOBILE APP

1.1 Giới thiệu về Mobile App

1.1.1 Khái niệm Mobile App

Mobile app là một chương trình ứng dụng dành riêng cho thiết bị di động như

tablet hay smartphone cho phép người dùng có thể sử dụng để truy cập vào nội dung

mà bạn mong muốn ngay trên thiết bị điện thoại di động đó Những nhà lập trìnhmobile app sẽ biến nó trở thành một không gian lớn được thu nhỏ để người dùng cóthể giải trí, xem tin tức, mua sắm,

Hình 1-1 Giới thiệu về Mobile App

Mobile app chứa một lượng lớn các khách hàng tiềm năng mà doanh nghiệp tìmkiếm Vì vậy mà ngày nay có vô số app thuộc nhiều lĩnh vực và ngành nghề khác nhauđược ra đời

1.1.2 Phân loại Mobile App

Khi đã hiểu hơn về khái niệm mobile app là gì thì việc tìm hiểu thêm về các phânloại của mobile app là không thể bỏ qua:

 Native Mobile App: Đây là loại ứng dụng mà bạn sử dụng để tải những nội

dung mong muốn xuống thiết bị điện thoại di động và sẽ sử dụng chúng bằngcách truy cập Một số native app có thể kể đến như các ứng dụng tra từ điển haycác loại game mobile offline,

 Hybrid Mobile App: Hybrid Mobile App là một ứng dụng lai kết hợp được

những điểm đặc trưng nổi bật giữa web app và native app Web ứng dụng nàyđược viết bằng các ngôn ngữ lập trình web như CSS3, Javascript, hay HTML5

và được bao bọc bởi một lớp vỏ container ở bên ngoài để có thể tương tự nhưnative mobile app và được tải về trên kho ứng dụng

Hình 1-2 Phân loại Mobile App

1.1.3 Tầm quan trọng của Mobile App

Sự phổ biến của smartphone: Smartphone sẽ ngày càng thay thế feature phone

trong các cửa hàng Hầu hết mọi người đều có khả năng sử dụng các App trênsmartphone, từ những doanh nhân, social networker và cả các game thủ Smartphoneđang ngày càng phổ biến

Khả năng đa dạng: Smartphone ngày càng có sức hút mạnh mẽ Chúng ngày càng

phù hợp với lượng lớn công việc ngày càng tăng mà trước đây bị hạn chế bở máy tínhxách tay hay máy tính để bàn Ngày nay, các smartphone app được các công ty sửdụng để quảng bá thương hiệu/sản phẩm, hoặc để cung cấp quyền truy cập vào các sảnphẩm hiện có Trong tương lai, chúng ta sẽ thấy rất nhiều những ứng dụng khác như:Kích hoạt sản phẩm mới, y tế lưu động, bán hàng trên điện thoại, hoặc các App giúpcải thiện hiệu quả làm việc

Sự phổ biến của App stores: Trong tương lai gần, smartphone sẽ luôn phụ thuộcvào các App store Bởi nếu bạn có smartphone hay advanced feature phone thì sẽ dễdàng và thuận tiện tiếp cận với thế giới các ứng dụng hơn Trong tương lai gần,smartphone sẽ luôn phụ thuộc vào các App store

Hình 1-3 Sự phổ biến của Mobile App Unmatched user-experience: Mobile App mang đến những trải nghiệm mà

Mobile Web hay các công cụ khác không thể có được Mobile App mang đến nhữngtrải nghiệm khác biệt

1.1.4 Ngôn ngữ lập trình để tạo ra Mobile App

Đối với mỗi hệ điều hành của thiết bị di động thì lại cần sử dụng những ngôn ngữlập trình khác nhau Cụ thể là hai hệ điều hành cơ bản nhất hiện nay là ISO

và Android

Hình 1-4 Android và IOS

a) Thiết kế app mobile hệ điều hành IOS:

Hệ điều hành IOS sẽ sử dụng hai ngôn ngữ lập trình phổ biến là Swift vàObjective-C và nhận sự hỗ trợ của Apple để thiết kế ứng dụng di động Swift là ngônngữ tối ưu nhất sử dụng mã nguồn mở và tiếp cận được với các nhà sản xuất ưachuộng sẽ giúp mang lại hiệu quả lập trình ứng dụng cao cho IOS

Tuy nhiên, Objective-C lại là nền tảng đầu tiên giúp thiết kế app và phổ biến hơntrước khi Swift ra đời Vì vậy, tuỳ thuộc vào nhu cầu mà bạn nên lựa chọn ngôn ngữphù hợp

b) Thiết kế app mobile hệ điều hành Android

Hai ngôn ngữ lập trình phổ biến được sử dụng trong thiết kế app cho android làJava và Kotlin Trong đó:

 Java là cái tên đã quá quen thuộc với hầu hết các lập trình viên bởi nó được sửdụng rất rộng rãi và phổ biến Ưu điểm lớn nhất của java chính là trong việcviết app, các developer có thể hoàn toàn thoải mái mà không có bất kỳ giới hạnnào trong việc thiết lập app

 Kotlin là ngôn ngữ lập trình được ra đời nhằm khắc phục một số điểm hạn chếcủa java và tối ưu trong việc viết app theo yêu cầu Kotlin luôn được cải tiếnliên tục và hỗ trợ các nhà phát triển tập trung triển khai ứng dụng của mình mộtcách hiệu quả

1.2 Các công cụ sử dụng

1.2.1 Visual Studio Code IDE

1.2.1.1 Giới thiệu về Visual Studio Code IDE

Visual Studio Code là một trình soạn thảo, biên tập code hoàn toàn miễn phí dànhđược Microsoft phát triển cho các lập trình viên và có mặt trên hầu hết các hệ điềuhành phổ biến như: Windows, Linux và macOS Có thể nói rằng, Visual Studio Code

là một sự kết hợp độc đáo – đỉnh cao giữa IDE và Code Editor

Không chỉ là soạn thảo, chỉnh sửa code, Visual Studio Code còn có thể hỗ trợ bạnlàm được rất nhiều việc như: đổi theme, hàng loạt phím tắt tiện dụng, có chức năngdebug đi kèm, hỗ trợ Git, syntax highlighting hỗ trợ quá trình gõ code, phần gợi ý codethông minh, …

Hình 1-5 Visual Studio Code IDE

Visual Studio Code là một sản phẩm của Microsoft Vì thế, Visual Studio Code sởhữu cho mình những công nghệ tiên tiến nhất và thường xuyên được cập nhật Khôngchỉ phù hợp đối với những lập trình viên chuyên nghiệp, Visual Studio Code còn phùhợp với những:

 Sinh viên đang theo học ngành công nghệ thông tin

 Các tester

 Các Data Administrator

Và hầu hết những người quan tâm đến lập trình đều có thể sử dụng Visual StudioCode để phục vụ cho nhu cầu về công việc và học tập của mình

1.2.1.2 Một số tính năng của Visual Studio Code

Hình 1-6 Các tính năng của Visual Studio Code

Visual Studio Code hỗ trợ nhiều ngôn ngữ lập trình như C/C++, C#, F#, VisualBasic, HTML, CSS, JavaScript, … Vì vậy, nó dễ dàng phát hiện và đưa ra thông báonếu chương chương trình có lỗi.

 Hỗ trợ đa nền tảng

Các trình viết code thông thường chỉ được sử dụng hoặc cho Windows hoặc Linuxhoặc Mac Systems Nhưng Visual Studio Code có thể hoạt động tốt trên cả ba nền tảngtrên

 Cung cấp kho tiện ích mở rộng

Trong trường hợp lập trình viên muốn sử dụng một ngôn ngữ lập trình không nằmtrong số các ngôn ngữ Visual Studio hỗ trợ, họ có thể tải xuống tiện ích mở rộng Điềunày vẫn sẽ không làm giảm hiệu năng của phần mềm, bởi vì phần mở rộng này hoạtđộng như một chương trình độc lập

 Kho lưu trữ an toàn

Đi kèm với sự phát triển của lập trình là nhu cầu về lưu trữ an toàn Với VisualStudio Code, người dùng có thể hoàn toàn yên tâm vì nó dễ dàng kết nối với Git hoặcbất kỳ kho lưu trữ hiện có nào

 Hỗ trợ app

Visual Studio Code hỗ trợ nhiều ứng dụng mobile Ngoài ra, nó cũng có một trìnhsoạn thảo và thiết kế mobile app

 Lưu trữ dữ liệu dạng phân cấp

Phần lớn tệp lưu trữ đoạn mã đều được đặt trong các thư mục tương tự nhau Ngoài

ra, Visual Studio Code còn cung cấp các thư mục cho một số tệp đặc biệt quan trọng

 Hỗ trợ viết Code

Một số đoạn code có thể thay đổi chút ít để thuận tiện cho người dùng VisualStudio Code sẽ đề xuất cho lập trình viên các tùy chọn thay thế nếu có

 Hỗ trợ thiết bị đầu cuối

Visual Studio Code có tích hợp thiết bị đầu cuối, giúp người dùng khỏi phảichuyển đổi giữa hai màn hình hoặc trở về thư mục gốc khi thực hiện các thao tác

 Màn hình đa nhiệm

Người dùng Visual Studio Code có thể mở cùng lúc nhiều tệp tin và thư mục – mặc

dù chúng không hề liên quan với nhau

 Intellisense

Hầu hết các trình viết mã đều có tính năng nhắc mã Intellisense, nhưng ít chươngtrình nào chuyên nghiệp bằng Visual Studio Code Nó có thể phát hiện nếu bất kỳđoạn mã nào không đầy đủ Thậm chí, khi lập trình viên quên không khai báo biến,Intellisense sẽ tự động giúp họ bổ sung các cú pháp còn thiếu

 Hỗ trợ Git

Visual Studio Code hỗ trợ kéo hoặc sao chép mã trực tiếp từ GitHub Mã này sau

đó có thể được thay đổi và lưu lại trên phần mềm

 Bình luận

Việc để lại nhận xét giúp người dùng dễ dàng nhớ công việc cần hoàn thành

1.2.2 Ngôn ngữ JavaScript

1.2.2.1 Giới thiệu về JavaScript

Javascript là một ngôn ngữ lập trình kịch bản dựa vào đối tượng phát triển có sẵnhoặc tự định nghĩa Javascript được sử dụng rộng rãi trong các ứng dụng Mobile.Javascript được hỗ trợ hầu như trên tất cả các trình duyệt như Firefox, Chrome, trênmáy tính lẫn điện thoại

Nhiệm vụ của Javascript là xử lý những đối tượng HTML trên trình duyệt Nó cóthể can thiệp với các hành động như thêm / xóa / sửa các thuộc tính CSS và các thẻHTML một cách dễ dàng Hay nói cách khác, Javascript là một ngôn ngữ lập trình trêntrình duyệt ở phía client Tuy nhiên, hiện nay với sự xuất hiện của NodeJS đã giúp choJavascript có thể làm việc ở backend

 Angular: Một thư viện dùng để xây dựng ứng dụng Single Page.

 NodeJS: Một thư viện được phát triển phía Server dùng để xây dựng ứng dụng

realtime

 Sencha Touch: Một Framework dùng để xây dựng ứng dụng Mobile.

 NextJS: Một Framework dùng xây dựng ứng dụng quản lý (Web Applications).

 jQuery: Một thư viện rất mạnh về hiểu ứng.

 React Native: Một thư viện viết ứng dụng Mobile.

 Và còn nhiều thư viện khác

1.2.2.3 Ưu và nhược điểm của JavaScript

Tuy là một ngôn ngữ lập trình rất nổi tiếng, nhưng bản thân Javascript không thểhoàn hảo được Sau đây hãy cùng freetuts điểm qua một số ưu điểm và nhược điểmcủa nó nhé

 Ưu điểm của Javascript là gì?

Javascript giúp thao tác với người dùng ở phía client và tách biệt giữa các client Ví

dụ 2 người đang truy cập vào 2 trình duyệt khác nhau thì cả hai đều có những phiên xử

lý Javascript khác nhau, không ảnh hưởng lẫn nhau

Javascript có thể hoạt động trên nhiều nền tảng khác nhau, từ Windows, macOScho đến các hệ điều hành trên mobile

Javascript là một ngôn ngữ dễ tiếp cận, bạn sẽ dễ dàng học nó mà không cần phảicài đặt quá nhiều phần mềm

 Nhược điểm của Javascript là gì?

Vì là một ngôn ngữ rất dễ dàng bị soi code nên dễ bị khai thác Hacker có thể nhậpmột đoạn code bất kì vào khung console của trình duyệt, lúc này trình duyệt sẽ hiểurằng đoạn code đó là chính thống, nên hacker có thể gửi nhửng request lên server mộtcách dễ dàng

Có thể bạn đã thấy những tool về Facebook trên mạng, hoặc những đoạn code làmthay đổi chức năng và giao diện của Facebook, thực tế thì chúng được viết từJavascript

1.2.3 Giới thiệu về NodeJS

1.2.3.1 Khái niệm về NodeJS

NodeJS là mã nguồn mở chạy trên môi trường V8 JavaScript runtime (một trìnhthông dịch JavaScript chạy cực nhanh trên trình duyệt Chrome) NodeJS giúp các nhàphát triển xây dựng các ứng dụng web một cách đơn giản và dễ dàng mở rộng

NodeJS có thể được dùng để xây dựng các loại ứng dụng khác nhau như các ứngdụng dòng lệnh, ứng dụng web, ứng dụng trò chuyện theo thời gian thực, máy chủREST API, Tuy nhiên, NodeJS thường được dùng chủ yếu để xây dựng các chươngtrình mạng như máy chủ web, tương tự như PHP, Java hoặc ASP.NET

Vì đây là mã nguồn mở nên cho phép bạn sử dụng miễn phí và đồng thời được liêntục được chỉnh sửa, cải tiến bởi cộng đồng các nhà phát triển toàn cầu

1.2.3.2 Điểm mạnh và hạn chế của NodeJS

 Điểm mạnh

 Đáp ứng được những yêu cầu về thời gian thực

 Có tốc độ cực rất nhanh, đáp ứng được nhu cầu sử dụng của khách truy cập

‘khổng lồ’ trong thời gian ngắn

 Sử dụng JavaScript, một ngôn ngữ lập trình rất dễ học

 Chia sẻ cùng một đoạn mã với cả phía máy chủ và máy khách

 Npm và các module rất mạnh mẽ và vẫn đang tiếp tục phát triển

 Có một cộng đồng lớn mạnh, có nhiều mã được chia sẻ qua githubTươngthích với nhiều thiết bị, nhiều hệ điều hành như MacOS, Window, Linux, …

 Nếu không hiểu rõ về JavaScript, bạn sẽ gặp khó khăn với NodeJS

 NodeJS không phù hợp với các tác vụ đòi hỏi nhiều CPU mà chỉ phù hợp vớinhững I/O như máy chủ web

 Nếu bạn có một web hosting dùng chung, sẽ rất khó khăn nếu bạn tải lên mộtứng dụng NodeJS VPS và Dedicated server là một sự lựa chọn tốt hơn nhiều

1.2.3.3 Hướng dẫn cài đặt NodeJS

Bước 1: Bạn truy cập vào địa chỉ này để cài đặt NodeJS

Bước 2: Tiến hành kiểm tra lại trạng thái cài đặt bằng cách: Vào cmd -> node –v Bước 3: Tạo một thư mục dùng để chứa các nội dung cho dự án Trong đó, tạo 1

file có tên DuAn.js và nhập nội dung cần viết là:

Console.log(‘Xin chào’);

Để chương trình có thể chạy, bạn vào trong thư mục vừa tạo rồi tiến hành thaotác Shift + chuột phải vào thư mục đó và chọn Open PowerShell window here Khicửa sổ command line đã hiện lên, bạn hãy gõ lệnh: node Duan.js

Lúc này, cửa sổ command line sẽ hiện lên để bạn khai báo biến và hằng trongNodeJS

dụng web một cách nhanh chóng Để hiểu ExpressJS, người dùng chỉ cần phải biếtJavaScript, do đó nên việc xây dựng các ứng dụng web và API trở nên đơn giản hơnđối với các lập trình viên và nhà phát triển đã thành thạo JavaScript trước đó.

Vì ExpressJS là một framework của Node.js nên hầu hết các mã đã được viết sẵncho các lập trình viên làm việc Bạn có thể tạo các ứng dụng web cho một trang, nhiềutrang hoặc kết hợp lại bằng cách sử dụng ExpressJS framework này khá nhẹ, giúp tổchức các ứng dụng web ở phía máy chủ thành một kiến trúc MVC hoàn hảo hơn.ExpressJS hỗ trợ nâng cao các chức năng của NodeJS Nếu bạn không sử dụngExpressJS, bạn phải thực hiện rất nhiều lập trình phức tạp để xây dựng một API hiệuquả ExpressJS đã giúp cho việc lập trình trong NodeJS trở nên dễ dàng hơn rất nhiều

 ExpressJS được sử dụng để làm gì?

ExpressJS sẽ giúp bạn tổ chức kiến trúc back-end của mình Các nhà phát triển webthường sử dụng ExpressJS để triển khai kiến trúc MVC, điều này cho phép họ viết mộtcodebase back-end bảo trì tương đối dễ dàng

Bởi vì ExpressJS hoạt động trên back-end, nên bạn có thể coi công nghệ này nhưmột “bộ não đằng sau một trang web” Ví dụ: ExpressJS có thể xác định cách nhữngtrang được định tuyến trên một trang web Hơn nữa, một nhà phát triển có thể sử dụngExpressJS để quản lý xác thực trên một trang web

Dưới đây là một số trường hợp sử dụng của ExpressJS:

 Sử dụng cookie trên một trang web

 Triển khai xác thực

 Thêm thanh tìm kiếm vào một trang web

 Cung cấp các tệp tĩnh như hình ảnh

1.2.4.2 Hướng dẫn cài đặt ExpressJS

Bước 1: Đầu tiên, bạn hãy tạo một thư mục E:\express\myapp dùng để

lưu trữ ứng dụng của bạn Sau đó tiến hành cd đến thư mục này:

entry point: (index.js)

Bước 3: Tiếp theo bạn nhập app.js hoặc bất cứ tên nào bạn muốn đặt tên thay

thế cho index.js Nếu bạn muốn sử dụng index.js, hãy nhấn RETURN để chấpnhận tên tệp mặc định này

Bước 4: Tiến hành cài đặt Express framework trong thư mục E:\express\myapp

bằng lệnh npm:

> npm install express saveLệnh trên sẽ lưu phần cài đặt trong thư mục node_modules và tạo thư mụcexpress ngay bên trong thư mục đó Dưới đây là những module quan trọng được càiđặt cùng với express:

body-parser: Đây là một lớp trung gian của Node.js có chức năng xử lý

JSON, dữ liệu thô, text và mã hóa URL

cookie-parser: Dùng để chuyển đổi header của Cookie và phân bố đến các

req.cookies

multer: Đây cũng một thành phần trung gian có trong Node.js dùng để xử lý

phần multipart/form-data

Bạn hãy nhập:

> npm install body-parser save

> npm install cookie-parser save

> npm install multer save

1.2.5 React Native

1.2.5.1 Khái niệm React Native

React Native là một framework mã nguồn mở được phát triển bởi

Facebook Framework này giúp phát triển app mobile trên cả 2 hệ sinh thái iOS và Android một cách dễ dàng Việc lập trình sẽ diễn ra nhanh chóng, cắt giảm chi phí và sửa chữa trực quan Sự ra đời của React Native là lời giải đáp cho bài toán về hiệu năng và tối ưu hóa ngôn ngữ cho mọi nền tảng di động

Hình 1-7 React Native

1.2.5.2 Ưu điểm của React Native

a) Thời gian học React Native ngắn: React Native cung cấp giải pháp lập trình đa

nền tảng Thay vì tìm hiểu 2 hệ sinh thái các biệt của iOS và Android, nay bạnchỉ tốn thời gian học React Native có thể phát triển tốt cho cả iOS và Android.b) Khả năng tái sử dụng code React Native cao: Code mở rộng của React Native

cho phép bạn tái sử dụng với những sửa chữa đơn giản Chỉ cần viết một lần vàcho lên thư viện, lưu trữ trên laptop bạn có thể tái sử dụng cho lần sau Điềunày đồng nghĩa với việc làm càng nhiều thời gian bạn sẽ có “thư viện” riêngcủa mình càng hoành tráng để hỗ trợ cho công việc lập trình

c) Có thể lập trình trên đa dạng hệ điều hành: React Native là bước chuyển mình

lớn của mobile app Việc lập trình trên đa dạng hệ điều hành mang đến sự tiệních cho cộng đồng dev trên toàn cầu

d) Cộng đồng React Native lớn: React Native được rất nhiều ông lớn trong ngành

công nghệ đang sử dụng Điều này giúp cho cộng đồng người học React Nativephát triển mạnh mẽ Những khó khăn cần giải quyết cho các tính năng, đoạncode với React Native sẽ được hỗ trợ với hàng nghìn dev của React Native

e) Hot Reloading: Với mỗi lập trình viên, thời gian Reload app sau mỗi chỉnh sửa

nhỏ luôn là vấn đề khó chịu và tốn nhiều thời gian Trong nhiều project vớilượng source code lớn thì thời gian build, đóng gói và cài đặt lại luôn gây mệt

mỏi đối với dev Đặc biệt là trong giai đoạn dự án gấp rút Với React Native thì

chúng ta không cần phải tốn nhiều thời gian cho việc đó Bạn không tốn nhiềuthời gian để build, đóng gói toàn bộ source code mà chỉ cập nhật đúng phần màchúng ta chỉnh sửa Thậm chí với tính năng Live Reload thì app sẽ tự động

refresh sau khi phát hiện thay đổi trong source code

f) Mã nguồn mở: React Native chia sẻ mã nguồn một cách tự do, không tính phí

và có nhiều tính năng hấp dẫn Các lập trình viên dễ dàng sử dụng các mãnguồn này để cải thiện nhiều tính năng, fix bugs dễ dàng Một vài source codecủa React Native chia sẻ miễn phí Dev sẽ tiết kiệm được nhiều thời gian chocác phần lập trình cơ bản

g) Tăng trải nghiệm của người dung: Giao diện đơn giản, đa dạng ứng dụng,

hoàn hảo trong thiết kế app… React Native tạo nên nhiều ứng dụng hữu ích cho

người dùng Hàng nghìn ứng dụng đang dùng React Native chính là minhchứng cho sự linh hoạt của ứng dụng từ React Native.

1.2.5.3 Nhược điểm của React Native

Muốn học React Native vẫn cần phải học về native code Nếu không giỏi về lậptrình React Native thì sẽ không thể đảm bảo tính bảo mật cao Việc quản lý bộ nhớ vớingôn ngữ React Native chưa được cải thiện Với một vài module sẽ có khả năng tùy biến thấp

Với một vài nhược điểm nhỏ và sự thắng thế của rất nhiều ưu điểm, bạn nên càiđặt React Native để học Hiện nay các lớp dạy React Native online và các tài liệu học React Native miễn phí trên internet rất phong phú React Native hiện đang phát triển mạnh hơn cả Flutter Việc cài đặt và học React Native của bạn sẽ không bao giờ bị hạnchế như các ngôn ngữ khác

MongoDB hoạt động trên collection, hướng tài liệu kiểu JSON thay cho bảng đểtăng tốc độ truy vấn MongoDB có chức năng định hướng tài liệu cung cấp, hiệu suấtcao, tính sẵn sàng cao và khả năng mở rộng dễ dàng

Collection trong MongoDB về bản chất thì có thể hiểu là nhóm các document, mộtcollection sẽ chứa các tập document

Ở MongoDB, các collection không theo bản chất cũ vì các document không tuântheo cấu trúc, nghĩa là các document trong một collection không có cấu trúc cố địnhnhư nhau (không cần chia ra các cột để lưu trữ), vậy thì không cần phải định nghĩathành phần các cột trong một collection như trong cơ sở dữ liệu quan hệ

 NoSQL là gì?

NoSQL là cơ sở dữ liệu được xây dựng dành riêng cho các ứng dụng hiện đại, dữliệu lưu trữ lớn và ứng dụng nền web thời gian thực NoSQL cần đơn giản trong thiết

kế, kiểm soát tính khả dụng tốt và yêu cầu database lưu trữ dữ liệu dung lượng cựclớn, tăng khả năng chịu lỗi tốt, thực hiện các truy vấn tốc độ cao không đòi hỏi nănglực phần cứng và tài nguyên hệ thống

NoSQL còn được xem là mảnh vá cho những hạn chế, khiếm khuyết của mô hình

Hệ quản trị cơ sở dữ liệu quan hệ (Relational Database Management System RDBMS) Đó là cải tiến về tốc độ, tính năng cũng như khả năng mở rộng

-NoSQL cho phép mở rộng dữ liệu mà không cần tạo khóa ngoại, khóa chính haykiểm tra tính ràng buộc… Có thể thấy, dạng cơ sở dữ liệu này có thể linh động, sẵnsàng bỏ qua tính toàn vẹn cứng nhắc của transaction hay dữ liệu nhằm đổi lấy hiệusuất, cùng với khả năng mở rộng tốt Chính vì ưu điểm này mà nhiều Tập đoàn lớn rất

ưa chuộng NoSQL như Facebook, Google, …

1.2.6.2 Nên và không nên sử dụng MongoDB trong trường hợp nào?

 Nên dùng MongoDB khi:

 Quản lý và truyền tải content – Quản lý đa dạng nhiều product của content

chỉ trong một kho lưu trữ data cho phép thay đổi và phản hồi nhanh chóng màkhông chịu thêm phức tạp thêm từ hệ thống content

 Cấu trúc Mobile và Social – MongoDB cung cấp một platform có sẵn, phản

xạ nhanh, và dễ mở rộng cho phép rất nhiều khả năng đột phá, phân tích time, và hỗ trợ toàn cầu

real- Quản lý data khách hàng – Tận dụng khả năng query nhanh chóng cho phân

tích real-time trên cơ sở dữ liệu người dùng cực lớn vớ các mô hình data phứctạp bằng các schema linh hoạt và tự động sharding cho mở rộng chiều ngang

 Không nên dùng MongoDB khi:

 Nếu website cần nhiều ứng dụng giao dịch (transaction), điển hình như cáctrang web của ngân hàng thì không nên dùng MongoDB Do chương trìnhnày không hỗ trợ cơ chế transaction

 Những ứng dụng cần đến SQL

1.2.6.3 Cách cài đặt MongoDB

Để cài đặt MongoDB trên Windows, bạn thực hiện các bước theo hướng dẫn sau:

Bước 1: Tải MongoDB từ trang chủ của phần mềm:

https://www.mongodb.org/downloads

Bước 2: Mở file vừa tải về và tiến hành chạy file cài đặt.

Bước 3: Sau khi chạy xong, vào thư mục chứa file tải về để khởi động MonggoDB Bước 4: Sử dụng IP 127.0.0.1:27017 để tạo kết nối đến mongoDB.

Một số câu lệnh cơ bản trên MongoDB

CHƯƠNG 2 PHÂN TÍCH THIẾT KẾ HỆ THỐNG

2.1 Phân tích hệ thống

2.1.1 Khảo sát hiện trạng

Mỗi ngày có rất nhiều du khách đặt chân đến Hà Nội để du lịch khám phá nhữngphong tục tập quán và các món ăn ở nới đây Trong số các du khách đó, không ít dukhách là người nước ngoài Do đó, để giúp du khách nước ngoài hiểu rõ hơn về thủ đôcủa Việt Nam, cũng như dễ dàng tìm kiếm các địa điểm ẩm thực nổi tiếng, ứng dụngHanoi Food Tour đã được tạo ra

Vừa phát triển du lịch, vừa quảng bá ẩm thực cũng như văn hóa Hà Nội, ứng dụngliên kết với các nhà hàng, cửa hàng và quán ăn, giúp cho khách du lịch khi đặt chân tớiđây sẽ có nhiều sự lựa chọn độc đáo, phong phú cho bữa ăn của mình mà không hềcảm thấy khó khăn