Báo cáo học phần nhập môn ngành cntt thiết kế website thương mại Điện tử

Nhưng vấn đề là người dùng chưa biết đến những sản phẩm cũng như thông tin về các loại sản phẩm.. Vì vậy , chúng tôi đã xây dựng một website thương mại điện tử nhằm cung cấp thông tin, g

TRƯỜNG ĐẠI HỌC THỦ DẦU MỘT Viện Kỹ thuật Công Nghệ

DA I i OC

THU DAU MOT

2009 THỤ DAU MOT UNIVERSITY

Báo cáo học phần Nhập môn ngành CNTT

THIET KE WEBSITE THUONG MAI ĐIỆN TỬ

Giang vién: Ths Duong Thi Kim Chi Sinh viên thực hiện:

Nguyễn Hoàng Hiệp (20204802010235) Trần Quay Tín (2024802010221) Lâm Văn Dương (2024802010396)

Lê Nhật An (2024802010377)

Võ Văn Tuấn (2024802010146)

Thu Dau Một, tháng 12 năm 2020

MỤC LỤC

CHƯƠNG1 TÌMHI LECONGNGH THIEET KEE WEB

1.1 TONG QUAN CONG NGHE THIEET KEE WEBSITE

1.2 GIGI THIEU WORDPRESS

LH EEE Ee enna Thy 4 1.2.1 Đôôi tượng: 4 F2 Ninja nan 4 1.2.3 Cách têôp cận 4 1.2.4 Phương pháp nghiên cứu: 4

CHUONG 2 THIEET KEE WEBSITE THUONG MAI DIEN TU’

2.1 //sar ¡o2 1 na ỐẮốỐốỐốỐốỐốỐốỐốỐốỐốỐố.ố EE EEE SEDER EE EE 5

2.2 Maiv 000i ïcn, TT .a ố 5

2.2.1 Quản lý danh mục cv D 2.2.2 Yêu cââu chức năng hệ thôông

CHU'ONG 3 CÀI ĐẶT CHƯƠNG TRÌNH .Õ

3.1 GIAO DIEN CUA 32 8n hố ae 6

<< TT HH HT TT HT TT KH HT TT HT TH KH KH TH HT HP HH TT KH HH HT HT TT KH HH ky 6

3.2 GIAO DIEN TRANG DANG NHAP will 3.3 (CTO) =I MNT: ANCHO 107\\\ I I) te 12

CHU'ONG 4 KÊÊT LUẠN VÀ HƯỚNG PHÁT TRIỂN 14

4.1 NHỮNG KÊÊT QUÁ ĐẠT ĐƯỢC cu cu HT Tà HT TH TK kh gà TK TH gà KT KH kh tà 14 4.2 NHỮNG HẠN CHÊÊ CỦA ĐÊÂ TÀI LH TH TH ng TH KH hà KT KH KH Ti EEEE SEE EE SEES SEE EEE 14

4.3 0/91c0i 5n 1 ẻ e= Ố.Ố.ẮỀỐ 14

MỤC LỤC HÌNH ẢNH Hình 1 Giao diện trang chủ của máy khách - c1 t2 111 11 1T TH TH TT vn ren 7 Hình 2 Giao diện trang chủ cta May KNACH cecceesseesseeeesceseecseceseeesneecsseesaeceseeesseessseseseseseessseesererses Hình 3 Giao diện trang chủ của máy khách

Hình 4 Giao diện trang chủ của máy khách

Hình 5 Giao diện trang chủ của máy khách - + t2 111 v.v Ty TH TH TT vn kh ren 9 0Ì; C30250 1 9 Hinh 7 Giao dién trang li6n 7 a 10 Hình 8 Giao di § phâân danh muc San Pham cccccccccccecsesscecsesecoesecsesesenseceesesssescensesesenseseeseseeseeaees 10 lÌIi 85 coi 18 e ỐốỐốỐ 11 Hinh 00c no 0916-1150 ro :-.-‹£‹:ÄäẬÃH,HẬH))) 11 Hinh 11 Giao 17s 11 e 5ẦẢ^+ 11 0ÌIip 2 eir- o0) r0 17 - ae 12 Hình 13 Giao diện thanh toán cv 1S 1H TT T HT TH TH TT KH TT kè 13 Hình 14 Giao diện đăng nhập 13 IÌh BE 0i e 14 0) co 000 n8 A RHH 14 Hình 17 Phâân thêm ảnh cho sản phẩm

Hình 18 Danh mục quản lý sản phẩm - L2 S2 TS E232 ST T HH HT HH ng 15

CHUONG 1 TÌM HIỂU CÔNG NGHỆ THIẾT KẺ WEB

