đồ án môn học lập trình web xây dựng ứng dụng web bán trái cây hdfruit

Ngoài việc cung cấp thông tin về trái cây, trang web cũng cho phép người dùng thêm các sản phâm vào giỏ hàng và tiến hành thanh toán trực tuyến một cách an toàn.. Xác định yêu câu, thu t

Trang 1

| | TRƯỜNG ĐẠI HỌC NGUYÊN TẮT THÀNH ° KHOA CÔNG NGHỆ THÔNG TIN

ĐỎ ÁN MÔN HỌC

Lập trình web

Tên đề tài: XÂY DỰNG ỨNG DỤNG WEB

BAN TRAI CAY HDFRUIT

Môn học : Lập trình web Lớp :2IDTMDTIA

Giảng viên : BÙI DUY TÂN SV thuchién : NGUYÊN THỊ CHÚC ĐÀO [MSSV]:2100008303

Học kỳ II Năm 2023 - 2024

Trang 2

BO GIAO DUC VA DAO TAO

TRUONG DAI HOC NGUYEN TAT THANH Ỷ @ KHOA CÔNG NGHỆ THÔNG TIN

DO AN MON HOC

Lap trinh web

Giảng viên : BÙI DUY TÂN

SV thuchién :PHAMTHIMYHUYEN [MSSVỊ: 2100002976

Học kỳ II Năm 2023 — 2024

Trang 3

BO GIAO DUC VA DAO TAO

TRUONG DAI HOC NGUYEN TAT THANH Ỷ @ KHOA CÔNG NGHỆ THÔNG TIN

DO AN MON HOC

Lap trinh web

Giảng viên : BÙI DUY TÂN SV thực hiện I : NGUYÊN THỊ CHÚC ĐÀO [MSSV]:2100008303

SV thực hiện2 : PHẠM THỊ MỸ HUYỄN [MSSV]: 2100002976

Học kỳ II Năm 2023 — 2024

Trang 4

LOI MO DAU

Trong thời đại công nghệ số ngày nay, việc phát triển các ứng dụng web không chỉ là một xu hướng mà còn là một yêu câu cần thiết cho nhiều doanh nghiệp Trong đỗ án lập trình web này, chúng em xin tran trong giới thiệu m6t trang web ban trai cay, nơi mà người dùng có thé dé dang tim kiếm, mua sắm và tham khảo thông tin về các

loại trái cây tươi ngon

Mục tiêu của đồ án này là xây dựng một trang web thân thiện với người dùng, đáp ứng nhu cầu mua sắm trái cây trực tuyến một cách tiện lợi, an toàn và đa dạng mẫu mã Chúng em đã tập trung vào việc tạo ra một giao diện trực quan, dễ sử dụng và tương thích trên nhiều nền tảng, giúp người dùng trải nghiệm mua sắm trực tuyến một cách thuận tiện nhất

Trang web bán trái cây của chúng em cung cấp một danh mục đa đạng về các loại trái cây tử khắp noi trên thê ĐIỚI Người dùng có thế tham khảo thông tin về các loại trái cây, bao gồm nguồn gốc, đặc điểm, giá cả và lợi ích sức khỏe mà chúng mang lại Đồng thời, chúng em cũng cung cap các công cụ tìm kiếm và bộ lọc đề người dùng có thê đễ dàng tìm kiếm và tìm hiểu về các loại trái cây mà họ quan tâm

Ngoài việc cung cấp thông tin về trái cây, trang web cũng cho phép người dùng thêm các sản phâm vào giỏ hàng và tiến hành thanh toán trực tuyến một cách an toàn Chúng em đã tích hợp các phương thức thanh toán phố biến để đảm bảo sự thuận tiện và tin cậy cho người dùng

Trang web cũng hướng đến việc tạo ra một trải nghiệm mua săm trực tuyến đáng tin cậy và tương tác Chúng em, đã xây dựng một hệ thống đánh giá và nhận xét từ khách hàng, giúp người dùng có thê chia sẻ cảm nhận và đánh giá về sản phẩm một cách công khai Điều này giúp tạo niềm tin và động lực cho người dùng khác khi quyết định mua sắm trên trang web của chúng tôi

Cuối cùng, chúng em muốn sửi lời cảm ơn chân thành đến thầy và các bạn cùng lớp đã cung cập sự hướng dẫn và hỗ trợ trong quá trình thực hiện đỗ án này Chúng em hi vọng rằng trang web bán trái cây của chúng em sẽ mang lại trải nghiệm mua sắm trực tuyến tuyệt vời cho người dùng và góp phần thúc đây sự phát triển của thương mại điện tử

Trang 5

LOI CAM ON

Lời nói đầu tiên, chúng em xin gửi lời cảm ơn chân thành đến nhà trường đã đưa môn Lập trình Web vào chương trình giảng dạy Đặc biệt, em xin gửi lời cảm ơn đến Thầy Bùi Duy Tân đã hướng dẫn và truyền đạt những kiến thức mới, những điều bổ ích trong môn học và kỹ năng lập trình đề kế một trang web Trong thời gian học lớp học phan này, Thầy đã giúp giải đáp nhiều thắc mắc để có thêm cho chúng em có nhiều kiến thức bô ích về lập trình web Tuy nhiên vì kiến thức của chúng em có nhiều hạn chế nên không tránh khỏi những thiếu sót và nhiều chỗ còn chưa chính xác Kính mong Thay xem xét và góp ý cho bài báo cáo của nhóm em được hoàn thiện hơn

Trang 6

Ngay thi: 14/05/2024 Phong thi: L5.11

Đề tai tiêu luận/báo cáo của sinh viên :

Xây dựng ứng dụng Website bán trai cay HD FRUIT Phân đánh giá của giảng viên (căn cứ trên thang rubrics của môn học):

Tiêu chí (theo aes eas Diém dat

Đánh giá của GV Điểm tối đa

Trang 7

MUC LUC

W0 2i 0117 <ú 1 lì) INN ' SH(.(idÝỶẢ.Ảd 2

1.1 Mô tả tóm tắt về websife ss 2c SH EH n2 211gr re 2 1⁄2 Cơ sở lý thuyết TH nHn nh HH HH ung ru re 3 58‹ 9 3 1.2.2 Kiến thức liên quan - 5s s2 1 12211 1121222121 1212121212112 re tr ta 5 1.2.3 Kiến thức về đữ liệu 5s c2 121122112211 121221212112 rrre 9

Chương 2 Phân tích và hoạch định G2 12c 2211212 1211111 1011011111181 1101111212811 e2 10 2.1 _ Các module chức năng: c1 2211211111311 1111 111011111111 1111111 11111 011118 1g re, 10

2.2 Site map: Trình bày sơ đồ liên kết - 5 St E212 221211 re 12

2.3 Database diagram: M6 ta luoc dé h9 8i šSHIIẳẳaẳỶẮẮ 14

2.4 GUI: Mô tả giao diện các các nhóm trang web của websIfe ác series 14 Chương3 Triển khai ứng dụng web s- S2 nh HH H212 are 17

3.1 Thiết kế giao điện: 5 TT HH H21 121 1212121 g ga guyu 17 KP 25 3.3 Thiết kế xử lý: ch n TH HH HH n1 1tr ng tua 26

3.4, Bảo mật websIfe QC TH nn HT nn ng KT kg n c0 xen 76 3.5 Kiểm tra và xuất bản websife - n n2 11 11211111112111211112111111111111 185 x1 rrke 78

Chương4 Kết luận -55- ST HH HH HH t2 n g1 rru 79

4.1 Kết quả đạt được ccnnn nnnn nnH n1 121 n2 trung He 79 4.2 Những hạn chế và hướng mở rộng - 5c E211 111211211211 2.210 1 ra 79 TÀI LIỆU THAM KHẢO 555252 E221 2 21122 2g ru 81

Trang 8

Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh

DANH MUC HINH ANH

1: Giao diện thê hiện trang public (Home) - 5s c2 1 1121111212181 1e 17

2: Giao diện thê hiện trang sản phẩm 5 SE E2 E1 212212121 reerre 18 3: Giao diện thê hiện các trang chỉ tiết sản phâm 56c ST rye 19

4: Giao diện thê 5081110 82008: An e.a II 20

5: Giao diện thê hiện trang BÌog - 2c 12011211211 11111111111111111111 011111211 1111181 1g xkp 21

6: Giao diện thê hiện trang én he 22

7: Giao diện thê hiện trang Login .cccceccecccscssssessessessesssessesssesessessessressesssarsavsneaesetsen 23 3N /)0801(:)ì 0.2) 00:0108s19)9-)49))1/HIIaẳđầđdđaaddầẳŸỶỒẮỶ 24

