Thiết kế web (12) Đề tài xây dựng website shop thới trang

Việc các doanh nghiệp đang dần hoàn thiện bộ máy tổ chức một cách linh hoạt nhất và việc ứng dụng công nghệ thông tin vào mọi hoạt động kính doanh của doanh nghiệp là một việc làm tất yế

TRUONG DAI HQC CONG NGHE THONG TIN VA

TRUYEN THONG VIET - HAN KHOA KHOA HQC MAY TINH

VU

THIET KE WEB (12)

DE TAI: XAY DUNG WEBSITE SHOP THOI TRANG

Sinh viên thực hiện NGÔ MINH PHU

ĐÀO LỄ QUÓC KHÁNH

BÙI VĂN NHẬT Giảng viên hướng dan: ThS LUONG KHANH TY

Đà nẵng, tháng 06 năm 2022

TRUONG DAI HQC CONG NGHE THONG TIN VA

TRUYEN THONG VIET - HAN

KHOA KHOA HOC MAY TINH

THIET KE WEB (12)

DE TAI: XAY DUNG WEBSITE SHOP THOI TRANG

Da Nang, thang 06 nam 2022

MO DAU

Ngày nay cùng với sự bùng nỗ của Internet, ngày càng mở rộng ở khắp nơi

trên thê giới, chỉ cần máy tính kết nôi Internet thì việc sử dụng nguôn tải nguyên

này là vô củng phong phú

Việc các doanh nghiệp đang dần hoàn thiện bộ máy tổ chức một cách linh hoạt nhất và việc ứng dụng công nghệ thông tin vào mọi hoạt động kính doanh của doanh nghiệp là một việc làm tất yếu, một trong những cải tiến đó là doanh nghiệp đã chủ động xây đựng những trang thông tin của riêng mình để quảng bá hình ảnh của công ty, mặt khác là đề kinh doanh trực tuyến, áp dụng thương mại điện tử vào trong thương mại

Và một trong những công cụ hữu ích nhất cho việc phát triển này đó là xây dựng được một dự án công nehệ thông tin hoàn chỉnh, đáp ứng được các nhu câu của người dùng

Đối với ngành thời trang, việc ứng dụng công nghệ thông tin cũng giúp

cho các shop xử lý công việc chính xác, hiệu quả, tiết kiệm chỉ phí, quảng bá hình ảnh shop rộng rãi trong nước và quốc tế Từ những kiến thức được học, em đã tìm

hiểu về đề tài “Xây dựng trang web shop thời trang”

LOI CAM ON

Đê hoàn thành báo cáo này trước tiên chúng em xin gửi đến thây piáo Lương Khánh Tý - người trực tiếp hướng dân đô án cơ sở lời cảm ơn sâu sắc nhật

Cảm ơn thầy đã quan tâm, hướng dẫn và định hướng cho chúng em về hướng đi và phát triển của đề tài, cũng như cung cấp kiến thức về lý thuyết để thực hiện sản phẩm

Vị khả năng sinh viên còn han chế, trong quá trình học tập, hoàn thiện báo cáo bài tập này sinh viên không tránh khỏi những sai sót, kính mong nhận được những ý kiến đóng góp từ giáo viên hướng dẫn

Cuối cùng chúng em kính chúc thầy giáo đồi dào sức khỏe và đạt được nhiều thành công tốt đẹp trong công việc

Em xin chân thành cảm ơn!

CHƯƠNG 2_ CƠ SỞ LÝ THUYẾT 22©2++2E22EEE22E222E2722c2xe2 3

CHƯƠNG 3 TRIÊN KHAI XÂY DỰNG -2- 22 2122222222112 xe 6

CHƯƠNG 4 KÉT LUẬN VÀ HƯỚNG PHÁT TRIÉN 22225252 12

Hinh 6 - Trang chủ và Banner - i12 121121121 12512111212 1151111111811 1 1 kg 7

DANH MUC CUM TU VIET TAT

1 Application Programming Interface API

2 Asynchronous JavaScript and XML AJAX

3 Cascading Style Sheets CSS

4 Content Delivery Network CDN

5 Document Object Model DOM

6 Extensible Markup Language XML

CHUONG 1 GIOI THIEU

cầu mua sắm của khách hảng tiện lợi va dé dang hơn khi xưa

Đề tài này nhằm mục tiêu xây dựng một website dé quản lý một shop thời trang trong việc các khách hàng sẽ thông qua website này để tiến hành lựa chọn trang phục, phụ kiện, tìm hiểu kĩ cảng hơn về shop cũng như tiến hành việc đặt hàng đề cho tiện lợi hơn cho nhu cầu mua

săm của khách hảng

1.3 Mục tiêu

Với những yếu tổ thuận lợi bên trong và bên ngoài, cùng với tiềm năng phát triên thị trường kinh doanh bên website ở Việt Nam chính là cơ sở dé chúng em tin rằng website shop thời trang Degrey

sẽ trở thành:

® - Nơi giao tiếp hiệu quả với khách hàng

