Đồ án Thiết kế và lập trình Website

BỘ GIÁO DỤC VÀ ĐÀO TẠO  
TRƯỜNG ĐẠI HỌC BÀ RỊA - VŨNG TÀU  
KHOA CÔNG NGHỆ KỸ THUẬT - NÔNG NGHIỆP CÔNG NGHỆ CAO  
  
ĐỒ ÁN TỐT NGHIỆP  
ĐỀ TÀI  
THIẾT KẾ VÀ LẬP TRÌNH WEBSITE  
Giảng viên hướng dẫn  
Sinh viên thực hiện  
Trình độ đào tạo  
Ngành đào tạo  
Chuyên Ngành  
MSSV  
: ThS. Nguyễn Lan Hương  
: Phan Tiến Đạt  
: Đại Học Chính Quy  
: Công Nghệ Thông Tin  
: Máy Tính  
: 16031147  
Lớp  
: DH16MT  
Niên khóa  
: 2016 - 2020  
VŨNG TÀU, NĂM 2020  
ĐẠI HỌC BÀ RỊA – VŨNG TÀU  
KHOA KỸ THUẬT CN-NNCN CAO  
⎯⎯⎯⎯⎯⎯⎯⎯⎯  
CỘNG HÒA XÃ HỘI CHỦ NGHĨA VIỆT NAM  
Độc lập – Tự do – Hạnh phúc  
⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯  
PHIẾU GIAO ĐỀ TÀI ĐỒ ÁN/ KHÓA LUẬN TỐT NGHIỆP  
Họ tên sinh viên: Phan Tiến Đạt  
Mã SV: 16031147  
Lớp: DH16MT  
Ngành: Công Nghệ Thông Tin Khóa: 16  
Tên đề tài: Thiết kế và lập trình Website  
Mục tiêu đề tài:  
Thiết kế và lập trình website giới thiệu, quảng bá về công ty (công ty lấy tên  
Viko), đưa tới mọi người hình ảnh về công ty cùng những thông tin sản phẩm, dự  
án của công ty đó. Đồng thời bên phía công ty cũng được cung cấp những chức  
năng để quản trị website một cách tốt nhất.  
Kết quả dự kiến:  
Sản phẩm website có giao diện đẹp mắt, bố cục đơn giản, tích hợp nhiều chức  
năng để người dùng dễ dàng tra cứu, tìm hiểu các thông tin về công ty. Qua đó  
hình ảnh công ty sẽ được quảng bá một cách tốt nhất đến mọi người.  
Thời gian thực hiện: Bắt đầu từ 02/03/2020 đến 10/05/2020.  
Vũng Tàu, ngày….. tháng…..năm…  
TRƯỞNG KHOA CNTT  
(Ký và ghi rõ họ tên)  
GIẢNG VIÊN HƯỚNG DẪN  
(Ký và ghi rõ họ tên)  
NHẬN XÉT CỦA GIÁO VIÊN HƯỚNG DẪN  
.............................................................................................................................  
.............................................................................................................................  
.............................................................................................................................  
.............................................................................................................................  
.............................................................................................................................  
.............................................................................................................................  
.............................................................................................................................  
.............................................................................................................................  
.............................................................................................................................  
.............................................................................................................................  
.............................................................................................................................  
.............................................................................................................................  
.............................................................................................................................  
.............................................................................................................................  
.............................................................................................................................  
.............................................................................................................................  
.............................................................................................................................  
.............................................................................................................................  
.............................................................................................................................  
.............................................................................................................................  
.............................................................................................................................  
.............................................................................................................................  
.............................................................................................................................  
Ngày.........Tháng..........Năm.........  
Giáo Viên Hướng Dẫn  
(Ký, ghi rõ họ và tên)  
NHẬN XÉT CỦA GIÁO VIÊN PHꢀN BIỆN  
.............................................................................................................................  
.............................................................................................................................  
.............................................................................................................................  
.............................................................................................................................  
.............................................................................................................................  
.............................................................................................................................  
.............................................................................................................................  
.............................................................................................................................  
.............................................................................................................................  
.............................................................................................................................  
.............................................................................................................................  
.............................................................................................................................  
.............................................................................................................................  
.............................................................................................................................  
.............................................................................................................................  
.............................................................................................................................  
.............................................................................................................................  
.............................................................................................................................  
.............................................................................................................................  
.............................................................................................................................  
.............................................................................................................................  
.............................................................................................................................  
.............................................................................................................................  
Ngày.........Tháng..........Năm.........  
Giáo Viên Phản Biện  
(Ký, ghi rõ họ và tên)  
LỜI CAM ĐOAN  
Đồ án này là công trình nghiên cứu và xây dựng của cá nhân tôi, được thực  
hiện dưới sự hướng dẫn khoa học của Ths. Nguyễn Lan Hương. Các số liệu,  
những kết luận nghiên cứu được trình bày trong đồ án này là do tôi tự tìm hiểu  
và hoàn toàn trung thực.  
Tôi xin hoàn toàn chịu trách nhiệm về lời cam đoan này.  
Vũng Tàu, tháng 4 năm 2020  
Sinh Viên Thực Hiện  
Phan Tiến Đạt  
LỜI CꢀM ƠN  
Tôi xin chân thành cảm ơn khoa Công nghệ thông tin, trường Đại  
học Bà Rịa – Vũng Tàu đã tạo điều kiện thuận lợi cho tôi thực hiện đề  
tài này.  
Tôi cũng xin được gửi lời cảm ơn chân thành nhất đến Ths.  
Nguyễn Lan Hương, người đã tận tình chỉ bảo, định hướng đi và hướng  
dẫn tôi thực hiện đề tài này.  
Bên cạnh đó, tôi xin gửi lời cảm ơn đến các thầy cô, những người  
đã giảng dạy, tạo điều kiện cho tôi tích lũy được những kiến thức quý  
báu trong những năm học qua.  
Dù đã cố gắng hoàn thành đề tài Website giới thiệu công ty Viko,  
nhưng do thời gian hạn hẹp và khả năng còn hạn chế nên chắc chắn sẽ  
có những thiếu sót không tránh khỏi. Tôi mong nhận được sự thông cảm  
và tận tình chỉ bảo của các thầy cô và góp ý từ các bạn.  
Vũng Tàu, tháng 4 năm 2020  
Sinh viên thực hiện  
Phan Tiến Đạt  
MỤC LỤC  
DANH MỤC CÁC BꢀNG  
TT  
Số hiệu  
Nội dung  
Bảng các tác nhân và quyền của  
tác nhân trong UseCase  
Bảng các yêu cầu chức năng hệ  
thống  
Trang  
1
Bảng 4.1  
28  
2
Bảng 4.2  
28  
3
4
Bảng 4.3 Bảng chi tiết các UseCase  
Bảng 5.1 Bảng Table tai_khoans  
Bảng 5.2 Bảng Table infoct  
31 - 58  
59 - 60  
60  
5
6
Bảng 5.3 Bảng Table thanhpham  
Bảng 5.4 Bảng Table baogia  
60 - 61  
61  
7
8
Bảng 5.5 Bảng Table sanpham  
Bảng 5.6 Bảng Table loaisanpham  
Bảng 5.7 Bảng Table loaisanpham_sanpham  
Bảng 5.8 Bảng Table hinhsanpham  
Bảng 5.9 Bảng Table nhanxet  
61  
9
62  
10  
11  
12  
62  
62  
62 - 63  
1
 
