ĐỀ TÀI XÂY DỰNG WEBSITE BÁN GIÀY

Bạn đang xem bản rút gọn của tài liệu. Xem và tải ngay bản đầy đủ của tài liệu tại đây (254.8 KB, 14 trang )

Trang 1<div class="page_container" data-page="1">

ĐẠI HỌC BÁCH KHOA HÀ NỘI

TRƯỜNG CÔNG NGHỆ THÔNG TIN VÀ TRUYỀN THÔNG──────── * ────────

BÁO CÁO TIẾN ĐỘ HỌC PHẦN

PROJECT 1

TÊN ĐỀ TÀI

XÂY DỰNG WEBSITE BÁN GIÀY

Giảng viên hướng dẫn: Th.S Trần Thị Dung

Sinh viên thực hiện : Đỗ Ngọc Hiếu – 20210144P Lớp : CNTT 1.2 - K66

</div>Trang 2<div class="page_container" data-page="2">

Chương 2: Tìm Hiểu Về Các Cơng Nghệ Hiện Nay...7

Chương 3: Trang Web Bán Giầy...12

Kết Luận...14

Tài Liệu tham Khảo...14

</div>Trang 3<div class="page_container" data-page="3">

LỜI CẢM ƠN

Sau khoảng thời gian ngắn cụ thể là tuần đầu tiên nghiên cứu Project I, dưới sự chỉ bảo tận tình của cơ Th.s Trần Thị Dung. Em không chỉ lên ý tưởng để xây dựng đề tài cho Project I mà còn học hỏi được rất nhiều kiến thức mới.

Để được như vậy, em vơ cùng biết ơn cơ đã tận tình chỉ bảo, hướng dẫn, truyền đạt những kiến thức, kinh nghiệm quý báu cho Em trong khoảng thời gian qua.Với lòng biết ơn chân thành, em xin gửi lời chúc sức khoẻ và những gì tốt đẹp nhất đến các thầy cô trong khoa, trong nhà trường và đặc biệt là cô Th.s Trần Thị Dung.

Sinh Viên Thực Hiện Hiếu

Đỗ Ngọc Hiếu

</div>Trang 4<div class="page_container" data-page="4">

LỜI NHẬN XÉT CỦA GIÁO VIÊN

</div>Trang 5<div class="page_container" data-page="5">

TÓM TẮT CHỦ ĐỀ PROJECT 1

Ngày nay với sự phát triển mạnh mẽ như vũ bão của Internet, cuộc sống của con người đãcàng ngày càng trở nên phong phú và đa dạng hơn. Internet cũng như mạng xã hội đã làmthay đổi đáng kể nhiều lĩnh vực, từ học tập, nghiên cứu cho đến kinh doanh và thươngmại, đặc biệt là trong thị trường thương mại điện tử.Trong môi trường thị trường ngàynay, việc phát triển một trang web bán hàng là một bước quan trọng đối với các doanhnghiệp muốn nắm bắt cơ hội kinh doanh trực tuyến. Trong đề tài này, em đã tiến hànhphân tích và xây dựng một trang web bán giày với mục đích phục vụ cả nhu cầu mua sắmvà nắm bắt xu hướng thị trường của người tiêu dùng hiện đại.

Trang web của em được thiết kế để cung cấp một trải nghiệm mua sắm trực tuyến thuậntiện và thú vị. Em đã tập trung vào việc tạo ra một giao diện người dùng thân thiện, dễ sửdụng và hiệu quả để khách hàng trong thực tế có thể dễ dàng tìm kiếm và mua các sảnphẩm giày mình mong muốn.

Thơng qua việc tìm kiếm trên mạng về những đề tài nghiên cứu thị trường và phân tíchxu hướng, em đã xác định các loại giày phổ biến và sở hữu một bộ sưu tập đa dạng đểđáp ứng nhu cầu của đa dạng đối tượng khách hàng trong thực tế. Đồng thời, em cũngđặc biệt chú trọng vào việc cung cấp thông tin chi tiết về sản phẩm, từ hình ảnh đến mô tảvà thông số kỹ thuật, nhằm giúp khách hàng đưa ra quyết định mua hàng chính xác vàthơng minh.

