đồ án tốt nghiệp đề tài xây dựng trang web

Đồ án tốt nghiệp xây dựng trang web

TRƯỜNG ĐẠI HỌC KHOA ĐỒ ÁN TỐT NGHIỆP Đề tài: XÂY DỰNG TRANG WEB SV thực hiện: Mã sinh viên: Lớp K1A 1Đồ án tốt nghiệp |Đề tài: “Xây dựng trang web” Trang 2Đồ án tốt nghiệp |Đề tài: “Xây dựng trang web” LỜI CẢM ƠN Với lòng biết ơn sâu sắc em xin chân thành cảm ơn giúp đỡ tận tình thầy mơn Mạng giảng dạy hướng dẫn em suốt trình học tập nhà trường hoàn thành đồ án Để hoàn thành đồ án này, em xin tỏ lòng biết ơn sâu sắc đến Ths.A tận tình hướng dẫn suốt trình em viết đồ án Em chân thành cảm ơn quý thầy, cô mơn Mạng tận tình truyền đạt kiến thức năm em học tập Với vốn kiến thức tiếp thu q trình học khơng tảng cho trình nghiên cứu đồ án mà hành trang quý báu để em bước vào đời cách vững tự tin Vì thời gian có hạn kiến thức em cịn nhiều hạn chế nên đồ án em chắn khơng tránh khỏi thiếu sót, em mong nhận giúp đỡ thầy tồn thể bạn lớp giúp đỡ em hoàn thành báo cáo Thái Nguyên, ngày tháng năm 20 Sinh viên thực Trang 3Đồ án tốt nghiệp |Đề tài: “Xây dựng trang web” MỤC LỤC CHƯƠNG TỔNG QUAN VỀ CỞ SỞ LÝ THUYẾT .5 1.1 Tổng quan ngôn ngữ PHP 1.1.1 Khái niệm 1.1.2 Mơ hình MVC 1.2 Hệ quản trị CSDL MySQL 10 1.2.1 Khái niệm .10 1.2.2 Ưu điểm MySQL 10 1.2.3 Đặc điểm MySQL 11 1.2.4 Cú pháp MySQL .11 1.3 Tổng quan Framework Laravel 11 1.3.1 Khái niệm .11 1.3.2 Lịch sử phát triển Laravel 12 1.3.3 Ưu điểm Laravel PHP Framework .13 1.3.4 Mơ hình MVC (Model – View – Controller) Laravel .13 1.3.5 Cấu trúc thư mục Laravel 14 1.4 Môi trường công cụ phát triển 17 CHƯƠNG PHÂN TÍCH VÀ THIẾT KẾ HỆ THỐNG .19 2.1 Đặt vấn đề 19 2.2 Mục tiêu đồ án .19 2.3 Phương pháp nghiên cứu 20 2.4 Mô tả tổng quan 20 2.4.1 Mô tả chức hệ thống 20 2.4.2 Đặc điểm người sử dụng 21 2.4.3 Môi trường vận hành 22 2.4.4 Ràng buộc thực thi thiết kế 22 2.5 Các yêu cầu giao tiếp 23 2.5.1 Giao diện người sử dụng 23 2.5.2 Giao tiếp phần cứng 23 Trang 4Đồ án tốt nghiệp |Đề tài: “Xây dựng trang web” 2.5.3 Giao tiếp phần mềm 23 2.5.4 Giao tiếp truyền thông tin 24 2.6 Các tính hệ thống 24 2.6.1 Đăng nhập 24 2.6.2 Đăng xuất .25 2.6.3 Tạo danh mục quan ban hành 26 2.6.4 Tạo danh mục hình thức văn 26 2.6.5 Tạo danh mục lĩnh vực 27 2.6.6 Tạo danh mục loại văn 27 2.6.7 Tạo danh mục công văn 28 2.6.8 Tạo Slide 28 2.6.9 Tạo người dùng 29 2.6.10 Phân quyền 29 2.6.11 Quản lý cơng văn theo loại hình cơng văn .30 2.6.12 Giới thiệu .30 2.6.13 Liên hệ 31 2.6.14 Tìm kiếm 31 2.6.15 Tải công văn 32 2.6.16 Chi tiết công văn 32 2.7 Các yêu cầu phi chức 33 2.7.1 Yêu cầu thực thi .33 2.7.2 Yêu cầu an toàn .33 2.7.3 Yêu cầu bảo mật 33 2.7.4 Các đặt điểm chất lượng phần mềm .34 2.8 Kiến trúc hệ thống 34 2.8.1 Thiết kế kiến trúc 34 2.8.2 Mô tả phân rã .36 2.9 Thiết kế liệu 36 2.9.1 Mơ hình quan hệ 36 2.9.2 Từ điển liệu 37 CHƯƠNG 3: XÂY DỰNG WEBSITE 44 3.1 Trang giao diện trang chủ 44 Trang 5Đồ án tốt nghiệp |Đề tài: “Xây dựng trang web” 3.2 Trang giao diện tìm kiếm .44 3.3 Trang đăng nhập trang chủ 44 3.4 Giao diện đăng nhập trang chủ thành công 45 3.5 Giao diện đăng nhập trang quản trị 45 3.6 Giao diện trang quản trị đăng nhập thành công 46 3.7 Giao diện danh sách thành viên 47 3.8 Giao diện thêm công văn .47 KẾT LUẬN VÀ HƯỚNG PHÁT TRIỂN 48 PHỤ LỤC 50 TÀI LIỆU THAM KHẢO .56 Trang 6Đồ án tốt nghiệp |Đề tài: “Xây dựng trang web” CHƯƠNG TỔNG QUAN VỀ CỞ SỞ LÝ THUYẾT 1.1 Tổng quan ngôn ngữ PHP PHP (Personal Home Page hay PHP Hypertext Preprocessor) giới thiệu năm 1994 R Lerdoft, sưu tập ngôn ngữ chưa chặt chẽ dựa vào Perl công cụ trang chủ.Vì trình xử lý dựa máy chủ nên trang Web viết PHP dễ dàng hệ điều hành Nói cách ngắn gọn: PHP ngơn ngữ lập trình kiểu script, chạy Server trả mã HTML cho trình duyệt xu hướng sử dụng PHP việc thiết kế Web ngày phát triển giai đoạn nay.PHP ngôn ngữ lập trình kết nối chặt chẽ với máy chủ Nói cách đơn giản khơng theo thuật ngữ khoa học trình xử lý PHP thực máy chủ (Windowns Unix) Khi trang Web muốn dùng PHP phải đáp ứng tất q trình xử lý thơng tin trang Web đó, sau đưa kết ngơn ngữ HTML.Vì trình xử lý diễn máy chủ nên trang Web viết PHP dễ nhìn hệ điều hành Cũng giống hầu hết ngơn ngữ lập trình khác,PHP nối trực tiếp với HTML.Mã PHP tách biệt với HTML thực thể đầu cuối.Khi tài liệu đưa phân tích, q trình xử lý PHP thực điểm quan trọng, sau đưa kết Mã PHP đặt kiểu tag đặc biệt cho phép ta vào khỏi chế độ PHP, cú pháp PHP giống số ngơn ngữ lập trình khác, đặc biệt C Perl Ví dụ : Trang 7Đồ án tốt nghiệp |Đề tài: “Xây dựng trang web” 1.1.1 Khái niệm Cú pháp : Ta nhúng lệnh php vào trang HTML Đoạn mã php bắt đầu kết thúc cặp thẻ theo cú pháp: Đoạn mã php đặt đâu tài liệu Thông thường trang php bao gồm thẻ HTML trang HTML có thêm đoạn mã php Mỗi câu lệnh php kết thúc dấu (;) Dấu toán tử dùng để phân biệt cấu trúc với Có hai câu lệnh dùng để hiển thị câu text browser : echo print Lưu ý: + Các file php phải có phần mở rộng php Nếu phần mở rộng html đoạn mã php khơng thực thi + Có thể viết câu thích cho đoạn mã php Có hai cách viết là: /* thích */ // thích + Đoạn mã php đặt cặp thẻ: Các kiểu liệu : Php hỗ trợ kiểu liệu sau : + Integer: sử dụng cho giá trị có kiểu liệu số nguyên + Double: sử dụng cho giá trị có kiểu liệu số thực + String: sử dụng cho giá trị có kiểu liệu chuỗi ký tự + Array: sử dụng cho giá trị có kiểu liệu mảng + Object: sử dụng cho giá trị có kiểu liệu đối tượng lớp Biến : Trang 8Đồ án tốt nghiệp |Đề tài: “Xây dựng trang web” + Biến dùng để lưu giá trị như: xâu, số, ký tự, mảng,… + Tất biến php bắt đầu ký hiệu $ + Biến khai báo tự động sử dụng (gán giá trị) cho theo cú pháp: $Tên_biến = Giá_trị; + Php ngôn ngữ không định kiểu, nghĩa không cần khai báo kiểu cho biến Php chuyển kiểu biến cách tự động tùy thuộc vào giá trị + Lưu ý: Quy tắc đặt tên biến php giống C, C++, … Phạm vi biến: + Nếu biến khai báo Script có phạm vi toàn Script + Nếu biến khai báo hàm có tác dụng hàm Kiểm tra/ loại bỏ biến: + Sử dụng hàm isset(Tên_biến) để kiểm tra biến có tồn hay không? Kết trae kiểu boolean + Sử dụng hàm unset(Tên_biến) để loại bỏ biến tồn khỏi trạng thái thực thi + Sử dụng hàm empty(Tên_biến) để kiểm tra biến tồn không rỗng Hằng : + Hằng php khai báo giống ngôn ngữ C, C++ + Tên thường viết chữ hoa + Cú pháp khai báo sau: define (“Tên_hằng”, giá_trị); define (Tên_hằng, giá trị); Ví dụ: Ta có khái báo MAX = 100 sau: define (“MAX”, 100); define (MAX, 100); Cấu trúc rẽ nhánh : Trang 9Đồ án tốt nghiệp |Đề tài: “Xây dựng trang web” Cú pháp: if (điều kiện) câu lệnh php; Cấu trúc lặp : Cú pháp: for (init; condition; increment) { code to be executed; } 1.1.2 Mơ hình MVC Mơ hình MVC ? MVC từ viết tắt 'Model View Controller' Nó đại diện cho nhà phát triển kiến trúc áp dụng xây dựng ứng dụng Với kiến trúc MVC, xem xét cấu trúc ứng dụng liên quan đến cách luồng liệu ứng dụng hoạt động Dễ hiểu hơn, mơ hình phân bố source code thành phần, thành phần có nhiệm vụ riêng biệt độc lập với thành phần khác Hình 1.1 Mơ hình MVC Mơ hình MVC chia làm lớp xử lý gồm Model – View – Controller : + Model : nơi chứa nghiệp vụ tương tác với liệu hệ quản trị sở liệu (mysql, mssql… ); bao gồm class/function xử lý Trang 44Đồ án tốt nghiệp |Đề tài: “Xây dựng trang web” 3.1Trang giao diện trang chủ Hình 3.1 Giao diện trang chủ 3.2Trang giao diện tìm kiếm Trang 44 45Đồ án tốt nghiệp |Đề tài: “Xây dựng trang web” Hình 3.2 Giao diện trang tìm kiếm 3.3Trang đăng nhập trang chủ Hình 3.3 Giao diện đăng nhập trang chủ 3.4 Giao diện đăng nhập trang chủ thành cơng Hình 3.4 Giao diện trang chủ đăng nhập thành công Trang 45 46Đồ án tốt nghiệp |Đề tài: “Xây dựng trang web” 3.5Giao diện đăng nhập trang quản trị Hình 3.5 Giao diện đăng nhập trang quản trị 3.6 Giao diện trang quản trị đăng nhập thành cơng Hình 3.6 Giao diện trang quản trị Trang 46 47Đồ án tốt nghiệp |Đề tài: “Xây dựng trang web” Giao diện trang danh sách slide Hình 3.7 Giao diện danh sách slide 3.7 Giao diện danh sách thành viên Trang 47 48Đồ án tốt nghiệp |Đề tài: “Xây dựng trang web” Hình 13.8 Giao diện danh sách thành viên 3.8Giao diện thêm cơng văn Hình 3.9 Giao diện thêm công văn KẾT LUẬN VÀ HƯỚNG PHÁT TRIỂN 1.Kết đạt Về lý thuyết:  Nâng cao khả tự tìm tịi, học hỏi, khả đọc hiểu tài liệu tiếng Anh  Hiểu sâu Laravel Framework - PHP Framework phổ bíến  Hiểu vận dụng thành thạo mơ hình MVC, kiến thức hỗ trợ Trang 48 49Đồ án tốt nghiệp |Đề tài: “Xây dựng trang web” trình xây dựng hệ thống: CSS, HTML, MySQL, Javascript, Ajax,…  Khả lập trình, xây dựng mộ hệ thống đáp ứng nhu cầu thực tế nâng cao Ngoài ra, cịn tích lũy thêm kinh nghiệm xây dựng kế hoạch cho việc phát triển phần mềm hoàn chỉnh, cách bố trí quản lý thời gian cho hợp lý  Nâng cao khả thuyết trình, trình bày vấn đề Rèn luyện thêm kỹ viết tài liệu phần mềm chuẩn Về ứng dụng:  Xây dựng thành công phần mềm“ Xây dựng trang web quản lý công văn” đáp ứng yêu cầu Sở Y Tế Thái Nguyên  Hệ thống đưa vào hoạt động thử nghiệm thành công hosting, tốc độ xử lý mức chấp nhận chưa thấy phát sinh lỗi nghiêm trọng  Hệ thống viết theo mơ hình MVC nên dễ nâng cấp bảo trì, nâng cấp để triển khai sử dụng thực tế Hạn chế  Khả làm việc thực tế thân cịn hạn chế nên gặp khơng ích khó khăn trình xây dựng hệ thống cho thân thiện, gần gũi với người dùng  Thời gian thực cịn nên số vấn đề chưa giải giải chưa tối ưu triệt để  Hệ thống đáp ứng nghiệp vụ yêu cầu Sở Y Tế, số hạn chế chưa đáp ứng vào thực tế  Một số chức hệ thống đáp ứng phần yêu cầu người dùng, chưa có tính sáng tạo, đột phá cách giải vấn đề Hướng phát triển  Hồn thiện số chức cịn hạn chế hệ thống Trang 49 50Đồ án tốt nghiệp |Đề tài: “Xây dựng trang web”  Tìm hiểu thêm quy trình nghiệp vụ quan khác quản lý cơng văn có quy mơ phức tạp để áp dụng hoàn thiện cho dự án  Hoàn thiện thêm tính nâng cao hỗ trợ trải nghiệm người dùng Trang 50 51Đồ án tốt nghiệp |Đề tài: “Xây dựng trang web” PHỤ LỤC Có loại người dùng loại tài khoản đăng nhập vào “hệ thống quản lý công văn”: Khách truy cập( Không đăng nhập): Khi khách truy cập đến trang web, trang chủ hiển thị cho người dùng thơng tin như: danh sách tồn cơng văn đến, cơng văn đi, cho phép người dùng tìm kiếm công văn, xem chi tiết công văn, tải công văn Nhân viên: Khi nhân viên đăng nhập tài khoản nhân viên trang đăng nhập thông qua việc bấm vào nút “Đăng nhập” phần header trang web với email: nhanvien@quanlycongvan.com mật khẩu: 123456 bấm nút “Đăng nhập” Khi đăng nhập thành công người dùng chuyển đến trang chủ với quyền nhân viên, xem tồn cơng văn nội bộ, cơng văn đến, cơng văn đi, tìm kiếm tồn công văn, xem chi tiết công văn, tải công văn Admin: Khi người dùng truy cập vào địa public/admin, người dùng chuyển đến giao diện đăng nhập dành cho admin, người dùng đăng nhập với thông tin email: admin@quanlycongvan.com mật 123456 bấm nút “Đăng nhập” Khi đăng nhập hành công người dùng chuyển đến trang dành cho quản trị viên với quyền admin, người dùng có quyền thêm, sửa xố cơng văn Ngồi người dùng cịn có quyền thay đổi thơng tin tài khoản tên người dùng, mật SuperAdmin: Trang 51 52Đồ án tốt nghiệp |Đề tài: “Xây dựng trang web” Khi người dùng truy cập vào địa public/admin, người dùng chuyển đến giao diện đăng nhập dành cho admin, người dùng đăng nhập với thông tin email: superadmin@quanlycongvan.com mật 123456 bấm nút “Đăng nhập” Khi đăng nhập hành công người dùng chuyển đến trang dành cho quản trị viên với quyền SuperAdmin, người dùng có tồn quyền cập nhật cơng văn, cập nhật quan ban hành, cập nhật hình thức văn bản, cập nhật lĩnh vực, cập nhật loại văn bản, cập nhật người dùng, cập nhật slide hiển thị trang chủ Ngồi người dùng cịn có quyền thay đổi thông tin tài khoản tên người dùng, mật Cách hệ thống xử lý yêu cầu request từ phía client: Hình 4.1 Sơ đồ luồng xử lý có yêu cầu từ request từ phí client  Người dùng gửi request thơng qua trình duyệt web( browser) đến sever Trang 52 53Đồ án tốt nghiệp |Đề tài: “Xây dựng trang web”  Sever kiểm tra yêu cầu người dùng thông qua URL chuyển đến Routing xử lý, tuỳ vào yêu cầu người dùng mà Routing chuyển yêu cầu đến Controller tương ứng  Controller xử lý yêu cầu, yêu cầu có địi hỏi truy xuất liệu sở liệu Controller gọi đến lớp Model Nếu không Controller gọi đến View  Model lớp dùng để tương tác trực tiếp với sở liệu, lệnh từ Controller, Model lấy liệu lên đổ Controller để Controller tiếp tục xử lý  View nhận liệu từ Controller gọi đến trang giao diện tương ứng váo yêu cầu request từ phí người dùng, hiển thị chúng qua browser Dự án thực tế:  Khi người dùng truy cập vào trang chủ cách gõ địa vào URL Hình 4.2 Người dùng gõ địa trang chủ vào URL browser  Server chuyển yêu cầu request đến Routing Hình 4.3 Tạo route ‘trangchu’, gọi đến PagesController Trang 53 54Đồ án tốt nghiệp |Đề tài: “Xây dựng trang web”  Từ route gọi đến Controller “PagesController” với function trangchu() Hình 4.4 Code function trangchu()  Trong PagesController gọi đến Model Auth::user() để kiểm tra xác thực người dùng, đăng nhập gọi đến Model CongVan lấy tất liệu bảng công văn, xếp giảm dần theo ngày ký Nếu người dùng chưa đăng nhập, gọi đến Model CongVan lấy tất công văn trừ cơng văn có idloaihinhcongvan = 2, xếp giảm dần theo ngày ký Return liệu công văn view trangchu.blade.php nằm thư mục pages Bảo mật với Middleware:  Group route toàn trang admin với Middleware Trang 54 55Đồ án tốt nghiệp |Đề tài: “Xây dựng trang web” Hình 4.5 Route group admin với middleware ‘adminLogin’ Trang 55 56Đồ án tốt nghiệp |Đề tài: “Xây dựng trang web”  View trangchu.blade.php nhận liệu từ “PagesController” hiển thị lên browser Hình 4.6 View trangchu.blade.php  Middleware adminLogin kiểm tra quyền người dùng, > tức admin Superadmin vào trang quản lý Trang 56 57Đồ án tốt nghiệp |Đề tài: “Xây dựng trang web” Hình 4.7 Middel ‘adminLogin’ Trang 57 58Đồ án tốt nghiệp |Đề tài: “Xây dựng trang web” TÀI LIỆU THAM KHẢO [1] Phạm Thế Quế, Giáo trình Cơ sở liệu, Trường Đại học Mở Hà Nội, Hà Nội, 2004 [2] Trần Đình Quế, Giáo trình Phân tích thiết kế hệ thống thơng tin, Học viện Cơng nghệ bưu viễn thơng, Hà Nội, 2017 [3] Đặng Văn Đức, Phân tích thiết kế hướng đối tượng, NXB Giáo Dục, 2002 [4] FPT Polytechnic, Giáo trình Html & Css3 , NXB Bách Khoa Hà Nội, 2015 [5] Jole Murach, Lập Trình Cơ Bản Php Và Mysql, NXB Khoa Học Kỹ Thuật, 2013 [6] Steve Suehring, JavaScript - Hướng dẫn học qua ví dụ, NXB Khoa Học Kỹ Thuật, 2013 [7] Ebook “Laravel 5.4 for Beginners”, Bill Keck [8] Các trang webs:  Trang 1: http://w3schools.com  Trang 2: https://laravel.com  Trang 3: https://allaravel.com  Trang 4: https://khoapham.vn  Trang 5: https://freetuts.net Trang 58 ... ? ?Xây dựng trang web? ?? 3. 1Trang giao diện trang chủ Hình 3.1 Giao diện trang chủ 3. 2Trang giao diện tìm kiếm Trang 44 45Đồ án tốt nghiệp |Đề tài: ? ?Xây dựng trang web? ?? Hình 3.2 Giao diện trang tìm... CHƯƠNG 3: XÂY DỰNG WEBSITE 44 3.1 Trang giao diện trang chủ 44 Trang 5Đồ án tốt nghiệp |Đề tài: ? ?Xây dựng trang web? ?? 3.2 Trang giao diện tìm kiếm .44 3.3 Trang đăng... ngữ cảnh Trang 36 37Đồ án tốt nghiệp |Đề tài: ? ?Xây dựng trang web? ?? 2.9 Thiết kế liệu 2.9.1 Mơ hình quan hệ Hình 2.4 Mơ hình quan hệ Trang 37 38Đồ án tốt nghiệp |Đề tài: ? ?Xây dựng trang web? ?? Hình