DANH MỤC CÁC HÌNH ꢀNH  
TT  
Số hiệu  
Nội dung  
Các phiên bản của laravel đến tháng  
4 năm 2020  
Trang  
1
Hình 1.1  
12  
Cách thức hoạt động MVC trong  
Laravel  
2
3
Hình 1.2  
Hình 1.3  
14  
16  
Những ngôn ngữ lập trình phổ biến  
từ năm 1965 – 2019  
4
5
Hình 1.4 So sánh giữa ASP và PHP  
Hình 1.5 Slide hình ảnh sản phẩm  
17  
19  
Mẫu gửi thông tin yêu cầu tới công  
ty  
6
Hình 1.6  
20  
7
Hình 1.7 Danh mục các sản phẩm  
Hình 1.8 Bài đăng thông tin về sản phẩm  
Hình 1.9 Bài đăng báo giá  
20  
21  
22  
22  
23  
30  
59  
8
9
10  
11  
12  
13  
Hình 1.10 Bài đăng tin tức  
Hình 1.11 Danh sách các công trình khác  
Hình 4.1 Lượt đồ tổng quan usecase  
Hình 5.1 Lượt đồ cơ sꢀ dữ liệu  
Các bản dữ liệu có mối quan hệ với  
Hình 5.2  
nhau  
14  
64  
15  
16  
17  
Hình 5.3 Trang chủ website Viko  
64  
65  
66  
Hình 5.4 Mục giới thiệu trên trang chủ  
Hình 5.5 Mục sản phẩm nổi bật trên trang chủ  
2
 