Ngồi ra, em cũng tích hợp các tính năng tiện ích như hệ thống tìm kiếm nâng cao giúpkhách hàng trong thực tế có thể tìm kiếm thơng tin về sản phẩm giày một cách dễ dàng,tính năng đánh giá và nhận xét từ người dùng, tính năng đặt hàng và giao hàng online,cũng như chính sách đổi trả linh hoạt, nhằm tăng cường niềm tin và sự hài lòng của kháchhàng.

Với sự kết hợp giữa thiết kế chuyên nghiệp, sản phẩm đa dạng và dịch vụ khách hàng tậntình, trang web bán giày của em hướng đến mục tiêu trở thành điểm đến hàng đầu chonhững người yêu thích giày dép và đam mê mua sắm trực tuyến.

Được cơ Th.s Trần Thị Dung tận tình giúp đỡ cùng sự cố gắng của cá nhân, Project nàyđã hoàn thành đúng tiến độ của mỗi tuần. Do thời gian, tài liệu và năng lực bản thân cònhạn chế nên Project này khơng thể tránh khỏi những sai sót. Vậy kính mong cơ và cácbạn trong nhóm trao đổi và đóng góp thêm ý kiến để em tiếp tục hồn thiện Project nàytrong thời gian tới.

</div>Trang 6<div class="page_container" data-page="6">

Chương I : Đặt Vấn Đề

Trong thời đại số hóa ngày nay, việc có mặt trực tuyến là khơng thể phủ nhận trong chiếnlược kinh doanh của bất kỳ doanh nghiệp nào, đặc biệt là trong lĩnh vực bán hàng. Tronglĩnh vực bán giày, nhu cầu mua sắm trực tuyến đang trở nên phổ biến hơn bao giờ hết,khi người tiêu dùng trở nên thuận tiện hơn trong việc tìm kiếm và mua các sản phẩm màhọ quan tâm chỉ qua một vài cú click chuột. Trong bối cảnh này, việc xây dựng một trangweb bán giày không chỉ là một cơ hội mà còn là một yêu cầu cần thiết để tồn tại và pháttriển trong thị trường cạnh tranh.

Tuy nhiên, việc xây dựng một trang web bán giày không chỉ đơn giản là việc tạo ra mộttrang web đẹp mắt và chứa đựng các sản phẩm. Đó là một quy trình phức tạp địi hỏi sựkết hợp giữa kiến thức về công nghệ, hiểu biết về thị trường và sự hiểu biết về người tiêudùng. Đầu tiên và quan trọng nhất, doanh nghiệp cần xác định mục tiêu kinh doanh cụ thểcủa mình khi xây dựng trang web bán giày. Có thể là tăng doanh số bán hàng, mở rộngthị trường tiềm năng hoặc xây dựng thương hiệu trực tuyến mạnh mẽ. Mục tiêu này sẽđịnh hình chiến lược phát triển trang web và các hoạt động kinh doanh đi kèm.

Tiếp theo, để xây dựng một trang web bán giày thành công, việc hiểu rõ về đối tượngkhách hàng là vô cùng quan trọng. Việc nắm bắt được sở thích, nhu cầu mua sắm và hànhvi trực tuyến của khách hàng sẽ giúp doanh nghiệp tạo ra trải nghiệm mua sắm tối ưu vàtạo ra các chiến lược marketing hiệu quả. Đồng thời, việc nghiên cứu thị trường cũng làbước quan trọng để hiểu rõ về cạnh tranh và xu hướng trong ngành bán giày, từ đó đưa ranhững quyết định kinh doanh đúng đắn và linh hoạt.

Bên cạnh việc xác định mục tiêu kinh doanh và hiểu rõ về đối tượng khách hàng, việc lựachọn cơng nghệ và bố cục cho trang web cũng đóng vai trị quan trọng. Cơng nghệ phùhợp sẽ giúp trang web hoạt động một cách mượt mà và linh hoạt, đồng thời cung cấp trảinghiệm người dùng tốt nhất có thể. Bố cục của trang web cũng cần được thiết kế sao chohấp dẫn và dễ sử dụng, giúp người dùng dễ dàng tìm kiếm và mua sắm sản phẩm.

