MỞ ĐẦUNgày nay, ứng dụng công nghệ thông tin và việc tin học hóa được xem làmột trong những yếu tố mang tính quyết định trong hoạt động của cácchính phủ, tổ chức, cũng như các công ty, n
Trang 1ĐẠI HỌC ĐÀ NẴNG KHOA CÔNG NGHỆ THÔNG TIN VÀ TRUYỀN THÔNG
ĐỒ ÁN CƠ SỞ 1
ĐỀ TÀI: WEBSITE STUDIO ÁO CƯỚI
Sinh viên thực hiện : NGUYỄN VĂN AN
Giảng viên hướng dẫn : ThS NGUYỄN VĂN BÌNH
Đà nẵng, tháng 08 năm 2020
Trang 2ĐẠI HỌC ĐÀ NẴNG KHOA CÔNG NGHỆ THÔNG TIN VÀ TRUYỀN THÔNG
ĐỒ ÁN CƠ SỞ 1
ĐỀ TÀI: WEBSITE STUDIO ÁO CƯỚI
Đà Nẵng, tháng 08 năm 2020
Trang 3MỞ ĐẦU
Ngày nay, ứng dụng công nghệ thông tin và việc tin học hóa được xem làmột trong những yếu tố mang tính quyết định trong hoạt động của cácchính phủ, tổ chức, cũng như các công ty, nó đóng vai trò hết sức quantrọng, có thể tạo ra những bước đột phá mạnh
Giờ đây, mọi việc liên quan đến thông tin trở nên thật dễ dàng cho người
sử dụng; chỉ cần có một máy tính kết nối internet và một dòng dữ liệu truytìm thì gần như lập tức cả thế giới về vấn đề mà bạn đang quan tâm sẽhiện ra, có đầy đủ thông tin, hình ảnh và âm thanh
Trong hoạt động sản xuất, kinh doanh, giờ đây, thương mại điện tử đã khẳng định được vai trò xúc tiến và đẩy sự phát triển của doanh nghiệp
Ngày cưới được xem là ngày quan trọng trong cuộc đời của mỗi con người vìthế mọi người thường khá khắt khe trong việc lựa chọn các dịch vụ cưới hỏicủa mình
Ngày nay công nghệ thông tin ngày càng phát triển, bất cứ khách hàng nàotrước khi tìm đến các studio hay ảnh viện áo cưới của bạn đều sẽ tham khảocũng như tìm kiếm các trang công cụ hiện nay
Do đó, nếu như doanh nghiệp không có một website chuyên nghiệp thì xemnhư bạn đã mất đi một lượng lớn khách hàng tiềm năng cũng như không thểtạo được suy uy tín, chuyên nghiệp về các sản phẩm, dịch vụ mà bạn cungcấp.Vì vậy, em đã thực hiện xây dựng “WEBSITE STUDIO ÁO CƯỚI” để tưvấn, hỗ trợ dịch vụ cưới cho khách hàng trong ngày trọng đại nhất cuộc đời.Với sự hướng dẫn tận tình của thầy giáo Nguyễn Văn Bình đã giúp emhoàn thành báo cáo đề tài này Tuy đã cố gắng hết sức tìm hiểu, phân tíchthiết kế và cài đặt hệ thống nhưng chắc rằng không tránh khỏi những thiếusót Em rất mong nhận được sự thông cảm và góp ý của quý thầy cô Emxin chân thành cảm ơn
Trang 4
LỜI CẢM ƠN
Lời đầu tiên, em xin gửi lời cảm ơn chân thành đến các thầy cô Khoa Công nghệThông tin & Truyền Thông đã dạy em những kiến thức hay, và các thầy cô trong bộmôn Công nghệ Web đã truyền đạt những kiến thức chuyên ngành bổ ích cũng như các
kỹ năng trong cuộc sống
Đặc biệt, em xin cảm ơn sâu sắc tới giáo viên hướng dẫn ThS.Nguyễn Văn Bình–Giảng viên Khoa Công nghệ Thông tin & Truyền Thông, Trường Đại học Công nghệThông tin & Truyền thông Việt Hàn - Đại học Đà Nẵng đã tận tình hướng dẫn, góp ýtheo sát giúp em có thể hoàn thành đồ án tốt nhất
Em xin cảm ơn tới gia đình đã luôn động viên tinh thần, tạo động lực cho em trongquá trình thực hiện đồ án Cảm ơn tất cả bạn bè, tập thể lớp 19IT1 đã cùng chia sẻ, góp
ý trong quá trình thực hiện
Xin chân thành cảm ơn!
Trang 5NHẬN XÉT
………
………
………
………
………
………
………
………
………
………
………
………
………
………
………
………
………
………
………
………
………
………
………
………
………
………
………
………
………
………
………
………
………
………
Chữ ký GVHD
Trang 6MỤC LỤC
Chương 1 Giới thiệu 1
1.1 Lý do chọn đề tài 1
1.2 Mục tiêu đề tài 2
1.3 Nội dung chính 3
1.4 Kết quả: 3
Chương 2 Nghiên cứu tổng quan 4
2.1 Tìm hiểu về các ngôn ngữ lập trình 4
2.2 Một số thư viện hỗ trợ 6
2.3 Cơ sở dữ liệu MySQL 7
Chương 3 Phân tích thiết kế hệ thống 9
3.1 Khảo sát và đặc tả yêu cầu 9
3.2 Phân tích thiết kế hệ thống 9
Triển khai xây dựng 11
3.3 Trang chủ: 11
3.4 Trang đăng nhập 13
3.5 Trang đăng ký 14
3.6 Trang giới thiệu: 15
3.7 Trang áo cưới: 17
3.8 Kết luận 18
3.9 Hướng phát triển 19
Trang 7DANH M C HÌNH NH ỤC HÌNH ẢNH ẢNH
Hình 1.1 Trang chủ Studio Áo cưới BON 1
Hình 1.2 Trang chủ Studio Áo cưới MAILISA 2
Hình 3.1 Trang chủ 11
Hình 3.2 Trang chủ 11
Hình 3.3 Trang chủ 12
Hình 3.4 Trang chủ 12
Hình 3.5 Trang chủ 12
Hình 3.6 Trang chủ 13
Hình 3.7 Footer trang chủ 13
Hình 3.8 Trang đăng nhập 14
Hình 3.9 Trang đăng ký 15
Hình 3.10 Trang giới 15
Hình 3.11 Trang giới thiệu 16
Hình 3.12 Trang giới thiệu 16
Hình 3.13 Trang giới thiệu 16
Hình 3.14 Trang giới thiệu 17
Hình 3.15 Trang áo cưới 17
Hình 3.16 Trang áo cưới 18
Hình 3.17 Bảng giá dịch vụ 18
Trang 9Với nhu cầu tìm kiếm dịch vụ cưới hỏi đang tăng cao làm sao để các cặp đôinhận được sự tư vấn, chọn được dịch vụ ngày cưới ưng ý nhất một cách dễ dàng
Hình 1.1 Trang chủ Studio Áo cưới BON
+ Giao diện Website chụp ảnh cưới thân thiện người dùng: màu sắc, hình ảnh banner, hình sản phẩm/dịch vụ chụp ảnh cưới đẹp mắt ấn tượng
+ Các chức năng của website chụp ảnh cưới sử dụng dễ dàng, bố cục website phân bổ khoa học tạo tiện lợi khi khách hàng duyệt web
Trang 10+ Các thông tin về sản phẩm và dịch vụ chụp ảnh cưới cần chi tiết, rõ ràng, và
ấn tượng khách hang
+ Có các combo khuyến mãi ấn tượng thu hút khách hàng
+ Trang phục cưới, địa điểm chụp ảnh cưới đa dạng, thoải mái, phù hợp
+ Hợp đồng rõ ràng, đảm bảo độ tin cậy, luôn hướng về phục vụ nhu cầu của khách hàng , bảo đảm uy tín của website
+ Quy trình đơn giản: Sau khi đăng ký thông tin khách hàng sẽ nhận 1 SMS khuyến mại từ Website Ngay từ bây giờ, bạn có thể book lịch bằng điện thoại Đến thời gian hẹn,Áo Cưới BON đã chuẩn bị ekip sẵn sàng phục vụ bạn
+ Tạo các trang Blog viết về những câu chuyện tình yêu của khách hàng rất thú vị
+ Dịch vụ chụp ảnh cưới đầy đủ , chu đáo Không chỉ là các sản phẩm chất lượng
về ảnh cưới như album ảnh cưới, ảnh cưới phóng lớn, DVD cưới, mà quan trọng vẫn nằm trong chi phí đó mà các công việc : ngày chụp ảnh - ngày lễ an hỏi - ngày lễ cưới đều đã có đầy đủ các dịch vụ
Áo cưới Mailisa : https://aocuoimailisa.vn/
Hình 1.2 Trang chủ Studio Áo cưới MAILISA
+ Hệ thống chat trực tiếp với Website giúp khách hàng có thể giải đáp thắc mắc một cách rõ ràng, nhanh chóng
+ Trình bày những giải thưởng – cờ - cúp lưu niệm đã đạt được trong các cuộc thitạo uy tín với khách hàng
+ Phong cách chụp hình độc đáo , khác lạ nhưng vẫn giữ được nét truyền thống cho bộ ảnh cưới
+ Dịch vụ cưới đa dạng (Chụp hình cưới ở phim trường,Đà Lạt,…;trang điểm cô dâu;cho thuê và bán áo cưới; ) với đội ngũ ekip chất lượng(Đạo diễn,Chuyên gia Stylist,Nhiếp ảnh gia, )
+ Album ảnh cưới,Video đẹp của những khách hàng giúp tạo ấn tượng,thu hút người xem khi duyệt web
+ Có mục tin tức ghi lại những thông báo,câu chuyện tình yêu,hôn nhân tốt đẹp làm tăng sự thu hút với khách hàng
1.2 Mục tiêu đề tài
- Quảng bá thương hiệu, sản phẩm, dịch vụ của cửa hàng áo cưới cho khách hàngbiết đến, thu hút được nhiều khách hàng hơn
Trang 11- Cung cấp đầy đủ thông tin các gói dịch vụ (trang điểm, chụp ảnh cưới, ) vàcác ưu đãi kèm theo nếu có, để khách hàng biết trước và có thể lựa chọn chomình một gói phù hợp, tiết kiệm thời gian di chuyển
- Chia sẻ những bức ảnh, những album đẹp của ảnh viện đã chụp để khách hàng
có thể xem và tham khảo
- Chia sẻ những video cưới đẹp, ấn tượng, các câu chuyện tình yêu, nhật ký củacác đôi tình nhân nếu có
- Chia sẻ những thông tin, bình luận, đánh giá của khách hàng thông qua việctích hợp mạng xã hội vào trang web, để khách hàng có cái nhìn khách quan nhất
về sản phẩm, dịch vụ của ảnh viện mình
1.3 Nội dung chính
- Tìm hiều, ứng dụng các ngôn ngữ lập trình vào thiết kế website
- Thiết kế đặc tả hệ thống
- Xây dựng các module quản lý
- Tìm hiểu về PHP, MySQL , phục vụ trong quá trình xây dựng trang web
- Website nhanh và hiệu quả hơn trong việc tư vấn, hỗ trợ dịch vụ, chăm sóc khách hàng
1.4 Kết quả:
- Xây dựng thành công website hỗ trợ tìm kiếm việc làm
- Tìm hiểu nắm bắt được các kiến thức về HTML, CSS, JAVASCRIPT,
JQUERY, BOOTSTRAP,…
- Với quy mô trang web vừa và nhỏ, cộng thêm thời gian không cho phép nên đề
tài “Xây dựng website STUDIO ÁO CƯỚI A&C” có thể chưa có đầy đủ các
chức năng hoàn thiện của một trang web tìm việc Trong quá trình làm còn nhều sai sót, do kiến thức có hạn lên website còn ít nhiều thiếu sót về việc hiển thị cũng như tối ưu thuật toán, thời gian thực hiện Trong tương lai em sẽ cố gắng khắc phục những sai sót này
Trang 12vụ web với phần mở rộng “.htm” hoặc “.html” Các trình duyệt sẽ đọc tập tinHTML và hiển thị chúng dưới dạng trang web Các thẻ HTML sẽ được ẩn đi, chỉhiển thị nội dung văn bản và các đối tượng khác: hình ảnh, media Với các trìnhduyệt khác nhau đều hiển thị một tập HTML với một kết quả nhất định Các trangHTML được gửi đi qua mạng internet theo giao thức HTTP HTML không nhữngcho phép nhúng thêm các đối tượng hình ảnh, âm thanh mà còn cho phép nhúngcác kịch bản vào trong đó như các ngôn ngữ kịch bản như Javascript để tạo hiệuứng động cho trang web Để trình bày trang web hiệu quả hơn thì HTML chophép sử dụng kết hợp với CSS HTML không những cho phép nhúng thêm cácđối tượng hình ảnh, âm thanh mà còn cho phép nhúng các kịch bản vào trong đónhư các ngôn ngữ kịch bản như Javascript để tạo hiệu ứng động cho trang web HTML là một chuẩn ngôn ngữ internet được tạo ra và phát triển bởi tổ chức World Wide Web Consortium còn được viết tắc là W3C Trước đó thì HTMLxuất bản theo chuẩn của RFC HTML được tương thích với mọi hệ điều hànhcùng các trình duyệt của nó Khả năng dễ học, dễ viết là một ưu điểm của HTMLkhông những vậy việc soạn thảo đòi hỏi hết sức đơn giản, chúng ta có thể dùngword, notepad hay bất cứ một trình soạn thảo văn bản nào để viết và chỉ cần lưuvới định dạng “.html “ hoặc “.htm” là đã có thể tạo ra một file chứa HTML Hiệnnay, phiên bản mới nhất của HTML là HTML5 với nhiều tính năng ưu việt so vớicác phiên bản cũ HTML cải tiến khá nhiều đặc biệt hỗ trợ mạnh mẽ các phần tửmultimedia mà không cần các plugin Một tập tin HTML bao gồm trong đó là cácđoạn văn bản HTML, được tạo lên bởi các thẻ HTML HTML5 nói chung mạnh
mẽ hơn nhiều không chỉ về tốc độ và độ thích ứng cao mà chính là khả năng hỗtrợ API (Application Programming Interface - giao diện lập trình ứng dụng) vàDOM (Document Object Model – các đối tượng thao tác văn bản)
2.1.2 Ngôn ngữ CSS
CSS (Cascading Style Sheets) là một ngôn ngữ quy định cách trình bàycho các tài liệu viết bằng HTML, XHTML, XML, SVG, hay UML,…CSS quyđịnh cách hiển thị của các thẻ HTML bằng cách quy định các thuộc tính của cácthẻ đó (font chữ, kích thước, màu sắc )
CSS có cấu trúc đơn giản và sử dụng các từ tiếng anh để đặt tên cho cácthuộc tính CSS khi sử dụng có thể viết trực tiếp xen lẫn vào mã HTML hoặctham chiếu từ một file css riêng biệt Hiện nay CSS thường được viết riêng thànhmột tập tin với mở rộng là “.css” Chính vì vậy mà các trang web có sử dụng CSSthì mã HTML sẽ trở nên ngắn gọn hơn Ngoài ra có thể sử dụng một tập tin CSS
đó cho nhiều website tiết kiệm rất nhiều thời gian và công sức Một đặc điểmquan trọng đó là tính kế thừa của CSS do đó sẽ giảm được số lượng dòng code
mà vẫn đạt được yêu cầu
Trang 13Tuy nhiên, đối với CSS thì các trình duyệt hiểu theo kiểu riêng của nó Dovậy, việc trình bày một nội dung trên các trình duyệt khác nhau là không thốngnhất CSS cung cấp hàng trăm thuộc tính trình bày dành cho các đối tượng với sựsáng tạo cao trong kết hợp các thuộc tính giúp mang lại hiệu quả
2.1.3 Ngôn ngữ lập trình PHP
PHP (Hypertext Preprocessor) là một ngôn ngữ lập trình kịch bản hay mộtloại mã lệnh chủ yếu được dùng để phát triển các ứng dụng viết cho máy chủ, mãnguồn mở, dùng cho mục đích tổng quát Nó rất thích hợp với web và có thể dễdàng nhúng vào trang HTML Do được tối ưu hóa cho các ứng dụng web, tốc độnhanh, nhỏ gọn, cú pháp giống ngôn ngữ lập trình C và ngôn ngữ lập trình Java,
dễ học và thời gian xây dựng sản phẩm tương đối ngắn hơn so với các ngôn ngữkhác nên PHP đã nhanh chóng trở thành một ngôn ngữ lập trình web phổ biếnnhất thế giới Một tập tin PHP có phần mở rộng *.php, nó có thể chứa các vănbản, mã nguồn HTML, CSS, Javascript, Jquery và đương nhiên có thể chứa mãnguồn PHP
Đối với các trang PHP khi có yêu cầu xem trang web thì Server sẽ tiến hànhphát sinh trang web đó từ mã nguồn PHP sang mã nguồn HTML, sau đó mớichuyển mã nguồn đó về trình duyệt web để người dùng xem Vì các trình duyệtweb không thể đọc được các mã nguồn PHP mà chỉ đọc được các mã nguồnHTML
2.1.3.1 Framework Laravel
Laravel là một PHP framework mã nguồn mở và miễn phí, được pháttriển bởi Taylor Otwell và nhắm vào mục tiêu hỗ trợ phát triển các ứng dụng webtheo kiếm trúc model-view-controller (MVC) Những tính năng nổi bật củaLaravel bao gồm cú pháp dễ hiểu – rõ ràng , một hệ thống đóng gói modular vàquản lý gói phụ thuộc, nhiều cách khác nhau để truy cập vào các cơ sở dữ liệuquan hệ, nhiều tiện ích khác nhau hỗ trợ việc triển khai vào bảo trì ứng dụng
Vào khoảng Tháng 3 năm 2015, các lập trình viên đã có một cuộc bìnhchọn PHP framework phổ biến nhất, Laravel đã giành vị trí quán quân cho PHPframework phổ biến nhất năm 2015, theo sau lần lượt là Symfony2, Nette,CodeIgniter, Yii2 vào một số khác Trước đó, Tháng 8 2014, Laravel đã trở thànhproject PHP phổ biến nhất và được theo dõi nhiều nhất trên Github
Laravel được phát hành theo giấy phép MIT, với source code được lưu trữtại Github
Laravel là ứng dụng MVC hoàn chỉnh tương đối dễ tiếp cận phù hợp vớingười mới lập trình PHP
Dưới đây là một số tính năng nổi bật của Laravel:
- Viết trên mô hình MVC PHP
- Đầy đủ các lớp Database giúp hỗ trợ tốt cho các nền tảng khác nhau
- Dễ dàng đọc hiểu, sử dụng: Các tính năng dựng sẵn: Cung cấp cho người dùng rất nhiều các nhóm tính năng giúp quá trình phát triển trở nên nhanh chóng hơn rất nhiều
- Các tính năng bảo mật
- Cung cấp Blade Templade
- Thư viện hỗ trợ lớn
Trang 142.2.1 Thư viện Javascript
JavaScript là một ngôn ngữ dạng script thường được sử dụng cho việc lậptrình web ở phía client, nó tuân theo chuẩn ECMAScript Là một ngôn ngữ linhđộng, cú pháp dễ sử dụng như các ngôn ngữ khác và dễ dàng lập trình JavaScriptkhông hề liên quan tới ngôn ngữ lập trình java, được hầu hết các trình duyệt ngàynay hỗ trợ Với javascript, ứng dụng web của bạn sẽ trở nên vô cùng sinh động,mang tính trực quan và tương tác cao JavaScript theo phiên bản hiện hành là mộtngôn ngữ lập trình kịch bản dựa trên đối tượng được phát triển từ các ý niệmnguyên mẫu Ngôn ngữ này được dùng rộng rãi cho các trang web, nhưng cũngđược dùng để tạo khả năng viết script sử dụng các đối tượng nằm sẵn trong cácứng dụng Giống Java, JavaScript có cú pháp tương tự ngôn ngữ lập trình C “.js”
là phần mở rộng thường được dùng cho tập tin mã nguồn JavaScript
2.2.2 Thư viện BOOTSTRAP
Bootstrap là một Framework có chứa HTML, CSS, JAVASCRIPT,Framework trong tiếng việt có nghĩa là “khuôn khổ” giúp tiết kiệm được thờigian, công sức hơn nữa việc xây dựng hai teamplate cho giao diện Desktop vàMobile đã lỗi thời thay vào đó là Responsive Responsive sẽ giúp website của bạnhiển thị tương thích với mọi kích thước màn hình nhờ đó bạn sẽ tùy chỉnh hiện thịđược nhiều hơn trên các loại màn hình khác nhau
Ưu điểm của Bootstrap:
- Tiết kiệm thời gian: Boostrap giúp người thiết kế giao diện website tiết kiệm rất nhiều thời gian Các thư viện Bootstrap có những đoạn mã sẵn sàng cho bạn áp dùng vào website của mình Bạn không phải tốn quá nhiều thời gian để tự viết code cho giao diện của mình
- Tùy biến cao: Bạn hoàn toàn có thể dựa vào Bootstrap và phát triển nền tảng giao diện của chính mình Bootstrap cung cấp cho bạn hệ thống Grid Systemmặc định bao gồm 12 bột và độ rộng 940px Bạn có thể thay đổi, nâng cấp và phát triển dựa trên nền tảng này
- Responsive Web Design: Với Bootstrap, việc phát triển giao diện website
để phù hợp với đa thiết bị trở nên dễ dàng hơn bao giờ hết Đây là xu hướng phát triển giao diện website đang rất được ưu chuộng trên thế giới
2.2.3 Thư viện JQUERY
JQuery là một thư viện kiểu mới của JavaScript, được tạo bởi John Resig vàonăm 2006 với một phương châm tuyệt vời: Write less, do more - Viết ít hơn, làmnhiều hơn
JQuery làm đơn giản hóa việc truyền tải HTML, xử lý sự kiện, tạo hiệu ứngđộng và tương tác Ajax Với jQuery, khái niệm Rapid Web Development đãkhông còn quá xa lạ