(Đồ án tốt nghiệp) ứng dụng ruby on rails xây dựng website cookgram

Nội dung thực hiện đề tài: - Ứng dụng Ruby on Rails xây dựng website chia sẻ công thức nấu ăn: Cải thiện, phát triển thêm chức năng và hoàn thiện sản phẩm đã có từ tiểu luận chuyên nghàn

BỘ GIÁO DỤC VÀ ĐÀO TẠO TRƯỜNG ĐẠI HỌC SƯ PHẠM KỸ THUẬT THÀNH PHỐ HỒ

CHÍ MINH

ĐỒ ÁN TỐT NGHIỆP NGÀNH CÔNG NGHỆ THÔNG TIN

ỨNG DỤNG RUBY ON RAILS XÂY

DỰNG WEBSITE COOKGRAM

GVHD: LÊ THỊ MINH CHÂU SVTH: TÔ NGỌC ÁNH MSSV:16126003

SVTH: MÃ NGỌC TÚ MSSV:16110254

SKL007072

TRƯỜNG ĐẠI HỌC SƯ PHẠM KỸ THUẬT THÀNH PHỐ HỒ CHÍ MINH

KHOA ĐÀO TẠO CHẤT LƯỢNG CAO

Nghành: CÔNG NGHỆ THÔNG TIN

GVHD: THS LÊ THỊ MINH CHÂU

Tp Hồ Chí Minh, tháng 07 năm 2020

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 2020

NHIỆM VỤ ĐỒ ÁN TỐT NGHIỆP

Họ và tên sinh viên 1: Tô Ngọc Ánh

Họ và tên sinh viên 2: Mã Ngọc Tú

Nghành: Công Nghệ Thông Tin

Giảng viên hướng dẫn: ThS Lê Thị Minh Châu

Ngày nhận đề tài: 25/02/2020

MSSV1: 16126003 MSSV2: 16110254 Lớp: 16110CLST4 ĐT: 090.2200.557

Ngày nộp đề tài: 01/07/2020

1 Tên đề tài: Ứng dụng ruby on rails xây dựng website cookgram.

2 Các số liệu, tài liệu ban đầu:

Đồ án phát triển dựa trên đề tài Tiểu luận chuyên ngành

3 Nội dung thực hiện đề tài:

- Ứng dụng Ruby on Rails xây dựng website chia sẻ công thức nấu ăn: Cải thiện, phát triển thêm chức năng và hoàn thiện sản phẩm đã có từ tiểu luận chuyên nghành

- Tìm hiểu và cài đặt thêm các chức năng như: Gợi ý món ăn, tìm

kiếm và chatbot để hỗ trợ người dùng

4 Sản phẩm:

Webistie Cookgram – website chia sẻ công thức nấu ă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ẢNG VIÊN HƯỚNG DẪN

Họ và tên sinh viên 1: Tô Ngọc Ánh

Họ và tên sinh viên 2: Mã Ngọc Tú

Nghành: Công Nghệ Thông Tin

MSSV1: 16126003 MSSV2: 16110254

Tên đề tài: Ứng dụng ruby on rails xây dựng website cookgram

Họ và tên giảng viên hướng dẫn: ThS Lê Thị Minh Châu

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àytháng

Giảng viên hướng dẫn