36: Màn hình cải đặt Index_ShoppIngCAaFt - óc 0 1 1121111312153 111111511 re 44 37: Màn hình cải đặt Ordernow_ ShoppIngCATE c2 122 9293111111211 11 111 xe 44 38: Man hinh cải đặt IsExistngCheck và Removeltem _ ShoppIngCart 45

39: Màn hình cải đặt Upadtecart - ClearCart - Checkout _ ShoppingCart 46 40: Màn hình cải đặt ProcessOrder_ShoppingCart

41: Màn hình cải đặt View Index ShoppIngAFt c2 112 Hee 42: Kết quả View_Index_ShoppingCart khi chưa thêm sản phâm 5-55 49

43: Kết quả View_Index_ShoppingCart khi đã thêm sản phẩm 5s cc: 49

44: Màn hình cải đặt Checkout_ View _ ShoppIngart ác che 50

Trang 9

Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh Hinh

45: Kết quả View_Checkout_ShoppingCart 5c tt E21 211tr rưe 51 46: Màn hình cải đặt OrderSuccess_V1Iew_ ShoppIngCart ác s se vessrrey 51 47: Kết quả OrderSuccess_View_ ShoppingfCart 5c sn nEHngH Hee reo 52 48: Man hinh cải đặt Šignup - Login - Logout _ Account sóc ccssssssssey 52 49: Màn hình cải đặt ŠSignup_ View _ACCOUHI, 2 2212112191 1011111111 111110112111 re 54 50: Két qua Signup View Accoumt cccccccccesccssessessesscsssessesssessessuesessesessesevsresseeesees 55 51: Man hinh cai dat Login_ View _ ACCOUHI, 0 02201121101 11111111515111 21112112 xrkg 55 52: Két qua Login View Accoumt c ccccccccccccsssssessessessssssessesssesessesseseressesevsnsasesessetees 56 53: Màn hình cài đặt Partial VIew Ca†€ĐOTV LH HH HH 111111211 11 rrreg 56

54: Màn hình cài đặt Index Action Producfs L2 12 12 1119111111111 1 2 xe, 57 55: Màn hình cài đặt View Index Products - c1 n2 cv ng nen khay 58

56: Kết quả View Index Produets s s2 SE 2 1711212212211 1E xe 59

57: Màn hình cài đặt Create_ VI€W LH HH 111111112111 111111111111 111188 1 xer 60

58: Kết quả Create_ View cc cn n Hn HH HH H1 12121 nrruyn 60 b0 80v 8/1 .ố 61

60: Kết quả Edit_ View các ch nnn HH HH ng H121 gay 61

61: Man hinh cai dat Details V1iew Q HT HT TH TH TK nen nn hen ng 1421 xx5 62

28.1 00 HAI NYigÝÝỶÝỶÝỶÝ 62

63: Man hinh cai dat Delete V1ewW ecccccccccensscccsccenssececesnetsseccecccccesevevecevevevers 63

64: Két qua Delete View ccccccccccccsssessessessesssessesssessessesessresresessesessessserearessesasesseseeeees 63 65: Màn hình cai dat Index Action Product_Category ccccecescseesteesteecnssenetereeeene 64

66: Man hinh cai dat Index View icc ceceececcccssssscescesstscscceseeesscccesstetseessentasacacs 65

67: Kết quả Index View ccccccccccssccsssessesssessessrssessessesersssesessssessssseseessresiesanesesiesereessees 66

68: Màn hình cài đặt Create VI€W HT n HH TT HT KT ng khen 28555 67

S4 mo 06 A/ 1n <e 67 WU0 o8 20 e 68

l8 cC co 00/7 a 68

72: Man hinh cai dat Details V1iew QQ HT TT TH ng TK khen nhe nu n1 xx5 69

73: Kết quả Details VieW ccc nn tn Hnnnn HH nu H20 n1 ngờ 69

74: Màn hình cài đặt Delete V1ewW cLQnQQ TT TT HT KT ng khen 255% 70

c0 e 70 76: Màn hình cải đặt Index Action_Cat€ØOTI€S L2 12T vn TH ni 111 ru 71

77: Màn hình cài đặt Index VIewW ceeeeccccccsssersccecesstscecceseeessecessstesseeesentasecaes 72

€1 ao an ‹«/ 72

79: Màn hình cài đặt Create VI€W cceccccccccccssssscesccssscsecesnsnsecceeccecesevevecevev sees 73

§0: Kết quả Create ViewW ác HH HH HH HH 1n 2121 run ưyn 73 81: Màn hình cài đặt Edit VIeW ác t0 111111 1111 Hà HH Hai 74 §2: Kết quả Create View ác TH HH HH HH HH 2121 rerưyn 74

