Xây dựng website bán linh kiện máy tính

Thầy luôn tận tụy giảng day chỉ bảo và là người luôntheo dõi tiến độ làm việc, đưa ra những góp ý, gợi ý quý giá cho chúng em trong quátrình thực hiện đồ án, nhắc nhở chúng em về những v

TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN &

TRUYỀN THÔNG VIỆT HÀNKhoa Khoa Học Máy Tính

Đà Nẵng, Ngày 13, Tháng 1 năm 2021

TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN &

TRUYỀN THÔNG VIỆT HÀN

Khoa Khoa Học Máy Tính

ĐỒ ÁN CƠ SỞ 1

Sinh viên: ĐỖ QUỐC HUY Mã: 20IT674 Giảng viên hướng dẫn: THS VÕ VĂN LƯỜNG

Đà Nẵng, Ngày 13, Tháng 1 năm 2021

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

3

LỜI CẢM ƠN

Sau quá trình học tập và thực hiện đồ án cơ sở, chúng em đã hoàn thành xong

đề tài của mình Đầu tiên, chúng em xin gửi lời cảm ơn tới tất cả Thầy, Cô trong khoaKhoa học máy tính của trường nói chung – là những người đã cung cấp, chỉ bảo cáckiến thức nền tảng, và đặc biệt là Thầy Võ Văn Lường nói riêng, giáo viên hướng dẫntrực tiếp đồ án của chúng em Thầy luôn tận tụy giảng day chỉ bảo và là người luôntheo dõi tiến độ làm việc, đưa ra những góp ý, gợi ý quý giá cho chúng em trong quátrình thực hiện đồ án, nhắc nhở chúng em về những vấn đề cần khắc phục để chúng em

có thể hoàn thành đồ án đúng thời gian, đảm bảo tiến độ công việc,…

Dù đã cố gắng làm việc với sự tập trung cao, song chúng em cũng không thểtránh khỏi một số sai sót do kiến thức về công nghệ mới tiếp cận trong đề tài còn chưanhiều, thời gian thực hiện cũng hạn hẹp Chúng em mong sẽ nhận được sự góp ý, nhậnxét từ Thầy, Cô để chúng em có thể làm tốt hơn nữa trong các đề tài và dự án sắp tới

Chúng em xin chân thành cảm ơn

SINH VIÊN THỰC HIỆN

ĐỖ QUỐC HUY

DANH MỤC HÌNH VẼ 7

MỞ ĐẦU 9

1 Giới thiệu 9

2 Mục tiêu của đề tài 9

3 Nội dung và kế hoạch thực hiện 9

3.1 Nội dung 9

3.2 Kế hoạch thực hiện 10

4 Bố cục báo cáo 10

Chương 1 TỔNG QUAN VỀ WEBSITE 11

1 Tổng quan 11

2 Ngôn ngữ, công cụ sử dụng 11

3 Kết chương 1 14

Chương 2 PHÂN TÍCH HỆ THỐNG 15

1 Biểu đồ ca sử dụng 15

2 Biểu Đồ Lớp 17

3 Biểu đồ hoạt động 19

4 Biểu đồ Tuần Tự 20

5 Kết chương 2 21

Chương 3 XÂY DỰNG WEBSITE 22

KẾT LUẬN 30

1 Kết quả đạt được 30

2 Hướng nghiên cứu 30

TÀI LIỆU THAM KHẢO 31

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

5

VIẾT TẮT NỘI DUNG

HTML Hypertext Markup Language

DANH MỤC HÌNH VẼ

Hình 1 HTML 12

Hình 2 JavaScript 13

Hình 3 Biểu đồ Use Case 16

Hình 4 Biểu đồ Lớp 18

Hình 5 Biểu đồ hoạt động mua hàng 19

Hình 6 Biểu đồ Tuần tự đăng nhập 20

Hình 7 Biểu đồ Tuần Tự khách Hàng mua sản phẩm 21

Hình 8 Giao diện Người dùng 22

Hình 9 Giao diện Người dùng Danh mục sản phẩm 22

Hình 10 Giao diện Sản phẩm được ưa chuộng 23

Hình 11 Giao diện Footer 23

Hình 12 Khu vực Đăng ký tài khoản 24

Hình 13 Khu vực đăng nhập 24

Hình 14 khu vực giỏ hàng 25

Hình 15 Khu vực Tư vấn khách hàng 26

Hình 16 Giao diện Admin 27

