Bài tập lớn tên đề tài thiết kế web bán đồng hồ

Từ các doanh nghiê ̣p cho tới các đại lí bán l攃ऀ hay các hô ̣kinh doanh cá nhân c甃̀ng đã sử dụng hình thức shopping online như một công cụ thiếtyếu để mua bán.Sau khi hoàn thành khóa họ

BỘ LAO ĐỘNG VÀ THƯƠNG BINH XÃ HỘI TRƯỜNG CAO ĐẲNG KINH TẾ CÔNG NGHỆ HÀ NỘI

BÀI TẬP LỚN

TÊN ĐỀ TÀI: THIẾT KẾ WEB BÁN ĐỒNG HỒ

NHÓM: 2 MÔN: THIẾT KẾ VÀ QUẢN TRỊ

WEBSITE LỚP: PMK11 - CO1 NGÀNH: LẬP TRÌNH MÁY TÍNHGVHD: ThS Lê Văn Phong

BỘ LAO ĐỘNG VÀ THƯƠNG BINH XÃ HỘI TRƯỜNG CAO ĐẲNG KINH TẾ CÔNG NGHỆ HÀ NỘI

Giảng viên hướng dẫn: ThS Lê Văn Phong

Bằng số Bằng chũ

1 Tao Văn Đoàn PMK11C01-016

2 Nguyễn Thị Thu Hương PMK11C01-001

3 Nguyễn Thị Kim Ngân PMK11C01-010

4 Nguyễn Thu Trang PMK11C01-045

5 Hoàng Minh Tới PMK11C01-038

Đề Tài:

XÂY DỰNG WEBSITE BÁN ĐỒNG HỒ

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

………

………

………

………

………

………

………

………

………

………

………

………

………

………

………

………

………

………

………

………

………

………

Hà Nội, ngày tháng năm 2023

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

LỜI CẢM ƠN

Em xin chân thành cảm ơn các thầy cô trong trong trường Cao đẳng kinh tế công nghệ

Hà Nội đã tạo điều kiện cho nhóm em thực hiện đề tài này

Em xin cảm ơn thầy Nguyễn Văn Phong đã tận tình hướng dẫn nhóm trong suốt thời gian thực hiện đề tài Trong thời gian được làm việc với thầy, em không những học hỏi được nhiều kiến thức bổ ích mà còn học được tinh thần làm việc, thái độ nghiêm túc của thầy

Mặc dù đã cố gắng hoàn thiện đồ án với tất cả nỗ lực của thành viên nhóm, nhưng chắc chắn không thể tránh khỏi những thiếu sót Kính mong Thầy Cô tận tình chỉ bảoMột lần nữa, em xin chân thành cảm ơn đến tất cả các thầy cô tại trường Cao đẳng kinh tế công nghệ Hà Nội đã giảng dạy, giúp đỡ em trong thời gian vừa qua

Hà Nội, Ngày Tháng Năm 2023

Nhóm Sinh viên thực hiện

MỤC LỤC

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

LỜI CẢM ƠN 5

CHƯƠNG 1 : TỔNG QUAN 7

1.1 Lý do chọn đề tài: 7

1.2 Nhiệm vụ 7

1.3 Kết quả 7

CHƯƠNG 2 : CƠ SỞ LÝ THUYẾT 8

2.1 Ngôn ngữ HTML, CSS và JavaScript 8

2.2 Ngôn ngữ PHP 9

2.3 Hệ quản trị cơ sở dữ liệu MySQL 10

CHƯƠNG 3 : PHÂN TÍCH VÀ THIẾT KẾ HỆ THỐNG 12

3.1 Mô hình Use-Case 12

3.2 Mô hình lớp 13

3.3 Mô hình tuần tự 14

CHƯƠNG 4 : GIAO DIỆN WEBSITE 15

4.1 Giao diện chính 15

4.2 Chức năng đăng ký /đăng nhập 16

4.3 Chức năng xem chi tiết sản phẩm 17

KẾT LUẬN 18

Kết luật: 18

Ưu Điểm: 18

Nhược điểm: 18

Hướng Phát Triển: 18

Tài liệu tham khảo: 20

CHƯƠNG 1 : TỔNG QUAN

1.1 Lý do chọn đề tài:

Sự phát triển của công nghệ thông tin đã và đang làm thay đổi toàn bộ thế giới.Mọi ngành nghề, mọi lĩnh vực dần dần được tin học hóa và làm cho công việc trở nên dễdàng, nhanh chóng, chính xác hơn Đặc biệt, trong lĩnh vực thương mại, việc tin học hóagóp phần nâng cao chất lượng dịch vụ thương mại

Hình thức shopping khi được tin học hóa trở thành một trong những hình thứcmua bán (shopping online) phổ biến nhất trên thế giới Với ưu điểm khách quan, chínhxác và thuận tiện cho cả người mua và người bán Giờ đây bạn không cần phải đi ra tâ ̣ncửa hàng để chọn lựa sản phẩm mà chỉ cần một click chuô ̣t và bạn s攃̀ nhâ ̣n được sảnphẩm