Mục tiêu chí hoạt động trên trang  
18  
19  
20  
Hình 5.6  
Hình 5.7  
Hình 5.8  
66  
67  
67  
chủ  
Mục dự án đã thực hiên trên trang  
chủ  
Mục khách hàng nói về chúng tôi  
trên trang chủ  
21  
22  
Hình 5.9 Mục liên hệ trên trang chủ  
Hình 5.10 Trang danh sách sản phẩm  
68  
68  
Mục lọc sản phẩm trên trang danh  
23  
24  
25  
Hình 5.11  
69  
69  
70  
sách sản phẩm  
Hình 5.12 Trang chi tiết sản phẩm  
Mục bài viết trên trang chi tiết sản  
Hình 5.13  
phẩm  
Mục nhận xét cùng mục sản phẩm  
Hình 5.14  
26  
27  
28  
71  
71  
72  
cùng loại trên trang chi tiết sản phẩm  
Hình 5.15 Trang danh sách dự án đã thưc hiện  
Mục các danh sách dự án đã thực  
Hình 5.16  
hiện trên trang dự án đã thực hiện  
29  
30  
Hình 5.17 Trang chi tiết dự án  
72  
73  
Hình 5.18 Mục bài viết trên trang chi tiết dự án  
Mục các dự án khác trên trang chi  
31  
Hình 5.19  
73  
tiết dự án  
32  
33  
34  
35  
Hình 5.20 Trang đăng nhập Admin  
Hình 5.21 Trang Admin  
73  
74  
74  
75  
Hình 5.22 Trang thêm loại sản phẩm  
Hình 5.23 Trang danh sách loại sản phẩm  
3
36  
37  
38  
39  
40  
41  
42  
43  
44  
45  
Hình 5.24 Trang sửa loại sản phẩm  
75  
76  
77  
78  
80  
81  
82  
83  
84  
84  
Hình 5.25 Trang thêm sản phẩm  
Hình 5.26 Trang danh sách sản phẩm  
Hình 5.27 Trang sửa sản phẩm  
Hình 5.28 Trang thêm dự án đã thực hiện  
Hình 5.29 Trang danh sách dự án đã thực hiện  
Hình 5.30 Trang sửa dự án đã thực hiện  
Hình 5.31 Trang cập nhật thông tin công ty  
Hình 5.32 Trang danh sách yêu cầu báo giá  
Hình 5.33 Trang sửa thông tin tài khoản  
Trang báo lỗi Not Found khi không  
46  
Hình 5.34  
84  
tìm thấy trang  
4
LỜI MỞ ĐẦU  
1. Tính cꢋp thiết cꢆa đề tài  
Theo thống kê mới nhất, tính đến đầu năm 2019, Việt Nam đã có  
hơn 60 triệu người sử dụng internet, chiếm hơn 60% dân số. Và trong  
tương lai con số này sẽ vẫn tiếp tục tăng lên không ngừng. Có thể nói đối  
với các nhà kinh doanh thì môi trường internet chính là một môi trường  
chứa đầy khách hàng tiềm năng nhất mà mọi doanh nghiệp hay tổ chức  
nào cũng đều thèm khát. Do đó để khai thác tiềm năng này một cách tốt  
nhất thì điều không thể thiếu đó chính là đầu tư, phát triển cho riêng mình  
một Website giới thiệu, quảng bá bản thân doanh nghiệp hoặc bất kỳ tổ  
chức nào.  
2. Tình hình nghiên cꢈu  
Có thể nói việc nghiên cứu và phát triển website đã không còn là  
một vấn đề xa lạ trong kỷ nghiên 4.0 ngày này. Và đặc biệt trong thời đại  
kinh tế cạnh tranh thì các website phục vụ trong mục đích kinh doanh,  
quảng bá luôn được ưu tiên phát triển hàng đầu. Điều này có thể dễ dàng  
thấy thông qua các website của các thương hiệu nổi tiếng hàng đầu trong  
lĩnh vực kinh doanh như samsung.com, lazada.vn, sony.com.vn,…  
Những website của các thương hiệu này luôn được trao chuốt một cách  
kĩ lưỡng. Ngoài ra không chỉ những các thương hiệu lớn mới có riêng  
cho mình một website để quảng bá thương hiệu của mình, mà còn hàng  
ngàn các công ty, doanh nghiêp lớn nhỏ đều sỡ hữu một website để quảng  
bá thương hiệu của mình đến mọi người.  
5
 