LSM bi 0iïìï)( 0v: 0i 10 09 /1011-10/(i./điiiỔỶỔÝẢ 75

§4: Kết quả Details ViewW ác HH HH ng n1 2121 cr ng 75

85: Màn hình cài đặt Delete View Lnnn HH nn HH ng TK ng 2 x1 2 1xx kg 76

L8 4.8 89.) Av /£rŒiiia'ÝÝỶẢ 76 87: Kết quả đăng nhập thành công 1 5c E221 212218 1e 77 88: Kết quả đăng nhập không thành công và báo lỗi - 2-5 c E EEExierrren 77

Trang 10

DANH MUC BANG

I5 10 5880026.-1-.,900iaỲẼsẼEẼIIiaiaiầttiẢÕẦÕ 25 si 5/28si3 0n an 25 s00 na - 25 si 9.00 008 n 25 ; h0 - 26

Trang 11

DO AN MON HOC LAP TRINH WEB

Thong tin chung

Tên đồ án: XÂY DỰNG ỨNG DỤNG WEB BÁN TRÁI CÂY HDFRUIT

Nhóm: 4

- _ Sinh viên NGUYÊN THỊ CHÚC ĐÀO _ MSSV: 2100008303

- _ Sinh viên 2: PHẠM THỊ MỸ HUYỄN MSSV: 2100002976 Phân công thực hiện (Mô tả cụ thê công việc của từng thành viên)

- Đinh viên 1:

+ Phy trach ly thuyết chương 2, chương 3, và trình bay

+ Phụ trách code web - Đinh viên 2:

+ Phy trach ly thuyết chương 1, chương 4

+ Tim hinh anh và nội dung web, làm cơ sở dữ liệu

Nguyễn Thị Chúc Đào — Phạm Thị 4ð Huyền

Trang 12

DO AN MON HOC LAP TRINH WEB Chương 1 Tổng quan

1.1 Mô tả tóm tắt về website Website thuộc chủ đề nào?

Website ban trải cây HD FRUTT là một trang web thuộc chủ đề thương mại điện tử Một website bán trái cây được tạo ra dé cung cap mét nén tảng trực tuyến cho

người mua và người bán trái cây giao dịch, trao đôi thông tin và mua bán sản phâm trái cây Website này giúp kết nối giữa người mua và người bán trái cây,

mang lại lợi ích cho cả hai bên Tại sao có website?

Mục đích chính của website này là tạo ra một kênh bán hàng tiện lợi và đáng tin

cậy cho người tiêu dùng Giúp người tiêu dùng tìm kiếm nhanh chóng, chọn lựa và mua các loại trái cây khác nhau từ nhiêu nguôn cung câp khác nhau mà không cần phải tôn thời g1an ra tận cửa hàng mới có thê mua trái cây

Nội dung website: Nội dung của trang web bao gồm danh sách các loại trái cây , thông tin chỉ tiết về từng loại trái cây, hình ảnh, giá cả, thông tin về nguồn gốc và chất lượng của trái cây Ngoài ra, trang web cũng có thê cung cấp thông tin về các khuyến mãi, giảm giá hoặc giao hàng miễn phí

Xác định yêu câu, thu thập thông tin và các đữ liệu liên quan e Yêu câu chức năng:

=_ Đối với người dùng (User) Đối với người dùng, chức năng chính của trang web bán trái cây là cho phép

họ tìm kiếm, xem thông tin và mua các loại trái cây một cách để đàng và thuận

tiện từ nhà Người dùng có thê tìm kiếm theo loại trái cây, giá cả, đánh giá từ người dùng khác và thêm vào giỏ hàng đề đặt hàng trước khi thanh toán

Người dùng có thê đăng nhập vào trang web và đề lại các thông tin của mình đề đăng ký một tải khoản đề có thê nhận được những tư vấn từ trang web Nếu thấy không còn cần thiết thì người dùng có thê đăng xuất thông tin khỏi trang

web Ngoài ra, trang web cũng có thể cung cấp dịch vụ giao hàng tận nơi, giúp

người dùng nhận được trái cây mà họ đã mua một cách tiện lợi

=_ Đối với người quản trị (Admin)

Đối với người quản trị, chức nang cua trang web ban trái cây là quản lý và cập

nhật thông tin về sản phâm, kiểm tra và xử lý đơn hàng từ người dùng, quản lý

danh sách khách hàng và theo đối doanh thu Họ cũng có thể tăng cường

quảng bá và tiếp thị sản phẩm thông qua trang web đề thu hút người dùng mới và tăng doanh số bán hàng

e _ Yêu cầu phi chức năng: giao diện Trang web bán trái cây HD FRUIT thì có thể xem trên nhiều thiết bị: máy tính laptop, điện thoại thông minh, máy tính bảng, Smart TV mà có tích hợp trình duyệt web vả có kết ni internet

Trang 13

° Nguồn thơng tin và dữ liệu:

Website HD FRUIT cĩ tham khảo nguồn thơng tin từ 2 trang web đĩ là https://citifruit.com/ va https://tfruit.com.vn/

1.2 Cơ sở lý thuyết

1.2.1 Kiến trúc MVC

Khái niệm: Mơ hình Model-View-Controller (MVC) là một mẫu kiến trúc phân tách một ứng dụng thành ba thành phân lòic chính Model, View và Controller Mơi

thành phần kiến trúc được xây dựng đề xử lý khía cạnh phát triển cụ thê của

một ứng dụng MVC tách lớp logic nghiệp vụ và lớp hiến thị ra riêng biệt

Ngày nay, kiến trúc MVC đã trở nên phổ biến đề thiết kế các ứng dụng web

cũng như ứng dụng di động Thành phan của MVC:

- Model: Đây là bộ phận cĩ nhiệm vụ lưu trữ tồn bộ dữ liệu của ứng dụng Model cũng là bộ phận kết nối giữa hai bộ phận cịn lai la View va Controller Nĩ được thê hiện dưới hình thức là một CSDL hay chi la mot file XML binh

thường Các thao tác với CSDL như cho phép xem, xử lý hay truy xuất dữ liệu

sẽ được Model được thể hiện rõ

- _ View: Thành phần này được dùng cho tất cả các logic UI của ứng dụng View

cĩ nhiệm vụ hiền thị thơng tin, tương tác với người dùng Nĩ là nơi chứa tất cả

những đối tượng GUI như textbox, images, View cũng chính là tập hợp các form hoặc file HTML Các ứng dụng web sử dụng nĩ như một thành phần của

hệ thống hoặc các thành phan HTML được tạo ra View cịn ghi nhận hoạt

động của người dùng dé tương tác với Controller - Controller: Đây chính là bộ phận cĩ chức năng xử lý những từ yêu cầu người

dùng đưa đến qua View Controller sẽ từ đĩ đưa ra đữ liệu phù hợp với người

dùng Ngồi ra, Controller cịn cĩ thêm chức năng là kết nối với bộ phận

Model Đặc điểm của MVC

- _ Cung cấp sự phân tách rõ ràng giữa logic nghiệp vu, logic Ul va logic đầu vảo -_ Cung cấp tồn quyền kiêm sốt HTML và URL, giúp bạn dễ dàng thiết kế kiến

trúc ứng dụng web

- Cĩ thể sử dụng đề xây dựng các ứng dụng cĩ URL dễ hiểu và cĩ thê tìm kiếm

được

- H6tro Lap trinh dựa trên thử nghiệm (Test-driven Development)

MVC là một mẫu thiết kề tiêu chuân được nhiều lập trình viên quen thuộc nhờ

vào khả năng mở rộng và cĩ thê mở rộng MVC thường được sử dụng đề làm framework phat triên web tiêu chuân cũng như các ứng dụng di động Chức năng của MVC

Trang 14

MVC giúp bạn tạo các ứng dụng tách biệt cho các khía cạnh khác nhau của

ứng dụng (logic dau vào, logic nghiệp vụ và logic giao diện người dùng), đồng thời cung cấp sự kết nối giữa các thành phần nay

Mô hình MVC chỉ định vị trí của từng loại logIc trong ứng dụng: ® Logic nghiệp vụ chính là Model

e Logic giao diện người dùng thuộc về View © Logic đầu vào thuộc về Controller

Sự tách biệt này giúp bạn quản lý sự phức tạp khi xây dựng một ứng dụng vì

nó cho phép bạn tập trung vào một khía cạnh của việc triên khai tại một thời

điểm Cơ chế hoạt động của MVC

Cơ chế hoạt động của MVC dựa trên nguyên tắc chia thành ba thành phần

chính:

- Model (Mô hình): Đây là thành phần chịu trách nhiệm cho dữ liệu và logic xử lý dữ liệu Model thường đại diện cho các đối tượng trong ứng dụng và cung cấp các phương thức để truy xuất hoặc thay đối dữ liệu Nó không phụ thuộc vào các thành phần khác trong mô hình MVC - View (Giao diện): View đại diện cho phần giao diện người dùng của

ứng dụng Nó được sử dụng đê hiến thị dữ liệu từ Model và tương tác

với người dùng View không chịu trách nhiệm xử lý logic, nó chỉ hiển thị thông tin và gửi các sự kiện tới Controller khi người dùng tương tác - Controller (Bộ điều khiển): Controller là thành phần trung gian giữa Model và View Nó nhận các sự kiện từ View và xử lý chúng bằng cách cập nhật Model hoặc yêu cầu View hiển thị dữ liệu mới Controller cũng có thể chịu trách nhiệm khởi tạo Model ban đầu và quản lý luồng điều khiên của ứng dụng

Kỹ thuật sử sụng ASP.NET MVC

+ Hinh thức chia sẻ dữ liệu data sharng

+ Entity framework Hình thức chia sẻ dữ liệu (data sharing) là gì? Data sharing la quá trình chia sẻ dữ liệu giữa các nguồn thông tin, hệ thống hoặc cá nhân khác nhau Nó bao gồm việc truyền tải, cung cấp và tiếp nhận dữ liệu giữa các bên có quyền truy cập và sử dụng dữ liệu Mục đích của data sharing là tạo điều kiện cho việc chia sẻ thông tin, hợp tác và khai thác giá trị từ đữ liệu đã thu thập được Chức năng của hình thức chia sẻ dữ liệu (data sharing)

- _ ViewBag/ViewData và Model: được sử dụng đề chia sẻ đữ liệu giữa Controller và View Session: Dữ liệu được lưu vào session sẽ được duy trì trong suốt phiên làm việc và được truy cập bởi bất kỳ thành phần nào hoạt động trong phiên làm việc đó - Application: Application là phạm vi chia sẻ dữ liệu trên toan ứng dụng (tất cả mọi

user c6 the tao va su dung) - - Truy xuất đối tượng Application

Trang 15

+ Trong Controller: HttpContext.Application + Trong View: @HttpContext.Current Application + Trong lop bat kz: HttpContext.Current Application Entity framework 1a gi?

La framework (thu vién khung) dé anh xa cac don vi dir ligu m6 ta bang ldp (déi

tượng) vào cơ sở dữ liệu quan hệ, nó cho phép ánh xạ vào các bảng CSDL, tạo CSDL,

truy van voi LINQ, tao và cập nhật vao database

Cac thanh phan cta Entity Framework?

Entity Data Model: là thành phần dùng đê lưu trữ các thông tin ánh xạ, nối các lớp

model với cơ sở dữ liệu, mang lại sự tách biệt giữa chương trình và CSDL với 3

thành phần chính là Conceptual Model, Mapping và Storage Model LINQ to Entities và Entity SQL: Là hai ngôn ngữ truy vẫn được sử dụng với mục đích giúp viết các truy vấn tới object model và trả về các thực thê được định nghĩa trong Conceptual Model

Object Service: Cu thé hoa qua trình chuyên đổi và truy xuất dữ liệu Ngoài ra, nó còn đảm nhận nhiệm vụ quản lý và theo dõi trạng thái thay đôi của Object Entity Client Data Provider: Thanh phan nay chiu trach nhiém tuong tac voi Data provider va chuyén déi truy van LINQ to Entities va Entity SQL dé truy van SQL Chire nang cua Entity framework

Mapping di liéu: Entity Framework cho phép lập trình viên ánh xạ các đối

tượng NET vào cơ sở đữ liệu quan hệ

Truy vấn dữ liệu: Entity Framework cung cấp một ngôn ngữ truy vấn LINQ (Language Integrated Query) dé truy van dir liéu tir co so dir liéu

Cập nhật dữ liệu: Entity Framework cho phép lập trình viên thực hiện các thao tac

CRUD (Create, Read, Update, Delete) trên đữ liệu Quan hệ giữa các đối tuong: Entity Framework hỗ trợ định nghĩa các quan hệ giữa các đối tượng thực thê Lập trình viên có thê xác định quan hệ mét-nhiéu, nhiều- nhiều và một-một giữa các đối tượng Entity Framework sẽ tự động tạo các quan hệ và xử lý các truy vấn liên quan đến các quan hệ này

Tạo cơ sở dữ liệu: Entity Framework có khả năng tự động tạo cơ sở dữ liệu dựa trên mô hình đữ liệu đã định nghĩa Nó có thê tạo các bảng, quan hệ, các khóa chính và các ràng buộc tự động Điều này giúp giảm thiểu công việc phát triển và

triển khai cơ sở đữ liệu

Tối ưu hóa truy vấn: Entity Framework cung cấp các công cụ và kỹ thuật đề tối ưu hóa truy vấn dữ liệu Nó tự động sinh ra các câu truy vấn SQL hiệu quả, áp dụng các kỹ thuật như tải lười (lazy loading), tải sớm (eager loading) và tải một phan (partial loading) dé cải thiện hiệu suất truy vấn dữ liệu

Migrations: Entity Framework co tinh nang Migrations, cho phép lập trình viên

quản lý các phiên bản cơ sở dữ liệu và thực hiện các thay đổi cầu trúc đữ liệu một cách an toàn Migrations giúp tự động áp dụng các thay đôi cơ sở dữ liệu và duy trì tính nhất quán giữa mô hình đữ liệu và cơ sở dữ liệu

1.2.2 Kiến thức liên quan

a Thiết kế web là làm gì?

Thiết kế web là quá trình tạo ra giao diện và trải nghiệm người dùng cho một trang

web Nó bao gôm việc thiết kê và tô chức các yêu tô như bô cục, máu sắc, hình

Trang 16

ảnh, biêu đồ, phông chữ và các phần tử khác đề tạo ra một trang web hấp dan va thân thiện với người dùng

b Ngôn ngữ HTML, là gì? HTML (HyperText Markup Language)

- _ Ngôn ngữ đánh dấu siêu văn bản

- _ Là ngôn ngữ xây dựng trang Web Một số nguyên tắc cơ bản HTML,

- _ Luôn sử dụng thẻ định dạng theo từng cặp, có thẻ mở thì có thẻ đóng

- Dé tăng khả năng trình bày cho các thé html, co thé sir dung Attribute

- Nho rang thuéc tinh str dung trong thé lénh, lu6n tồn tsij theo từng cặp ở dang key=value

- _ Chỉ nên sử dụng chữ thường đối với các tên của tag, không sử dụng chữ in hoa

- Chi str dụng ký tự hoặc ký số đề đặt tên cho tập tin html, không sử dụng dấu tiếng việt và các ký tự đặc biệt khác

c Ngôn ngữ CSS là gì? CSS (Cascading Style Sheets) là một ngôn ngữ dùng đề xác định bo cuc, dinh dạng, kiêu cách của những trang HTML, Nêu HTML được sử dụng đề cầu trúc nội

dung thi CSS duoc str dung đề định dạng nội dung đã được câu trúc Ví dụ: CSS có thê xác định font chữ, chiều cao, chiều rộng, màu sắc phông nên, vị

trí và nhiều thứ khác trên tài liệu HTML Thế mạnh của CSS là gì?

- C§S giúp tách các kiểu trình bày ra khỏi nội dung trang web nên các mã

HTML sé gọn gàng hơn, thuận tiện hơn trong việc chỉnh sửa g1ao diện - Trinh duyệt web chỉ tải một lần Do đó, trang web được load nhanh hơn

-_ Giúp bồ trí kiểm soát nhiều tai liệu theo một phong cách đồng nhất

- _ Kiểm soát bố cục dàn trang chính xác hơn Vai trò của CSS

1 Giải quyết một vấn đề lớn

Nho CSS ma source code của trang Web sẽ được tô chức gọn gàng hơn, trật tự

hơn Nội dung trang web sẽ được tách bạch hơn trong việc định dạng hiển thị

Từ đó, quá trình cập nhập nội dung sẽ dễ dàng hơn và có thê hạn ché tối thiêu

làm rối cho mã HTML

2 Tiết kiệm rất nhiều thời gian

Định nghĩa kiêu CSS được lưu trong các tệp CSS bên ngoài vì vậy có thê thay

đối toàn bộ trang web bằng cách thay đổi chỉ một tệp Sử dụng CSS sẽ giúp bạn không cần thực hiện lặp lại các mô tả cho từng thành phần Từ đó, bạn có thê tiết kiệm được tối đa thời gian làm việc với nó, làm code ngắn lại giúp

kiêm soát dễ dàng hơn các lỗi không đáng có 3 Cung cấp thêm các thuộc tính

Trang 17

CSS cung cấp các thuộc tính chỉ tiết hơn HTML để định nghĩa giao diện của

trang web CSS giúp người dùng nhiều styles trên một trang web HTML nên

khả năng điều chỉnh trang của bạn trở nên vô hạn

d Giới Thiệu JavaScript JavaScript là ngôn ngữ lập trình “kịch bản" (Script) có cú pháp đề biêu diễn mã lệnh “tựa ngôn ngữ C Trên thực tế, ban đầu JavaScript được phát triển từ ngôn ngữ C (derived from C) dé thi hành các kịch bản định sẵn cho trang web, trong khi đó ngữ nghĩa và mục tiêu thiết kế của nó lại mang hơi hướng của lập trình hướng đối tượng (gần giống Java)

Javascript dùng để làm gì?

JavaScript dần được biết đến như một công nghệ phía trình duyệt để làm cho

các ứng dụng web linh hoạt hơn Sử dụng JavaScrIpt, các trình duyệt có thê

phản hồi tương tác của người dùng và thay đôi bố cục của nội dung trên trang web

Javascript có những lợi ích nào? - - Dễ đảng học và sử dụng: Cú pháp của JavaScript được lấy cảm hứng từ

ngôn ngữ lập trình Java, rat dé dé học và viết mã - _ Có thê không phụ thuộc vào nền tảng: Không giống như các ngôn ngữ lập

trình khác, bạn có thê chèn JavaScript vào bất kỳ trang web nào và sử dụng với nhiều ngôn ngữ và khung phát triển web khác

- - Giảm tải máy chủ: Bạn có thê sử dụng JavaScript để giảm tải máy chủ và

tắc nghẽn mạng vì JavaScript có thê chạy các phép toán logic và thực hiện nhiều công việc của máy chủ trên chính máy khách

Cải thiện giao diện người dùng: JavaScript tạo ra các trang web tinh tế giúp thuận tiện trong việc tìm kiêm và xử lý thông tin phức tạp

e Mô hình dữ liệu quan hệ là gì? Là một mô hình dữ liệu phô biến trong lĩnh vực cơ sở đữ liệu Nó sử dụng

cầu trúc bảng và quan hệ giữa các bảng đề tô chức và lưu trữ dữ liệu Mô

hinh nay dựa trên các khai nệm chính sau: - Bang (Table): Một bảng trong mô hình đữ liệu quan hệ đại diện cho

một tập hợp các đữ liệu có cầu trúc, với mỗi dòng trong bảng biểu

diễn một bản ghi đữ liệu Mỗi bảng được đặt tên và có các cột (column) đề đại diện cho các thuộc tính (attributes) cha dir liéu

- Khoa chính (Primary Key): Mỗi bảng trong mô hình quan hệ có

một trường hoặc tập trường được xác định là khóa chính Khóa

chính là một giá trị duy nhất cho mỗi bản ghi trong bảng và được sử

dụng đề xác định và duy nhất định danh cho đữ liệu trong bang

- Khóa ngoại (Foreign Key): Khóa ngoại được sử dụng để xác định mối quan hệ giữa các bảng trong mô hình quan hệ Khóa ngoại là

một trường trong một bảng tham chiếu đến khóa chính của bảng khác Điều này cho phép liên kết đữ liệu giữa các bảng và xác định

mối quan hệ giữa chúng

Trang 18

- Quan hé (Relationship): Quan hé trong m6 hinh dir liéu quan hé

biểu thị mối liên hệ giữa các bảng Có ba loại quan hệ chính trong

mô hình quan hệ:

+ One-to-One (Một-một): Một bản ghi trong bảng A chỉ có một bản ghi tương ứng trong bảng B và ngược lại

+ One-to-Many (M6t-nhiéu): Một bản ghi trong bảng A có thê

có nhiều bản ghi tương ứng trong bảng B, nhưng một bản ghi trong bảng B chỉ có một bản ghi tương ứng trong bảng A

+ Many-to-Many (Nhiều-nhiều): Một bản ghi trong bảng A có

thê có nhiều bản ghi tương ứng trong bảng B và ngược lại Mô hình dữ liệu quan hệ cung cấp các lợi ích sau:

- - Tính toàn vẹn dữ liệu: Mô hình dữ liệu quan hệ cho phép xác định ràng

buộc dữ liệu để đảm bảo tính toàn vẹn của đữ liệu - Tính mô đun và tái sử dụng: Dữ liệu được tổ chức thành các bảng riêng

biệt, cho phép mô-đun hóa và tái sử dụng đữ liệu trong các ứng dụng khác

nhau

- Tính linh hoạt: Mô hình đữ liệu quan hệ cho phép truy xuất dữ liệu phức

tạp thông qua các câu lệnh SQL và kết hợp dữ liệu từ nhiều bảng khác

nhau

Hiệu suất và tối ưu hóa: Mô hình đữ liệu quan hệ cho phép tối ưu hóa truy vấn

và cung cấp hiệu suất cao khi truy xuất dữ liệu f Các giao thức của mạng máy tính về http và https_ - HTTP (Hypertext Transfer Protocol): HTTP la mét giao thire truyén tai

siêu văn bản được sử dụng đề truyền tai các tài nguyên trên web, chẳng hạn

như trang web, hình ảnh, video, tệp tin, vv

+ Nó hoạt động trên cơ sở giao tiếp "yêu cầu-đáp ứng" giữa máy khách (client) và máy chủ (server) Máy khách gửi yêu cầu HTTP

và máy chủ trả lời bằng các phản hồi HTTP chứa nội dung được

yêu cầu

+ HTTP su dung céng mặc định là 80 va su dung giao thire TCP/IP

đề thiết lập và duy trì kết nối giữa máy khách và máy chủ

- HTTPS (Hypertext Transfer Protocol Secure): HTTPS la mot phién ban bao mat cua HTTP No str dung SSL (Secure Sockets Layer) hoac TLS (Transport Layer Security) dé ma héa dir liéu truyén tai va dam bảo tính bảo mật trong quá trình truyén tải

+ HTTPS str dung céng mặc định là 443 và sử dụng giao thire TCP/IP

giống như HTTP

+ Một chứng chỉ SSL/TLS được sử dụng để xác minh tính toàn vẹn

của máy chủ và thiết lập kênh truyền an toàn giữa máy khách và

máy chủ Loi ich cua HTTPS so voi HTTP Ia:

Neuvén Thi Chic Dao — Pham Thi My Huvén

Trang 19

- Bao mat: Dit ligu duge ma hoa trong qua trinh truyền tải, ngăn chặn các

kẻ tấn công có thê nghe trộm hoặc thay đối dữ liệu

- _ Xác minh tính toàn vẹn: Chứng chỉ SSL/TLS xác minh tính toàn vẹn

của máy chủ, đảm bảo rằng người dùng kết nối với máy chủ chính xác

và không có sự can thiệp của bên thứ ba

Tín nhiệm: HTTPS được biết đến là an toàn va tin cậy hơn, do đó, nhiều trình duyệt hiện thị biểu tượng mô-đun bảo mật (như biêu tượng ô khóa) để cho người dùng biết rằng kết nối được bảo mật

Cac thao tác với dữ liệu:

SELECT: Thao tac SELECT cho phép bạn truy vấn và lấy dữ liệu từ cơ sở đữ

liệu Bạn có thể chỉ định các cột cụ thể mà bạn muốn lay hoặc lấy tất cả các cột từ một bảng

INSERT: Thao tac INSERT cho phép ban chẻn dữ liệu mới vào bảng trong cơ

sở đữ liệu Bạn cần xác định tên bảng và cung cấp giá trị cho các cột tương

ung UPDATE: Thao tac UPDATE cho phép ban cap nhat dir ligu trong co so dir liệu Bạn có thê chỉ định bảng, cột và giá trị mới đề cập nhật, cùng với điều kiện đề xác định dòng dữ liệu cần cập nhật

DELETE: Thao tác DELETE cho phép bạn xóa đữ liệu từ cơ sở đữ liệu Bạn có thê chỉ định bảng và điều kiện đề xác định những dòng đữ liệu cần xóa JOIN: Thao tác JOIN cho phép bạn kết hợp dữ liệu từ nhiều bảng dựa trên một điều kiện kết nói Có nhiều loại JOIN như INNER JOIN, LEFT JOIN, RIGHT

JOIN va FULL JÓIN, môi loại phù hợp với mục đích kết hợp dữ liệu khác

nhau GROUP BY: Thao tác GROUP BY cho phép bạn nhóm các dòng dữ liệu dựa

trên giá trị của một hoặc nhiều cột Thường kết hợp với các hàm như SUM, COUNT, AVG để tính toán các giá tri tong hop trong mỗi nhóm

Truy van dữ liệu:

- _ Truy vấn đữ liệu là quá trình trích xuất thông tin từ cơ sở dữ liệu Trong

ngữ cảnh của hệ quản trị cơ sở đữ liệu (Hệ quản trị cơ sở dữ liệu - DBMS),

truy vấn dữ liệu thường được thực hiện bằng cách sử dụng ngôn ngữ truy vấn cầu trúc (Structured Query Language - SQL) SQL la mét ngon ngit lập trình dùng đề tương tác với cơ sở dữ liệu, cho phép bạn truy vấn, thêm,

sửa đổi hoặc xóa dữ liệu trong cơ sở dữ liệu

Trang 20

- Truy van đữ liệu trong SQL được thực hiện bằng cách sử dụng câu lệnh SELECT Câu lệnh SELECT cho phép bạn chỉ định các cột mả bạn muốn trả về, , áp dụng các điều kiện đề lọc dữ liệu va thực hiện các phép toán khác như sắp xếp và nhóm dữ liệu

Khi thực hiện một truy vấn đữ liệu, có thé hướng đến mục tiêu như:

- Lay dữ liệu từ một bảng cụ thê hoặc nhiều bảng kết hợp

- Lọc dữ liệu dựa trên các điều kiện nhất định

- Sắp xếp kết quả theo một hoặc nhiều cột

- Tính toán các giá trị dẫn xuất hoặc tông hợp đữ liệu

Truy vấn đữ liệu là một công cụ quan trọng đề truy cập và thu thập thông tin từ cơ sở dữ

liệu Nó cho phép tìm kiêm, lọc và phân tích dữ liệu đề trả lời các câu hỏi cụ thê và đáp

ứng nhu câu của ứng dụng hoặc người dùng cuôi

Chương 2 Phần tích và hoạch định

2.1 Các module chức năng: Sơ đồ chức năng:

Trang 21

| Chức năng |

- User |

Xem théng tin s

Trang 22

Chitc nang cua ngwoi dung (User):

1 Thê hiện thông tin:

Người dùng có thê xem thông tin chỉ tiết về các sản phẩm trái cây có sẵn trên trang web Thông tin này bao gồm hình ảnh, mô tả, nguồn gốc, chất lượng, giá cả và đánh giá từ người dùng khác

2 Mua sản phẩm:

Người dùng có thể chọn và thêm các sản phẩm trái cây vào giỏ hàng của

mình Họ có thê chợn sô lượng, kiêm tra lại danh sách sản phâm và tiên hành

thanh toán khi muốn mua hàng 3 Đặt hàng:

Sau khi chọn sản phẩm và kiểm tra giỏ hàng, người dùng có thể tiến hành đặt

hàng Họ cung cấp thông tin về địa chỉ giao hàng và các yêu cầu đặc biệt khác

đê hoàn tất quá trình đặt hàng

4 Thanh toán: Khi người dùng muốn mua sản phẩm, trang web bán trái cây cung cấp chức năng thanh toán Người dùng có thê chọn phương thức thanh toán phù hợp như

1312

thẻ tín dụng, thẻ ghi nợ, ví điện tử hoặc chuyên khoản ngân hàng để hoàn tất

thanh toán 5 Dang ky:

Trang web cung cấp chức năng đăng ký đề người dùng có thẻ tạo tài khoản thành viên Đăng ký giúp người dùng lưu trữ thông tin cá nhân và địa chỉ giao hàng, cũng như tiếp cận các tính năng đặc biệt như giảm giá hoặc khuyến mãi dành riêng cho thành viên

6 Đăng nhập: Người dùng đã đăng ký có thê sử dụng chức năng đăng nhập đề truy cập vào tài khoản cá nhân của mình Điều nay cho phép họ xem lại lịch sử mua hàng, cập nhật thông tin cá nhân và sử dụng các tính năng khác chỉ dành cho thành viên

7 Đăng xuất:

Sau khi hoàn thành việc sử dụng trang web, người dùng có thê sử dụng chức

năng đăng xuất đề thoát khỏi tài khoản cá nhân và đảm bảo an toàn thông tin

Chitc nang cua nguwoi quan tri (Admin): 1 Quản trị thông tin:

Người quản trị có quyên truy cập và quản lý thông tin về người dùng, bao gôm thông tin cá nhân, địa chỉ giao hàng và lịch sử mua hàng Họ cũng có quyên quản lý thông tin về sản phâm, bao gồm thông tin mô tả, hình ảnh, giá cả và nguồn góc

2 Phân quyền:

Trang 23

gười quản trị có thể phân quyền cho các phòng ban như kinh doanh, nhân sự

và kế toán Điều này cho phép họ quản lý và xử lý đữ liệu liên quan đến các

phòng ban cụ thê, đông thời đảm bảo an toàn và bảo mật thông tin 3 Ghi lại thông tin người dùng:

Người quản trị có chức năng ghi lại thông tin về hoạt động của người dùng, bao gồm lịch sử mua hàng, tương tác trên trang web và các hoạt động khác

Điều này giúp tạo dựng dữ liệu đề phân tích và cải thiện trải nghiệm người

dùng 4 Nâng cấp người dùng:

Người quản trị có thể nâng cấp người dùng từ tài khoản thường thành tài

khoản thành viên Điều này cho phép người dùng có quyên truy cập vào các tính năng đặc biệt như giảm giá, khuyến mãi hoặc ưu đãi dành riêng cho thành viên

5 Thống kê lượt truy cập: Người quản trị có chức năng mở rộng đề thống kê và xem số lượng người truy cập trang web Thông qua các công cụ phân tích, họ có thê thu thập đữ liệu về lượt truy cập, nguồn truy cập và hành vi người dùng đề đánh giá hiệu quả và tối ưu hóa trang web

6 Chức năng bảo mật: Người quản trị có thể quản lý chức năng bảo mật như đăng nhập và đăng xuất

Họ có thê thiết lập chính sách bảo mật, yêu câu xác thực và đảm bảo an toàn

thông tin của người dùng và dữ liệu

7 Tạo, thêm, sửa, xóa dữ liệu:

Người quản trị có quyền tạo dữ liệu mới, bao gồm thông tin về sản phẩm và người dùng Họ có thê nhập liệu từ các nguồn khác nhau để bố sung và cập nhật thông tin trên trang web

Người quản trị có quyền thực hiện các thao tác thêm, sửa và xóa đữ liệu, bao gồm thông tin về sản phâm và người dùng Điều này cho phép họ cập nhật và quản lý thông tin trên trang web một cách linh hoạt và chính xác

2.2 Site map: Trình bảy sơ đồ liên kết

Trang 24

Ban đầu khi người dùng truy cập vào website của HD FRUIT thi ho sé nhin thay dau tiên là trang giao diện Home: Ở đây người dùng có thê xem về tất cả sản phẩm và các mục có liên quan

Products: + Phía trên là một banner màu xanh với nội dung là một thời gian giảm giá

sản phâm có giới hạn - hãy mua ngay đề thu hút khách hàng

+ Phía dưới là các sản phẩm, có các thông tin về tên sản phâm, giá tiền, thêm

vao gø1ỏ hang

Blog: Trang thê hiện tin tức về Website HDERUIT, những lời bình luận về sản phâm của Khách hàng

Contact:

+ Phia trên sẽ hiện ra một ban dé thé hiện địa chỉ của cửa hàng trực tiếp

+ Phía dưới bên trải sẽ là thông tin liên hệ: Tên, Email, Tiêu đề và Nội dung mà bạn muốn để lại để liên lạc với shop

+ Phía dưới bên phải sẽ là thông tin về website, địa chỉ, số điện thoại và các kênh mạng xã hội của website

Cart: Phía trên sẽ là các thông tin của sản phâm mà người dùng đã thêm vào giỏ hàng: Tên sản phâm, Hình ảnh, Sô lượng, Gía tiên, Thành tiên, cuôi cùng sẽ có Tổng tiền Nếu họ chưa thêm vào thì giỏ hàng sẽ ở trạng thái trồng Phía dưới sẽ là thông tin của khách hàng mua: Tên khách hàng, số điện thoại,

email, địa chỉ Và cuối cùng là nút đặt hàng

Login: Dang ky/ dang nhập (Login): Người dùng click vào mục login sẽ hiện ra 2 khung, nêu người dùng chọn đăng nhập sẽ hiện ra khung đê họ nhập tên và địa chỉ email để đăng nhập và bám vào nút đăng nhập đề hoàn thành; nếu người dung chon dang ky thi sẽ điên thông tin vao 6 dang ky va khoi tao password va bam nut dang ky

Footer

Khi người dùng click vào các mục:

+_ GIỎ TRÁI CÂY: Gồm có: Hộp trái cây, Giỏ trái cây có nơ, Giỏ trái cây kết

hợp hoa

+ TRÁI CÂY: Gồm có: Trái cây nhập khẩu, Trái cây vườn

Thì website sẽ chuyên đến các trang tương ứng, những trang này chủ yếu sẽ hiện ra sản phâm có các thông tin về tên sản phẩm, giá tiền

+ CHÍNH SÁCH: Phương thức thanh toán, Chính sách giao hàng, Chính sách

đổi trả, Chính sách bảo mật Thì website sẽ hiện thị những chính sách của cửa hàng, đảm bảo cung cấp đây đủ

thông tin và quyền lợi của người dùng 2.3 Database diagram: M6 ta luge 46 quan hé

Trang 25

OrderName OrderDate

Trang 26

dùng click vào các biểu tượng sẽ dẫn họ đến các nội dung tương ứng với biêu

tượng đó

1.2 Header middle - — Ở góc trên bên trải sẽ có logo của website và cạnh bên là tên của website HD

ERUIT

- _ Ở góc bên phải có: biêu tượng của giỏ hàng (Cart) và biểu tượng đăng nhập/đăng

ký (Login) + Gio hang (Cart): Khi người dùng click thêm vào sản pham “Add to cart” thi

các sản phâm sẽ được gửi vảo trong mục nảy + Login: hién ra giao diện cho người dùng đăng nhập hoặc đăng ky 1.3 Header bottom

- _ Ở góc trên bên trái sé có các nút: Home, Products, Blog, Contact Khi người dùng click vào các nút này sẽ dẫn họ đến các trang tương ứng

- _ Ở góc bên phải nút “search” để người dùng có thê tìm kiếm các sản phâm nhanh hơn

2 Slider Chu yéu sé co 1 carousel hién thi hinh anh va thong tin về sản phâm Nó có thê tự điều hướng mà không cần người dùng phải click vào khung

3 Nội dung về Sản phâm: chia làm 2 phần

3.1 Sidebar Sidebar sé co danh muc san pham bao gom:

- Gio trai cay - H6p trai cay ;

- Trái cây nhập khâu

- Trai cay vườn

Trang 27

Khi click vào mỗi mục sản phâm ở sidebar thì website sẽ hiện ra đây đủ các sản phâm tương ứng với danh mục đã chọn ở bên phải khung sản phâm

4.1 Footer top

Cam kết của website HD FRUIT: Đảm bảo trái cây tươi và chất lượng

Giới thiệu đôi nét về website

VỊ trí của công ty: 303 Nguyen Van Linh Street, District 7, Ho Chi Minh City

Trang 28

DO AN MON HOC LAP TRINH WEB Chương 3 Triển khai ứng dụng web

3.1 Thiết kế giao diện:

Sử dụng Template E Shopper được thiết kế trên nền tảng Bootstrap Framework, tích hop vao ứng dụng web dùng thê hiện giao diện cho các nhóm trang web,

(Giao diện các nhóm trang web được thê hiện từ Bootstrap Responsive Template Eshopper tích hợp vào ứng dụng web )

Giao diện thê hiện cho các nhóm trang web gồm:

Trang 29

02848735844 — #hdiuit@gnalcom f£ w in G+ Pe] HD FRUIT ® Cart @ Login

Home Products Blog Contact _

Limeted 'Time offer - Order now

worldwide

$30.00 $35.00 $45.00 le) N OR Premium Fruit Basket CT14 Birthday Fruit Gift Basket CT10 Gift Fruit Basket CT32