Hình 17 Biểu đồ Thống kê 27

Hình 18 Quản lí sản phẩm 28

Hình 19 Quản lí đơn hàng 29

Hình 20 Quản Li Nhan Vien 29

7

MỞ ĐẦU

1 Giới thiệu

Trong thời buổi hiện nay, khi mà công nghệ phát triển, thương mại điện tử ngàycàng phát triển Và một trong những ứng dụng của thương mại điện tử phổ biến ởnước ta là dịch vụ bán hàng qua mạng internet Dịch vụ này cho phép người dùng tìmkiếm chọn lựa sản phẩm để mua, thực hiện giao dịch mà không cần phải trực tiếp đếncửa hàng, mà chỉ cần sử dụng một thiết bị máy tính, điện thoại có kết nối internet Làsinh viên, người thực hiện đề tài cũng có kiến thức về tin học cũng như tiếp xúc vớithương mại điện tử tuy nhiên đôi lúc cũng gặp một số khó khăn trong việc mua bántrên các hệ thống bán hàng qua mạng hiện tại Như hình thức thanh toán, nhận hàng,phục vụ khách hàng, chất lượng sản phẩm thực tế không được như trên website và tìnhtrạng bán hàng giả hàng nhái, giao hàng không đúng với sản phẩm mà khách hàng đãđặt mua trên website

Hiểu được các vấn đề đó cũng như mong muốn đưa thương mại điện tử đến vớinhiều người hơn người thực hiện đề tài thực hiện đề tài: “Xây dựng Website BánLinh Kiện Máy Tính.” Với mục đích xây dựng một hệ thống bán hàng qua mạng uytín, đơn giản, thân thiện, cũng như đem lại cho khách hàng những lựa chọn tối ưu đểngay cả những người không có kiến thức về tin học cũng có thể tham gia mua hàngqua mạng chỉ với một số thao tác đơn giản, với mục đích giúp cho những khách hàngcòn hạn chế về công nghệ hiện tại có cái nhìn trực quan hơn và có sự lựa chọn chínhxác hơn về các sản phẩm công nghệ laptop để phục vụ nhu cầu sử dụng của minh Sảnphẩm mà người thực hiện đề tài hướng tới là các loại linh kiện máy tính và laptop Vìsản phẩm này đã dần trở thành vô cùng cần thiết cho nhu cầu hiện tại

2 Mục tiêu của đề tài

Mục tiêu của đề tài nhằm xây dựng một website bán các loại Laptop và Linhkiện tới khách hàng Giúp Khách Hàng có cái nhìn trực quan hơn về các thiết bị côngnghệ hiện đại, để Khách Hàng có thể lựa chọn các “sản phẩm đúng mục đich”, phùhợp với cộng việc của mình

3 Nội dung và kế hoạch thực hiện

3.1 Nội dung

- Tìm hiểu thị trường Laptop, công nghệ máy tính hiện tại

- Tìm hiểu các công cụ, ngôn ngữ hỗ trợ

- Khảo sát các website đã có sẵn trên thị trường

- Phân tích thiết kế hệ thống website bán Laptop

- Mô phỏng và xây dựng website bán Laptop

Thực hiện phân tích, khảo sát hệ thống, bắt đầu vẽ các

sơ đồ phân tích thiết kế hệ thống, tạo nên cái nhìn tổngthể cho website

21/12/2021 đến

10/1/2022

Chỉnh sửa một số chi tiết hạng mục của website và bổsung thêm các chi tiết trong sản phẩm của website.Trước 14/1/2022 Hoàn thành và nộp sản phẩm lên hệ thống Đào Tạo

4 Bố cục báo cáo

Chương 1 Tổng quan về website

Chương 3 Xây dựng website

10

Chương 1 TỔNG QUAN VỀ WEBSITE

1 Tổng quan

Website Bán Laptop bao gồm các sản phẩm và các Linh kiện Công Nghệ hiệnđại và có các chương trình Khuyến Mãi đặc biệt cho Khách hàng Ngoài ra còn cóthêm các dịch vụ về hỗ trợ Khách Hàng trong việc lựa chọn các sản phẩm công nghệcho phù hợp với công việc của Khách Hàng

Mục đích mang đến người sử dụng một hay nhiều sản phẩm chính hãng và tưvấn tận tâm đến người dùng Thiết kế website đẹp mắt dễ sử dụng an toàn minh bạch,trên mỗi sản phẩm đều đề cập giá và thông tin Cho phép người dung đăng ký sao lưunhững thông tin sản phẩm để tìm kiếm dễ hơn và kèm theo đó là những ưu đãi cho chủ

