Đồ Án Cơ Sở 1 Đề Tài Xây Dựng Website Bán Đồ Ăn Vặt.doc

MẪU ĐỒ ÁN KHOÁ LUẬN TỐT NGHIỆP TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN VÀ TRUYỀN THÔNG VIỆT – HÀN KHOA KHOA HỌC MÁY TÍNH ĐỒ ÁN CƠ SỞ 1 ĐỀ TÀI Xây dựng website bán đồ ăn vặt MỞ ĐẦU Ngày nay với sự phát triể[.]

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

TRUYỀN THÔNG VIỆT – HÀN KHOA KHOA HỌC MÁY TÍNH

ĐỒ ÁN CƠ SỞ 1

ĐỀ TÀI:Xây dựng website bán đồ ăn vặt

MỞ ĐẦU

Ngày nay với sự phát triển mạnh mẽ của khoa học công nghê.Công Nghệ thông tin là một trong những ngành có vị thế dẫn đầu và có vai trò rất lớn trong sự phát triển chung đó.Các ứng dụng của công nghệ thông tin được áp dụng trong mọi lĩnh vực nghiên cứu khoa học cũng như mọi lĩnh vực của cuộc sống.Là một phần của Công Nghệ Thông tin,Công nghệ WEB đang có được sự phát triển mạnh mẽ và phổ biến rất nhanh bởi những lợi ích mà nó mang lại cho cộng đồng rất lớn

Bằng việc lựa chọn và thực hiện đề tài “Xây dựng web bán đồ ăn vặt”,em muốn tìm hiểu và đưa ra giải pháp giải quyết việc bán hàng trực tuyến.Website mang lại những lựa chọn linh hoạt và tiện lợi trong việc tìm mua sản phẩm Các thông tin sản phẩm được hiển thị chi tiết với từng sản phẩm ,từ đó khách hàng dễ dàng lựa chọn được thứ mình cần

LỜI CẢM ƠN

Để hoàn thành đề tài :”Xây dựng web bán đồ ăn vặt “xin cảm ơn đến những chỉ dạy của thầy cô ,truyền đạt cho em kiến thức về chuyên ngành để em có thể thiết

kế web tĩnh này

Trong bài báo cáo hay đề tài còn rất nhiều thiết sót,hạn chế Vì thế em rất mong nhận được sự quan tâm và đánh giá đến từ phía thầy cô để bài của em được hoàn thiện hơn

Những đóng góp của thầy cô sẽ giúp em nhận ra những hạn chế và qua đó em có thêm nguồn tư liệu mới để giúp cho nghiên cứu sau này hay cụ thể hơn là phát triển 1 web tĩnh thành 1 web động có thể mua bán

MỤC LỤC

Trang

MỞ ĐẦU

Chương 1 Tổng quan về Công nghệ thiết kế website

1,1Tìm hiểu về các ngôn ngữ lập trình

1.1.1.Ngôn ngữ Html 1.1.2.Ngôn ngữ css 1.2 Tìm hiểu về thư viện hỗ trợ

1.2.1.Thư viện javascipt 1.2.2.Thư viện bootstrap Chương 2 Phân tích thiết kế hệ thống website

2.1 Chức năng

2.2 Yêu cầu

Chương 3 Thiết kế và xây dựng web

Chương 4 Kết luận và Hướng phát triển

PHỤ LỤC

DANH MỤC TÀI LIỆU THAM KHẢO

CHƯƠNG 1 TỔNG QUAN VỀ CÔNG NGHỆ THIẾT KẾ WEBSITE

1.1 Tìm hiểu về các ngôn ngữ lập trình

1.1.1 Ngôn ngữ html5