Tại Việt Nam, trong những năm gần đây, hình thức shopping online đang được ápdụng rất rô ̣ng rãi và phổ biến Từ các doanh nghiê ̣p cho tới các đại lí bán l攃ऀ hay các hô ̣kinh doanh cá nhân c甃̀ng đã sử dụng hình thức shopping online như một công cụ thiếtyếu để mua bán

Sau khi hoàn thành khóa học lâ ̣p trình PHP, chúng em chọn đề tài Xây dựng

website bán đồng hồ trực tuyến như là một dự án thực tế thông qua đó có cơ hội được vận

dụng những kiến thức lý thuyết được từ môn học

1.2 Nhiệm vụ

- Đọc tài liệu, nghiên cứu tìm hiểu về cách lập trình trên NetBeans

- Tìm hiểu về ngôn ngữ Php và mô hình MVC

- Tìm hiểu các vấn đề liên quan đến việc làm thế nào để xây dựng lên một website

- Viết đề cương báo cáo và hoàn thành website

1.3 Kết quả

Xây dựng thành công website bán đồng hồ online

CHƯƠNG 2 : CƠ SỞ LÝ THUYẾT

2.1 Ngôn ngữ HTML, CSS và JavaScript

HTML là chữ viết tắt của cụm từ HyperText Markup Language (tạm dịch Ngôn

ngữ đánh dấu siêu văn bản) được sử dụng để tạo một trang web, trên một website có thểs攃̀ chứa nhiều trang và mỗi trang được quy ra là một tài liệu HTML Cha đ攃ऀ của HTML là

Tim Berners-Lee, c甃̀ng là người khai sinh ra World Wide Web và chủ tịch của World

Wide Web Consortium (W3C – tổ chức thiết lập ra các chuẩn trên môi trường Internet).Một tài liệu HTML được hình thành bởi các phần tử HTML (HTML Elements) được quyđịnh bằng các cặp th攃ऀ (tag), các cặp th攃ऀ này được bao bọc bởi một dấu ngoặc ngọn (ví dụ

<html>) và thường là s攃̀ được khai báo thành một cặp, bao gồm th攃ऀ mở và th攃ऀ đóng (ví

<strong> dụ </strong> và ) Các văn bản muốn được đánh dấu bằng HTML s攃̀ được khaibáo bên trong cặp th攃ऀ (ví dụ <strong>Đây là chữ in đậm</strong>) Nhưng một số th攃ऀđặc biệt lại không có th攃ऀ đóng và dữ liệu được khai báo s攃̀ nằm trong các thuộc tính (ví

dụ như th攃ऀ <img>)

CSS là chữ viết tắt của Cascading Style Sheets, nó là một ngôn ngữ được sử dụng

để tìm và định dạng lại các phần tử được tạo ra bởi các ngôn ngữ đánh dấu (ví dụ nhưHTML) Có thể hiểu đơn giản rằng, nếu HTML đóng vai trò định dạng các phần tử trênwebsite như việc tạo ra các đoạn văn bản, các tiêu đề, bảng,… thì CSS s攃̀ giúp chúng ta

có thể thêm một chút “phong cách” vào các phần tử HTML đó như đổi màu sắc trang, đổimàu chữ, thay đổi cấu trúc,… rất nhiều

Javascript là một ngôn ngữ lập trình kịch bản dự vào đối tượng phát triển có sẵn

hoặc tự định nghĩa ra, javascript được sử dụng rộng rãi trong các ứng dụng Website.Javascript được hỗ trợ hầu như trên tất cả các trình duyệt như Firefox, Chrome, thậmchí các trình duyệt trên thiết bị di động c甃̀ng phải hỗ trơ nó Javascript ra đời dựa trênmột nhu cầu hợp lý là giảm tải cho các server Thay vì tất cả các các thông tin dữ liệuphải được trao đổi trực tiếp giữa trình duyệt và web server thì nó được Javascript tiền xử

lý ngay trên trình duyệt trước khi gởi đến các web server Javascript đã làm giảm lưu

lượng truy cập giữa server và client hay nói cách khác nó đã biến máy tính của bạn thànhmột server tạm thời xử lý một số tác vụ đơn giản Ví dụ, một trang thu thập dữ liệu từngười dùng có thể sử dụng các đoạn code JavaScript để xác nhận tính hợp lý của thôngtin trước khi gởi các dữ liệu này về server để xử lý.

Hình 2.1: Mối quan hệ giữa HTML, CSS và JavaScript

2.2 Ngôn ngữ PHP

PHP (viết tắt hồi quy "PHP: Hypertext Preprocessor") là một ngôn ngữ lập trìnhkị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 chomá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

Để chạy một website với mã nguồn PHP & hệ quản trị cơ sở dữ liệu MySQL làm việc Offline trên máy tính cá nhân chúng ta cần phải cài đặt tối thiểu các gói cài đặt sau:

• Web Server: Hỗ trợ giao thức HTTP, dùng để truy cập dữ liệu như bạn truy cập vào website Chúng ta dùng Server Apache