2 PAIRS MORE! RAG to Cast FRAdd to Cart Add to Cost

$82.00 $50.00 $43.00

Gift Fruit Basket CH12 Fruit Gift Basket CT47 Fruit Gift Basket CT42 Add to Cart TRAdd to Cart Add to Cart

HD FRUIT troduct IT fresh fruit > the juciest selec vits s rectly F

aay nh rere Na Ha : nu ng nnh 308 Nguyen VaniLinh Street, Dicstrict Perea 7,HO'Chi Mink Ctity

FRUIT BASKET FRUIT POLICY ABOUT HD FRUIT Box fruit Imported fruit Payment methods Your email address mã Fruit basket with bow attached Garden fruit Delivery policy

Fruit basket with flowers Return policy Get the most recent updates from our site and be updated your self

Hinh 2: Giao dién thé hién trang san pham

Trang 30

028 4973 5844 Bhd fruit@gmail oom f£ w in G F2] HD FRUIT " @ Log

FRUIT BASKET FRUIT POLICY ABOUT HD FRUIT

Your email address 9|

uit

f

uit

e ur se

Hình 3: Giao điện thể hiện các trang chi tiết sản phẩm

Trang 31

‘028 4973 5844 hdfruit@gnal con mm HD FRUIT Home Products Blog Contact