(Ký & ghi rõ họ tê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ẢNG VIÊN PHẢN BIỆN

Nghành: Công Nghệ Thông Tin

Tên đề tài: Ứng dụng ruby on rails xây dựng website cookgram.

Họ và tên giảng 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àytháng

Giảng viên phản biện

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

LỜI CẢM ƠN

Để hoàn thành tốt đề tài khóa luận tốt nghiệp này, ngoài sự nỗ lực từ chính bảnthân, nhóm em còn nhận được sự quan tâm giúp đỡ, chỉ bảo tận tình của nhiều cánhân, tập thể Người mà chúng em không quên gửi lời cảm ơn sâu sắc

Đầu tiên, nhóm em xin chân thành cảm ơn khoa Đào tạo Chất lượng cao –nghành Công nghệ thông tin, trường Đại học Sư Phạm Kỹ Thuật TP Hồ Chí Minh

và thầy Nguyễn Đăng Quang – trưởng nghành CNTT đã tạo điều kiện thuận lợi cho

chúng em thực hiện đề tài này

Chúng em cũng xin được gửi lời cảm ơn chân thành nhất đến cô Lê Thị Minh

Châu, người đã tận tình chỉ bảo và hướng dẫn nhóm em trong suốt quá trình thực

hiện đề tài này

Bên cạnh đó, chúng em xin gửi lời cảm ơn đến các thầy cô giảng viên của trườngĐại học Sư Phạm Kỹ Thuật TP Hồ Chí Minh nói chung cũng như các thầy cô giảngviên khoa Đào tạo Chất lượng cao, nhất là nghành Công nghệ thông tin nói riêng,những người đã giảng dạy, tích lũy cho chúng em những kiến thức quý báu trongnhững năm học vừa qua Đó là nền tảng giúp chúng em làm nên đề tài này và cũng

là tiền đề giúp chúng em tiến xa hơn nữa trong tương lai

Dù đã cố gắng hoàn thành đề tài khóa luận đúng yêu cầu, nhưng do thời gian hạnhẹp và khả năng còn hạn chế nên chắc chắn nhóm sẽ không tránh khỏi nhiều thiếusót Chúng em mong nhận được sự thông cảm và tận tình chỉ bảo của các thầy cô vàcác bạn

Nhóm chúng em một lần nữa xin chân thành cảm ơn

Trân trọng

i

TÓM TẮT ĐỒ ÁN TỐT NGHIỆP

Đề tài: ỨNG DỤNG RUBY ON RAILS XÂY DỰNG WEBSITE COOKGRAM

Ngày nay với sự phát triển của công nghệ thông tin, nhu cầu chia sẻ, cập nhậtthông tin là không thể thiếu đối với con người trong cuộc sống hằng ngày Từ đó,một thế giới mang tên Mạng xã hội ra đời, đó là nơi mà mọi người, đặc biệt là giớitrẻ rất yêu thích Và với xu hướng đó, nhóm chúng em đã tạo ra Cookgram – mộtmạng xã hội nho nhỏ chuyên về nấu ăn, dành cho những người có cùng sở thích bếpnúc có thể cập nhật mọi công thức mới, chia sẻ, giao lưu, kết bạn

MỤC LỤC

NHIỆM VỤ ĐỒ ÁN TỐT NGHIỆP

PHIẾU NHẬN XÉT CỦA GIẢNG VIÊN HƯỚNG DẪN

PHIẾU NHẬN XÉT CỦA GIẢNG VIÊN PHẢN BIỆN

LỜI CẢM ƠN TÓM TẮT ĐỒ ÁN TỐT NGHIỆP

MỤC LỤC

DANH MỤC CÁC TỪ VIẾT TẮT

DANH MỤC CÁC BẢNG BIỂU

DANH MỤC CÁC BIỂU ĐỒ VÀ HÌNH ẢNH

CHƯƠNG 1: TỔNG QUAN

1.1.Tính cấp thiết của đề tài

1.1.1 Vấn đề đặt ra

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

1.1.3 1.2.Mục tiêu đề tài

1.3.Đối tượng nghiên cứu

CHƯƠNG 2: YÊU CẦU HỆ THỐNG

2.1.Yêu cầu người dùng

2.2.Yêu cầu hệ thống

2.2.1 Yêu cầu chức năng

2.2.2 Yêu cầu phi chức năng

CHƯƠNG 3: THIẾT KẾ HỆ THỐNG

3.1.Tổng quan hệ thống

3.1.1 3.1.2 Mô hình MVC trong Ruby on rails

3.1.3 3.2.Database 3.2.1

iii

5.2.1 Cài đặt framework Ruby on Rails 79

5.2.2 Cài đặt Yarn 80

5.2.3 Cài đặt MySQL Server 80

5.2.4 Cấu hình và tích hợp chatbot 80

5.2.5 Cài đặt và chạy website Cookgram 81

CHƯƠNG 6: KẾT LUẬN 82

6.1 Tiến độ thực hiện 82

6.2 Kết quả đạt được 82

6.2.1 Kiến thức và thực nghiệm 82

6.2.2 Ưu điểm và nhược điểm 83

6.3 Thách thức 83

6.4 Kế hoạch phát triển trong tương lai 83

TÀI LIỆU THAM KHẢO

v

DANH MỤC CÁC TỪ VIẾT TẮT

Admin: Administration (Người quản trị)

MVC: Model-View-Controller

ERD: Entity Relationship Diagram

API: Application Programming Interface (Giao diện lập trình ứng dụng)

SQL: Structured Query Language

HTML: HyperText Markup Language

CRUD: Create – Read – Update – Delete

DANH MỤC CÁC BẢNG BIỂU

Bảng 1.1 Bảng câu hỏi khảo sát Cookpad.com 2

Bảng 1.2 Bảng câu hỏi khảo sát Cooky.vn 3

Bảng 1.3 Bảng câu hỏi khảo sát CandyCanCook.com 3

Bảng 2.1 Yêu cầu người dùng 5

Bảng 2.2 Actor 5

Bảng 2.3 Chức năng actor Guest 5

Bảng 2.4 Chức năng actor User 6

Bảng 2.5 Chức năng actor Admin 6

Bảng 2.6 Bảng danh sách các use case 10

Bảng 2.7 Mô tả usecase UC001a.Đăng nhập 10

Bảng 2.8 Mô tả usecase UC001b.Đăng xuất 10

Bảng 2.9 Mô tả usecase UC002.Đăng ký 11

Bảng 2.10 Mô tả usecase UC003.Quên mật khẩu 11

Bảng 2.11 Mô tả usecase UC004.Xem danh sách món ăn 12

Bảng 2.12 Mô tả usecase UC005.Xem chi tiết món ăn 12

Bảng 2.13 Mô tả usecase UC006.Bình luận 12

Bảng 2.14 Mô tả usecase UC007.Quản lý tài khoản 13

Bảng 2.15 Mô tả usecase UC008.Quản lý bookmark 13

Bảng 2.16 Mô tả usecase UC009.Quản lý follow 14

Bảng 2.17 Mô tả usecase UC0010.Đánh giá món ăn 14

Bảng 2.18 Mô tả usecase UC0011a.Quản lý món ăn (User) 14

Bảng 2.19 Mô tả usecase UC0011b.Quản lý món ăn (Admin) 15

Bảng 2.20 Mô tả usecase UC0012.Quản lý user 15

Bảng 2.21 Yêu cầu phi chức năng 16

Bảng 3.1 Bảng User 21

Bảng 3.2 Bảng Relatioships 22

Bảng 3.3 Bảng Recipes 22

Bảng 3.4 Bảng Rates 22

Bảng 3.5 Bảng Comments 23

Bảng 3.6 Bảng Ingredients 23

Bảng 3.7 Bảng Steps 23

Bảng 3.8 Bảng Viewed_recipe 23

Bảng 3.9 Bảng Bookmarks 24

Bảng 3.10 Bảng Likes 24

vii

Bảng 3.11 Bảng Notifications 24

Bảng 3.12 Danh sách màn hình của Guest 29

Bảng 3.13 Mô tả chi tiết màn hình GUEST001.Home 30

Bảng 3.14 Mô tả chi tiết màn hình GUEST002.Home-newfeed 31

Bảng 3.15 Mô tả chi tiết màn hình GUEST0003 Home- RecipeDetail 34

Bảng 3.16 Mô tả chi tiết màn hình GUEST004 Guest-ViewUsers 35

Bảng 3.17 Mô tả chi tiết màn hình GUEST006 Guest-Search 37

Bảng 3.18 Mô tả chi tiết màn hình GUEST007 SignUp 38

Bảng 3.19 Mô tả chi tiết màn hình GUEST008 Login 39

Bảng 3.20 Mô tả chi tiết màn hình GUEST008 Chatbot 40

Bảng 3.21 Danh sách màn hình User 41

Bảng 3.22 Mô tả chi tiết màn hình USER001 User-Home 41

Bảng 3.23 Mô tả chi tiết màn hình USER002 User-NewsFeed 43

Bảng 3.24 Mô tả chi tiết màn hình USER003 User-upRecipe 44

Bảng 3.25 Mô tả chi tiết màn hình USER004 User-Home-RecipeDetail 46

Bảng 3.26 Mô tả chi tiết màn hình USER005 Profile-About 47

Bảng 3.27 Mô tả chi tiết màn hình USER006 Profile-Followers 49

Bảng 3.28 Mô tả chi tiết màn hình USER007 Profile-Bookmarks 51

Bảng 3.29 Mô tả chi tiết màn hình USER008 Profile-Repcies 52

Bảng 3.30 Danh sách màn hình Admin 52

Bảng 3.31 Mô tả chi tiết màn hình ADM001.Dashboard 53

Bảng 3.32 Mô tả chi tiết màn hình ADM002.Like 54

Bảng 3.33 Mô tả chi tiết màn hình ADM004.Relationships 54

Bảng 3.34 Mô tả chi tiết màn hình ADM004.User 55

Bảng 3.35 Mô tả chi tiết màn hình ADM005 Recipe 56

Bảng 4.1 Nền tảng công nghệ sử dụng 57

Bảng 4.2 Framework, thư viện sử dụng 57

Bảng 4.3 Các phương pháp gợi ý 63

Bảng 5.1 Testcase đăng nhập 68

Bảng 5.2 Testcase Đăng công thức 71

Bảng 5.3 Testcase Chi tiết công thức 73

Bảng 5.4 Testcase Trang cá nhân 75

Bảng 6.1 Tiến độ công việc 82

DANH MỤC CÁC BIỂU ĐỒ VÀ HÌNH ẢNH

Hình 1.1 Website Cookpad.com 2

Hình 1.2 Website Cooky.vn 2

Hình 1.3 Website CandyCanCook 3

Hình 2.1 Usecase diagram tổng quát 7

Hình 2.2 Usecase của actor User 8

Hình 2.3 Usecase của actor Guest 9

Hình 2.4 Usecase của actor Admin 9

Hình 3.1 Mô hình MVC 17

Hình 3.2 Mô hình MVC trong rails 18

Hình 3.3 Class Diagram 19

Hình 3.4 ERD 20

Hình 3.5 Physical diagram 21

Hình 3.6 SQ001_UC002 Đăng ký 25

Hình 3.7 SQ002_UC001a Đăng nhập 25

Hình 3.8 SQ003_UC005 Xem chi tiết món ăn 26

Hình 3.9 SQ004_UC007 Quản lý tài khoản 26

Hình 3.10 SQ005_UC0011a Quản lý món ăn (user) 27

Hình 3.11 Màn hình GUEST001.Home 30

Hình 3.12 Màn hình GUEST002.Home-newfeed 31

Hình 3.13 Màn hình Popup Repice Preview 32

Hình 3.14 Màn hình GUEST0003 Home-RecipeDetail 33

Hình 3.15 Màn hình GUEST004 Guest-ViewUsers 35

Hình 3.16 Màn hình GUEST006 Guest-Search 36

Hình 3.17 Màn hình GUEST007 SignUp 37

Hình 3.18 Màn hình GUEST008 Login 38

Hình 3.19 Màn hình Login Facebook 39

Hình 3.20 Màn hình GUEST009.Chatbot 40

Hình 3.21 Guest’s screen flow 40

Hình 3.22 Màn hình USER001 User-Home 41

Hình 3.23 Màn hình USER002 User-NewsFeed 42

Hình 3.24 Màn hình USER003 User-upRecipe 43

Hình 3.25 Màn hình USER004.User-Home- RecipeDetail 45

Hình 3.26 Màn hình USER005 Profile-About 47

Hình 3.27 Màn hình Cập nhật thông tin cá nhân 48

ix

Hình 3.28 Màn hình USER006 Profile-Followers 49

Hình 3.29 Màn hình USER007 Profile-Bookmarks 50

Hình 3.30 Màn hình USER008 Profile-Repcies 51

Hình 3.31 User’s screen flow 52

Hình 3.32 Màn hình ADM001.Dashboard 53

Hình 3.33 Màn hình ADM002.Likes 53

Hình 3.34 Màn hình ADM004.Relationships 54

Hình 3.35 Màn hình ADM004.Users 55

Hình 3.36 Màn hình ADM005 Recipes 55

Hình 3.37 Màn hình View Recipe từ Admin 56

Hình 4.1 Minh họa logo ngôn ngữ Ruby 58

Hình 4.2 Minh họa logo Ruby on Rails 59

Hình 4.3 Sơ đồ hoạt động của dialogflow 62

Hình 4.4 Logo công cụ Elasticsearch 64

Hình 5.1 Kết quả tổng quan về kiểm thử 77

Hình 5.2 Kết quả testcase Đăng nhập 77

Hình 5.3 Kết quả testcase Đăng công thức 78

Hình 5.4 Kết quả testcase Chi tiết công thức 78

Hình 5.5 Kết quả testcase Trang cá nhân 79

ăn tiệm lại càng ngày càng có nhiều bất cập, an toàn vệ sinh thực phẩm luôn khôngđược bảo đảm, giá cả món ăn đắt hơn so với thực tế cộng với thái độ phục vụ củanhân viên vẫn còn chưa ổn định.

Tuy nhiên, rất nhiều người vẫn thích tự nấu ăn, có niềm đam mê với nấu nướng,luôn muốn được học thêm nhiều kinh nghiệm, công thức mới để thực hành khi có

cơ hội hoặc chia sẻ chiến tích nấu ăn của mình với nhiều người khác để có thể giaolưu, kết bạn với nhau

Thực ra với thời đại công nghệ số, công việc vào bếp đã đơn giản hơn rất nhiềukhi xung quanh là các loại máy móc hỗ trợ Vì vậy, vấn đề đặt ra là chúng ta phảitổng hợp lại các công thức, tạo một nơi giao lưu, chia sẻ, kết bạn cho những người

có cùng sở thích nấu nướng cũng như những người muốn vào bếp, học làm bếp,…thành một hội nhóm, mạng xã hội nho nhỏ đơn giản và dễ dàng truy cập

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

Với thời đại công nghệ tiên tiến, việc vào bếp và nấu nướng đã trở nên khá dễdàng Chỉ cần có Internet, chúng ta có thể truy cập vào bất kì trang Web nấu nướngnào hoặc tải về các ứng dụng dạy nấu ăn trên điện thoại, các bước tiếp theo đươngnhiên là chỉ cần làm theo hướng dẫn sẵn có Tuy nhiên, độ chính xác của các côngthức hiện diện đấy là bao nhiêu phần trăm? Chúng ta có thể tin cậy công thức đấy vàcác món ăn sẽ luôn được làm ra thành công chứ?

Thật ra nấu ăn là một công việc gần như là thường xuyên, được thực hiện hằngngày Nhưng có vẻ các website về chủ đề nấu ăn trên thị trường Việt Nam lại khá ít:

1

1.1.2.1 Cookpad.com (https://cookpad.com/)

Hình 1.1 Website Cookpad.com

Bảng 1.1 Bảng câu hỏi khảo sát Cookpad.com.

Câu hỏi khảo sát

ăn được tổ chức thường xuyên

- Đánh giá nhược điểm: Độ tương tác giữa người dùng với nhau còn thấp.1.1.2.2 Cooky.vn (https://www.cooky.vn/)

Hình 1.2 Website Cooky.vn

Bảng 1.2 Bảng câu hỏi khảo sát Cooky.vn

Câu hỏi khảo sát

ăn Có nhiều event nấu ăn được tổ chức thường xuyên

- Đánh giá nhược điểm: Không có

1.1.2.3 Candycancook.com (https://candycancook.com/)

Hình 1.3 Website CandyCanCook Bảng 1.3 Bảng câu hỏi khảo sát CandyCanCook.com

Câu hỏi khảo sát

nh toán khẩu phần ăn theo số người

Có Nhập vào số người để nhận số

lượng nguyên liệu cần dùng

- Đánh giá ưu điểm: giao diện sinh động Giao diện rất dễ nhìn, rõ ràng và sinh động Nhiều món ăn đa dạng đến từ các nước khác nhau trên trang web này

- Đánh giá nhược điểm: độ tương tác không cao giữa các người đọc

Nhìn chung, các trang web không có sự khác biệt nhiều về chức năng Mỗi websiteđều hướng đến đối tượng người dùng khác nhau nhưng đều chú trọng vào độ đơn giản nhưng sinh động trên giao diện Những trang web này chú trọng tối ưu tốc độ duyệt web rất tốt cho trải nghiệm người dùng

1.1.3 Hướng giải quyết

Để đáp ứng nhu cầu về việc gợi ý một bữa ăn hợp lý cũng như thỏa mãn nhu cầugiao lưu kết bạn của giới trẻ mà “Cookgram” ra đời

Với trang “Cookgram” không những là nơi giao lưu, kết bạn mà còn là nơi giúpcác bạn trẻ có thể chia sẻ với nhau niềm yêu thích nấu ăn, các bí kíp nấu ăn nhanh,tiết kiệm thời gian mà lại đầy đủ dinh dưỡng, ngon như mẹ nấu,… Để việc nấunướng không còn là nổi ám ảnh Ngoài ra “Cookgram” còn dành cho các mẹ nội trợ,

mẹ bỉm sữa, những người luôn mong muốn có một bữa cơm đầy đủ cho cho giađình mình mà không phải mất quá nhiều thời gian việc suy nghĩ: Hôm nay ăn gì?

1.3 Đối tượng nghiên cứu

- Ngôn ngữ ruby và framework ruby on rails

2 CHƯƠNG 2: YÊU CẦU HỆ THỐNG

2.1. Yêu cầu người dùng

Bảng 2.1 Yêu cầu người dùng

Người dùng chọn một món ăn để hiển thịthông tin về món ăn đó.

2.2.1.3 Usecase Diagram

Hình 2.1 Usecase diagram tổng quát

7

2.2.1.3.1 Usecase User

Hình 2.2 Usecase của actor User

Bảng 2.8 Mô tả usecase UC001b.Đăng xuất

Usecase Đăng xuất

Usecase ID

Mô tả

2.2.1.5.5 UC004.Xem danh sách món ăn

Bảng 2.11 Mô tả usecase UC004.Xem danh sách món ăn Use case Xem danh sách món ăn

2.2.1.5.6 UC005.Xem chi tiết món ăn

Bảng 2.12 Mô tả usecase UC005.Xem chi tiết món ăn Usecase xem chi tiết món ăn

Bảng 2.13 Mô tả usecase UC006.Bình luận

Usecase Bình luận món ăn

đăng tải.

2.2.1.5.8 UC007.Quản lý tài khoản

Bảng 2.14 Mô tả usecase UC007.Quản lý tài khoản

Usecase Quản lí tài khoản

Bảng 2.15 Mô tả usecase UC008.Quản lý bookmark

Usecase Quản lí bookmark

2.2.1.5.10 UC009.Quản lý follow

Bảng 2.16 Mô tả usecase UC009.Quản lý follow

Usecase Quản lí bookmark

2.2.1.5.11 UC0010.Đánh giá món ăn

Bảng 2.17 Mô tả usecase UC0010.Đánh giá món ăn

Usecase Đánh giá món ăn

2.2.1.5.12 UC0011a.Quản lý món ăn của user

Bảng 2.18 Mô tả usecase UC0011a.Quản lý món ăn (User)

Usecase Quản lí món ăn (User)

Bước 2: Danh sách món ăn được tạo ra bởi user

sẽ được show lên màn hình

Bước 3: User click chọn món ăn cần quản lí

Bước 4.a: User chọn chỉnh sửa món ănBước 4a.1: User tiến hành chỉnh sửa món ănBước 4a.2: User click chọn Lưu món ănBước 4a.3: Nếu món ăn được lưu thành công, user sẽtrở về giao diện xem chi tiết món ăn

Bước 4b: User chọn delete món ănBước 4b.1: Pop-up hiện lên yêu cầu xác nhận

Bước 4b.2: Nếu user xác nhận, hệ thông sẽ xóa món ăn và trở về giao diện danh sách món ăn Bước4c: User chọn tạo món ăn mới

Bước 4c.1: User tiến hành tạo món ănBước 4c.2: User click chọn lưu món ănBước 4c.3: Nếu món ăn được lưu thành công, user sẽtrở về giao diện xem chi tiết món ăn

2.2.1.5.13 UC0011b.Quản lý món ăn của admin

Bảng 2.19 Mô tả usecase UC0011b.Quản lý món ăn (Admin)

Usecase Quản lí món ăn (Admin)

Bảng 2.20 Mô tả usecase UC0012.Quản lý user

Usecase Quản lí user

Usecase ID

Mô tả

Tác nhân kích hoạt

15

Tiền điều kiện

Các bước thực hiện

2.2.2 Yêu cầu phi chức năng

Bảng 2.21 Yêu cầu phi chức năng

3 CHƯƠNG 3: THIẾT KẾ HỆ THỐNG

3.1 Tổng quan hệ thống

3.1.1 Mô hình MVC

Mô hình MVC là một kiến trúc phần mềm hay mô hình thiết kế được sử dụng trong

kỹ thuật phần mềm Khi một phần mềm sử dụng mô hình này thì nó sẽ phải chia ra

thành ba phần chính Model-View-Controller (MVC) với ba nhiệm vụ khác nhau:

Hình 3.1 Mô hình MVC

- Model: Là thành phần chính và nó chỉ chứa nghiệp vụ logic, các phươngthức xử lý dữ liệu, truy xuất dữ liệu từ database và gửi đến Views Model độclập với giao diện người dùng

- View: Là nới chứa những giao diện như một nút bấm, khung nhập, menu, hình

ảnh… Nó đảm nhiệm nhiệm vụ hiển thị dữ liệu và giúp người dùng tương tác với hệ thống

- Controller: Là nới tiếp nhận những yêu cầu xử lý được gửi từ người dùng,

nó sẽ gồm những class/ function xử lý nhiều nghiệp vụ logic giúp lấy đúng dữliệu thông tin cần thiết nhờ các nghiệp vụ lớp Model cung cấp và hiển thị dữliệu đó ra cho người dùng nhờ lớp View

3.1.2 Mô hình MVC trong Ruby on rails

Model - Controller - View là nguyên tắc phân chia công việc của một ứng dụng thành ba hệ thống con riêng biệt nhưng hợp tác chặt chẽ

Các thư mục models, view, controllers được đặt trong thư mục app với:

- app/controllers: Nó là bộ não controller trong MVC chứa tất cả các filecontrller Việc đặt tên của file này bắt buộc phải theo quy tắt là số nhiều của tênmodel + “_controller”

đối tượng quan hệ sẽ mapping với database table chứa dữ liệu Quy tắt đặt modelsẽ

17

là viết các object table trong DB ở dạng số ít “app/models/concerns” Giống như controller, method ở đây sẽ được dùng ở nhiều model files.

thị hoặc mails cũng như response api sẽ được viết trong phần này Thường nhữngfile ở đây nếu là web sẽ là kết hợp giữu HTML và Ruby với extension sẽ là

html.erb và được tổ chức dựa trên controller

Ngoài ra, các file layout sẽ được đặt tại đây app/views/layouts Nó như là một layout tổng và được kế thừa ở các views khác

Hình 3.2 Mô hình MVC trong rails.

18

3.1.3 Class Diagram

3.2. Database

3.2.1 ERD

Hình 3.4 ERD.

20