1.1 Tổng quan công nghệ thiết kế website

Hiện nay, nhu cầu cái đẹp của con người cảng cao Mọi người có xu hướng tìm

đến các thiết bị có khả năng lưu giữ các khoảnh khắc đẹp của bản thân cũng như người

thân, cụ thé la may anh

Cac hang san xuat may anh nhu Canon, Fujifilm, di dua ra nhiéu san pham dé đáp ứng nhu cầu của người dùng Nhưng vấn đề là người dùng chưa biết đến những sản phẩm cũng như thông tin về các loại sản phẩm

Ngày nay, việc áp dụng công nghệ thông tin vào hâu hết các lĩnh vực của đời sống

đã trở nên quá quen thuộc Vì vậy , chúng tôi đã xây dựng một website thương mại điện tử nhằm cung cấp thông tin, giá cả một cách chỉ tiết nhất đối với từng sản phâm

và cung cấp các sản phẩm tốt nhất đến tay người dùng

Mục tiêu chính của dé tài là nghiên cứu, xây dựng website thương mại điện tử Là một kênh giúp người dùng nắm được thông tin và lựa chọn được sản phẩm phủ hợp

với bản thân mình nhất

* Giúp người dùng tiếp cận thông tin từ hãng sản xuất

*ˆ Cung cấp sản phẩm tốt nhất đến tay người dùng

* Cung cấp các dịch vụ hỗ trợ khách hàng một cách tôi ưu nhất

1.2 Giới thiệu Wordpress

1.2.1 Đối tượng:

- _ Sinh viên trường Đại học Thủ Dầu Một

- Nguoi co nhu cau su dung web

- Dai digén m6t so hãng sản xuat may ảnh

1.2.2 Phạm vi nghiên cứu:

- Công tác thu thập, tông hợp ý kiến phản hồi của người sử dụng

- Thu thập ý kiến của đại diện các công ty, nhà phân phối

1.2.3 Cách tiếp cận

- Tìm hiệu thực trạng về nhu câu của người mua

- Tìm hiểu các ngôn ngữ lập trình và kỹ thuật xây đựng ứng dụng web đáp ứng các yêu câu đề ra

1,2,4 Phương pháp nghiên cứu:

®_ Phương pháp nghiên cứu lý thuyết

- _ Nghiên cứu xây dựng hệ thống Website bằng mã nguồn mở

- Ly thuyét phân tích thiết kế hệ thống

® Phương pháp thực nghiệm

Lập trình thiết kế website

Triển khai lấy ý kiến của cựu sinh viên khoa CNTT trường Đại học Thủ Dầu Một đang làm việc tại một số công ty

Lấy ý kiến của đại diện nhà phân phối và công ty bằng cách mời qua email

CHƯƠNG2 THIẾT KẺ WEBSITE THƯƠNG MẠI ĐIỆN TỬ

2.1 Mô tả hệ thống

Các nhà phân phối và các nhà bán lẻ trên toàn quốc cần một hệ thông có khả năng cung cấp thông tin cho người dùng, cung cấp sản phẩm, dịch vụ đến người dùng một cách để dàng nhất và tiếp nhận những ý kiến phản hồi của người dùng về các sản phẩm

Từ các thông tin này các hãng sản xuất sẽ biết được nhu cầu thực tế của thị trường Từ đó có những đổi mới phù hợp hơn với người dùng

Yêu cầu đặt ra cho hệ thống là:

- Cung cap hệ thống mua bán trực tuyến một cách tối ưu hoá

- Cung cấp thông tin về sản phẩm

- Cung cấp hệ thông đánh giá, phản hồi

2.2 Yêu cầu tông thể

2.2.1 Quản lý danh mục

- Danh mục sản phâm

2.2.2 Yêu cầu chức năng hệ thống

2.2.2.1 Chúc năng admin

- _ Quản trị doanh nghiệp

- Quan ly hang trong kho

- Quan ly giá cả sản phẩm

- Quan tri ý kiến phản hồi

- Quan tri tai khoan

2.2.2.2 Chúc năng cho người dùng

- _ Giao điện tra cứu và mua sản phẩm

- _ Giao diện phản hồi ý kiến.

KING CAME I Trang Cha Giớithiệu Liênhệ Danh mục sản phẩm V

SALE

Hàng mới về

Hàng bán chạy

Bai viet

LILILLLILLLIHLIL LILILLLILLLIHLIL LILILLLILLLIHLIL

CHƯƠNG 3 CÀI ĐẶT CHƯƠNG TRINH

3.1 Giao diện của máy khách