Shopping Cart

Name

f£ w in G* wR Can @ Login

Birthday Fruit Git Basket CT10 @ $35.00 +[1]- HC16 Fruit Gift Box sà $61.00 +[! ]- American Green Seediess Grapes đò $20.00 *+[1]- Luc Ngan Lychee ‘te $4.00 +[1]-

Cart Sub Total ‘Shipping Cost Total What would you like to do next?

Choose if you have a discount code or reward points you want to use or would like to estimate your delivery cost © Use Coupon Code) Use Gift Voucher Estimate Shipping & Taxes

Conlinue to shopping

HD FRUIT Nee nen sharaeporessal ela paler rearelalosaye

FRUIT BASKET FRUIT POLICY Box fruit Imported fruit Payment methods

4 with bow attached Garden fruit Delivery policy

Fruit basket with flowers Return policy

Hình 4: Giao điện thể hiện trang gió hàng

$120.00

306 Nguyen VaniLinh Street Dicstrict 7, HO'Chi Min City

ABOUT HD FRUIT Your email address

most recent updates from

our site and be updated your self

Designed by Chục Dao & My Huyen

Trang 32

Ít Eosesbkenlxe seren se Gift giving treenet tociny Theeresfeotee, wee huaver laonchercd fruit Euecert presets with: ee saricd rvcoverl cleonicprve feo erumeet ther Gifting reemete of camtomers The HO Fruit meen creaivery Gesigring Daenats every Gay 60 meet me needs of ench event and each cortex! such &f: grand Opening, NEsewerTnINg, COnpreRNAENG apecial oooetione, s