• Database Server: Là Server quản lý quy xuất cơ sở dữ liệu

• PHP: Hỗ trợ ngôn ngữ lập trình PHP

Xampp là chương trình tạo máy chủ Web (web server) trên máy tính cá nhân(localhost) được tích hợp sẵn Appache PHP,MySQL FTP server.Mail Server và cáccông cụ như PHPmyadmin

Để cài đặt Xampp chúng ta c甃̀ng tiến hành cài đặt thông thường như các gói phầnmềm khác

Sau khi cài đặt thành công Xampp, để có thể làm việc đươc với PHP bạn cần phảiphân biệt chức năng Apache bằng cách click button start trong của sổ Xampp controlpanel

2.3 Hệ quản trị cơ sở dữ liệu MySQL

Cơ sở dữ liệu MySQL đã trở thành cơ sở dữ liệu mã nguồn mở phổ biến nhất trênthế giới vì cơ chế xử lý nhanh và ổn định của nó, sự đáng tin cậy cao và dễ sử dụng Nóđược sử dụng mọi nơi – ngay cả châu Nam Cực – bởi các nhà phát triển Web riêng l攃ऀc甃̀ng như rất nhiều các tổ chức lớn nhất trên thế giới để tiết kiệm thời gian và tiền bạc chonhững Web sites có dung lượng lớn, phần mềm đóng gói – bao gồm cả những nhà đi đầutrong lĩnh vực công nghiệp như Yahoo!, Alcatel-Lucent, Google, Nokia, YouTube vàZappos.com

MySQL không chỉ là cơ sở dữ liệu mã nguồn mở phổ biến nhất trên thế giới, nócòn trở thành cơ sở dữ liệu được chọn cho thế hệ mới của các ứng dụng xây dựng trênnền Linux, Apache, MySQL, PHP/Perl/Python MySQL chạy trên hơn 20 flatform baogồm: Linux, Windows, OS/X, HP-UX, AIX, Netware, mang đến cho bạn tính linh hoạt

Một số đặc điểm của MySQL:

 MySQL là một phần mềm quản trị cơ sở dữ liệu dạng server-based (gần tươngđương với SQL Server của Microsoft)

 MySQL quản lý dữ liệu thông qua các cơ sở dữ liệu, mỗi cơ sở dữ liệu có thể cónhiều bảng quan hệ chứa dữ liệu

 MySQL có cơ chế phân quyền người sử dụng riêng, mỗi người dùng có thể đượcquản lý một hoặc nhiều cơ sở dữ liệu khác nhau, mỗi người dùng có một tên truy cập(user name) và mật khẩu tương ứng để truy xuất đến cơ sở dữ liệu

CHƯƠNG 3 : PHÂN TÍCH VÀ THIẾT KẾ HỆ THỐNG

3.1 Mô hình Use-Case

Hình 3.1: Mô hình Use-Case

Người dùng: Xem tất cả thông tin trên trang chủ và sản phẩm

: Tìm kiếm sản phẩm

: Đăng ký thành viên

Khách hàng: Mua hàng

: Quản lý thông tin trên giỏ hàng ( thêm, xóa, sửa)

Người quản lý: Tạo mới người dùng

: Xem thông tin người dùng : Cập nhật thông tin người dùng : Xóa người dùng

3.2 Mô hình lớp

6 Xem chi tiết: Khách hàng xem chi tiết từng sản phẩm.

9 Thêm vào giỏ hàng: Khách hàng thêm sản phẩm vào giỏ hàng của mình

CHƯƠNG 4 : GIAO DIỆN WEBSITE

4.1 Giao diện chính

Hình 4.1.1 Giao diện chính website

4.2 Chức năng đăng ký /đăng nhập

Mô tả: có chức năng đăng ký thành viên cho người dùng và người quản trị Ngườiđăng ký không được bỏ trống các ô được yêu cầu là bắt buộc

Hình 4.2.2 Đăng nhập

Hình 4.2.3 Đăng ký

4.3 Chức năng xem chi tiết sản phẩm

Hình 4.3 Chi tiết sản phẩm

KẾT LUẬN

Kết luật:

Mặc dù đã cố gắng và đầu tư rất nhiều nhưng do thời gian có hạn nên đề tài cònnhiều hạn chế Chúng em rất mong nhận được sự thông cảm và góp ý của Thầy cô cùngcác bạn để chương trình ngày càng hoàn thiện hơn

Ưu Điểm:

Website đã hoàn thiện các chức năng cơ bản, đáp ứng được một số yêu cầu như:

- Cập nhật, lưu trữ thông tin của khách hàng

- Giao diện đơn giản, thân thiện cho người sử dụng

- Chức năng tìm kiếm thông tin

-Tìm hiểu thêm một số ngôn ngữ, các phần mềm ứng dụng để nâng cao giao diện

đồ họa đẹp mắt, thân thiện hơn…

-Xây dựng trang web quy mô lớn hơn với nhiều ứng dụng, chức năng

- Tăng cường tính bảo mật cho trang web, tài khoản cá nhân, người dùng

Tài liệu tham khảo: