THIẾT KẾ VÀ TRIỂN KHAI HỆ THỐNG WEBSITE BÁN ĐỒNG HỒ SỬ DỤNG NGÔN NGỮ LẬP TRÌNH PHP VÀ CƠ SỠ DỮ LIỆU MYSQL

Kỹ Thuật - Công Nghệ - Công Nghệ Thông Tin, it, phầm mềm, website, web, mobile app, trí tuệ nhân tạo, blockchain, AI, machine learning - Lập trình 1 LỜI CẢM ƠN Trước tiên, em xin phép gửi lời mời cảm ơn sâu sắc tới cô giáo ThS. Nguyễn Thị Minh Châu đã nhiệt Thnh giúp đỡ và hướng dẫn em trong quá trình thực hiện khóa luận này. Em cũng xin gửi đến quý thầy cô đang giảng dạy tại trường Đại học Quảng Nam nói chung và thầy cô trong khoa Toán – Tin nói riêng lời biết ơn chân thành, cảm ơn thầy cô vì đã hết lòng truyền đạt cho em những kiến thức trong những năm tháng học tại Trường. Kính chúc quý thầy cô luôn mạnh khỏe, gặt hái được nhiều thành công trong sự nghiệp Dù đã cố gắng hết sức thực hiện đề tài nhưng cũng khó tránh khỏi những thiếu sót, em rất mong nhận được sự góp ý của quý thầy cô, các anh chị và các bạn để bản thân em khắc phục và tiến bộ hơn. Quảng Nam, tháng 4 năm 2023 Sinh viên thực hiện Thaikeu VATSANGA 2 DANH MỤC CÁC TỪ VIẾT TẮT Từ viết tắt Tiếng Viết Tiếng Anh HTML Ngôn ngữ siêu văn bản HyperText Markup Language CSS Ngôn ngữ định kiểu theo tầng Cascading Style Sheets PHP Lập trình kịch bản Hypertext Preprocessor CSDL Cơ sở dữ liệu Database UC Ca sử dụng Use Case MỤC LỤC PHẦN 1. MỞ ĐẦU ........................................................................................................... 1 1.1. Lý do chọn đề tài ........................................................................................................ 1 1.2. Mục tiêu của đề tài ..................................................................................................... 1 1.3. Đối tượng và phạm vi nghiên cứu ............................................................................... 1 1.4. Phương pháp nghiên cứu ............................................................................................ 2 1.5. Lịch sử nghiên cứu ..................................................................................................... 2 1.6. Đóng góp của đề tài .................................................................................................... 2 1.7. Cấu trúc đề tài ............................................................................................................ 2 PHẦN 2. NỘI DUNG NGHIÊN CỨU............................................................................... 3 CHƯƠNG 1 : CƠ SỞ LÝ THUYẾT.................................................................................. 3 1.1. Giới thiệu về đề tài ..................................................................................................... 3 1.2. Giới thiệu các ngôn ngữ lập trình ................................................................................ 3 1.2.1. Ngôn ngữ HTML ..................................................................................................... 3 1.2.1.1. Các thẻ HTML cơ bản ........................................................................................... 7 1.2.2. Ngôn ngữ CSS ......................................................................................................... 8 1.2.2.1 Định nghĩa CSS ..................................................................................................... 8 1.2.2.2 Cú pháp của CSS ................................................................................................... 8 1.2.2.3 Tại sao phải sử dụng CSS ...................................................................................... 9 1.2.3. Ngôn ngữ PHP ....................................................................................................... 10 1.2.3.1. Khái niệm PHP ................................................................................................... 10 1.2.3.2 Cú pháp của PHP ................................................................................................ 11 1.3. Một số thư viện hỗ trợ .............................................................................................. 14 1.3.1. Thư viện Javascript ................................................................................................ 14 1.3.1.1. Giới thiệu............................................................................................................ 14 1.3.1.2. Cách nhúng Javascript vào trong tập tin HTML.................................................. 15 1.3.1.3. Biến trong JavaScript ......................................................................................... 16 1.3.1.4. Các câu lệnh trong javaScript ............................................................................. 17 1.4. Tổng quan MySQL ................................................................................................... 17 1.4.1. Giới thiệu MySQL ................................................................................................. 17 1.4.2. Ưu điểm của MySQL ............................................................................................. 18 1.4.3. Tại sao sử dụng MySQL ........................................................................................ 20 1.5.Visual studio code ..................................................................................................... 22 1.6. Xampp ...................................................................................................................... 22 CHƯƠNG 2 : PHÂN TÍCH VÀ THIẾT KẾ WEBSITE .................................................. 26 2.1. Khảo sát hiện trạng ................................................................................................... 26 2.1.1. Môi trường hệ thống .............................................................................................. 27 2.1.2. Mô tả hệ thống bán đồng hồ ................................................................................... 28 2.1.3. Đặc tính người dùng .............................................................................................. 29 2.1.4. Yêu cầu về chức năng ............................................................................................ 29 2.1.5. Yêu cầu phi chức năng ........................................................................................... 31 2.2. Phân tích hệ thống .................................................................................................... 31 2.2.1 Xác định Use Case .................................................................................................. 31 2.2.2. Sơ đồ Use Case tổng quát ...................................................................................... 32 2.2.2.1. Đặc tả Use Case ................................................................................................. 32 2.2.3. Biểu đồ tuần tự ...................................................................................................... 37 2.2.3.1. Biểu đồ tuần tự UC đăng nhập .......................................................................... 37 2.2.3.2. Biểu đồ tuần tự UC đăng ký .............................................................................. 38 2.2.3.3. Biểu đồ tuần tự UC đăng xuất ........................................................................... 39 2.2.3.4. Biểu đồ tuần tự UC tìm kiếm ............................................................................. 39 2.2.3.5. Biểu đồ tuần tự UC đặt hàng ............................................................................. 39 2.2.3.6. Biểu đồ tuần tự UC sản phẩm ........................................................................... 40 2.2.3.7. Biểu đồ tuần tự UC loại sản phẩm .................................................................... 40 2.2.3.8. Biểu đồ tuần tự UC danh mục sản phẩm ........................................................... 41 2.2.3.9. Biểu đồ tuần tự UC người dùng......................................................................... 41 2.2.3.10. Biểu đồ tuần tự UC hóa đơn ............................................................................ 42 2.2.4. Biểu đồ lớp ............................................................................................................ 43 2.2.5. Biểu đồ hoạt động .................................................................................................. 43 2.2.5.1. Biểu đồ hoạt động UC đăng nhập ..................................................................... 43 2.2.5.2. Biểu đồ hoạt động UC đăng ký.......................................................................... 44 2.2.5.3. Biểu đồ hoạt động UC đăng xuất ...................................................................... 44 2.2.5.4. Biểu đồ hoạt động UC tìm kiếm......................................................................... 44 2.2.5.5. Biểu đồ hoạt động UC quản lý danh mục sản phẩm .......................................... 45 2.2.5.6. Biểu đồ hoạt động UC quản lý người dùng ........................................................ 46 2.2.5.7. Biểu đồ hoạt động UC đặt hàng ........................................................................ 46 2.2.5.8. Biểu đồ hoạt động UC quản lý hóa dơn............................................................. 47 2.2.5.9 Biểu đồ hoạt động UC thanh toán ...................................................................... 47 2.3. Thiết kế dữ liệu......................................................................................................... 48 CHƯƠNG 3 : XÂY DỰNG WEBSITE ........................................................................... 51 3.1. Cài đặt cơ sở dữ liệu ................................................................................................. 51 3.2. Một số giao diện chính từ trang người dùng .............................................................. 54 3.2.1. Giao diện trang chủ ................................................................................................ 54 3.2.2. Giao diện trang cửa hàng ....................................................................................... 54 3.2.3. Giao diện trang giới thiệu ...................................................................................... 55 3.2.4. Giao diện trang liên hệ ........................................................................................... 55 3.2.5. Giao diện trang giỏ hàng ........................................................................................ 56 3.2.6. Giao diện trang đăng nhập và đăng ký ................................................................... 57 3.2.7. Giao diện trang tìm kiếm sản phẩm ........................................................................ 57 3.2.8. Giao diện trang thanh toán ..................................................................................... 58 3.3. Một số giao diện trang quản trị ................................................................................. 58 3.3.1 Giao diện trang chủ ................................................................................................. 58 3.3.2. Giao diện trang quán lý tài khoản ........................................................................... 59 3.3.3. Giao diện trang quản lý sản phẩm .......................................................................... 59 3.3.4. Giao diện trang thêm sản phẩm .............................................................................. 60 3.3.5. Giao diện trang quản lý loại sản phẩm ................................................................... 60 3.3.6. Giao diện trang xét duyệt hóa đơn(Quản lý hóa đơn) ............................................. 61 3.3.7. Giao diện trang quản lý danh mục sản phẩm .......................................................... 61 3.3.8. Giao diện trang quản lý banner .............................................................................. 62 3.3.9. Giao diện trang quản lý khuyến mãi ....................................................................... 62 PHẦN 3. KẾT LUẬN VÀ KIẾN NGHỊ .......................................................................... 63 1. Kết luận ....................................................................................................................... 63 1.1. Kết quả đạt được của đề tài : ..................................................................................... 63 1.2. Hạn chế : .................................................................................................................. 63 2. Kiến nghị..................................................................................................................... 63 PHẦN 4. TÀI LIỆU THAM KHẢO ................................................................................ 64 4.1. Tài liệu tham khảo .................................................................................................... 64 4.2. Website tham khảo ................................................................................................... 64 DANH MỤC HÌNH ẢNH Hình 1.1: Mô hình của HTML ........................................................................................... 4 Hình 1.2: Mô hình hoạt động JavaScript, CSS, HTML ...................................................... 4 Hình 1.3: Mô hình cấu trúc cơ bản của trang HTML.......................................................... 6 Hình 1.4: Mô hình cú pháp của CSS. ................................................................................ 8 Hình 1.5: Mô hình của Javascript .................................................................................... 15 Hình 1.6: Mô hình của MySQL ....................................................................................... 18 Hình 1.7: Mô hình khả năng MySQL............................................................................... 20 Hình 2.1: sơ đồ hệ thống.................................................................................................. 27 Hình 2.2: Use Case tổng quát website bán đồng hồ .......................................................... 32 Hình 2.3: Biểu đồ tuần tự UC đăng nhập ....................................................................... 38 Hình 2.4: Biểu đồ tuần tự UC đăng ký ........................................................................... 38 Hình 2.5: Biểu đồ tuần tự UC đăng xuất ........................................................................ 39 Hình 2.6: Biểu đồ tuần tự UC tìm kiếm ......................................................................... 39 Hình 2.7: Biểu đồ tuần tự UC đặt hàng .......................................................................... 40 Hình 2.8: Biểu đồ tuần tự UC sản phẩm ......................................................................... 40 Hình 2.9: Biểu đồ tuần tự UC loại sản phẩm .................................................................. 41 Hình 2.10: Biểu đồ tuần tự UC danh mục sản phẩm ....................................................... 41 Hình 2.11: Biểu đồ tuần tự UC người dùng .................................................................... 42 Hình 2.12: Biểu đồ tuần tự UC hóa đơn ......................................................................... 42 Hình 2.13: Biểu đồ lớp .................................................................................................... 43 Hình 2.14: Biểu đồ hoạt động UC đăng nhập ................................................................. 43 Hình 2.15: Biểu đồ hoạt động UC đăng ký..................................................................... 44 Hình 2.16: Biểu đồ hoạt động UC đăng xuất .................................................................. 44 Hình 2.17: Biểu đồ hoạt động UC tìm kiếm ................................................................... 45 Hình 2.18: Biểu đồ hoạt động UC danh mục sản phẩm .................................................. 45 Hình 2.19: Biểu đồ hoạt động UC người dùng ............................................................... 46 Hình 2.20: Biểu đồ hoạt động UC đặt hàng .................................................................... 46 Hình 2.21: Biểu đồ hoạt động UC hóa đơn .................................................................... 47 Hình 2.22: Biểu đồ hoạt động UC thanh toán ................................................................. 47 Hình 3.1: Bảng nguoidung(Người dùng) trong MySQL ................................................... 51 Hình 3.2: Bảng loaisanpham(Loại sản phẩm) trong MySQL ............................................ 51 Hình 3.3: Bảng khuyenmai(Khuyến mãi) trong MySQL .................................................. 51 Hình 3.4: Bảng phanquyen(Phân quyền) trong MySQL ................................................... 51 Hình 3.5: Bảng sanpham(Sản phẩm) trong MySQL ......................................................... 52 Hình 3.6: Bảng hoadon(Hóa đơn) trong MySQL ............................................................. 52 Hình 3.7: Bảng danhmuc(Danh mục) trong MySQL ........................................................ 52 Hình 3.8: Bảng chitiethoadon(Chi tiết hóa đơn) trong MySQL ........................................ 53 Hình 3.9: Bảng banner(Banner) trong MySQL ................................................................ 53 Hình 3.10: Bảng thiết kế dữ liệu trong MySQL ............................................................... 53 Hình 3.11: Giao diện trang chủ ........................................................................................ 54 Hình 3.12: Giao diện cửa hàng ........................................................................................ 54 Hình 3.13: Giao diện trang giới thiệu ............................................................................... 55 Hình 3.14: Giao diện trang liên hệ ................................................................................... 55 Hình 3.15: Giao diện trang giỏ hàng ................................................................................ 56 Hình 3.16: Giao diện trang đăng nhập và đăng ký ............................................................ 57 Hình 3.17: Giao diện trang tìm kiểm sản phảm ................................................................ 57 Hình 3.18: Giao diện trang thanh toán ............................................................................. 58 Hình 3.19: Giao diện trang chủ của người quản trị ........................................................... 58 Hình 3.20: Giao diện trang quản lý tải khoản ................................................................... 59 Hình 3.21: Giao diện trang quản lý sản phẩm .................................................................. 59 Hình 3.22: Giao diện trang thêm sản phẩm ...................................................................... 60 Hình 3.23: Giao diện trang quản lý loại sản phẩm ............................................................ 60 Hình 3.24: Giao diện trang xét duyệt hóa đơn .................................................................. 61 Hình 3.25: Giao diện trang quản lý danh mục sản phẩm .................................................. 61 Hình 3.26: Giao diện trang quản lý banner....................................................................... 62 Hình 3.27: Giao diện trang quản lý khuyến mãi ............................................................... 62 1 PHẦN 1. MỞ ĐẦU 1.1. Lý do chọn đề tài Công nghệ thông tin phát triển ngày càng hiện đại và đổi mới không ngừng, bằng việc chinh phục hết đỉnh cao này đến đỉnh cao khác. Mạng internet đang trở thành mạng truyền thông có sức ảnh hưởng lớn nhất, không thể thiếu trong tất cả các hoạt động của con người trong việc truyền tải và trao đổi dữ liệu. Không như ngày xưa, ngày nay mọi việc liên quan đến thông tin ngày càng dễ dàng hơn cho người sử dụng, bằng việc kết nối internet và một dòng dữ liệu truy tìm, thì ngay lập tức cả kho tài nguyên không chỉ trong nước mà ngoài nước hiện ra không chỉ bằng ngôn ngữ mà cả bằng hình ảnh, âm thanh. Chính vì lợi ích từ internet đã thúc đẩy sự ra đời và phát triển của thương mại điện tử, làm biến đổi bộ mặt văn hoá cũng như nâng cao chất lượng cuộc sống của con người, các hoạt động thông thường như sản xuất, kinh doanh và các doanh nghiệp cũng phát triển. Cuộc sống con người ngày càng phát triển thì nhu cầu sống của con người cũng được nâng cao và những nhu cầu đơn giản nhưng cũng rất thiết thực. Đó là nhu cầu ăn, ở và mặc, đây là vấn đề cũng đang là một bài toán của các nhà kinh doanh, làm sao để đáp ứng nhu cầu của con người để cải thiện đời sống ngày càng cao. Chính lẽ đó để đáp ứng những nhu cầu đó của con người trên cơ sở kế thừa những trang web bán hàng khác, em xây dựng nên một website bán đồng hồ để đáp ứng nhu cầu mua sắm đồng hồ của mọi người, giúp họ tiết kiệm kiệm được thời gian, chi phí trong việc phải đi ra các shop, các cửa hàng hay các chợ truyền thống để mua và tìm kiếm sản phẩm. Thay vào đó chỉ việc ngồi ở nhà với chiếc máy tính đã kết nối internet, mọi người có thể thỏa sức tìm kiếm, lựa chọn sản phẩm đồng hồ mà mình yêu thích mọi lúc mọi nơi. Giúp cho người quản trị dễ dàng trong việc phân quyền quản lý, quản lý khách hàng và các hóa đơn đặt hàng của họ. Vì những lý do trên, nên em chọn đề tài: “Xây dựng website bán đồng hồ”. Cho bài báo cáo khóa luận tốt nghiệp của mình. 1.2. Mục tiêu của đề tài Xây dựng Website bán đồng hồ để quảng cáo và bán hàng đồng hồ trên mạng nhằm tăng thêm hiệu quả kinh doanh của cửa hàng. Đồng thời, thu hút người tiêu dùng đến cửa hàng, từ đó có thể mở rộng quy mô cửa hàng. 1.3. Đối tượng và phạm vi nghiên cứu - Quy trình quản lý bán các mặt hàng đồng hồ. 2 - Các vấn đề cần giải quyết trong quá trình quản lý số lượng đồng hồ trong cửa hàng, tra cứu tìm kiếm các mặt hàng đồng hồ. Từ đó tiến hành xây dựng cơ sở dữ liệu và khai thác dữ liệu phục vụ công tác quản lý. - Theo dõi và thống kê các chức năng : doanh thu tháng nay, năm nay, nhân viên, khách hàng, đồng hồ nam, đồng hồ nữ, đồng hồ trẻ em, hóa đơn chưa duyệt và đáp ứng yêu cầu phát triển của cửa hàng trong tương lai. 1.4. Phương pháp nghiên cứu - Sử dụng những phương pháp nghiên cứu cụ thể như: logic, phân tích, tổng hợp, thống kê. - Phương pháp lý luận thông qua việc tìm hiểu tài liệu từ sách, giáo trình, internet. 1.5. Lịch sử nghiên cứu Trước đây, có rất nhiều Website thương mại điện tử để bán hàng, tuy nhiên bản thân em chọn nghiên cứu sâu về bán đồng hồ, một mặt hàng khá thông dụng hiện nay. 1.6. Đóng góp của đề tài Giúp cho việc quản lí trở nên đơn giản và hiệu quả hơn, nhờ đó tiết kiệm nguồn nhân lực trong việc quản lý sổ sách trong cửa hàng. Tạo được tính chuyên nghiệp trong việc quản lí bán đồng hồ. 1.7. Cấu trúc đề tài Nội dung khóa luận gồm có 3 chương : Chương 1: Cơ sở lý thuyết Chương 2: Phân tích và thiết kế Website Chương 3: Xây dựng Website 3 PHẦN 2. NỘI DUNG NGHIÊN CỨU CHƯƠNG 1 : CƠ SỞ LÝ THUYẾT 1.1. Giới thiệu về đề tài Việc kinh doanh mua bán là nhu cầu không thể thiếu đối với mọi chúng ta. Trong thời đại cạnh tranh hiện nay việc giới thiệu sản phẩm kinh doanh đến từng cá nhân với chi phí thấp, hiệu quả cao là một vấn đề nan giải của người kinh doanh cùng với nhu cầu mua sắm với những sản phẩm đa chủng loại, đạt chất lượng, và hợp túi tiền của người tiêu dùng vì vậy thương mại điện tử đã được ra đời và dần dần phát triển trên toàn thế giới. Việc phổ biến các sản phẩm của cửa hàng kinh doanh đến khách hàng thông qua các bảng báo giá tuy nhiên chi phí khá cao vì số lượng sản phẩm ngày một đa dạng và giá cả thay đổi liên tục và tính phổ biến không cao chưa đáp ứng được nhu cầu người dùng. Mặt khác của hàng còn gặp nhiều khó khăn như chưa quản lý được người dùng, thông tin nhà sản xuất, cập nhật giá sản phẩm, quản lý sản phẩm... Nắm bắt được tình hình trên em tiến hành thiết kế trang web mua bán hàng online để mong sao giúp cho các cửa hàng phát triển nhanh hơn, giúp cho chủ cửa hàng có thể quản lý cửa hàng của mình một cách tốt hơn. 1.2. Giới thiệu các ngôn ngữ lập trình 1.2.1. Ngôn ngữ HTML Ngôn ngữ HTML (HyperText Markup Language – ngôn ngữ siêu văn bản) là một trong các loại ngôn ngữ được sử dụng trong lập trình web. Khi truy cập một trang web cụ thể là click vào các đường link, bạn sẽ được dẫn tới nhiều trang các nhau và các trang này được gọi là một tài liệu HTML (tập tin HTML). Một trang HTML như vậy được cấu thành bởi nhiều phần tử HTML nhỏ và được quy định bằng các thẻ tag. Bạn có thể phân biệt một trang web được viết bằng ngôn ngữ HTML hay PHP thông qua đường link của nó. Ở cuối các trang HTML thường hay có đuôi là HTML hoặc HTM. 4 Hình 1.1: Mô hình của HTML Một trang HTML được cấu thành bởi nhiều phần tử HTML nhỏ và được quy định bằng các thẻ tag. HTML là ngôn ngữ lập trình web được đánh giá là đơn giản. Mọi trang web, mọi trình duyệt web đều có thể hiển thị tốt ngôn ngữ HTML. Hiện nay, phiên bản mới nhất của HTML là HTML 5 với nhiều tính năng tốt và chất lượng hơn so với các phiên bản HTML cũ. Vậy, đối với các website, ngôn ngữ HTML đóng vai trò như thế nào? HTML, theo đúng nghĩa của nó, là một loại ngôn ngữ đánh dấu siêu văn bản, thế nên các chức năng của nó cũng xoay quanh yếu tố này. Cụ thể, HTML giúp cấu thành các cấu trúc cơ bản trên một website (chia khung sườn, bố cục các thành phần trang web) và góp phần hỗ trợ khai báo các tập tin kĩ thuật số như video, nhạc, hình ảnh. Hình 1.2: Mô hình hoạt động JavaScript, CSS, HTML Ưu điểm nổi trội nhất và cũng là thế mạnh của HTML là khả năng xây dựng cấu trúc và khiến trang web đi vào quy cũ một hệ thống hoàn chỉnh. Nếu bạn mong muốn sở hữu một website có cấu trúc tốt có mục đích sử dụng nhiều loại yếu tố 5 trong văn bản, hãy hỏi HTML. Nhiều ý kiến cho rằng tùy theo mục đích sử dụng mà lập trình viên hay người dùng có thể lựa chọn ngôn ngữ lập trình riêng cho website của bạn, tuy nhiên thực chất HTML chứa những yếu tố cần thiết mà dù website của bạn có thuộc thể loại nào, giao tiếp với ngôn ngữ lập trình nào để xử lý dữ liệu thì nó vẫn phải cần đến ngôn ngữ HTML để hiển thị nội dung cho người truy cập. Nói đúng hơn, dù website của bạn được xây dựng như thế nào, trên nền tảng nào thì nó cũng cần đến sự hỗ trợ của HTML, dù ít dù nhiều. Đối với các lập trình viên hay nhà phát triển web, họ đều phải học HTML như một loại ngôn ngữ cơ bản trước khi bắt tay vào thiết kế trang web nào. Cấu trúc cơ bản của một trang HTML Cấu trúc cơ bản của HTML Cấu trúc cơ bản của trang HTMLXHTML có dạng như sau, thường gồm 3 phần: : Phần khai báo chuẩn của html hay xhtml. : Phần khai báo ban đầu, khai báo về meta, title, CSS, javascript... : Phần chứa nội dung của trang web, nơi hiển thị nội dung.  Cấu trúc cơ bản Tiêu đề trang web ...Phần thân viết ở đây... Cấu trúc cơ bản của trang web Mỗi trang web đều có cách thể hiện cấu trúc khác nhau, có trang 1 cột, có trang 2 và cũng có trang chứa nhiều cột, bên dưới đây chúng ta tham khảo một trang đơn giản sử dụng 2 cột để layout. 6  Phần đầu: header, có thể chứa logo, câu slogan, các liên kết, các banner liên kết, các button, đoạn flash, hoặc các form ngắn như form tìm kiếm...  Phần liên kết toàn cục: global navigation, dùng để chứa các liên kết đến những trang quan trọng trong toàn bộ trang, trong phần này có thể chứa thêm các liên kết con (Sub Navigation).  Phần thân của trang: page body, phần này chứa phần nội dung chính (Content) và phần nội dung phụ (Sidebar).  Phần nội dung chính: content, phần này chứa nội dung chính cần thể hiện cho người dùng xem.  Phần nội dung phụ: sidebar, phần này có thể chứa liên kết phụ của từng trang (Local Navigation), hoặc các banner chứa liên kết liên quan, hoặc có thể dùng để chứa các liên kết quảng cáo...  Phần cuối trang web: footer, phần này thường chưa phân liên hệ như: tên công ty, địa chỉ, số điện thoại, mail liên hệ,... và đặc biệt là copyright, hoặc có thể chứa các liên kết toàn trang, các banner liên kết... Hình 1.3: Mô hình cấu trúc cơ bản của trang HTML 7 1.2.1.1. Các thẻ HTML cơ bản Thẻ ...: Tạo đầu mục trang Thẻ ...: Tạo tiêu đề trang trên thanh tiêu đề, đây là thẻ bắt buộc. Thẻ title cho phép bạn trình bày chuỗi trên thanh tựa đề của trang Web mỗi khi trang Web đó được duyệt trên trình duyệt Web. Thẻ …: Tất cả các thông tin khai báo trong thẻ đều có thể xuất hiện trên trang Web. Những thông tin này có thể nhìn thấy trên trang Web. Các thẻ định dạng khác. Thẻ