Mende - colleagues, n Iver on masa bosses pe 24

ociei sthermore, we also accept fruit baskets at becoming an Indispensable tend in today’ mode orang to customers requests Fur as - we Wil Go better" - crterta for mult bashets made

At HD Frult, you have many choices of gifts and offe for important da) the request of customers in the Mo Chi Minh City area "You Rist give us Id

2029 have taken place, basket designs are bei 3 Iggest to you a few products that many custome Beet choices when coming te HO Frum and choose and nd every

ry Newt, ww we ce to you the best-eetling modes at HO in atisied when purchasing gi ar arrives At the same time, it helps you make the A boasket

pre Nex RATE THISITEM: www

m ta

se ean: aan enya ey nan ey un Ye nttanon ea Riel see

AbconAGty agree! HL Fruit Gouvars Lap-NOtEN GuaMYY and Service 1g ion Muss are a dowant every Une

a mmvascaracren JB curve a rem 7024

FE rescence EB voce QE reer ous

Leave a replay HD FRUIT

33 Nouyen Van Linh Street, D 7, He Gh) Mink Cet FRUIT BASKET FRUIT POLICY ABOUT HD FRUIT

Trang 33

‘028 4973 5044 BW hdfruit@gmail com ee HD FRUIT

Home Products Blog Contact “