3. Mục đích nghiên cꢈu  
Đề tài có mục đích xây dựng website giới thiệu công ty giúp đưa  
tới khách hàng những hình ảnh, thông tin một cách đầy đủ và rõ nét về  
công ty đó. Qua đó tạo được thêm nhiều ưu thế trên môi trường  
marketing.  
4. Nhiệm vụ nghiên cꢈu  
Để thực hiện được đề tài một cách trọn vẹn phải trãi qua nhiều giai  
đoạn nghiên cứu, tìm hiểu, chọn lọc và cuối cùng mới đến công đoạn bắt  
tay vào xây dựng nên một website. Đầu tiên việc tìm hiểu về cơ sꢀ lý  
thuyết để tạo ra một website là điều tất yếu. Kế đến cần phải khảo sát  
thực tế xem website có phù hợp cũng như đồng thời tham khảo những  
website tương tự. Tiếp đến phải xây dựng mô hình về website như các  
chức năng, ràng buộc,… Và cuối cùng là công việc xây dựng website  
hoàn chỉnh.  
5. Các kết quả đạt đưꢍc cꢆa đề tài  
Thông qua đề tài sẽ mang đến những kiến thức và cách xây dựng  
lên một website hoàn chỉnh. Đồng thời website được xây dựng trong đề  
tài sẽ đạt được một cách đầy đủ và tốt nhất các mục tiêu ban đầu đề.  
6
CHƯƠNG 1: CƠ SỞ Lꢁ THUYẾT VÀ KHꢀO SꢂT  
1.1 HTML,CSS và JavaScript  
−
HTML, CSS và JavaScript là những khái niệm không hề xa lạ với  
những người lập trình website chuyên nghiệp. Chúng chính là nền tảng  
không thể thiếu để xây dựng,tô vẽ và làm sống động cho chính những trang  
web. Và vì lẽ đó mà HTML, CSS, JavaScript là những khái niệm mà bắt  
buộc ai cũng phải có khi muốn bước chân vào con đường phát triển website.  
1.1.1 HTML là gì?  
− HTML là viết tắt của HyperText Markup Language (ngôn ngữ  
đánh dấu siêu văn bản) dùng mô tả cấu trúc của các trang Web và tạo ra  
các loại tài liệu có thể xem được trong trình duyệt.  
− HTML là cốt lõi của mọi trang web. Mỗi trang web được tạo thành  
từ một loạt các thẻ HTML mà chúng biểu thị từng loại nội dung trên  
trang. Mỗi loại nội dung trên trang được “bọc”, tức là được bao quanh  
bꢀi các thẻ HTML.  
− HTML không phải là ngôn ngữ lập trình, đồng nghĩa với việc nó  
không thể tạo ra các chức năng “động” được. Nó chỉ giống như Microsoft  
Word, dùng để bố cục và định dạng trang web.  
1.1.2 CSS là gì?  
− CSS (viết tắt của Cascading Style Sheets) là một ngôn ngữ định  
dạng được sử dụng để mô tả trình bày các trang Web, bao gồm màu sắc,  
cách bố trí và phông chữ. Nó cho phép hiển thị nội dung tương thích trên  
các loại thiết bị có kích thước màn hình khác nhau, chẳng hạn như màn  
hình lớn, màn hình nhỏ, hoặc máy in.  
7
       