e - Cung cấp cho khách hàng cơ hội mua hàng hóa và sử đụng dịch vụ với sự trợ giúp của hệ thống thanh toán điện tử mà không cần rời

khỏi nhà

e - Cung cấp các thông tin hoặc thông báo cho khách hàng, đối tác, nhân viên về các hoạt động của công ty và phạm vi địch vụ được

cung cấp;

® - Tăng cơ sở khách hàng hiện có, tiếp cận khách hàng mới và

tăng chuyên đổi thành khách hàng tiềm năng

1.4 Logo website

DEGIEY

Hinh 1 — Logo website shop thoi trang DEGREY

Céng cu thiét ké website

công cụ hồ trợ dinh dang nhu CSS, SCSS dé tao mét website tinh

- Su dung Sublime Text 3: là phần mềm lập trình đa nền tảng, là một editor nôi tiếng cho các lập trình viên có thê chạy trên nhiều hệ điều

hành máy tính

CHUONG2 COSOLY THUYET

2.1Khai niém website

Website (tiéng Anh: website), con gọi là trang web (có thê nhằm lẫn với

"web page") hoặc trang mạng, là một tập hợp trang web, thường chỉ nằm

trone một tên miễn hoặc tên miền phụ trên World Wide Web cua Internet

Một trang web là tập tin HTML hoặc XHTML có thể truy nhập dùng giao thức HILTP Trang mạng có thé duoc xây dựng từ các tệp tin HTML (trang mạng tĩnh) hoặc vận hành bằng các CMS chạy trên máy chủ (trang mạng động)

Trang mạng có thê được xây dựng bằng nhiều ngôn ngữ lập trình khác nhau (PHP, ASP.NET, Java, Ruby on Rails, Perl )

Website được giao tiếp và hiến thị cho người dùng truy cập bằng các

phân mềm được goi la trình duyệt website Một sô trình duyệt website nỗi

tiếng có thê kế đến như Internet Explorer được cài đặt mặc định vào mỗi máy tính cài hệ điều hành windows và được thay thế bởi Edge trén Windows 10 hay Chrome được phát triển bởi Google và Firefox được phát triển bởi

Mozilla

Để một website hoạt động cần 3 yếu tố:

- _ Cần có tên miền

- - Nơi lưu trữ website

- - Nội dung các trang web hoặc cơ sở đữ liệu thông tin

2.2 Có hai loại web: Web nh và Web động:

- _ Website tĩnh là website mà người quản trị (những người không phải

là lập trình viên) không thể tùy ý thay đổi nội dung và hình ảnh mà

phải cần kiến thức về HTML cơ bản Website tĩnh được viết hoản

toàn dựa trên nền tảng HTIML CSSvà thêm các hiệu ứng tir Javascript nếu muốn

- - Website động là website được viết kèm theo một bộ công cụ quản tri dé tùy biến nội dung dành cho webmaster (người quản trị) có thể

dễ dàng thay đổi nội dung, hình ảnh Website động được thiết kế bởi các lập trình viên để làm sao cho phép website có thê thay đổi được nội dung thường xuyên Một số công nghệ, ngôn ngữ để xây dung website dong bao g6m PHP, ASP.NET, Java,

2.3 Lịch sử hình thành và phát triển của website

Nhiều người vẫn thường có thói quen sử dụng hai từ World wide web và Internet thay thê cho nhau, nhưng thực ra đây lại là hai khái nệm hoàn toàn khác nhau Internet có nghĩa là một “mạng lưới toàn cầu của các mạng lưới”, liên kết hàng triệu các máy tính cùng chia sẻ thông tin thông qua một tập hợp những ø1ao

3

thức chia sẻ phần mềm Ngược lại, có các ứng dụng lại sử dụng mạng Internet như một phương tiện để giao tiếp như thư điện tử, trò chuyện toàn cầu và mạng

toàn cầu

Lịch sử của Web

Web xuất hiện lần đầu tiên vào năm 1989 khi nhà vật ly hoc Tim Berners- Lee muốn tìm ra một cách thức giúp các nhà khoa học trao đôi tài liệu nghiên cứu thông qua Internet Berners-Lee muốn rằng đó không chỉ là cách in các văn bản trực tiếp trên Internet mà còn là cách hiển thị các đường dẫn dé đưa người đọc đến các phần khác của tài liệu, hoặc thậm chí là dẫn đến các tài liệu được đặt ở một nơi khác trên mạng Internet Điều đó có nghĩa là tạo nên một hệ thống tài liệu được kết nối toàn cầu

Thực ra thì Berners-Lee không phải là người đưa ra ý tưởng này đầu tiên Ngay

từ những năm 40, các nhà nghiên cứu khác cũng đã từng mô tả một hệ thống tương tự, và vào khoảng những năm 80, các ứng dụng như Ngôn ngữ đánh dấu tông quát chuẩn (SGML) cũng đã sử dụng một tập hợp phức tạp các siêu liên kết

đề kết nối các tài liệu lại với nhau Nhưng Berners-Lee đã phát triển một hệ thống