...

: Tạo một đoạn mới. Thẻ ...: Thay đổi phông chữ , kích cỡ và màu kí tự... Thẻ định dạng bảng ...: Đây là thẻ định dạng bảng trên trang Web. Sau khi khai báo thẻ này, bạn phải khai báo các thẻ hàng và thẻ cột cùng với các thuộc tính của nó. Thẻ hình ảnh : Cho phép bạn chèn hình ảnh vào trang Web. Thẻ này thuộc loại thẻ không có thể đóng. Thẻ liên kết ...: Là loại thẻ dùng để liên kết giữa các trang Web hoặc liên kết đến địa chỉ Internet, Mail hay Intranet (URL) và địa chỉ trong tập tin trong mạng cục bộ (UNC). Bạn đã gửi Hôm nay lúc 13:39 Các thẻ Input: Thẻ Input cho phép người dùng nhập dữ liệu hay chỉ thị thực thi một hành động nào đó, thẻ Input bao gồm các loại thẻ như: text, password, submit button, reset, checkbox, radio, image. The Textarea: ....: The Textarea cho phép người dùng nhập liệu với rất nhiều dòng. Với thẻ này bạn không thể giới hạn chiều dài lớn nhất trên trang Web. Thẻ Select: Thẻ Select cho phép người dùng chọn phần tử trong tập phương thức đã được định nghĩa trước. Nếu thẻ Select cho phép người dùng chọn một phần tử trong danh sách phần tử thì thẻ Select sẽ giống như combobox. Nếu thẻ Select cho phép người dùng chọn nhiều phần tử cùng một lần trong danh sách phần tử, thẻ Select đó là dạng listbox. Thẻ Form: Khi bạn muốn submit dữ liệu người dùng nhập từ trang web phía Client 8 lên phía Server, bạn có hai cách để làm điều nàu ứng với hai phương thức POST và GET trong thẻ form. Trong một trang Web có thể có nhiều thẻ Form khác nhau, nhưng các thẻ Form này không được lồng nhau, mỗi thẻ form sẽ được khai bảo hành động (Action) chỉ đến một trang khác. 1.2.2. Ngôn ngữ CSS 1.2.2.1 Định nghĩa CSS CSS là viết tắt của Cascading Style Sheets. Đây là một ngôn ngữ style sheet được sử dụng để mô tả giao diện và định dạng của một tài liệu viết bằng ngôn ngữ đánh dấu (Markup). Nó cung cấp một tính năng bổ sung cho HTML. Nó thường được sử dụng với HTML để thay đổi phong cách của trang web và giao diện người dùng. Nó cũng có thể được sử dụng với bất kỳ loại tài liệu XML nào bao gồm cả XML đơn giản, SVG và XUL. CSS được sử dụng cùng với HTML và JavaScript trong hầu hết các trang web để tạo giao diện người dùng cho các ứng dụng web và giao diện người dùng cho nhiều ứng dụng di động.  CSS làm được những gì? Bạn có thể thêm giao diện mới vào các tài liệu HTML cũ. Bạn hoàn toàn có thể thay đổi giao diện trang web của mình chỉ với một vài thay đổi trong mã CSS. 1.2.2.2 Cú pháp của CSS Bộ quy tắc CSS chứa selector và khối khai báo. Hình 1.4: Mô hình cú pháp của CSS. Selector: Bộ chọn cho biết phần tử HTML bạn muốn tạo kiểu cách. Nó có thể là bất kỳ thẻ nào như , ,... Declaration Block: Khối khai báo có thể chứa một hoặc nhiều khai báo được phân cách bởi dấu chấm phẩy (;). Đối với ví dụ trên, có hai khai báo: 9 1. color: yellow; 2. font-size: 11 px; Mỗi khai báo chứa một tên thuộc tính và giá trị, được phân cách bởi dấu hai chấm. Property: Một property là một kiểu của thuộc tính của phần tử HTML. Nó có thể là color, border,... Value: Các giá trị được gán cho thuộc tính CSS. Trong ví dụ trên, giá trị “yellow” được gán cho thuộc tính color. Selector{Propertyl: valuel; Property2: value2; .........;} 1.2.2.3 Tại sao phải sử dụng CSS Đây là ba lợi ích chính của CSS:  Giải quyết một vấn đề lớn Trước khi có CSS, các thẻ như phông chữ, màu sắc, kiểu nền, các sắp xếp phần tử, đường viền và kích thước phải được lặp lại trên mọi trang web. Đây là một quá trình rất dài tốn thời gian và công sức. Ví dụ: Nếu bạn đang phát triển một trang web lớn nơi phông chữ và thông tin màu được thêm vào mỗi trang, nó sẽ trở thành một quá trình dài và tốn kém. CSS đã được tạo ra để giải quyết vấn đề này. Đó là một khuyến cáo của W3C.  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.  Cung cấp thêm các thuộc tính CSS cung cấp các thuộc tính chi tiết hơn HTML để định nghĩa giao diện của trang web. Các điểm chính của CSS được đưa ra dưới đây: CSS là viết tắt của Cascading Style Sheet. CSS được sử dụng để thiết kế các thẻ HTML. CSS là một ngôn ngữ được sử dụng rộng rãi trên web. HTML, CSS và JavaScript được sử dụng để thiết kế web. Nó giúp các nhà thiết kế web áp dụng phong cách trên các thẻ HTML.  Ví dụ về CSS 10 h1 { color:white; background-color:00eeee; padding:5px; } p{ color:blue; } Write Your First CSS Example