Tóm lại, việc xây dựng một trang web bán giày là một q trình phức tạp địi hỏi sựchun nghiệp và sự hiểu biết sâu sắc về thị trường và công nghệ. Tuy nhiên, nếu thựchiện đúng cách, trang web này có thể trở thành cơng cụ mạnh mẽ giúp doanh nghiệp tăngcường doanh số bán hàng và xây dựng thương hiệu trực tuyến một cách hiệu quả.

Hướng Giải Quyết:

- Tìm hiểu về những cơng nghệ để xây dựng một trang web hiện nay.

- Chắt lọc và lựa chọn những công nghệ để áp dụng vào đề tài của Project 1.- Nêu ra những tính năng cơ bản cần có được áp dụng vào Project 1.

</div>Trang 7<div class="page_container" data-page="7">

- Bài Báo Cáo làm trong tuần đầu tiên.

Chương II : Tìm Hiểu Về Các Cơng Nghệ Hiện Nay

Nghiên cứu những công nghệ để xây dựng một trang web hiện nay

I. Những bố cục cũng như công nghệ để xây dựng lên một trang web hiện nay

Sau một khoảng thời gian nghiên cứu, tìm hiểu phân tích cũng như chắt lọc thơng tin từ nhiều nguồn tham khảo trên mạng, em nhận ra rằng có nhiều sự lựa chọn để xây dựng bố cục cho một trang web, dưới đây là một số bố cục mà em đã tìm hiểu :

 Mơ hình Static Website: Trang web tĩnh khơng có tính năng tương tác động.

Thường được xây dựng bằng HTML và CSS. Thích hợp cho các trang web thông tin cơ bản như trang giới thiệu doanh nghiệp, trang web cá nhân, trang web bảng giá.

 Mơ hình Dynamic Website: Trang web có khả năng tương tác động, dữ liệu có

thể thay đổi theo thời gian. Sử dụng ngơn ngữ lập trình back-end như PHP,

Python, Ruby, hoặc Node.js để tạo ra nội dung động. Thích hợp cho các trang webnhư blog, diễn đàn, trang tin tức.

Hình 1: So sánh giữa web tĩnh và web động

 Mơ hình Single Page Application (SPA): Trang web hoạt động như một ứng

dụng, tất cả nội dung được tải một lần duy nhất khi trang được truy cập lần đầu tiên. Sử dụng JavaScript frameworks như React.js, Vue.js hoặc Angular để quản lýgiao diện người dùng và tương tác với máy chủ thông qua API. Cung cấp trải nghiệm người dùng mượt mà và nhanh chóng, phù hợp cho các ứng dụng web phức tạp như các dịch vụ trực tuyến, ứng dụng đòi hỏi tương tác cao.

</div>Trang 8<div class="page_container" data-page="8">

Hình 2: Mơ Hình SPA

 Mơ hình MVC (Model-View-Controller): Mơ hình phát triển phổ biến trong

việc xây dựng các ứng dụng web và phần mềm. Mơ hình này phân chia ứng dụng thành ba thành phần chính: Model, View, và Controller. Mơ hình MVC tách biệt các loại nhiệm vụ khác nhau của ứng dụng, giúp làm rõ vai trò và trách nhiệm của mỗi thành phần. Điều này làm cho mã nguồn trở nên dễ bảo trì, mở rộng và tái sử dụng. Ngồi ra, nó cũng tạo điều kiện thuận lợi cho việc phát triển song song của ứng dụng, khi nhiều nhóm có thể làm việc trên các phần khác nhau của mơ hình mà khơng ảnh hưởng đến nhau.

Hình 3: Mơ Hình MVC

 Mơ hình Progressive Web Application (PWA): Kết hợp giữa tính năng của

trang web và ứng dụng di động. Có khả năng hoạt động offline và có thể cài đặt trên thiết bị như một ứng dụng di động thông thường. Sử dụng các công nghệ như Service Workers và Web App Manifest để cung cấp trải nghiệm người dùng tốt nhất trên nhiều nền tảng.

 Mơ hình Content Management System (CMS): Sử dụng các hệ thống quản lý

nội dung như WordPress, Joomla, Drupal để quản lý và cập nhật nội dung của trang web một cách dễ dàng và linh hoạt. Phù hợp cho các trang web có nội dung phong phú như blog, trang tin tức, trang web thương mại điện tử.

II. Những công nghệ dùng để xây dựng một trang web hiện nay

</div>Trang 9<div class="page_container" data-page="9">