mà trong đó không đòi hỏi phải sử dụng các phần mềm mắc tiền hay những kỹ năng lập trình cao Ông đã phát minh ra một giao thức cơ bản cho việc chuyên tải các tài liệu lên mạng Internet, sọi là Giao thức truyền siêu van ban (HTTP) cting

như phát minh ra một bộ đơn giản các lệnh gọi là Ngôn ngữ đánh dấu siêu văn bản (HTML) đề mô tả cấu trúc của một tài liệu

Web da bung nỗ vào năm 1993 khi một sinh viên tốt nghiệp trường Đại học Illinois tén 14 Mare Andreessen phat triển thành công một phần mềm giúp hiển thị các trang Web dưới dang đồ họa Phần mềm của Andreessen, được gọi là một

“trình duyệt”, cho phép người sử dụng có thê hiền thị hình ảnh cũng như văn bản trên các trang web Kết quả là Web đã lớn mạnh nhanh chóng, vượt ra khỏi cả phạm vi sử dụng nhỏ hẹp ban đầu của các nhà khoa học Sau đó Andreessen đã

tiếp tục đồng sáng lập Netscape Communications, đánh dấu cho sự khởi đầu của

cuộc cách mạng Internet

Lí do gì làm cho Web thành công đến như vậy?

Web phát triển như vậy không chỉ vì nó đễ sử dụng mà còn vì bất cứ ai cũng có thể thực hiện trang Web riêng của họ Ngôn ngữ HTML cơ bản rất dễ học Nó sử dụng một tập hợp các đuôi đơn giản giúp mô tả các đầu đề, đoạn văn, danh sách, các bảng và các thành tố khác của một trang Web Mới đây, nhiều công ty đã phát triển phần mềm xử lý tự động hóa, làm cho việc học HTML trở

nên không còn cần thiết nữa Nhờ đó, hàng triệu người với vốn kinh nghiệm it oi

cũng đã có thê lập trang Web cho riêng mình

Loi ich khi có website

Chỉ phí thấp so với các ấn phâm thông thường

Thị trường mở rộng

Đa dạng hóa doanh thu

Phục vụ 24/7 và 365 ngày

Thuận tiện

Thêm gia tri gia tang va hai long

Cai thién tin cay

Cơ hội tăng trưởng, đễ dàng nhận thông tin phản hồi

CHUONG 3 TRIEN KHAI XAY DUNG

1.5 Hinh anh website quan ly nha hang gold

1.5.1 Dang nhap, dang ki

Khách hang có thê đăng nhập dé có thế đặt hang một cách đễ dàng hơn, nếu

chưa có tài khoản khách hang có thê đăng kí tại trang đăng kí

1.5.2 Thanh header, menu

Nằm ở trên cùng của web, chứa logo của website, của shop, các đường dẫn sang cac trang khac Xuat hiện ở tật cả các trang HTML thuộc website shop thời trang DEGREY

DE€3EU' Trangehù Sảnphẩm Giớihiệu Sựkiệnmớinhất Héthdng ca hang Hướng dẫnđậtảng

Hình 4 - Thanh header, menu

1.5.3 Thanh footer

Nằm ở dưới cùng của web, chứa đường dẫn tới các trang mạng xã hội thuộc

shop DEGREY

.9 Ø9 8 ở + Shop s Hưởng đẩnđậthờng « Chinhsáchvâquy#nh « Chính sàch bảo mặt

« Thôn fined how

đầu tiên và bên cạnh đó sẽ có nhiều thông tin liên quan Phần nội dung sẽ hiển

thị các trang phục được mua nhiều nhất giúp cho khách hang dễ dàng lựa chọn

DEG3EU' Trangchủ Sảaphẩm Gieithiệu Sựk#nmớinhất Hệhốngcừahảng Hướng dẫn đậthàng a œ

1.5.5 Trang giới thiệu

Hiền thị những hình ảnh sơ lược thông tin của shop

DE€G5EU' Trangchủ Sảnphẩm Giớithệu Sự kiện mớinhất Hệ thổngcửừaháng Hướng dẩn đặt hàng Qa 'Ð

-

Danh mục Happy birthday Xoài bếu,

lại già thêm 1 tuổi

Instagram

Hinh 10 - Trang sw kién

1.5.8 Trang hé thong cira hang

Hién thị các hệ thống cửa hàng mà shop hiện có để khách hang có thể đến

CHƯƠNG4 KẾT LUẬN VÀ HUONG PHAT

TRIEN

Qua việc làm đô án này, em xin đưa ra kêt quả thu được như sau:

¢ Ban thân tích lũy được kinh nghiệm trong việc phân tích và thiết kế hệ thống

® - Xây dựng được website sử dụng công cụ Bootstrap và JavaScrip

thông tin

thông tin cá nhân

Về hạn chế:

Hướng phát triển

e - Xây dựng được giao diện thân thiện hơn với người dùng,

e© _ Xây dựng thêm nhiều chức năng đề hệ thống đầy đủ và toàn vẹn hơn

© _ Tìm hiểu xu hướng của người dùng đề chỉnh sửa, bố sung hệ thống phù hợp theo yêu cau

12