This is Paragraph

1.2.3. Ngôn ngữ PHP 1.2.3.1. Khái niệm PHP PHP (viết tắt hồi quy “PHP: Hypertext Preprocessor”) là một ngôn ngữ lập trình kịch bản hay một loại mã lệnh chủ yếu được dùng để phát triển các ứng dụng viết cho máy chủ, mã nguồn mở, dùng cho mục đích tổng quát. Nó rất thích hợp với web và có thể dễ dàng nhúng vào trang HTML. Do được tối ưu hóa cho các ứng dụng web, tốc độ nhanh, nhỏ gọn, cú pháp giống C và Java, dễ học và thời gian xây dựng sản phẩm tương đối ngắn hơn so với các ngôn ngữ khác nên PHP đã nhanh chóng trở thành một ngôn ngữ lập trình web phổ biến nhất thế giới. Như đã giới thiệu, PHP là ngôn ngữ máy chủ, mã lệnh PHP sẽ tập trung trên máy chủ để phục vụ các trang Web theo yêu cầu của người dùng thông qua trình duyệt. Khi người dùng truy cập website viết bằng PHP, máy chủ đọc mã lệnh PHP và xử lý chúng theo các hướng dẫn đã được mã hóa. 11 Khác với Website HTML tĩnh ở chỗ: khi có một yêu cầu, máy chủ chỉ đơn thuần gửi dữ liệu HTML đến trình duyệt Web và không xảy ra một sự biến dịch nào từ phía máy chủ. Đối với người dùng cuối và trên trình duyệt web, các trang home. html và home. php trong tương tự như nhau, nhưng thực chất nội dung của trang được tạo theo các cách khác nhau. - Ưu điểm khi dùng PHP + Dùng mã nguồn mở (có thể chạy trên Apache hoặc IIS). + Phổ biến hơn ASP (có thể thấy dựa vào số website dùng PHP). + Dễ học khi đã biết HTML, C. + Dựa vào XAMP (dễ cấu hình). + Nhiều hệ thống CMS miễn phí dùng. + Đi cặp với MYSQL + Hoạt động trên Linux, có thể trên IIS - Windows - Nhược điểm : + Mã nguồn không đẹp. + Chỉ chạy trên ứng dụng web. 1.2.3.2 Cú pháp của PHP a. Nhúng mã PHP vào HTML Cách thông dụng sau để nhúng mã PHP Ví dụ: Các bạn có thể chèn mã này sen kẽ các tag của html hoặc có thể từ mã này echo (in) ra các html theo ý muốn Ví dụ: tôi có thể sử dụng 2 cách như sau hoặc VD01 Câu lệnh của php cũng giống như trong lập trình C kết thúc bởi dấu chấm phẩy ";" b. Chú thích trong PHP PHP hỗ trợ các kiểu chú giải như của C, C++ Ví dụ: Về cơ bản ngôn ngữ lập trình php là ngôn ngữ dễ sử dụng, thông dụng hiện này. Cú pháp PHP chính là cú pháp trong ngôn ngữ C, các bạn làm quen với ngôn ngữ C thì có lợi thế trong lập trình PHP. Để lập trình bằng ngôn ngữ PHP cần chú ý những điểm sau: 1. Cuối câu lệnh có dấu; 2. Biến trong PHP có tiền tố là 3. Mỗi phương thức đều bắt đầu {và đóng bằng dấu} 4. Khi khai báo biến thì không có kiễu dữ liệu 5. Nên có giá trị khởi đầu cho biến khai báo 13 6. Phải có chi chú (Comment) cho mỗi feature mới 7. Sử dụng dấu hoặc để giải thích cho mỗi câu ghi chú 8. Sử dụng và cho mỗi đoạn ghi chú 9. Khai báo biến có phân biệt chữ hoa hay thường c. Khai báo biến Khi thực hiện khai báo biến trong C, bạn cần phải biết tuân thủ quy định như: kiễu dữ liệu trước tên biến và có giá trị khởi đầu, tuy nhiên khi làm việc với PHP thì không cần khai báo kiểu dữ liệu nhưng sử dụng tiền tố trước biến. Xuất phát từ những điều ở trên, khai báo biến trong PHP như sau: tenbien =giá trị; dem=0; đếm strSql = "Select from sanpham where hienthi=1"; mang = array("Họ", "Tên", "cơ quan"); kiemtra = false; Code đầy đủ Tự học PHP Biến 1.3. Một số thư viện hỗ trợ 1.3.1. Thư viện Javascript 1.3.1.1. Giới thiệu JavaScript, theo phiên bản hiện hành, là một ngôn ngữ lập trình thông dịch được phát triển từ các ý niệm nguyên mẫu. Ngôn ngữ này được dùng rộng rãi cho các trang web (phía người dùng) cũng như phía máy chủ (với Nodejs). Nó vốn được phát triển bởi Brendan Eich tại Hãng truyền thông Netscape với cái tên đầu tiên Mocha, rồi sau đó đổi tên thành LiveScript, và cuối cùng thành JavaScript. Giống Java, JavaScript có cú pháp tương tự C, nhưng nó gần với Self hơn Java. js là phần mở rộng thường được dùng cho tập tin mã nguồn JavaScript. Cũng giống như C, JavaScript không có bộ xử lý xuất nhập (input output) riêng. Trong khi C sử dụng thư viện xuất nhập chuẩn, JavaScript dựa vào phần mềm ngôn ngữ được gắn vào để thực hiện xuất nhập. Trên trình duyệt, rất nhiều trang web sử dụng JavaScript để thiết kế trang web động và một số hiệu ứng hình ảnh thông qua DOM. JavaScript được dùng để thực hiện một số tác vụ không thể thực hiện được với chỉ HTML như kiểm tra thông tin nhập vào, tự động thay đổi hình ảnh... Tuy nhiên, mỗi trình duyệt áp dụng JavaScript khác nhau và không tuân theo chuẩn W3C DOM, do đó trong rất nhiều trường hợp lập trình viên phải viết nhiều phiên bản của cùng một đoạn mã nguồn để có thể hoạt động trên nhiều trình duyệt. Một số công nghệ nổi bật dùng JavaScript để tương tác với DOM bao gồm DHTML, Ajax và SPA. Bên ngoài trình duyệt, JavaScript có thể được sử dụng trong tập tin PDF của Adobe Acrobat vả Adobe Reader. Điều khiển Dashboard trên hệ điều hành MacOS X phiên bản 10.4 cũng có sử dụng JavaScript Từ khi Nodejs ra đời vào năm 2009, Javascript được biết đến nhiều hơn là một ngôn ngữ đa nền khi có thể chạy trên cả môi trường máy chủ cũng như môi trường nhúng. Mỗi ứng dụng này đều cung cấp mô hình đối tượng riêng cho phép tương tác với môi trường chủ, với phần lõi là ngôn ngữ lập trình JavaScript gần giống nhau. JavaScript có rất nhiều ưu điểm 15 khiến nó vượt trội hơn so với các đối thủ, đặc biệt trong các trường hợp thực tế. Sau đây chỉ là một số lợi ích của JavaScript: - Chúng ta không cần một compiler vì web browser có thể biên dịch nó bằng HTML: Nó dễ học hơn các ngôn ngữ lập trình khác; - Lỗi dễ phát hiện hơn và vì vậy dễ sửa hơn; Nó có thể được gắn trên một số element của trang web hoặc event của trang web như là thông qua click chuột hoặc di chuột tới; JS hoạt động trên nhiều trình duyệt, nền tảng; Chúng ta có thể sử dụng JavaScript để kiểm tra input và giảm thiểu việc kiểm tra thủ công khi truy xuất qua database: Nó giúp website tương tác tốt hơn với khách truy cập: Nó nhanh hơn và nhẹ hơn các ngôn ngữ lập trình khác. Mọi ngôn ngữ lập trình đều có các khuyết điểm. Một phần là vì ngôn ngữ đó khi phát triển đến một mức độ như JavaScript, nó cũng sẽ thu hút lượng lớn hacker, scammer, và những người có ác tâm luôn tìm kiếm những lỗ hổng và các lỗi bảo mật để lợi dụng nó. Một số khuyết điểm có thể kể đến là: Dễ bị khai thác; Có thể được dùng để thực thi mã độc trên máy tính của người dùng: - Nhiều khi không được hỗ trợ trên mọi trình duyệt; - JS code snippets lớn; - Có thể bị triển khai khác nhau tùy từng thiết bị dẫn đến việc không đồng nhất. 1.3.1.2. Cách nhúng Javascript vào trong tập tin HTML ...

NỘI DUNG NGHIÊN CỨU

Việc kinh doanh mua bán là nhu cầu không thể thiếu đối với mọi chúng ta Trong thời đại cạnh tranh hiện nay việc giới thiệu sản phẩm kinh doanh đến từng cá nhân với chi phí thấp, hiệu quả cao là một vấn đề nan giải của người kinh doanh cùng với nhu cầu mua sắm với những sản phẩm đa chủng loại, đạt chất lượng, và hợp túi tiền của người tiêu dùng vì vậy thương mại điện tử đã được ra đời và dần dần phát triển trên toàn thế giới Việc phổ biến các sản phẩm của cửa hàng kinh doanh đến khách hàng thông qua các bảng báo giá tuy nhiên chi phí khá cao vì số lượng sản phẩm ngày một đa dạng và giá cả thay đổi liên tục và tính phổ biến không cao chưa đáp ứng được nhu cầu người dùng Mặt khác của hàng còn gặp nhiều khó khăn như chưa quản lý được người dùng, thông tin nhà sản xuất, cập nhật giá sản phẩm, quản lý sản phẩm Nắm bắt được tình hình trên em tiến hành thiết kế trang web mua bán hàng online để mong sao giúp cho các cửa hàng phát triển nhanh hơn, giúp cho chủ cửa hàng có thể quản lý cửa hàng của mình một cách tốt hơn

1.2 Giới thiệu các ngôn ngữ lập trình

Ngôn ngữ HTML (HyperText Markup Language – ngôn ngữ siêu văn bản) là một trong các loại ngôn ngữ được sử dụng trong lập trình web Khi truy cập một trang web cụ thể là click vào các đường link, bạn sẽ được dẫn tới nhiều trang các nhau và các trang này được gọi là một tài liệu HTML (tập tin HTML)

Một trang HTML như vậy được cấu thành bởi nhiều phần tử HTML nhỏ và được quy định bằng các thẻ tag Bạn có thể phân biệt một trang web được viết bằng ngôn ngữ HTML hay PHP thông qua đường link của nó Ở cuối các trang HTML thường hay có đuôi là HTML hoặc HTM.

CƠ SỞ LÝ THUYẾT

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

Việc kinh doanh mua bán là nhu cầu không thể thiếu đối với mọi chúng ta Trong thời đại cạnh tranh hiện nay việc giới thiệu sản phẩm kinh doanh đến từng cá nhân với chi phí thấp, hiệu quả cao là một vấn đề nan giải của người kinh doanh cùng với nhu cầu mua sắm với những sản phẩm đa chủng loại, đạt chất lượng, và hợp túi tiền của người tiêu dùng vì vậy thương mại điện tử đã được ra đời và dần dần phát triển trên toàn thế giới Việc phổ biến các sản phẩm của cửa hàng kinh doanh đến khách hàng thông qua các bảng báo giá tuy nhiên chi phí khá cao vì số lượng sản phẩm ngày một đa dạng và giá cả thay đổi liên tục và tính phổ biến không cao chưa đáp ứng được nhu cầu người dùng Mặt khác của hàng còn gặp nhiều khó khăn như chưa quản lý được người dùng, thông tin nhà sản xuất, cập nhật giá sản phẩm, quản lý sản phẩm Nắm bắt được tình hình trên em tiến hành thiết kế trang web mua bán hàng online để mong sao giúp cho các cửa hàng phát triển nhanh hơn, giúp cho chủ cửa hàng có thể quản lý cửa hàng của mình một cách tốt hơn.

Giới thiệu các ngôn ngữ lập trình

Ngôn ngữ HTML (HyperText Markup Language – ngôn ngữ siêu văn bản) là một trong các loại ngôn ngữ được sử dụng trong lập trình web Khi truy cập một trang web cụ thể là click vào các đường link, bạn sẽ được dẫn tới nhiều trang các nhau và các trang này được gọi là một tài liệu HTML (tập tin HTML)

Một trang HTML như vậy được cấu thành bởi nhiều phần tử HTML nhỏ và được quy định bằng các thẻ tag Bạn có thể phân biệt một trang web được viết bằng ngôn ngữ HTML hay PHP thông qua đường link của nó Ở cuối các trang HTML thường hay có đuôi là HTML hoặc HTM

Hình 1.1: Mô hình của HTML Một trang HTML được cấu thành bởi nhiều phần tử HTML nhỏ và được quy định bằng các thẻ tag

HTML là ngôn ngữ lập trình web được đánh giá là đơn giản Mọi trang web, mọi trình duyệt web đều có thể hiển thị tốt ngôn ngữ HTML Hiện nay, phiên bản mới nhất của HTML là HTML 5 với nhiều tính năng tốt và chất lượng hơn so với các phiên bản HTML cũ

Vậy, đối với các website, ngôn ngữ HTML đóng vai trò như thế nào? HTML, theo đúng nghĩa của nó, là một loại ngôn ngữ đánh dấu siêu văn bản, thế nên các chức năng của nó cũng xoay quanh yếu tố này Cụ thể, HTML giúp cấu thành các cấu trúc cơ bản trên một website (chia khung sườn, bố cục các thành phần trang web) và góp phần hỗ trợ khai báo các tập tin kĩ thuật số như video, nhạc, hình ảnh

Hình 1.2: Mô hình hoạt động JavaScript, CSS, HTML Ưu điểm nổi trội nhất và cũng là thế mạnh của HTML là khả năng xây dựng cấu trúc và khiến trang web đi vào quy cũ một hệ thống hoàn chỉnh Nếu bạn mong muốn sở hữu một website có cấu trúc tốt có mục đích sử dụng nhiều loại yếu tố trong văn bản, hãy hỏi HTML Nhiều ý kiến cho rằng tùy theo mục đích sử dụng mà lập trình viên hay người dùng có thể lựa chọn ngôn ngữ lập trình riêng cho website của bạn, tuy nhiên thực chất HTML chứa những yếu tố cần thiết mà dù website của bạn có thuộc thể loại nào, giao tiếp với ngôn ngữ lập trình nào để xử lý dữ liệu thì nó vẫn phải cần đến ngôn ngữ HTML để hiển thị nội dung cho người truy cập Nói đúng hơn, dù website của bạn được xây dựng như thế nào, trên nền tảng nào thì nó cũng cần đến sự hỗ trợ của HTML, dù ít dù nhiều Đối với các lập trình viên hay nhà phát triển web, họ đều phải học HTML như một loại ngôn ngữ cơ bản trước khi bắt tay vào thiết kế trang web nào

Cấu trúc cơ bản của một trang HTML

Cấu trúc cơ bản của HTML

Cấu trúc cơ bản của trang HTML/XHTML có dạng như sau, thường gồm 3 phần:

: Phần khai báo chuẩn của html hay xhtml

: Phần khai báo ban đầu, khai báo về meta, title, CSS, javascript

: Phần chứa nội dung của trang web, nơi hiển thị nội dung

Tiêu đề trang web

Cấu trúc cơ bản của trang web

Mỗi trang web đều có cách thể hiện cấu trúc khác nhau, có trang 1 cột, có trang 2 và cũng có trang chứa nhiều cột, bên dưới đây chúng ta tham khảo một trang đơn giản sử dụng 2 cột để layout

 Phần đầu: header, có thể chứa logo, câu slogan, các liên kết, các banner liên kết, các button, đoạn flash, hoặc các form ngắn như form tìm kiếm

 Phần liên kết toàn cục: global navigation, dùng để chứa các liên kết đến những trang quan trọng trong toàn bộ trang, trong phần này có thể chứa thêm các liên kết con (Sub Navigation)

 Phần thân của trang: page body, phần này chứa phần nội dung chính

(Content) và phần nội dung phụ (Sidebar)

 Phần nội dung chính: content, phần này chứa nội dung chính cần thể hiện cho người dùng xem

 Phần nội dung phụ: sidebar, phần này có thể chứa liên kết phụ của từng trang (Local Navigation), hoặc các banner chứa liên kết liên quan, hoặc có thể dùng để chứa các liên kết quảng cáo

 Phần cuối trang web: footer, phần này thường chưa phân liên hệ như: tên công ty, địa chỉ, số điện thoại, mail liên hệ, và đặc biệt là copyright, hoặc có thể chứa các liên kết toàn trang, các banner liên kết

Hình 1.3: Mô hình cấu trúc cơ bản của trang HTML

1.2.1.1 Các thẻ HTML cơ bản

• Thẻ : Tạo đầu mục trang

Thẻ đóng vai trò tạo tiêu đề trang trên thanh tiêu đề của trình duyệt, đây là thẻ bắt buộc phải có Thẻ title cho phép hiển thị chuỗi mong muốn trên thanh tiêu đề trang web mỗi khi người dùng duyệt trang web đó trên trình duyệt web.