CONTACT US

wre e IEN THAM MY % iz

Tl 3030 Jn Vin Linh B bườnsð43 ( Vợ: wh a, Ễ Số12 303Ð Nguyễn Văn Linh, Binh Thuận ¡ ‘San Chu 79Pro & 9.862%

- Quận 7, Thành phố Hồ Chí Minh Chaweng Lea TT fe Q7 ọ se ah Nhà Tí Đấu ;Ọ Ð số1a

Xem bản đổ lớn hơn a“ rong SN vn oe i Mitsubishi Nam Auto mr ant Tiệm nani ate t Quán - Hải@) - ; ‘6 Trường THCS a \g Giế 40K Ĩ Nguyễn Hiến Le

` naits® a gs “a

x 2 Đi ae

a $ Ạ Chung Cư turcity® °

went hip @2 Lasent 3 Đường se2e a so ñ— 0œ H Qo NguyệnTnị Thi ¡ Thập P

Đưng số ạg ast pon @ § a ° 9 Ð Số32 2 i\ $

40 a $611 š cho Tan my mms $ @- Ệ

Công viên 2 sf Oe: 3 &

An * * Ð sốg i e + % a " a: Docklands Saigon

2 cư Green vale,Q KG HQ am 0.366 sf —

“t3, ấ =m n u~.sên Đồng Chỉ GET IN TOUCH Name Email Subject

Your Message Here

HD FRUIT

a ““ Phimtất DữÖệubảnđ@2024 08ukhoán Báo cúomộtlỗibánđồ

CONTACT INFO Website HD FRUIT

303 Nguyen Van Linh Street, Dicstrict 7, Ho Chi Minh Ctity

Phone:028 4873 5844 Email: hdfruit@gmail.com

Get the most recent updates from Fruit basket with flowers Retum polic: ở our site and be updated your self

Trang 34

22848725844 WBhéfnit@gmaiLeeer f£ wv in G- 21 HD FRUIT weat âL

New User Signup! Login to your account UserName admin 6 UserName samn Password — sense Password — s

HD FRUIT 308 Nouyen vai tanh Street, Dicstric

7, H6'Ghi Minh City

Your email address | 2 |

it

\eclnest$9672/hecount/Signupriep HGH ® 2024 HD FRUIT Al rights reserved Designed by Chục Dao & My Huyen

Hinh 7: Giao dién thé hién trang Login

Trang 35

> om ° SM SO ama, Whew ÁP

Trang 36

Hinh 8: Man hinh cai dat_HDLayout

3.2 Thiết kế đữ liệu:

3.2.1 Lược đồ quan hệ

Product 9 Pod

——

Hình 9: Lược đô quan hệ

3.2.2 Các bang dữ liệu

Bang 1; Category

Tên cột (thuộc tinh) Kiểu dữ liệu Mô tả Ghi chú

Id int Mã loại Khóa chính

CatName nvarchar(50) Tén loai san pham

Bang 2: Product Tên cột (thuộc tính) Kiếu dữ liệu Mô tả - Ghỉ chú

Prold int Ma san pham Khoa chinh

ProName nvarchar(50) Tén san pham _ Prolmage nvarchar( 100) Hình ảnh sản pham

ProPrice decimal(18, 2) Gia sản pham

Catld int Tên loại

Đảng 3: Order Tên cột (thuộc tính) Kiểu dữ liệu Mô tả Ghi chú

Orderld int Ma don hang Khoa chinh

OrderName nvarchar(50) Tén don hang

OrderDate date Ngay dat don hang PaymentType nvarchar(50) Loai thanh toan

Status nvarchar(50) Trang thai CustomerName nvarchar( 100) Tên khách hàng CustomerPhone nvarchar( 15) Sô điện thoại khách hàng CustomerEmail nvarchar( 100) Email khách hàng

Customer Address nvarchar(250) Dia chi_khach hang

Trang 37

Orderld int Ma don hang

Productld int Mã sản phẩm Khóa chính

Price float Gia tién Quantity int Số lượng

Đảng 5: User Tên tính

Userld UserPassword

3.3 Thiết kế xử lý:

3.3.1 Mô hình ánh xạ dữ liệu và các thực thê (ORM)

“* Class Diagram: ProductDataModel

ĐỘ Fie Edit View Git Project Build Debug Test Analyze Tools Extensions Window Help ©-©|131-% M292 «+ € «| det - + _ˆ ISEsgress (Google Chrome) ~

„ HDFRUIT C-®* 8;

Ghi chú Khóa chính

#CusomerName #CuspmerPh, & Cusomertmail # Customesnddress

@ Connected Services

> & Properties b để Reterences

* E

& ContactControlier

bưnn i

4 4WPtodudDatsModelederx > 2) ProdutDataModelComenttt 1) ProductOwuuModel Designercs

Trang 38

2, “wy DBContext Class: ProductDBContext

DM Fie Edit View Git Project Build Debug š@-+o|f- tạ wP| 2 - € -| der - Ary CPU Test Analyze Tools Extensions Window Help

Search (Ctrl+Q) + DMS Express (Googie Chrome) + 9 G | tte

+ | 4s HOFRUT Models ProdactDBContext x

xoũng 9/gtee Đeta.fAftyị

ertial class ProfectotCartest 1 OkContext

Le + Base(“sass-frodec128Cantext") Productoacentext() protected giarriáe v34 9els4elCZsstlrg[pttedel95114c nsdsl8u11#e=) {

r

ian:

Hồ GE5et(Getsgor/x Categaries ( get; sets }

Ewor List

Hinh 11; DBContext Class

“+ Entity Class: e Category Class OQ) Fie Edit View Git Project Build Debug Test Analyze Tools Extensions Window Help Search (Ctr +0) 2

tad cles Catepory ‹ „ [syxten.tinguontica codetnalysis.cusorevwiersage(“Microsaft.Unage”, “CAI214:OuftntCal 1OrerridabLewthodstrconstrectors”))

[Syston thageostics.Codetnalysts.Suppresstessage("Mlcrosott.Ueage”, ^C2A2327/Col1ect1en#eepertesShou1đĐeBes40n1y”]} public virwwal

@ Connected Services Properties

D 28 References #9 App Data

#8 App Sia Anae

#9 Contest

€entrllens

™ fonts

me imoges > cm Cones 4 4WProducOstaModelsơrw

4 †) ProductOstahiodel, "

4 †9 troductDataMedeiCo 4g RroductDBConeert 2) ProductOstaModelDesignencs ProdoctOestalđodel > TD ProductDauModel

> i Views

Search Efov tết bó —— # pve

Line Suppression State Ð @ềWebcong

a F)

ODA D-FOOBlOFL= Search Soâutioe Exglorer (Cự và

‘Search Enor List

Une Suppression State

Trang 39

= public Product) — tedssebysia.s "Mieressft.laage”, ^i 2) Lt —lesoad Dm images 3 » Abs OnderDetatls = sex Xez26eteirderOetaf.()1 > mis 4 Models _ › = 5 KÝ 4 4WPtodudDataModl = aan ProductDataModel Conextit ” pike 4° 2) ProcuctbataMocet.Contextcs

nhắc String Pretwage { geth sets > % moduDĐ * "` { gets eats } 5 ea 2 public Nllobleciot> Cotte { pets sets } 4D ProductDetaModel