sở hữu tài khoản Chính sách minh bạch bảo hành an toàn, khách hàng dễ dàng thấyđược qua bill thanh toán và tem bảo hành,…

2 Ngôn ngữ, công cụ sử dụng

HTML là chữ viết tắt của HyperText Markup Language (ngôn ngữ đánh dấu siêu văn bản) HTML được sinh ra để tạo nên các trang web với các mẫu thông tin được trình bày trên World Wide Web HTML có thể được viết lên bởi các phần mềm, các trình soạn thảo văn bản thông thường như notepad++, editplus, hoặc các trình soạn thảo chuyên dụng như visual studio, sublime text 3,… Một file HTML sẽ có hai định dạng mở rộng là “.html” và “.htm”

Hình 1 HTML

hình ảnh và các đối tượng khác như biểu mẫu tương tác có thể được nhúng vào trang được hiển thị HTML cung cấp một phương tiện để tạo tài liệu có cấu trúc bằng cách biểu thị ngữ nghĩa cấu trúc cho văn bản như headings, paragraphs, lists, links, quotes

và các mục khác Các phần tử HTML được phân định bằng các tags, được viết bằng dấu ngoặc nhọn Các tags như <img /> và <input /> giới thiệu trực tiếp nội dung vào trang Các tags khác như <p> bao quanh và cung cấp thông tin về văn bản tài liệu và

có thể bao gồm các thẻ khác làm phần tử phụ Các trình duyệt không hiển thị các thẻ HTML, nhưng sử dụng chúng để diễn giải nội dung của trang

HTML có thể nhúng các chương trình được viết bằng scripting như JavaScript, điều này ảnh hưởng đến hành vi và nội dung của các trang web Việc bao gồm CSS xác định giao diện và bố cục của nội dung World Wide Web Consortium (W3C), trước đây là đơn vị bảo trì HTML và là người duy trì hiện tại của các tiêu chuẩn CSS, đã khuyến khích việc sử dụng CSS trên HTML trình bày rõ ràng kể từ năm 1997.2.2 Bootstrap

Bootstrap là một framework bao gồm các HTML template, CSS template

và JavaScript template dùng để phát triển website chuẩn responsive

Bản chất Bootstrap bao gồm một tập hợp các cú pháp thực hiện các chức năng

cụ thể Để hoạt động tốt, Bootstrap cần có các file chính quản lý giao diện người dùng

và chức năng của trang web Đó là 3 file:

web Để thực hiện một hành động cụ thể, cần tồn tại cùng lúc hai cấu

12

trúc: HTML quản lý nội dung và cấu trúc website, CSS xử lý bố cụcwebsite.

file JavaScript chịu trách nhiệm cho việc tương tác của trang web

giao diện người dùng

2.3 JavaScript ( JS )

JavaScript, theo phiên bản hiện hành, là một ngôn ngữ lập trình thôngdị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 chocác trang web (phía người dùng) cũng như phía máy chủ (với Nodejs) Nó vốn đượcphát triển bởi Brendan Eich tại Hãng truyền thông Netscape với cái tên đầutiê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ơnJava .js là phần mở rộng thường được dùng cho tập tin mã nguồn JavaScript

Hình 2 JavaScript

Nhiệm vụ của Javascript là xử lý những đối tượng HTML trên trình duyệt Nó

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

3 Kết chương 1

Qua các kiến thức đã học trong học kỳ 1 năm 2 này, chúng em đã đúc kết đượcnhững kiến thức quan trọng trong Lập Trình Website, hiểu rõ được sự quan trọng củaNgôn ngữ JS, HTML … Từ đó chúng em đã tạo nên Website Bán Linh Kiện, Máytính Phần trình bày Website được thực hiện ở chương tiếp theo

14

Chương 2 PHÂN TÍCH HỆ THỐNG

1 Biểu đồ ca sử dụng

Phát biểu bài toán :

Khách hàng vào trang web có thể xem các sản phẩm được hiển thị trên giaodiện, nếu khách hàng thích 1 sản phẩm và muốn mua nó thì khách hàng sẽ thêm vàogiỏ hàng sau đó phải đăng nhập vào trang chủ để bắt đầu mua sản phẩm