• Thẻ …: Tất cả các thông tin khai báo trong thẻ đều có thể xuất hiện trên trang Web Những thông tin này có thể nhìn thấy trên trang Web

• Các thẻ định dạng khác Thẻ

: Thay đổi phông chữ , kích cỡ và màu kí tự

• Thẻ định dạng bảng : Đây là thẻ định dạng bảng trên trang Web Sau khi khai báo thẻ này, bạn phải khai báo các thẻ hàng và thẻ cột

cùng với các thuộc tính của nó

• Thẻ hình ảnh : Cho phép bạn chèn hình ảnh vào trang Web Thẻ này thuộc loại thẻ không có thể đóng

• Thẻ liên kết : Là loại thẻ dùng để liên kết giữa các trang Web hoặc liên kết đến địa chỉ Internet, Mail hay Intranet (URL) và địa chỉ trong tập tin trong mạng cục bộ (UNC)

Bạn đã gửi Hôm nay lúc 13:39

• Các thẻ Input: Thẻ Input cho phép người dùng nhập dữ liệu hay chỉ thị thực thi một hành động nào đó, thẻ Input bao gồm các loại thẻ như: text, password, submit button, reset, checkbox, radio, image

• The Textarea: : The Textarea cho phép người dùng nhập liệu với rất nhiều dòng Với thẻ này bạn không thể giới hạn chiều dài lớn nhất trên trang Web

Một số thư viện hỗ trợ

JavaScript, theo phiên bản hiện hành, là một ngôn ngữ lập trình thông dịch được phát triển từ các ý niệm nguyên mẫu Ngôn ngữ này được dùng rộng rãi cho các trang web (phía người dùng) cũng như phía máy chủ (với Nodejs) Nó vốn được phát triển bởi Brendan Eich tại Hãng truyền thông Netscape với cái tên đầu tiên Mocha, rồi sau đó đổi tên thành LiveScript, và cuối cùng thành JavaScript Giống Java, JavaScript có cú pháp tương tự C, nhưng nó gần với Self hơn Java js là phần mở rộng thường được dùng cho tập tin mã nguồn JavaScript Cũng giống như C, JavaScript không có bộ xử lý xuất nhập (input/ output) riêng Trong khi C sử dụng thư viện xuất nhập chuẩn, JavaScript dựa vào phần mềm ngôn ngữ được gắn vào để thực hiện xuất nhập Trên trình duyệt, rất nhiều trang web sử dụng JavaScript để thiết kế trang web động và một số hiệu ứng hình ảnh thông qua DOM JavaScript được dùng để thực hiện một số tác vụ không thể thực hiện được với chỉ HTML như kiểm tra thông tin nhập vào, tự động thay đổi hình ảnh Tuy nhiên, mỗi trình duyệt áp dụng JavaScript khác nhau và không tuân theo chuẩn W3C DOM, do đó trong rất nhiều trường hợp lập trình viên phải viết nhiều phiên bản của cùng một đoạn mã nguồn để có thể hoạt động trên nhiều trình duyệt Một số công nghệ nổi bật dùng JavaScript để tương tác với DOM bao gồm DHTML, Ajax và SPA

Bên ngoài trình duyệt, JavaScript có thể được sử dụng trong tập tin PDF của Adobe Acrobat vả Adobe Reader Điều khiển Dashboard trên hệ điều hành MacOS

X phiên bản 10.4 cũng có sử dụng JavaScript Từ khi Nodejs ra đời vào năm 2009, Javascript được biết đến nhiều hơn là một ngôn ngữ đa nền khi có thể chạy trên cả môi trường máy chủ cũng như môi trường nhúng Mỗi ứng dụng này đều cung cấp mô hình đối tượng riêng cho phép tương tác với môi trường chủ, với phần lõi là ngôn ngữ lập trình JavaScript gần giống nhau JavaScript có rất nhiều ưu điểm khiến nó vượt trội hơn so với các đối thủ, đặc biệt trong các trường hợp thực tế Sau đây chỉ là một số lợi ích của JavaScript:

- Chúng ta không cần một compiler vì web browser có thể biên dịch nó bằng HTML: Nó dễ học hơn các ngôn ngữ lập trình khác;

- Lỗi dễ phát hiện hơn và vì vậy dễ sửa hơn; Nó có thể được gắn trên một số element của trang web hoặc event của trang web như là thông qua click chuột hoặc di chuột tới; JS hoạt động trên nhiều trình duyệt, nền tảng; Chúng ta có thể sử dụng JavaScript để kiểm tra input và giảm thiểu việc kiểm tra thủ công khi truy xuất qua database: Nó giúp website tương tác tốt hơn với khách truy cập: Nó nhanh hơn và nhẹ hơn các ngôn ngữ lập trình khác Mọi ngôn ngữ lập trình đều có các khuyết điểm Một phần là vì ngôn ngữ đó khi phát triển đến một mức độ như JavaScript, nó cũng sẽ thu hút lượng lớn hacker, scammer, và những người có ác tâm luôn tìm kiếm những lỗ hổng và các lỗi bảo mật để lợi dụng nó Một số khuyết điểm có thể kể đến là: Dễ bị khai thác; Có thể được dùng để thực thi mã độc trên máy tính của người dùng:

- Nhiều khi không được hỗ trợ trên mọi trình duyệt;

- Có thể bị triển khai khác nhau tùy từng thiết bị dẫn đến việc không đồng nhất

1.3.1.2 Cách nhúng Javascript vào trong tập tin HTML

Bạn có thể nhúng JavaScript vào một file HTML theo một trong hai cách chủ yếu sau đây:

 Dùng cặp thẻ để nhúng JavaScript vào file HTML

 Dùng thẻ link để nhúng JavaScript vào file HTML (Viết file riêng có đuôi js)

Hình 1.5: Mô hình của Javascript Cách 1 : Dùng cặp thẻ Script để viết js trong cùng HTML

Cặp thẻ Script ta có thể đặt ở trong cặp thẻ hoặc

alert(“aaa”)

Ở ví dụ trên là ta đang để Script ở trong thẻ head Trong một file HTML có thể viết nhiều đoạn Script, bạn có thể cho nó ở trong cặp thẻ cũng được Để sao cho ta quản lý file một cách thuận tiện nhất

Thuộc tính type: thuộc tính này không bắt buộc Không có cũng không sao Js tự mặc định sẵn trong HTML

Cách 2: Dùng link để gọi file js riêng

Js được đặt ở một file riêng biệt vs html Đuôi js

Thuộc tính src để đặt đường dẫn file js

Trong file js riêng không được chứa cặp thẻ

Giống như nhiều ngôn ngữ chương trình khác, JavaScript có các biến Biến có thể được xem là một nơi chứa (Container) được đặt tên Bạn có thể đặt dữ liệu vào trong nơi chứa này và sau đó tham chiếu đến dữ liệu này một cách đơn giản là đặt tên cho nơi chứa

Trước khi bạn sử dụng một biến trong chương trình JavaScript, bạn phải khai báo nó Biến được khai báo với từ khóa var như sau:

Bạn cũng có thể khai báo nhiều biến với cùng từ khóa var như sau:

Lưu giữ một giá trị trong một biến được gọi là khởi tạo biến Bạn có thể khởi tạo biến tại thời điểm tạo biến hoặc tại thời điểm sau khi bạn cần biến đó

Ví dụ: bạn có thể tạo một biến tên money và gán giá trị 2000.50 cho nó sau đó Với biến khác, bạn có thể gán một giá trị tại thời điểm khởi tạo như sau:

Khi sử dụng từ khóa `var` trong JavaScript, chỉ nên khai báo hoặc khởi tạo biến một lần cho mỗi tên biến duy nhất trong tệp Việc khai báo lại biến cùng tên nhiều lần là không cần thiết và có thể gây lỗi.

1.3.1.4 Các câu lệnh trong javaScript

Câu lệnh dưới đây nói cho trình duyệt hãy ghi dòng “Blog Kiến càng” vào phần tử HTML có id=”website”

Document.getElementById(“website”).innerHTML= “Blog kiến càng”;

Tổng quan MySQL