(cs

KING CAME

eS

aa oe =

Hình 1 Giao diện trang chủ của máy khách

HÀNG MỚI VỀ

CoN TSS CÓ >

ae a id

-

@® QUICK VIEW

9,460,000 HOTSHOE FLASH CAT BOX

Hinh 2 Giao dién trang chu cua may khdach.

HÀNG BÁN CHẠY

1

adel š ] 1

}

MAY ANH CANON EOS 800D KIT EF- MAY ANH CANON EOS M3 KIT EF-M15- Ong Kinh Sigma 17-50mm ti2.8EXDC COMBO Bé vé sinh may anh Canon 7 int

$18-55MM F4-5.6 1S STM 45 |S STM + NGAM CANON EF-EOS M OS HSM for Canon +Bút lau len than hoạt tính 14.800 0004 8,990,000# 7,200,000# 39,000

Hình 3 Giao diện trang chủ của máy khách

SALE

7 IN 1 orton Y Ex & Add to Wishlist

= Canon

—=

@ QUICK VIEW

COMBO Bé vé sinh may anh Canon 7 int MAY ANH CANON EOS 800D KIT EF- MAY ANH CANON EOS M3 KIT EF -4415-

HOTSHOE FLASH CAT BOX

99,0004

Hình 4 Giao diện trang chủ của máy khách

BÀI VIẾT

Bài viết mới

„_ Đánh giá Canon EOS M3 Thang Mt

Hình 5 Giao diện trang chủ của máy khách.

KING CAME

GIỚI THIỆU } - GIỜI THIẾU

Sử mệnh của cóng ty

Tâm nhìn công ty

Định hướng phát triển của công ty

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

> \ J

11°11'00.7°N 106°42'33.8°E

on * ơn Á too

Car oa

+

Hình 7 Giao diện trang liên hệ

TRANG CHỦ GIỚI THIỆU LIEN HE DANH MUC SAN PHAM v Ao ¬

ma a nã ì - đểm

MAY ANH MICROLESS > CANON

SONY

Tuyển dụng Chinh sách vận chu

Chinh sách mua trả góp

ATED

Hình 9 Giao dién footer

May anh Fujifilm X-T4 (Black,

Ea Q

Rodv Onlv) | Chinh hana

Hình 8 Giao di ê phâân danh mục sản phẩm

TU DẤU 39,350,000đ

Thông tin nỗi bật

THÊM VÀO GIÓ HÀNG

9 Add to Wishlist Danh myc:

Từ khỏa:

Chat with us @É

ae 2 Mee oe

Hình 10 Giao diện khi xem sản phẩm

SÂN PHÁM GIÁ SỐ LƯỢNG TẠM TÍNH

May Anh Fujifilm X-T4 (Black, Body Only) | Chinh

Hang

CONG GIO HANG Tam tinh

Van Chuyén Dén $6 21, Bac Tân Uyên, Bình Dương, Binh

Dương

DOI DIA CHỈ

Téng 39,350,000đ

03/07 )) l1 2/10) 0/0/(-

Hình 11 Giao diện giỏ hàng.

THONG TIN THANH TOÁN

Tên ~

Tên công ty (tuỷ chọn)

Việt Nam

ĐỊa chỉ ~

Dia chi

Mã bưu điện (tuy chon)

Ho >

Hình 12 Giao diện thanh toán

Chat with us &Ÿ

H

SAN PHAM TAM TÍNH

May Anh Fujifilm X-T4 (Black, Body Only) | Chính Hãng x 1 39,350,000đ

Tạm Tính 39,350,000

Giao Hang Mién Phi Giao Hang

Téng 39,350,000đ

@ _ Chuyên khoản ngân hàng

Thực hiện thanh toán vào ngay tài khoản ngân hảng của chúng tôi Vui lỏng sử dụng Mã đơn hàng của ban trong

phan Ndi dung thanh toán Đơn hàng sẽ duoc giao sau khí tiền đã chuyên

- Chat with us &É

© Tra tién mat khi nhận hàng

Hình 13 Giao diện thanh toán

3.2 Giao diện trang đăng nhập

Tên người dùng hoặc Địa chỉ Email Mật khẩu

Ban quên mật khẩu?

— Quay lại KING CAME

3.3 Giao diện trang quản trị

ÑW @ mnccAMc ©

zÈ Riviết

Sm)

Poo

cad

ed

cm

@ Sin prin

Thêm mới

Co

Pye

Sd)

© Femonte

Trang chu

eye Paes aa

Can we take only 2 minutes of your time? ' can create even greater free stuff in the fut

Ni

Thư viện

Te)

Form lién hé

We te erent es

WooCommerce

earn

SR alias

This theme recommends the following plugin: Ocean E