HTML (viết tắt của từ Hypertext Markup Language, hay là "Ngôn ngữ Đánh dấu

Siêu văn bản") là một ngôn ngữ đánh dấu được thiết kế ra để tạo nên các trang web trên World Wide Web Cùng với CSS và JavaScript, HTML là một trong những ngôn ngữ quan trọng trong lĩnh vực thiết kế website HTML được định nghĩa như là một ứng dụng đơn giản của SGML và được sử dụng trong các tổ chức cần đến các yêu cầu xuất bản phức tạp HTML đã trở thành một chuẩn mực của Internet do tổ chức World Wide Web Consortium (W3C) duy trì Phiên bản chính thức mới nhất của HTML là HTML 4.01 (1999) Sau đó, các nhà phát triển

đã thay thế nó bằng XHTML Hiện nay, phiên bản mới nhất của ngôn ngữ này là HTML5

Bằng cách dùng HTML động hoặc Ajax, lập trình viên có thể được tạo ra và xử lý bởi số lượng lớn các công cụ, từ một chương trình soạn thảo văn bản đơn giản –

có thể gõ vào ngay từ những dòng đầu tiên – cho đến những công cụ xuất bản

WYSIWYG phức tạp Hypertext là cách mà các trang Web (được thiết kế bằng

HTML) được kết nối với nhau Và như thế, đường link có trên trang Web được

gọi là Hypertext Như tên gọi đã nói, HTML là ngôn ngữ đánh dấu bằng thẻ (Markup Language), nghĩa là bạn sử dụng HTML để đánh dấu một tài liệu text bằng các thẻ (tag) để nói cho trình duyệt Web cách để cấu trúc nó để hiển thị

1.1.2.Ngôn ngữ CSS

CSS giúp ích rất nhiều khi viết một trang web bằng HTML

CSS là gì?

 CSS là viết tắt của Cascading Style Sheets

 CSS mô tả cách các phần tử HTML hiển thị trên màn hình và các phương tiện khác

 CSS rất hữu ích và tiện lợi Nó có thể kiểm soát tất cả các trang trên một website

 Các stylesheet ngoài được lưu trữ dưới dạng các tập tin CSS

CSS được dùng để định nghĩa kiểu cách cho các trang trên website của bạn, gồm

cả thiết kế, dàn trang và các cách hiển thị khác nhau trên nhiều thiết bị với kích thước màn hình khác nhau

HTML không có phần tử để để định dạng cho trang web HTML chỉ được dùng để tạo nội dung cho trang Khi các phần tử như <font> và thuộc tính màu sắc được thêm vào HTML 3.2, cơn ác mộng của các nhà phát triển web bắt đầu Việc phát triển một website lớn mà thêm thông tin font hay màu sắc vào từng trang đòi hỏi rất nhiều thời gian

Để giải quyết vấn đề này, World Wide Web Consortium (W3C) đã tạo ra CSS, giúp loại bỏ việc định dạng kiểu cách khỏi trang HTML.Các định nghĩa liên quan đến kiểu cách được đưa vào tập tin css và nhờ vào tập tin stylesheet ngoài, bạn

có thể thay đổi toàn bộ website chỉ bằng một tập tin duy nhất

1.1 Một số thư viện hỗ trợ

1.1.1Thư viện javascript

JavaScript là một ngôn ngữ kịch bản hướng đối tượng, đa nền tảng, được sử dụng để giúp cho các trang Web có tính tương tác với người dùng Ngoài ra còn

có các phiên bản JavaScript phía máy chủ nâng cao hơn như Node.js, cho phép thêm nhiều chức năng vào trang Web hơn JavaScript là một ngôn ngữ lập trình phổ biến có tính ứng dụng cao Ngày nay, JavaScript được sử dụng trong nhiều lĩnh vực khác như phát triển phía máy chủ, phát triển ứng dụng di động,…

Ta có thể thực hiện chạy các đoạn mã được viết bằng ngôn ngữ JavaScript theo các cách sau:

1 Sử dụng tab bảng điều khiển của trình duyệt web

2 Sử dụng Node.js

3 Tạo các trang web

1.2.2.Thư viện bootstrap

Bootstrap cho phép quá trình thiết kế website diễn ra nhanh chóng và dễ dàng

hơn dựa trên những thành tố cơ bản sẵn có như typography, forms, buttons,

tables, grids, navigation, image carousels… Cùng Mắt Bão tìm hiểu tính năng và

lợi ích mang lại cho lập trình viên của Bootstrap là gì nhé!

Bootstrap là một bộ sưu tập miễn phí của các mã nguồn mở và công cụ dùng để

tạo ra một mẫu webiste hoàn chỉnh Với các thuộc tính về giao diện được quy

định sẵn như kích thước, màu sắc, độ cao, độ rộng…, các designer có thể sáng

tạo nhiều sản phẩm mới mẻ nhưng vẫn tiết kiệm thời gian khi làm việc

với framework này trong quá trình thiết kế giao diện website.

Giới thiệu

1.1.Tính cấp thiết của đề tài

Hiện nay xuất hiện nhiều đồ ăn vặt được nhiều bạn ưa chuộng.Nhằm đáp ứng nhu cầu đó thì 1 trang web bán đồ ăn vặt là sự cần thiết để vừa tiết kiệm thời gian vừa tiện lợi nhất có thể cho mọi người.Web đưa đến cho mọi người sản phẩm mà ở đó họ có thể so sánh từng loại để có thế lựa chọn mua hay không

1.2.Phương pháp nghiên cứu

Đề tài đựa trên kết hợp:

-Html5

-Css3

-Bootstrap 4

-Javascript

1.3.Kết cấu đề tài

Web bán đồ ăn vặt gồm 1 trang chủ trình bày sản phẩm bán của web,những sản phẩm được liện kết với 1 trang con riêng để giới thiệu về sản phẩm đó.Bên cạnh

đó trang chủ còn liên kết đến 1 trang con dẫn đến form đăng kí Một trang con

để giới thiệu web, một trang con để hướng dẫn đặt hàng,một trang con để liên

hệ cho shop.Web còn đưa đến link liên kết để chỉ rõ facebook nhân viên,địa chỉ shop

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

1.2 Chức năng

Đây là 1 website bán và giới thiệu sản phầm là những đồ ăn vặt tiện lợi với các chi tiết mặt hàng , giá cả chinh xác.Có các chức năng:

- Đăng nhập và đăng kí: Khách hàng có thể đăng kí để có tài khoản riêng cho mình.Khi đăng nhập khách hàng chỉ cần nhập vào email và mật khẩu đã đăng kí trước đó Bạn có thể đăng nhập qua 2 hình thức là đăng nhập bằng email mật khẩu hoặc bạn có thể đăng nhập bằng chính facebook của bạn

-Hiển thị danh mục sản phẩm:

+Shop sẽ đưa ra cho bạn rất nhiều sản phẩm từ đồ ăn , nước uống đến các mặt hàng khác Khi đó bạn có thể tìm ra lựa chọn của mình

+Sản phẩm được bày bán trên chính trang chủ shop Nó sẽ tiện lợi hơn khi bạn chỉ cần đăng nhập vào là sẽ được đưa đến luôn mục sản phẩm bạn cần mua

- Hiển thị thông tin sản phẩm:

+Về phần thông tin sản phẩm : Bạn có thể biết được mọi thông tin sản phẩm như : Giá thành sản phẩm; Hình ảnh minh họa của sản phẩm; Những đanh giá chi tiết về sản phẩm

-Hướng dẫn mua hàng:

+Shop sẽ hướng dẫn cho bạn kĩ lưỡng về cách thức đặt hàng thông qua số điện thoại nhân viên , face book hay là liên lạc trực tiếp đến địa chỉ shop

-Liên hệ với quản trị:

+Cho phép bạn đặt ra những câu hỏi , vấn đề , thắc mắc hay những đánh giá sản phẩm cho shop

-Cung cấp thông tin shop:Mọi thông tin của shop được đề cập

+Giới thiệu shop đang bán những gì

+Tiêu chí sản phẩm đó

+Cam kết sản phẩm

+Số điện thoại shop

+ face book liên hệ

+ địa chỉ shop

1.1 YÊU CẦU

Phần khách hàng:

Khách hàng là người có nhu cầu mua sắm hàng hóa , họ sẽ tìm kiếm các mặt hàng cần thiết từ hệ thống và đặt mua các mặt hàng này.Vì thế phải có các chức năng:

+Hiển thị các danh sách các mặt hàng của cửa hàng để khách hàng xem , lựa chọn và mua

+Khách hàng xem các thông tin , tin tức đã có trên web

Phần thiết kế web:

+ Thiết kế dễ hiểu

+Giao diện mang tinh dễ dùng, đẹp mắt

+Cung cấp đầy đủ thông tin cho khách hàng

+Web luôn đổi mới và hấp dẫn

CHƯƠNG 3 Thiết kế và xây dựng web

3.1 Trang đăng nhập đăng kí

-Đăng Kí: Bạn chỉ cần nhập vào email,địa chỉ mật khẩu là sẽ có 1 tài khoản riêng

để có thế nhận nhiều ưu đãi hơn

-Đăng Nhập:Ở trang này bạn cần nhập email và mật khẩu để đăng nhập và tài

khoản của bạn

Bạn có thể liên kết giữa đăng nhập và đăng kí.

3.2 Trang giới thiệu

+Cho biết các thông tin cần thiết của shop

+Cho biết thêm cách thức đặt hàng ,các ưu đãi khi nhận được

3.3 Trang Giỏ hàng

- Khi bạn mua muốn mua hang bạn chỉ cần đưa đơn hàng vào giỏ hàng

3.4Trang liên hệ

- Form liên hệ để khách có thể nhập ý kiến phản hồi hay đánh giá shop.Kèm theo

đó khách hàng có thế biết được địa chỉ shop đã nhúng vào web

3.5 Trang chủ

Trang chủ đưa đến cho ta một số mặt hàng.Theo đó khách còn được tham khảo giữa các mặt hàng như mặt hàng nào đang được phổ biến ,mặt hàng nào được

ưa thích nhiều, mặt hàng nào mới được cập nhật

Trang chủ(index.html)

3.6 Trang sản phẩm

Nơi đây cho biết tất cả mặt hàng shop đang buôn bán

Kết luận và Hướng phát triển

Đề tài thực hiện trong mảng phát triển web nhằm phục vụ nhu cầu của khách hàng về xu hướng đồ ăn vặt hiện nay.Web giúp định hình được xu hướng , nhu cầu online của 1 shop đồ ăn vặt để có thể phát triển trong tương lai gần.Thiết kế web cần đủ kiến thức,kĩ năng và sự học hỏi những thông tin cần thiết,…

Để thiết kế web bán đồ ăn vặt này em cũng đã tìm hiểu , học hỏi khá nhiều Từ

đó cung cấp cho em rất nhiều kiến thức mới,những kĩ năng,khả năng tổng hợp

và chắt lọc thông tin cần thiết, phân tích,…

Web thực hiện trên phương diện 1 web tĩnh , nó cũng đưa ra được 1 form trang web khá đầy đủ để có thế phát triển lên 1 web động có thể mua bán.Hy vọng có web có thể phát triển theo hướng tích cực nhất và đáp ứng nhu cầu cho tương lai