MySQL là hệ quản trị cơ sở dữ liệu mã nguồn mở miễn phí nằm trong nhóm LAMP (Linux – Apache -MySQL – PHP) >< Microsoft (Windows, IIS, SQL Server, ASP/ASP.NET), vì MySQL được tích hợp sử dụng chung với apache, PHP nên nó phổ biến nhất thế giới Vì MySQL ổn định và dễ sử dụng (đối với tui thì ko chắc, có tính khả chuyển, hoạt động trên nhiều hệ điều hành cung cấp một hệ thống lớn các hàm tiện ích rất mạnh và Mysql cũng có cùng một cách truy xuất và mã lệnh tương tự với ngôn ngữ SQL chính vì thế nên MySQL được sử dụng và hỗ trợ của những lập trình viên yêu thích mã nguồn mở Nhưng Mysql không bao quát toàn bộ những câu truy vấn cao cấp như SQL Server Vì vậy Mysql chỉ đáp ứng việc truy xuất đơn giản trong quá trình vận hành của website, thích hợp cho các ứng dụng có truy cập CSDL trên internet và có thể giải quyết hầu hết các bài toán trong PHP, Perl MySQL miễn phí hoàn toàn cho nên bạn có thể tải về MySQL từ trang chủ

Nó có nhiều phiên bản cho các hệ điều hành khác nhau: phiên bản Win32 cho các hệ điều hành dòng Windows, Linux, MacOSX, Unix, FreeBSD, NetBSD, Novell NetWare, SGI Irix, Solaris, SunOS

MySQL là một hệ thống quản lý cơ sở dữ liệu quan hệ sử dụng ngôn ngữ truy vấn có cấu trúc (SQL) Là một trong những ví dụ cơ bản về hệ thống quản lý cơ sở dữ liệu, MySQL giúp người dùng truy xuất và quản lý dữ liệu hiệu quả, phục vụ cho nhiều mục đích sử dụng khác nhau.

Hình 1.6: Mô hình của MySQL

Sự linh hoạt về flatform là 1 đặc tính nổi bật của MySQL với các phiên bản đang được hỗ trợ của Linux, Unix, Windows, MySQL,

Các chuyên gia cơ sở dữ liệu có thể cấu hình máy chủ cơ sở dữ liệu MySQL đặc trưng cho các ứng dụng đặc thù thông qua kiến trúc storage - engine MySQL có thể đáp ứng khả năng xử lý những yêu cầu khắt khe nhất của từng hệ thống,

MySQL còn đưa ra các “công cụ” cần thiết cho các hệ thống doanh nghiệp khó tính bằng tiện ích tải tốc độ cao, bộ nhớ cache và các cơ chế xử lý nâng cao khác

Các tiêu chuẩn đảm bảo của MySQL là yếu tố quan trọng mang lại sự an tâm cho người dùng lựa chọn sử dụng hệ quản trị cơ sở dữ liệu này MySQL cung cấp nhiều tùy chọn và giải pháp khác nhau phù hợp với nhu cầu của người dùng, giúp triển khai và sử dụng ngay máy chủ cơ sở dữ liệu MySQL dễ dàng và hiệu quả.

MySQL hỗ trợ giao dịch mạnh 1 cách tự động, thống nhất, độc lập và bền vững, ngoài ra khả năng giao dịch cũng được phân loại và hỗ trợ giao dịch đa dạng mà người viết không gây trở ngại cho người đọc và ngược lại

 Nơi tin cậy để lưu trữ web và dữ liệu

Với khả năng xử lý dữ liệu nhanh chóng cùng engine hiệu suất cao, MySQL được coi là lựa chọn lý tưởng cho ứng dụng web và ứng dụng web doanh nghiệp.

Doanh nghiệp nào cũng cần tính năng bảo mật dữ liệu tuyệt đối vì đó chính là lợi ích quan trọng hàng đầu và đó cũng là lý do mà các chuyên gia về cơ sở dữ liệu chọn dùng MySQL MySQL có các kỹ thuật mạnh trong việc xác nhận truy cập cơ sở dữ liệu và chỉ có người dùng đã được xác nhận mới có thể truy cập vào server cơ sở dữ liệu

 Phát triển ứng dụng hỗn hợp

MySQL cung cấp hỗ trợ hỗn hợp cho bất kỳ sự phát triển ứng dụng nào nên MySQL được xem là cơ sở dữ liệu mã nguồn mở phổ biến nhất thế giới

Quá trình cài đặt MySQL diễn ra khá nhanh chóng trên Microsoft Windows, Linux, Macintosh hoặc Unix Sau khi cài đặt, các tính năng tự động mở rộng không gian, tự khởi động lại và cấu hình động được thiết lập sẵn sàng cho người quản trị cơ sở dữ liệu làm việc

 Mã nguồn tự do và hỗ trợ xuyên suốt

Nhiều doanh nghiệp lo lắng việc sử dụng mã nguồn mở là không an toàn và không được hỗ trợ tốt vì đa số tin vào các phần mềm có bản quyền , nhưng đối với

MySQL, các nhà doanh nghiệp hoàn toàn có thể yên tâm về điều này, MySQL có chính sách bồi thường hẳn hoi và luôn hỗ trợ tối đa cho quý doanh nghiệp

Trong các dự án phát triển mới, MySQL nổi bật như một lựa chọn hiệu quả về chi phí và đáng tin cậy Sự tiết kiệm chi phí của MySQL giúp các doanh nghiệp vừa tối ưu hóa ngân sách vừa đảm bảo tính toàn vẹn của hệ thống dữ liệu của mình.

1.4.3 Tại sao sử dụng MySQL

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

Hình 1.7: Mô hình khả năng MySQL MySQL cho phép người dùng mở rộng và có thể tùy chỉnh để thay đổi linh hoạt cấu trúc bên trong

Máy chủ cơ sở dữ liệu MySQL nổi bật với khả năng linh hoạt, cung cấp khả năng xử lý ứng dụng nhúng có dung lượng từ 1MB đến các kho dữ liệu khổng lồ lên tới hàng terabyte MYSQL hỗ trợ đa nền tảng, tương thích với tất cả các phiên bản Windows, Unix và Linux Ngoài ra, là phần mềm nguồn mở, MySQL cho phép chỉnh sửa và tùy chỉnh theo nhu cầu, giúp mở rộng các yêu cầu cần thiết cho máy chủ cơ sở dữ liệu.

Visual studio code

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ều hà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ạn là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ăng debug đi kèm, hỗ trợ Git, syntax highlighting hỗ trợ quá trình gõ code, phần gợi ý code thông minh,…

Xampp

Xampp là một công cụ tích hợp đầy đủ các thành bao gồm Apache, Mysql, PHP, Perl Giúp chúng ta tạo ra môi trường web server trên máy tính của mình, để có thể chạy được kịch bản PHP

1 Apache Là một chương trình máy chủ, dùng để giao tiếp với các giao thức HTTP Apache chạy tốt trên mọi hệ điều hành

2 Mysql Là hệ quản trị cơ sở dữ liệu, được dùng để lưu trữ thông tin của một website Mỗi website có thể sử dụng một hoặc nhiều cơ sở dữ liệu

3 PHP Là ngôn ngữ kịch bản trên phía Server, dùng để xử lý các thao tác của người dùng và làm việc trực tiếp với cơ sở dữ liệu (Database)

4 Perl Là một tầng cao hơn, một ngôn ngữ lập trình năng động hơn Sử dụng rộng rãi trong lập trình mạng và quản trị hệ thống Ít phổ biến cho mục đích phát triển web, Perl thích hợp với rất nhiều ứng dụng Để có thể chạy được xampp trên máy, các bạn download về theo link này Xampp có hỗ trợ hầu hết các hệ điều hành như window, linux, mac

Sau khi đã download được Xampp về máy, chúng ta tiến hành cài đặt như sau Màn hình mới vào cài đặt

- Nhấn Next để tiếp tục việc cài đặt

- Nhấn Next để tiếp tục cài đặt

- Ở đây, các bạn nên chọn ổ đĩa mà không phải ổ C Để tránh việc cài win hoặc ghost máy bị mất dữ liệu Nhấn Next để tiếp tục

- Nhấn Next để tiếp tục Quá trình cài đặt diễn ra như hình bên dưới

- Tiếp theo ta được màn hình như bên dưới

- Nhấn Finish để hoàn thành việc cài đặt.

PHÂN TÍCH VÀ THIẾT KẾ WEBSITE

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

Hiện nay trào lưu kinh doanh qua mạng ngày càng trở nên phổ biến Internet phát triển kéo theo nhiều dịch vụ phát triển theo Internet hiện nay không còn mấy xa lạ với con người được trở thành phương tiện truyền thông được nhiều người sử dụng nhất trên thế giới

Không chỉ dùng internet làm phương tiện truyền thông tin trao đổi, giải trí, xem tin tức, tìm kiếm thông tin mọi người còn dùng internet để kinh doanh các mặt hàng bình thường đến đặc biệt của mình Ở Việt Nam cũng có một số trang web kinh doanh bán hàng qua mạng như là www.123mua.com, www.thegioididong.com.vn Và nhiều trang web nổi tiếng khác Các mặt hàng đồng hồ cũng được bán khá nhiều trên nhiều website Tuy nhiên không phải việc kinh doanh qua mạng trở thành một trào lưu phát triển mạnh mẽ và thu hút các nhà kinh doanh, mọi lứa tuổi mà vì một số lý do như không mất chi phí thuê mặt bằng kinh doanh Kinh doanh trực tuyến không phải có một nguồn vốn lớn mới có thể kinh doanh mà chỉ cần nguồn vốn đủ để tích luỹ hàng hay một số dịch vụ khác là có thể bắt tay vào việc kinh doanh của mình, bên cạnh đó nhiều người có thể sử dụng blog cá nhân của mình để tiến hành kinh doanh các mặt hàng đồng hồ của mình

Mặt hàng kinh doanh qua mạng hiện nay thì đồng hồ được coi là đang phổ biến, với các shop online như thế này các chủ cửa hàng chỉ cần thường xuyên lên mạng quảng cáo các mặt hàng của mình với mục đích tìm kiếm và thu hút khách hàng Khách hàng chỉ cần mấy thao tác “click chuột” vào sản phẩm mà mình yêu thích và liên hệ với chủ cửa hàng là có thể chờ hóa đơn chuyển tới nhà của mình Việc kinh doanh qua mạng giúp nhiều công ty có nhiều cơ hội và thách thức hơn trong việc mở rộng thị trường không chỉ thời gian mà cả không gian, trong nước cũng như ngoài nước Ví dụ như một người nước ngoài muốn mua một đồng hồ xuất xứ từ Việt Nam hay bất cứ một cái gì đó Bên những thuận lợi thì việc kinh doanh qua mạng vẫn có những vấn đề nảy sinh Đòi hỏi phải có hiểu biết về công nghệ thông tin để thiết kế và tạo một trang web để thực hiện hoạt động bán hàng và quảng bá sản phẩm của mình Một thực tế cho thấy Việt Nam cho dù

Dù thương mại điện tử phát triển nhanh, nhiều khách hàng vẫn lo ngại khi mua sắm trực tuyến, đặc biệt là mặt hàng đồng hồ Họ sợ sản phẩm không như quảng cáo, không được kiểm tra trực tiếp, hàng giao chậm hoặc không nhận hàng Ngược lại, người bán cũng phải chịu các rủi ro như sản xuất sản phẩm mà không biết khách hàng phản ứng ra sao, giao hàng không có người nhận, địa chỉ không chính xác.

Hình thức kinh doanh nào cũng có những ưu điểm và nhược điểm của nó tuy nhiên sự thành công của một hình thức kinh doanh nó còn phụ thuộc vào ý tưởng và cách kinh doanh của người quản lí Đối với ngành kinh doanh đồng hồ qua mạng giúp cho ngành hồng hồ ngày càng đa dạng hơn và phù hợp với xu hướng tất yếu của thời đại hiện nay, thời đại công nghệ thông tin

Hình 2.1: sơ đồ hệ thống

2.1.2 Mô tả hệ thống bán đồng hồ

Hoạt động Website bán đồng hồ có thể mô tả như sau:

 Hoạt động của khách hàng

Khi khách đã quyết định tham gia vào hoạt động mua hàng của cửa hàng thì mọi khách hàng được cung cấp một giỏ hàng tương ứng Khách hàng tự do lựa chọn loại hàng hóa nào mà mình thích vào giỏ hàng của mình

Thông qua chức năng tìm kiếm của website giúp khách hàng có thể nhanh chóng tìm được loại hàng mà mình muốn mua một cách nhanh nhất

Khách hàng có thể cập nhật các mặt hàng hay thêm mặt hàng vào giỏ hàng của mình nếu muốn mua, có thể xóa mặt hàng trong giỏ hàng mà mình không muốn mua nữa

Nếu khách hàng chấp nhận thanh toán thì hệ thống yêu cầu nhập thông tin chi tiết của khách hàng như họ tên, địa chỉ, email, username, pasword nếu khách hàng chưa đăng ký đăng nhập, ngược lại nếu khách hàng nào đã đăng ký rồi thì họ chỉ cần đăng nhập bằng username và password của mình

Khi khách hàng đã hoàn thành quá trình đặt hàng với hệ thống thì khách hàng tiến hành thanh toán Sau khi hoàn thành quá trình thanh toán khách hàng có thể thực hiện lại quá trình mua hàng của mình nếu khách hàng muốn mua thêm hàng hóa Khi đã đặt hàng rồi, khách hàng có thể theo dõi trực tiếp tình trạng đơn đặt hàng của mình qua website nếu họ có băn khoăn, nếu họ có những gì không đồng ý thì có thể gửi đơn khiếu nại và thông tin phản hồi hệ thống qua chức năng liên hệ khác hàng

• Hoạt động của nhà quản trị

Cung cấp các giỏ hàng cho khách hàng giúp khách hàng cảm thấy an tâm khi mua hàng mà không bị một số lỗi làm gián đoạn quá trình mua hàng của khách hàng, giúp hiệu quả mua hàng của họ nhiều hơn cho đến khi kết thúc việc mua hàng cũng như ấn định số lượng hàng mua

Theo dõi khách hàng: cần phải biết khách hàng tham gia mua là ai và họ cần mua mặt hàng gì trong số khách hàng tham gia vào việc mua hàng Thống kế hóa đơn mua của họ, doanh thu với từng mặt hàng của hóa đơn

Sau khi kết thúc giao dịch, hóa đơn sẽ được chuyển đến các bộ phận khác để xử lý Để thu hút khách hàng, các chương trình khuyến mãi và giảm giá sẽ được thực hiện Các chương trình này cần được triển khai vào những thời điểm phù hợp để thu hút khách hàng Đối với khách hàng thường xuyên và mua số lượng lớn, nhà quản trị cần đưa ra các ưu đãi phù hợp Quản lý hóa đơn bao gồm các hoạt động như hiển thị thông tin mặt hàng, kiểm tra trạng thái hóa đơn và đánh dấu mặt hàng đã giao hoặc chưa giao, cũng như lập hóa đơn cho khách hàng.

- Người dùng phải đăng ký tài khoản thành viên để có tài khoản truy cập vào hệ thống để có thể tiến hành thanh toán sản phẩm trong giỏ hàng và quản lý giỏ hàng của mình

Để quản lý hệ thống hiệu quả, cả quản lý và nhân viên cửa hàng đều cần có tài khoản riêng Với tài khoản này, họ có thể thực hiện các chức năng quản lý, như quản lý thông tin sản phẩm và xử lý đơn hàng Đồng thời, tài khoản này cũng cho phép họ thực hiện các giao dịch mua bán với khách hàng, giúp quá trình làm việc trở nên thuận tiện và hiệu quả hơn.

- Cửa hàng đó cũng phải có đủ điều kiện để sử dụng được trang web đó

2.1.4 Yêu cầu về chức năng

- Đối với người quản trị

+ Để đảm bảo an toàn cho hệ thống hệ thống còn cung cấp password để người quản trị có thể truy cập vào hệ thống thao tác với cơ sở dữ liệu của website

Phân tích hệ thống

Là người quản lý tất cả các thông tin sản phẩm, quản lý thông tin nhập hàng, quản lý thông tin xuất hàng, quản lý thông tin khách hàng và thống kê các hóa đơn của khách Admin phải đăng nhập trước khi thực hiện quản lý các thông tin trên

+ Use case đăng nhập: Cho phép người quản trị đăng nhập vào để truy cập hệ thống

+ Use case đăng xuất: Người quản lý khi muốn kết thúc hệ thống hay đăng nhập bằng tài khoản khác thì có thể đăng xuất để bảo mật tài khoản cá nhân

+ Use case quản lý sản phẩm: Quản lý tất cả thông tin về sản phẩm.

Các trường hợp sử dụng quản lý loại sản phẩm: Quản lý đầy đủ thông tin của tất cả các loại sản phẩm Các trường hợp sử dụng quản lý danh mục sản phẩm: Quản lý thông tin toàn diện của toàn bộ danh mục sản phẩm.

+ Use case quản lý hóa đơn: Quản lý thông tin về hóa đơn mà khách hàng đã đặt

+ Use case quản lý người dùng: Người quản lý có thể quản lý tất cả thông tin của người dùng Có thể thêm, xóa, sửa tài khoản người dùng

+ Use case đặt hàng: Người quản lý có thể quản lý tất cả các thông tin hóa đơn, cho phép người quản lý xác nhận hóa đơn hoặc hủy bỏ

+ Use case quản lý khuyến mãi: Quản lý tất cả thông tin về khuyến mãi.

Là người tìm kiếm các sản phẩm, xem thông tin sản phẩm, đặt hàng, thanh toán.Khách hàng vào xem thông tin, tìm kiếm sản phẩm và đặt hàng thì phải có tài khoản Khách hàng cần phải đăng nhập trước khi tiến hành thanh toán Nếu khách hàng chưa có tài khoản thì phải đăng ký để tiến hành đăng nhập và thực hiện thanh toán trong giỏ hàng của mình

+ Use case đăng nhập: Cho phép khách hàng đăng nhập vào để truy cập hệ thống

+ Use case đăng ký: Khách hàng đăng ký tài khoản để tiến hành thanh toán sản phẩm trong giỏ hàng của mình

Trường hợp sử dụng nút đăng xuất thường thấy khi người dùng muốn kết thúc phiên làm việc trên hệ thống hoặc muốn đăng nhập bằng một tài khoản khác để đảm bảo tính bảo mật cho tài khoản cá nhân của họ.

+ Use case tìm kiếm: Cho phép khách hàng tìm kiếm sản phẩm

+ Use case thanh toán: Khách hàng thanh toán tiền khi đã đặt mua sản phẩm 2.2.2 Sơ đồ Use Case tổng quát dang xuat dang ky dang nhap tim kiem Khach hang thanh toan quan ly khuyen mai quan ly loai san pham quan ly san pham quan ly nguoi dung quan ly hoa don nguoi quan ly quan ly danh muc san pham

Hình 2.2: Use Case tổng quát website bán đồng hồ

Tên ca sử dụng: đăng nhập

Các tác nhân: người quản trị, khách hàng

- Khách hàng truy cập vào trang web, khi chọn mua hàng thì phải đăng ký tài khoản hoặc là đăng nhập để thanh toán

- Người quản trị muốn truy cập thì phải đăng nhập hệ thống để quản lý

Các luồng sự kiện chính trong UC Đăng nhập:

B1 UC bắt đầu khi có thành viên truy cập vào

B2 UC ở trạng thái sẵn sàng để hiển thị nội dung theo yêu cầu của người sử dụng B3 UC sẽ yêu cầu thành viên nhập mật khẩu khi cần đăng nhập để phản hồi thông tin

Các luồng sự kiện phụ trong UC Đăng nhập:

UC hiển thị một miền thu nhập thông tin phản hồi và cho phép thành viên thông tin phản hồi

UC lưu thông tin và kết thúc

UC thông báo mật khẩu sai

Tên ca sử dụng: đăng ký

Các tác nhân: khách hàng

Mô tả: UC cho phép đăng ký để trở thành viên của cửa hàng website bán đồng hồ

- B1: Khách xem chọn mục đăng ký

- B2: Trang đăng ký hiển thị

- B3: Khách xem phải nhập đầy đủ thông tin vào form đăng ký

- B4: Hệ thống sẽ kiểm tra thông tin mà khách xem đã nhập

+ Nếu thông tin nhập chính xác thì thực hiện B5

+ Nếu thông tin nhập không chính xác thì trở về B3

- B5: Hiển thị thông báo đăng ký thành công

- R2.2: Khách hàng chọn đăng kí ở trên trang web

- R2.3: Nhập thông tin cá nhân cần thiết vào form đăng ký

- R2.4: Hệ thống sẽ kiểm tra cơ sở dữ liệu thông tin đăng ký của người dùng có đúng hay không

- R2.4.1: Nếu thông tin đăng ký sai thì hệ thống sẽ báo lỗi vì yêu cầu người dùng đăng ký sẽ nhận lại

- R2.4.2: Nếu thông tin đăng ký đúng thì thông báo đăng ký thành công

- R2.5: Người dùng làm việc với hệ thống

Tên ca sử dụng: đăng xuất

Tác nhân: người quản trị, khách hàng

- B1: khi người quản trị hay khách hàng muốn thoát hệ thống

- B3: Hệ thống quay về trang chủ mặc định

- B4: Người dùng muốn sử dụng hệ thống thì đăng nhập lại

- R3.2: hệ thống xác nhận và quay về trang chủ mặc định

 Use Case tìm kiếm sản phẩm

Tên ca sử dụng: Tìm kiếm sản phẩm

- B1: Khi khách hàng hay nhân viên hoặc quản lý truy cập vào hệ thống

- B2: Nhấp vào form tìm kiếm trên trang web hay hệ thống quản lý

- B3: Tiếp theo sẽ nhập thông tin có liên quan đến thông tin hoặc sản phẩm

- B4: Sau đó thì nhấn nút tìm kiếm của chức năng tìm kiếm

-B5: Sản phẩm cần tìm hiển thị

- R3.2: Nhấp vào form tìm kiếm

- R3.3: Chọn thông tin hay sản phẩm cần tìm

- R3.5: Sản phẩm cần tìm được hiển thị

Tên ca sử dụng: đặt hàng

- B1: Khách hàng chọn sản phẩm cần đặt

- B2: Khách hàng nhắp nút đặt hàng

- B3: Hiển thị thông báo đặt hàng thành công

- R5.1: Khách hàng truy cập vào hệ thống

- R5.2: Khách hàng chọn sản phẩm cần đặt

- R5.3: Khách hàng nhấn nút đặt hàng

- R5.4: Sản phẩm được cập nhật trong giỏ hàng của bạn

Tên ca sử dụng: thanh toán

- B1: Khi khách hàng đã chọn xong sản phẩm để mua vào giỏ hàng của họ

- B2: Khi họ muốn yêu cầu thanh toán giỏ hàng của họ thì họ sẽ ấn vấn nút đặt hàng bên chi tiết thanh toán

- B3: Sau khi nhận được yêu cầu thanh toán của khách hàng thì nhân viên sẽ thực hiện việc thanh tóan cho khách

- R6.1: Khách hàng đăng nhập vào hệ thống

- R6.2: Khách hàng kích chọn vào giỏ hàng và yêu cầu thanh toán sản phẩm

- R6.3: Nhà quản lý sẽ thực hiện việc thanh toán cho khách hàng

- R6.4: Thông báo thanh toán được trực tiện

 Use case quản lý sản phẩm

Tên ca sử dụng: quản lý sản phẩm

Tác nhân: người quản trị

- B1: Nhà quản lý muốn quản lý sản phẩm trước tiên phải đăng nhập vào hệ thống

- B2: Nhà quản lý tiến hành quản lý

+ Nếu muốn thay đổi thông tin sản phẩm thì khách hàng chọn vào mục sửa thông tin sản phẩm

+ Nếu muốn xóa sản phẩm đó trong danh mục sản phẩm thì chọn vào mục xóa sản phẩm

- B3: Sản phẩm được cập nhật và hiển thị trong danh sách sản phẩm

- R7.1: Đăng nhập vào hệ thống

- R7.2: Chọn vào mục quản lý sản phẩm

- R7.2.1: Chọn vào mục xem sản phần

- R7.2.2: Chọn vào mục sửa sản phần

- R7.2.3: Chọn vào mục xóa sản phẩm

- R7.3: Các thay đổi được cập nhật

 Use Case quản lý hóa đơn

Tên ca sử dụng: quản lý hóa đơn

- B1: Nhà quản lý tiến hành đăng nhập vào hệ thống

- B2: Nhà quản lý tiến hành quản lý hóa đơn, cập nhật những hóa đơn mới đặt

- B3: Nhà quản lý xét duyệt hóa đơn và tiến hành giao hàng cho khách hàng

- R8.3: Duyệt đơn và thực hiện giao hàng

 Use case quản lý loại sản phẩm

Tên ca sử dụng: quản lý loại sản phẩm

- B1: Nhà quản lý muốn quản lý loại sản phẩm trước tiên phải đăng nhập vào hệ thống

+ Nếu muốn thay đổi thông tin loại sản phẩm thì khách hàng chọn vào mục sửa thông tin loại sản phẩm

+ Nếu muốn xóa loại sản phẩm đó trong danh mục loại sản phẩm thì chọn vào mục xóa loại sản phẩm

- B3: Loại sản phẩm được cập nhật và hiển thị trong danh sách loại sản phẩm

- R9.2: Chọn vào mục quản lý loại sản phẩm

- R9.2.1: Chọn vào mục xem loại sản phần

- R9.2.2: Chọn vào mục sửa loại sản phần

- R9.2.3: Chọn vào mục xóa loại sản phẩm

 Use case quản lý danh mục

Tên ca sử dụng: quản lý danh mục

- B1: Nhà quản lý muốn quản lý danh mục trước tiên phải đăng nhập vào hệ thống

+ Nếu muốn thay đổi thông tin danh mục thì khách hàng chọn vào mục sửa thông tin danh mục

+ Nếu muốn xóa danh thì chọn vào mục xóa danh mục

- B3: Loại sản phẩm được cập nhật và hiển thị trong danh sách danh mục

- R10.2: Chọn vào mục quản lý danh mục

- R10.2.1: Chọn vào mục xem danh mục

- R10.2.2: Chọn vào mục sửa danh mục

- R10.2.3: Chọn vào mục xóa danh mục

2.2.3.1 Biểu đồ tuần tự UC_ đăng nhập

: Nguoi quan tri - khach hang

: Nguoi quan tri - khach hang form dang nhap form dang nhap he thong he thong

2 Hien thi cua so dang nhap

3 nhap ten username + mat khau

Hình 2.3: Biểu đồ tuần tự UC_ đăng nhập

2.2.3.2 Biểu đồ tuần tự UC_ đăng ký

: Khach hang : Khach hang form dang ki form dang ki he thong he thong

2 hien thi form dang ki

4 he thong kiem tra thong

4.1 không hop le -> b3 hop le

6 bat dau su dung he thong

Hình 2.4: Biểu đồ tuần tự UC_ đăng ký

2.2.3.3 Biểu đồ tuần tự UC_ đăng xuất

: Nguoi quan tri - khach hang

: Nguoi quan tri - khach hang he thong he thong co so du lieu co so du lieu

1 yeu cau thoat he thong

4 ket thuc co so du lieu

Hình 2.5: Biểu đồ tuần tự UC_ đăng xuất

2.2.3.4 Biểu đồ tuần tự UC_ tìm kiếm

: Khach hang khung tim kiem khung tim kiem he thong he thong co so du lieu co so du lieu

2 nhâp tên san pham can tim

4 lây thông tin tu co so du lieu5 kiêm tra

8 hiên thi ket qua tim kiêm

Hình 2.6: Biểu đồ tuần tự UC_ tìm kiếm

2.2.3.5 Biểu đồ tuần tự UC_ đặt hàng

: Khach hang giao dien giao dien he thong he thong

1 dang nhap he thong 2.xem chi tiet san pham

4 he thong kiem tra con hang hay het

Hình 2.7: Biểu đồ tuần tự UC_ đặt hàng

2.2.3.6 Biểu đồ tuần tự UC_ sản phẩm

Hình 2.8: Biểu đồ tuần tự UC_ sản phẩm

2.2.3.7 Biểu đồ tuần tự UC_ loại sản phẩm

: nguoi quan tri giao dien giao dien he thong he thong co so du lieu co so du lieu

1 yeu cau them san pham

4 nhap thong tin muon them san pham

10.1 loi nhap thong tin10.2 thong bao nhap lai giao dien giao dien

: nguoi quan tri he thong he thong co so du lieu co so du lieu

1 yeu cau them loai san pham

4 nhap thong tin muon them loai san pham

10.1 loi nhap thong tin 10.2 thong bao nhap lai

Hình 2.9: Biểu đồ tuần tự UC_ loại sản phẩm

2.2.3.8 Biểu đồ tuần tự UC_ danh mục sản phẩm

: nguoi quan tri giao dien giao dien he thong he thong co so du lieu co so du lieu

1 yeu cau them danh muc san pham

4 nhap thong tin muon them danh muc san pham

10.1 loi nhap thong tin 10.2 thong bao nhap lai

Hình 2.10: Biểu đồ tuần tự UC_ danh mục sản phẩm

2.2.3.9 Biểu đồ tuần tự UC_ người dùng

: Nguoi quan tri giao dien giao dien he thong he thong co so du lieu co so du lieu

3 lay danh sach tai khoan nguoi dung

7 thuc hien chuc nang quan ly

Hình 2.11: Biểu đồ tuần tự UC_ người dùng

2.2.3.10 Biểu đồ tuần tự UC_ hóa đơn

Hình 2.12: Biểu đồ tuần tự UC_ hóa đơn

: Nguoi quan tri he thong he thong QL don hang QL don hang co so du lieu co so du lieu

3 chon thong tin don hang

4 lay thong tin don hang

8 xác nhan cac don hang mua

2.2.5.1 Biểu đồ hoạt động UC_ đăng nhập

Hình 2.14: Biểu đồ hoạt động UC_ đăng nhập

2.2.5.2 Biểu đồ hoạt động UC_ đăng ký

Nhap username + password dang ki kiem tra thong tin dang ki yeu cau nhap lai

Thong bao dang ki thanh cong no yes he thong khach hang

Hình 2.15: Biểu đồ hoạt động UC_ đăng ký

2.2.5.3 Biểu đồ hoạt động UC_ đăng xuất dang xuat xac nhan dang xuat

Thong bao dang xuat thanh cong he thong khach hang, nguoi quan tri

Hình 2.16: Biểu đồ hoạt động UC_ đăng xuất

2.2.5.4 Biểu đồ hoạt động UC_ tìm kiếm chon khung tìm kiêm nhap tên san pham can tim k iem tra khong tim thay hien thi thong tin chinh xac can tim no yes he thong khách hang, nguoi quan ly

Hình 2.17: Biểu đồ hoạt động UC_ tìm kiếm

2.2.5.5 Biểu đồ hoạt động UC_ quản lý danh mục sản phẩm

Dang nhap chon vao danh sach san pham thuc hien chuc nang quan ly san pham yeu cau nhap lai hien thi danh sach

KT luu vao co so du lieu no yes he thong nguoi quan tri

Hình 2.18: Biểu đồ hoạt động UC_ danh mục sản phẩm

2.2.5.6 Biểu đồ hoạt động UC_ quản lý người dùng thuc hien chuc nang quan ly tai khoan

Dang nhap chon vao danh sach tai khoan yeu cau nhap lai hien thi danh sach

KT luu vao co so du lieu no yes he thong nguoi quan tri

Hình 2.19: Biểu đồ hoạt động UC_ người dùng

2.2.5.7 Biểu đồ hoạt động UC_ đặt hàng yeu cau dat hang xac nhan kiem tra thong tin don hang tu choi ban hang lay thông tin hang dat hang xac nhan het hang xac nhan con hang he thong khach hang

Hình 2.20: Biểu đồ hoạt động UC_ đặt hàng

2.2.5.8 Biểu đồ hoạt động UC_ quản lý hóa dơn dang nhap he thong chon thong tin hoa don thuc hien chuc nang quan ly hoa don ket qua kiem tra thong tin hoa don huy hoa don xac nhan hoa don sai dung he thong nguoi quan tri

Hình 2.21: Biểu đồ hoạt động UC_ hóa đơn

2.2.5.9 Biểu đồ hoạt động UC_ thanh toán dang nhap he thong yeu cau thanh toan thanh cong huy don hang sai xac nhan thanh toan dung kiem tra thong tin don hang he thong khach hang

Hình 2.22: Biểu đồ hoạt động UC_ thanh toán

Thiết kế dữ liệu

+ Bảng chitiethoadon(Chi tiết hóa đơn)

Tên CSDL Kiểu Độ rỗng Mô tả

MaHD int 11 Mã hóa đơn

MaSP int 11 Mã sản phẩm

SoLuong int 11 Số luong sản phẩm

MaDM int 11 Mã Danh mục sảm phẩm

TenDM varchar 255 Tên danh mục

MaHD int 11 Mã hóa đơn

MaND int 11 mã của khách hàng

NguoiNhan varchar 50 Tên người nhận hàng

SDT varchar 20 Số điện thoại

DiaChi varchar 100 Địa chỉ khách hàng

PhuongThucTT varchar 20 Địa chỉ phương khác hàng

MaKM int 11 Mã khuyến mãi

TenKM varchar 100 Tên khuyến mãi

LoaiKM varchar 20 Loại khuyến mãi

GiaTriKM float 11,0 Giá trị khuyến mãi

NgayBD datetime Ngày bắt đầu

+ Bảng loaisanpham(Loại sản phẩm)

MaLSP int 11 Mã loại sản phẩm

TenLSP varchar 70 Ten loại sản phẩm

Mota varchar 200 Mô tả loại sản phẩm

MaDM int 11 Mã danh mục

MaND int 11 Mã của người dùng

Ho varchar 20 Họ người dùng

Ten varchar 20 Tên người dùng

SDT varchar 20 Số điện thoại người dùng

Email varchar 50 Địa chỉ email của người dùng

DiaChi varchar 200 Địa chỉ của người dùng

TaiKhoan varchar 100 Tên tài khoản người dùng

MatKhau varchar 100 Mật khẩu của người dùng

MaQuyen int 11 Mã đề phân loại tài khoản

ChiTietQuyen varchar 255 Chi tiết Quyền

MaSP int 11 Mã sản phẩm

MaLSP int 11 Mã loại sản phẩm

MaDM int 11 Mã danh mục

TenSP varchar 70 Tên sản phẩm

MaKM int 11 Mã khuyến mãi

Size varchar 50 Kích thước của kính đồng hồ TrongLuong varchar 50 Trọng lượng của đồng hồ

MaDongHo varchar 50 Mã đồng hồ

XÂY DỰNG WEBSITE

Cài đặt cơ sở dữ liệu

Hình 3.1: Bảng nguoidung(Người dùng) trong MySQL

Hình 3.2: Bảng loaisanpham(Loại sản phẩm) trong MySQL

Hình 3.3: Bảng khuyenmai(Khuyến mãi) trong MySQL

Hình 3.4: Bảng phanquyen(Phân quyền) trong MySQL

Hình 3.5: Bảng sanpham(Sản phẩm) trong MySQL

Hình 3.6: Bảng hoadon(Hóa đơn) trong MySQL

Hình 3.7: Bảng danhmuc(Danh mục) trong MySQL

Hình 3.8: Bảng chitiethoadon(Chi tiết hóa đơn) trong MySQL

Hình 3.9: Bảng banner(Banner) trong MySQL

Hình 3.10: Bảng thiết kế dữ liệu trong MySQL

Một số giao diện chính từ trang người dùng

Khi khách hàng truy cập vào trang chủ sẽ thấy những mục như sau:

Hình 3.11: Giao diện trang chủ

3.2.2 Giao diện trang cửa hàng

Hình 3.12: Giao diện cửa hàng

3.2.3 Giao diện trang giới thiệu

Hình 3.13: Giao diện trang giới thiệu

3.2.4 Giao diện trang liên hệ

Hình 3.14: Giao diện trang liên hệ

3.2.5 Giao diện trang giỏ hàng

Khi Nhấn vào liên kết đến trang giỏ hàng thì sẽ có giao diện như bên dưới, với trang giỏ hàng này có thể: cập nhật lại số lượng cần mua, xóa bỏ sản phẩm đã thêm.

Hình 3.15: Giao diện trang giỏ hàng

3.2.6 Giao diện trang đăng nhập và đăng ký

Khi khách hàng muốn đăng ký khách hàng mới từ website thì sẽ nhấn vào trên thanh menu khách hàng sẽ được dẫn đến trang giao diện đăng ký với giao diện như bên dưới và khi đăng ký khách hàng mới xong thì đăng nhập luôn ở bên cạnh (người quản trị cũng đăng nhập ở trang này luôn):

Hình 3.16: Giao diện trang đăng nhập và đăng ký

3.2.7 Giao diện trang tìm kiếm sản phẩm

Khi nhập từ khóa tìm kiếm sản phẩm trên thanh tìm kiếm thì website sẽ liệt kê tất cả sản phẩm phù hợp với từ khóa đã nhập và trang này sẽ có giao diện như sau:

Hình 3.17: Giao diện trang tìm kiểm sản phảm

3.2.8 Giao diện trang thanh toán

Sau khi vào trang giỏ hàng ta nhấn thanh toán Nếu khách hàng đã đăng nhập website sẽ hiển thị thông tin của khách hàng đã đăng ký.

Hình 3.18: Giao diện trang thanh toán

Một số giao diện trang quản trị

Giao diện trang chủ:Sẽ thấy thống kê các chức năng : doanh thu tháng nay, năm nay, nhân viên, khách hàng, đồng hồ nam, đồng hồ nữ, đồng hồ trẻ em, hóa đơn chưa duyệt

Hình 3.19: Giao diện trang chủ của người quản trị

3.3.2 Giao diện trang quán lý tài khoản

Hình 3.20: Giao diện trang quản lý tải khoản

3.3.3 Giao diện trang quản lý sản phẩm

Giao diện trang quản lý sản phẩm bao gồm: hiển thị tất cả sản phẩm, công cụ tìm kiếm nhanh một sản phẩm, nút thêm mới, xóa, sửa một sản phẩm bất kỳ…

Hình 3.21: Giao diện trang quản lý sản phẩm

3.3.4 Giao diện trang thêm sản phẩm Để thêm sản phẩm người quản lý nhấn vào trang quản lý sản phẩm và chọn thêm sản phẩm, thông tin sản phẩm thêm mới bao gồm: danh mục, loại sản phẩm, tên sản phẩm, đơn giá, …Sau khi nhập hết đầy đủ thông tin quản lý nhấn nút lưu lại để kết thúc quá trình thêm một sản phẩm mới

Hình 3.22: Giao diện trang thêm sản phẩm

3.3.5 Giao diện trang quản lý loại sản phẩm

Hình 3.23: Giao diện trang quản lý loại sản phẩm

3.3.6 Giao diện trang xét duyệt hóa đơn(Quản lý hóa đơn)

Hình 3.24: Giao diện trang xét duyệt hóa đơn

3.3.7 Giao diện trang quản lý danh mục sản phẩm

Hình 3.25: Giao diện trang quản lý danh mục sản phẩm

3.3.8 Giao diện trang quản lý banner

Hình 3.26: Giao diện trang quản lý banner

3.3.9 Giao diện trang quản lý khuyến mãi

Hình 3.27: Giao diện trang quản lý khuyến mãi

Tiêu đề	Thiết kế và triển khai hệ thống website bán đồng hồ sử dụng ngôn ngữ lập trình PHP và cơ sở dữ liệu MYSQL
Tác giả	Thaikeu Vatsanga
Người hướng dẫn	ThS. Nguyễn Thị Minh Châu
Trường học	Đại học Quảng Nam
Chuyên ngành	Toán – Tin
Thể loại	Khóa luận
Năm xuất bản	2023
Thành phố	Quảng Nam

Định dạng
Số trang	72
Dung lượng	3,86 MB