Analytics

Tiếp thi

KH Xin chào! Bạn đã đăng nhập vào k

ey ee Hay bat dau bang cac lién két dudi day:

Hay Bat Dau

Hinh 15 Giao dién trang quan tri

+ Mới W@fotte

Hình 16 Giao diện thêm sản phẩm

Crores | Đăng

‘6k Dan ofsap Shinn ss thị: Công ki4 ;ftith sua

$ ngay lập tee Chinn sie

Ảnh sản phẩm Ava

Thiết lập ảnh sản phẩm

Album hình ảnh sản

phẩm

Thêm ảnh thư viện sản phẩm

Hình 17 Phâân thêm ảnh cho sản phẩm

| Bulk actions mA | [Aeouns | [ Chọn danh mục Mi Lọctheo loạisảnphẩm v |Í Lọc theo trạng thải kho ⁄ | [ic | 10 mục

Mãă sản phấm h ° Custom

) T Ki h T N

Thing rac | Xem | EA Duplicator | od

Sao chép

6

O HOTSHOE FLASH CAT BOX - Con hang 428,000¢ — TRANG TRI che flash, WY (Da must bin

29.0000 HOTSHOE 27/11/2020 lúc 8:12

sáng

Hình 18 Danh mục quản lý sản phẩm.

CHUONG 4 KET LUAN VA HUONG PHAT TRIEN

4.1 Những kết quả đạt được

Hệ thống được xây dựng trên nền Web bằng việc áp dụng ngôn ngữ lập trình thông dụng nhất hiện nay: PHP, Javascript, HTML5, Bootstrap Framwork

Website giúp người sử dụng tiếp cận thông tin từ hãng sản xuất một cách đễ dàng

và nhanh chống đồng thời cũng giúp nhà bán lẻ có thể đễ dàng cung cấp thiết bị cũng như các dịch vụ tốt nhất đối với người dùng

Bên cạnh đó việc áp dụng công nghệ responsive giúp website có thê hiển thị đẹp

va gon gan trén cac thiết bị di déng: smart phone, tablet

4.2 Những hạn chế của đề tài

e Chua thong ké tong hợp được đa chiều, dữ liệu lưu trữ chưa tối ưu

e Phần thanh toán còn thiếu một số phương thức

e - Hệ thống vẫn còn thiếu nhiều chức năng tiện ích

e Mật khẩu của các tài khoản vẫn chưa được mã hóa

e Tính năng trò chuyện, tư vẫn khách hàng chưa được liên kết với các mạng xã hội lớn hiện nay như facebook,

4.3 Hướng phát triển

Với những hạn chế trên, trong thời gian tới hệ thống sẽ được hoàn thiện, phát triển hơn các nội dung:

- Mã hóa mật khâu của các tài khoản

- Thêm các tiện ích khác, thực hiện thông kê theo nhiều khía cạnh khác nhau

- Tích hợp thêm nhiều phương thức thanh toán

- Liên kết tính năng trò chuyện, tư vấn khách hàng thông qua các mạng xã hội

lớn.

TÀI LIỆU THAM KHẢO [I] Về tiêu chí đánh giá chất lượng giảng dạy của giảng viên (Đan hành kèm theo

Quyết định số 1080/QĐ-ĐHHDĐ, ngày 22/10/2008 của Hiệu trưởng trường Đại

học Hồng Đúc)

L2]

[3] https://binhminhdigital.com/

[4| https://ictnews vietnamnet vn/cuoc-song-so/xa-hoi/mua-sam-online-tiep-tuc- tang-nguol-viet-chu-trong-mua-thuc-pham-256601 html

ST | Tên thành viên Nội dung công việc Kết Quả

1 Nguyễn Hoàng Hiệp Lên ý tưởng web

Phát khảo giao diện web

Thiết kế web

Làm bannel quảng cáo

Thực hiện báo cáo chương 3,4

Khảo sát nhu cầu sử dụng máy ảnh

Tìm hiểu về sản phẩm

Nhập thông tin sản phâm

Hoàn thành

2 Trần Quay Tín Phát khảo giao diện web

'Vẽ các mục menu

Thực hiện báo cáo chương 3,4

Khảo sát nhu cầu sử dụng web thương mại

Hoàn thành

3 Lê Nhật An Thực hiện báo cáo chương

12 Đóng góp ý tướng làm web

Hoàn thành

4 Lâm Văn Dương Thực hiện báo cáo chương

12 Tìm logo của trường làm trang bìa

Đóng góp ý tưởng làm web Tim hiéu plugin Tidio chat

Hoan thanh

Thực hiện báo cáo chương

12 Hoàn thành