Có nhiều cơng nghệ được sử dụng để xây dựng trang web hiện nay, bao gồm cả phía front-end và back-end. Dưới đây là một số công nghệ phổ biến được sử dụng trong quá trình phát triển trang web:

Framework và thư viện Front-end:

 React.js: Thư viện JavaScript phổ biến được sử dụng để xây dựng giao diện người dùng động và hiệu quả.

 Vue.js: Framework JavaScript linh hoạt và dễ học, thích hợp cho việc xây dựng các ứng dụng web đơn trang và đa trang.

 Angular: Framework JavaScript được phát triển bởi Google, cung cấp cơ chế mạnh mẽ cho việc xây dựng các ứng dụng web phức tạp.

</div>Trang 10<div class="page_container" data-page="10">

Công cụ quản lý mã nguồn:

 Git: Hệ thống quản lý phiên bản mã nguồn phổ biến, được sử dụng để theo dõi và quản lý mã nguồn của dự án trang web.

</div>Trang 11<div class="page_container" data-page="11">

Hình 8: Cơng cụ quản lý mã nguồn

Cơng cụ tối ưu hóa và kiểm tra:

 Webpack, Babel: Các công cụ giúp tối ưu hóa và biên dịch mã nguồn JavaScript để tăng hiệu suất và tương thích của trang web.

 Jest, Mocha, Selenium: Các công cụ kiểm tra tự động giúp đảm bảo chất lượng và tính ổn định của trang web.

Hình 9: Cơng cụ tối ưu hố và kiểm tra

Các công nghệ này giúp xây dựng trang web với hiệu suất cao, tương tác tốt và bảo mật đảm bảo. Tùy thuộc vào yêu cầu cụ thể của dự án, các cơng nghệ có thể được lựa chọn vàkết hợp một cách linh hoạt.

</div>Trang 12<div class="page_container" data-page="12">

Chương III: Trang Web Bán Giày

I. Giới thiệu về trang web bán giày

Trang web Hiếu Giày là một nền tảng trực tuyến cung cấp một loạt các loại giày đa dạng

từ các nhà sản xuất và thương hiệu khác nhau. Trang web này là điểm đến cho nhữngngười đang tìm kiếm đơi giày mới, từ các mẫu giày thể thao đến giày đi làm và giàysandal cho mùa hè. Mục đích chính của trang web là cung cấp một phương tiện thuận tiệnđể người tiêu dùng có thể mua sắm các sản phẩm giày từ nhà, không cần phải đến cửahàng truyền thống. Bằng cách tận dụng sức mạnh của Internet, trang web bán giày giúptiết kiệm thời gian và công sức cho người dùng bằng cách cho phép họ duyệt qua cácmục sản phẩm và thực hiện mua sắm chỉ trong vài cú click chuột. Với giao diện đơn giảnvà trực quan, trang web cung cấp một trải nghiệm mua sắm dễ dàng và thuận tiện chongười dùng. Họ có thể sử dụng các tính năng tìm kiếm để lọc sản phẩm theo kích cỡ, màusắc, kiểu dáng và giá cả, giúp họ dễ dàng tìm thấy đơi giày phù hợp với nhu cầu và sở

thích của mình. Tóm lại, trang web Hiếu Giày không chỉ là một cửa hàng trực tuyến đơn

thuần, mà cịn là một cơng cụ tiện lợi giúp người tiêu dùng tìm kiếm và mua sắm các sảnphẩm giày một cách thuận tiện và dễ dàng từ nhà.

II. Những Cơng Nghệ Sử Dụng

Trong q trình phát triển trang web bán giày, chúng tôi đã quyết định sử dụng công nghệMERN (MongoDB, Express.js, React.js, Node.js) để xây dựng nền tảng của dự án. Báo cáo này sẽ trình bày về mỗi cơng nghệ trong bộ MERN và lý do chúng tôi chọn sử dụng chúng.

- Ngôn ngữ Frameworks, Cơ sở dữ liệu, Cài Đặt Môi Trường

</div>Trang 13<div class="page_container" data-page="13">

- Những công cụ hỗ trợ để xây dựng website

1. Visual Studio Code: Visual Studio Code đã trở thành mơi trường phát triển chính của