Đồng thời sau khi mua sản phẩm khách hàng có thể góp ý cho shop về sảnphẩm sau khi mua

Hệ thống phải hiện đầy đủ thông tin sản phẩm trong giao diện Trường hợpkhách hàng nhập mã sale thì hệ thống phải kiểm tra mã giảm giá xem sét mã giá đểgiảm theo nhu cầu của khách hàng Hệ thống phải báo cho admin khi có yêu cầu sửađơn hàng của khách hàng

Admin là người quản trị nên admin phải có những chức năng cơ bản như thêmsản phẩm, xóa sản phẩm,chỉnh sửa sản phẩm Admin phải xem các góp ý của kháchhàng Khi có nhu cầu chỉnh sửa đơn hàng admin phải xem xét và liên lạc với kháchhàng để chỉnh sửa theo nhu cầu của khách hàng

1.2 Vẽ biểu đồ usecase hệ thống

Hình 3 Biểu đồ Use Case

16

3 Biểu đồ hoạt động

Hình 5 Biểu đồ hoạt động mua hàng

4 Biểu đồ Tuần Tự

Hình 6 Biểu đồ Tuần tự đăng nhập

20

Hình 7 Biểu đồ Tuần Tự khách Hàng mua sản phẩm.

5 Kết chương 2

Thông qua môn Phân Tích Thiết Kế Hệ Thống Chúng em đã trình bày sơ lượtqua các loại biểu đồ của Website Từ đó Nhóm chúng em bắt đầu tiến hành xây dựngwebsite thôn qua biểu đồ này Phần tiếp theo sẽ chúng em sẽ trình bày phần giao diệncủa Website Bán Linh Kiện Máy Tính

Chương 3 XÂY DỰNG WEBSITE

1.1 Giao diện người dùng

Hình 8 Giao diện Người dùng

Hình 9 Giao diện Người dùng Danh mục sản phẩm

22

Hình 10 Giao diện Sản phẩm được ưa chuộng

Hình 11 Giao diện Footer

1.1.2 Giao diện trang đăng ký

Hình 12 Khu vực Đăng ký tài khoản

Hình 13 Khu vực đăng nhập

24

1.1.4 Giao diện trang giỏ hàng

Hình 14 khu vực giỏ hàng

1.1.5 Khu vực gửi địa chỉ liên hệ

Hình 15 Khu vực Tư vấn khách hàng

26

1.2 Giao diện quản trị viên

1.2.1 Giao diện trang tổng quan

Hình 16 Giao diện Admin

Hình 17 Biểu đồ Thống kê

1.2.2 Giao diện trang danh mục sản phẩm

Hình 18 Quản lí sản phẩm

28

1.2.3 Giao diện quản lý các đơn hàng

Hình 19 Quản lí đơn hàng

1.2.4 Giao diện quản lý Nhân Viên

Hình 20 Quản Li Nhan Vien

KẾT LUẬN

1 Kết quả đạt được

Sau thời gian thực hiện đồ án, kết quả đạt được như sau:

2 Hướng nghiên cứu

Với những hạn chế và tồn tại nêu trên, hướng nghiên cứu dự kiến như sau:

30

TÀI LIỆU THAM KHẢO

1 ACT "STEM EDUCATION IN THE U.S." 2017

2 Atwood, Jeff Lập Trình Và Cuộc Sống 2004

3 Carr, G Nicholas Liệu IT Đã Hết Thời Newyork, 2013

4 Council, Curriculum Development "Promotion of STEM Education Unleashing Potential in Innovation." 2015

5 Education, U.S Department of "Report of the Academic CompetitivenessCouncil." 2007

6 Hoàng, Phạm Huy Code Dạo Kí Sự NXB Dân Trí, 2017

7 co-nen-khoa-hoc-ky-thuat-tien-tien-nhat-the-gioi-26818.aspx." n.d

"http://thoibaotaichinhvietnam.vn/pages/quoc-te/2015-12-08/10-quoc-gia-8 "http://truonghocketnoi.edu.vn/data/thuvien/DongPhD/

hoclieu_3650611_1446867073.pdf." n.d

9 "https://hocvienkhampha.edu.vn/hieu-sao-cho-dung-ve-giao-duc-stem." n.d

10.Hunt, Andy The Pragmatic Programmer 1999

11.Joint Economic Committee Chairman’s Staff Senator Bob Casey, Chairman STEM Education: Preparing for the Jobs of the Future April 2012