= > 2) Categonces > 2 Oraeces > TQ OrdeOesäos ‘Search Efov Lết -'Đnasse 2 > 2) Procuct.Categonycs Coce Description Project file Une Suppression State 1D ProductDataModelcs

> 2 Useres b CProdueldeex > lt Views b đồ Giobalsse

® packagesconfi > @ Weocontig Eor List Hinh 13: Product Class

+] As HOFRUT Models Order xÌ@ cưa -+Ẵ coA b-Z@đG6 o6 ~

1 Tein code wan generated from a template / 3 |2 Mamas) changes te this file say couse unexpected behavior in your application © 27 <Javta-gaarstado [77 Maeua) change te this fike will te overnritten Af the code Le ragmerated

We

can (00081210005

: sus “ ¢ ila lors erie He partial class Onder ssh cameos Carano

Trang 40

+] H orcera “too Qa o-260@8\0%=

Search Solution Explores (Cit) ˆ- This code was generated from & temglate

: 2 7 =

: anual chenges 2 this file Gill be everuritten {f tha cade Ln rapenerated aoa

bế References

9 namespace HOFRUTT, = Te muted > mm App.stan

Onder (pets sets

ct Pradact (gets mets )

Build + inteliSense = Search Enor List P-

Une Suppression State

248 O-FOOBDlOr=

2 Api * [ 4s HOFRUIT Models Prod.xt Category 2 |2 «se gmersteb 11 Take code ven gmerated fron ø texplete, Search 5oivtioe Esetorer (Chí và e- s\n 4 ThHorum ˆ S|! Matusl chafges to this {Le may couse anenpected šehwrer in your application 2 Cennected Senscer 2 [71 manual chenges te thần file HÀ! be everuritten {f the cade Ln regenerated > An ; —— bế References

*9 App Sian

Areas 3 ection, Gener Content

& Contetiens % ah cles Protect Category a

fonts ” Prota ¢ gets sets ) im images „ public wtring Protame { gets set; } mph » public string Prataage ( gets ots? an ‘ai Motels e

public tilaviectectaal> Promrice { get; set; } 4 4WPtoJuDatsModele public mellablecion> cutté ( ge; set; } 4 _ †) ProáoctOataModelCometrt

public string Catone { gets sets

Build + ItetiSense + ‘Search Enor List ˆ-

Project file Line Suppression State

Hinh 16; Product_Category Class

Tiêu đề	Xây Dựng Ứng Dụng Web Bán Trái Cây HDFruit
Tác giả	Nguyên Thị Chúc Đào, Phạm Thị Mỹ Huyền
Người hướng dẫn	Bùi Duy Tân
Trường học	Trường Đại Học Nguyên Tắc Thành
Chuyên ngành	Lập Trình Web
Thể loại	Đồ án môn học
Năm xuất bản	2023 - 2024

Định dạng
Số trang	92
Dung lượng	24,55 MB