chúng tôi cho việc viết mã nguồn, kiểm thử và debug. Chúng tơi đã sử dụng tính năng IntelliSense để hỗ trợ việc gợi ý mã nguồn, giúp tăng tốc độ viết mã. Ngồi ra, chúng tơi cũng sử dụng tính năng Debug của VS Code để gỡ lỗi mã nguồn một cách hiệu quả.

2.Git và Source Control: VS Code đã tích hợp sẵn các tính năng Git và source control,

giúp chúng tôi quản lý và theo dõi thay đổi trong mã nguồn của dự án một cách thuận tiện. Chúng tơi có thể thực hiện các thao tác Git như commit, push và pull mà không cần phải rời khỏi môi trường VS Code.

3.Postman: là một ứng dụng máy tính được sử dụng chủ yếu để kiểm thử API

(Application Programming Interface). Nó cung cấp một giao diện đồ họa dễ sử dụng để tạo, gửi và kiểm thử các yêu cầu HTTP đến các API và xem kết quả trả về từ server.

III. Các Tính Năng Của Website

1. Danh mục sản phẩm: Hiển thị các danh mục sản phẩm như giày nam, giày nữ, giày

thể thao, giày cao gót, sandal, dép, vv. để người dùng dễ dàng tìm kiếm.

2. Tìm kiếm sản phẩm: Cho phép người dùng tìm kiếm sản phẩm dựa trên các tiêu chí

như tên sản phẩm, loại giày, màu sắc, kích cỡ, giá cả, vv.

3. Xem chi tiết sản phẩm: Cung cấp thông tin chi tiết về sản phẩm bao gồm hình ảnh,

mơ tả, giá cả, thơng số kỹ thuật, đánh giá của người dùng, vv.

4. Thêm vào giỏ hàng: Cho phép người dùng thêm sản phẩm vào giỏ hàng để tiến hành

thanh toán sau này.

5.Quản lý giỏ hàng: Cho phép người dùng xem, chỉnh sửa và xóa các mặt hàng trong giỏ

hàng trước khi thanh toán.

6.Thanh toán: Cung cấp giao diện thanh toán an toàn và thuận tiện cho người dùng, bao

gồm các phương thức thanh tốn như thanh tốn bằng thẻ tín dụng, chuyển khoản ngân hàng, ví điện tử, vv.

7. Quản lý đơn hàng: Cho phép người dùng theo dõi trạng thái của đơn hàng, cập nhật

</div>Trang 14<div class="page_container" data-page="14">

9. Tích hợp hệ thống đăng nhập và đăng ký: Cho phép người dùng tạo tài khoản và

đăng nhập để quản lý thông tin cá nhân và theo dõi đơn hàng.

10. Tích hợp chia sẻ mạng xã hội: Cho phép người dùng chia sẻ sản phẩm yêu thích lên

các mạng xã hội như Facebook, Twitter, Instagram, vv.

Kết Luận

Với những nỗ lực trong khoảng thời gian trong tuần vừa qua và sự hướng dẫn tận tìnhcủa Cơ Th.S Trần Thị Dung, đề tài project 1 của em cũng đã đạt được một số kết quả nhất

định.Điều này được thể hiện ở Hiếu Giày là trang web mà thời gian qua em đã tìm hiểu

và tham khảo để hoàn thiện nhằm đáp ứng yêu cầu của Project. Nhưng không tránh khỏimột vài hạn chế do điều kiện thời gian giới hạn trong tuần. Vì vậy trong những tuần tớiem sẽ cố gắng để hoàn thiện tốt và đúng tiến độ. Khơng chỉ để hồn thành bài tập Projectmà để có thể ứng dụng nó vào thực tế. Trong quá trình tìm hiểu Project 1, em cũng đã tìmhiểu được một lượng kiến thức lớn về World Wide Web, các kỹ thuật sử dụng của cácweb tĩnh và web động....Nhưng do trình độ cịn hạn chế nên khả năng am hiểu về các vấnđề là chưa sâu.Vậy mong cơ và các bạn trong nhóm đóng góp thêm ý kiến giúp em hoànthành cả về lý thuyết và bài tập lần này một cách tốt nhất. Em xin chân thành cảm ơn sựgiúp đỡ của Th.s Trần Thị Dung, các bạn sinh viên lớp CNTT1.2 trong nhóm đã giúp emtừng bước hoàn thành Project này.