− Trong khi HTML là cấu trúc cơ bản của trang web. CSS mang lại  
cho trang web của bạn phong cách mà bạn muốn. CSS gần như tạo nên  
bộ mặt của một website.  
− Cũng giống như HTML, CSS không phải là một ngôn ngữ lập  
trình.  
1.1.3 JavaScript là gì?  
− JS (viết tắt của Javascript) là một nền tảng (cross-platform), ngôn  
ngữ kịch bản hướng đối tượng (object-oriented). Nó là một ngôn ngữ nhỏ  
và nhẹ. Chạy trong môi trường máy chủ lưu trữ (ví dụ: trình duyệt web),  
JavaScript có thể được kết nối với các đối tượng của môi trường để cung  
cấp kiểm soát chương trình đối với chúng.  
− JavaScript là ngôn ngữ lập trình dựa trên logic. Nó có thể được sử  
dụng để sửa đổi nội dung trang web. Và khiến nó hoạt động theo nhiều  
cách khác nhau để đáp ứng với hành động của người dùng. Các cách sử  
dụng phổ biến cho JavaScript bao gồm các hộp xác nhận, kêu gọi hành  
động và thêm các danh tính mới vào thông tin hiện có.  
1.2 Bootstrap  
1.2.1 Bootstrap là gì?  
− Bootstrap là một front-end framework miễn phí giúp quá trình  
phát triển web nhanh chóng và dễ dàng hơn.  
− Bootstrap bao gồm các mẫu thiết kế dựa trên HTML và CSS như  
typography, forms, buttons, tables, navigation, modals, image  
carousels… cũng như các plugin JavaScript tùy chọn.  
− Bootstrap cũng cung cấp cho bạn khả năng tạo ra các responsive  
designs một cách dễ dàng.  
8
     
1.2.2 Tại sao nên dùng Bootstrap?  
− Dễ sử dụng: Bất kỳ ai có kiến thức cơ bản về HTML và CSS đều  
có thể bắt đầu sử dụng Bootstrap.  
− Các tính năng đáp ứng (Responsive features): responsive CSS của  
Bootstrap điều chỉnh cho điện thoại, máy tính bảng và máy tính để bàn.  
− Khả năng tương thích trình duyệt: Bootstrap tương thích với tất cả  
các trình duyệt hiện đại (Chrome, Firefox, Internet Explorer, Edge, Safari  
và Opera).  
− Tiết kiệm thời gian: Bootstrap giúp cho lập trình viên thiết kế giao  
diện website tiết kiệm rất nhiều thời gian và công sức, bꢀi các thư viện  
của Bootstrap có nhiều đoạn mã có thể sẵn sàng áp dụng ngay vào  
website. Khi đó sẽ tiết kiệm được rất nhiều thời gian để tự viết code cho  
giao diện website của bản thân.  
1.3 JQuery  
1.3.1 JQuery là gì?  
− JQuery là thư viện được viết từ JavaScript, jQuery giúp xây dựng  
các chức năng bằng Javascript dễ dàng, nhanh và giàu tính năng  
hơn. jQuery được tích hợp nhiều module khác nhau. Từ module hiệu ứng  
cho đến module truy vấn selector. jQuery được sử dụng đến 99% trên  
tổng số website trên thế giới.  
− JQuery không phải là một ngôn ngữ lập trình riêng biệt mà hoạt  
động liên kết với JavaScript. Với jQuery, bạn có thể làm được nhiều việc  
hơn mà lại tốn ít công sức hơn.  
1.3.2 Tại sao nên dùng jQuery?  
− Gọn nhẹ: jQuery là một thư viện khá gọn nhẹ – có kích cỡ khoảng  
19KB.  
9
       
− Tương thích đa nền tảng: Nó tự động sửa lỗi và chạy được trên  
mọi trình duyệt phổ biến như Chrome, Firefox, Safari, MS Edge, IE,  
Android và iOS.  
− Dễ dàng tạo Ajax: Nhờ thư viện jQuery, code được viết bꢀi Ajax  
có thể dễ dàng tương tác với server và cập nhật nội dung tự động mà  
không cần phải tải lại trang.  
− Xử lý nhanh nhạy thao tác DOM: jQuery giúp lựa chọn các phần  
tử DOM để traverse (duyệt) một cách dễ dàng, và chỉnh sửa nội dung của  
chúng bằng cách sử dụng Selector mã nguồn mꢀ, mà còn được gọi là  
Sizzle.  
− Đơn giản hóa việc tạo hiệu ứng: Giống với code snippet có hiệu  
ứng animation, nó phủ các dòng code và bạn chỉ việc thêm biến/nội dung  
vào thôi.  
− Hỗ trợ tốt phương thức sự kiện HTML: Xử lý sự kiện − jQuery xử  
lý các sự kiện đa dạng mà không làm cho HTML code trꢀ nên lộn xộn  
với các Event Handler.  
1.4 Ajax  
1.4 Ajax là gì?  
− AJAX là chữ viết tắt của Asynchronous JavaScript and XML. Đây  
là một công nghệ giúp chung ta tạo ra những Web động mà hoàn toàn  
không reload lại trang.  
− Cả JavaScript và XML đều hoạt động bất đồng bộ trong AJAX.  
Kết quả là, nhiều ứng dụng web có thể sử dụng AJAX để gửi và nhận  
data từ server mà không phải toàn bộ trang.  
10  
   
1.4.2 Tại sao nên dùng Ajax?  
− Callbacks: Ajax được sử dụng để thực hiện một cuộc gọi  
lại. AJAX thực hiện việc truy xuất và / hoặc lưu dữ liệu mà không gửi  
toàn bộ trang trꢀ lại máy chủ. Bằng cách gửi lại một phần trang web đến  
máy chủ, việc sử dụng mạng được giảm thiểu và các hoạt động diễn ra  
nhanh hơn. Trong các trang web băng thông hạn chế, điều này có thể cải  
thiện đáng kể hiệu suất mạng. Dữ liệu được gửi đến và đi từ máy chủ  
một cách tối thiểu.  
− Thực hiện các cuộc gọi không đồng bộ: Ajax cho phép bạn thực  
hiện các cuộc gọi không đồng bộ đến một máy chủ web. Điều này cho  
phép trình duyệt của người dùng tránh phải chờ tất cả dữ liệu đến trước  
khi cho phép người dùng hành động một lần nữa.  
− Thân thiện với người dùng: Vì không phải post lại trang lên server,  
các ứng dụng hỗ trợ Ajax sẽ luôn nhanh hơn và thân thiện với người dùng  
hơn.  
− Tăng tốc độ: Mục đích chính của Ajax là cải thiện tốc độ, hiệu  
suất và khả năng sử dụng của một ứng dụng web. Một ví dụ tuyệt vời  
của Ajax là tính năng xếp hạng phim trên Netflix. Người dùng đánh giá  
một bộ phim và xếp hạng cá nhân của họ cho bộ phim đó sẽ được lưu  
vào cơ sꢀ dữ liệu của họ mà không cần chờ trang làm mới hoặc tải lại.  
1.5 Lararel  
1.5.1 Laravel là gì?  
− Là một framework PHP có mã nguồn mꢀ miễn phí, giúp xây dựng  
các ứng dụng theo mô hình MVC (Model - View – Controller) một cách  
nhanh chóng, được tạo ra bꢀi một lập trình viên kỳ cựu từng làm .NET  
11  
     
đó là Taylor Otwell. Được phát hành lần đầu vào ngày 9 tháng 6 năm  
2011.  
Các phiên bản của laravel đến tháng 4 năm 2020  
− Trước đây Laravel có tên là Bootplant sau đó thì đổi thành là  
Laravel, nguồn gốc tên bắt nguồn từ tên một tòa lâu đài ꢀ Narnia, một  
vùng đất không có thật, mà nó ꢀ trong một thế giới được tưꢀng tượng ra  
12  
Tải về để xem bản đầy đủ
pdf 168 trang yennguyen 22340 Free
Bạn đang xem 20 trang mẫu của tài liệu "Đồ án Thiết kế và lập trình Website", để tải tài liệu gốc về máy hãy click vào nút Download ở trên

File đính kèm:

  • pdfdo_an_thiet_ke_va_lap_trinh_website.pdf