BỘ GIÁO dục và đào tạo

BỘ GIÁO DỤC VÀ ĐÀO TẠO TRƯỜNG ĐẠI HỌC VINH VIỆN KỸ THUẬT VÀ CÔNG NGHỆ BÀI TẬP LỚN Học phần Lập trình Web Lớp Lập trình Web 01 Nhóm thực hiện Nhóm 8 THIẾT KẾ TRANG WEB TIN TỨC NỀN TẢNG MVC ASP NET Giảng viên hướng dẫn Ths Lê Văn Thành Sinh viên thực hiện Hồ Văn Lợi (NT) MSSV 18574802010127 Lớp 59K2 Phạm Hoàng Linh MSSV 18574802010078 Lớp 59K1 Dương Hoàng Long MSSV 18574802010180 Lớp 59K1 Nguyễn Bá Lương MSSV 18574802010103 Lớp 59K2 Nghệ An – 2022 MỤC LỤC LỜI CẢM ƠN 1 CHƯƠNG I GIỚI THIỆU CHUNG 2 1.

TRƯỜNG ĐẠI HỌC VINH VIỆN KỸ THUẬT VÀ CÔNG NGHỆ BÀI TẬP LỚN Học phần: Lập trình Web Lớp: Lập trình Web_01 Nhóm thực hiện: Nhóm THIẾT KẾ TRANG WEB TIN TỨC NỀN TẢNG MVC ASP.NET Giảng viên hướng dẫn: Ths.Lê Văn Thành Sinh viên thực hiện: Hồ Văn Lợi (NT) Phạm Hoàng Linh Dương Hoàng Long Nguyễn Bá Lương MSSV: 18574802010127 MSSV: 18574802010078 MSSV: 18574802010180 MSSV:18574802010103 Nghệ An – 2022 Lớp: 59K2 Lớp: 59K1 Lớp: 59K1 Lớp: 59K2 MỤC LỤC DANH MỤC HÌNH VẼ Hình 2.2 Sơ đồ phân cấp chức Hình 2.3.2 Biểu đồ use case tổng quát website Hình 2.3.3: Biểu đồ usecase đăng nhập Hình 2.3.4: Biểu đồ use case quản lý người dùng Hình 2.3.5: Biểu đồ usercase quản lý viết Hình 2.3.6 Biểu đồ use case tìm kiếm Hình 2.4.1 Biểu đồ hoạt động chức thêm tin Hình 2.4.2 Biểu đồ hoạt động sửa tin Hình 2.4.3 Biểu đồ hoạt động chức xóa tin Hình 2.4.4 Biểu đồ hoạt động chức tìm kiếm Hình 3.2 Mơ hình thực thể liên kết Hình 4.1 Giao diện trang chủ Hình 4.2 Giao diện trang quản trị Hình 4.3 Giao diện trang đăng nhập Hình 4.4 Giao diện trang thêm viết LỜI CẢM ƠN Báo cáo tập lớn mơn lập trình Web với đề tài “Thiết kế trang Web tin tức tảng Asp.net” kết q trình cố gắng khơng ngừng nhóm giúp đỡ, động viên khích lệ thầy cơ, bạn bè lớp Qua trang viết nhóm chúng tơi xin gửi lời cảm ơn tới người giúp đỡ nhóm suốt khoảng thời thời gian học tập - nghiên cứu khoa học vừa qua Nhóm chúng tơi xin tỏ lịng kính trọng biết ơn sâu sắc thầy Lê Văn Thành trực tiếp tận tình hướng dẫn cung cấp tài liệu thông tin khoa học cần thiết cho tập Trong khoảng thời gian nhóm chúng tơi cố gắng học tập nghiên sản phẩm cuối cùng, lần đầu tiếp cận chưa có nhiều kinh nghiệm hiểu biết nên khơng thể tránh khỏi sai sót Nhóm mong có ý kiến đánh giá khách quan góp ý mang tính xây dựng từ thầy bạn đọc, để nhóm hồn thiện tập lấy học cho sau Chúng xin chân thành cảm ơn! CHƯƠNG I: GIỚI THIỆU CHUNG 1.1 Tổng quan đề tài 1.1.1 Tính cấp thiết đề tài Cơng nghệ thơng tin tạo nên xã hội toàn cầu, nơi mà người tương tác liên lạc với cách nhanh chóng hiệu Trong 15 năm qua, lĩnh vực công nghệ thông tin Việt Nam đạt nhiều thành tựu quan trọng Ngày nay, công nghệ thông tin dần trở thành ngành kinh tế mũi nhọn đất nước, có tỉ lệ đóng góp cho tăng trưởng GDP đất nước ngày cao Cơng nghệ thơng tin có mặt nhiều phương diện sống hàng ngày chúng ta, từ thương mại đến giải trí chí văn hóa, xã hội giáo dục… Bên cạnh việc phổ biến sử dụng Internet tạo bước ngoặt định hướng phát triên ngành Công nghệ thông tin nước ta với nhu cầu sử dụng phương tiện truyền thông để trao đổi thông tin ngày cáng phát triển mạnh Việc cập nhật thông tin tin tức từ nhiều lĩnh vực xã hội như: kinh tế, trị, công nghệ, thể thao,… từ lâu nhu cầu thiết người công nghệ thông tin phát triển việc tiếp cận thơng tin người dễ dàng hết Bây bạn khơng phải khoản phí để mua tờ báo giấy mà có thơng tin ngày hơm Với việc sở hữu cho điện thoại thơng minh hay máy tính có kết nối internet hồn tồn biết tồn thơng tin lĩnh vực mà bạn cần cách nhanh chóng Cơng nghệ thay đổi cách tiếp cận thơng tin kéo theo phát triển trang tin tức, tờ báo số tăng theo Do số lượng người dung trải dài độ tuổi như cầu tin tức khác Vì cần thiết phải xây dựng website có thiết kế chức năng, giao diện phù hợp đáp ứng số lượng người dung lớn lúc 1.1.2 Mục đích đề tài Người dùng tiếp cận tìm kiếm thơng tin khác trang tin tức Website cập nhật tin tức từ sơ liệu, cho phép người quản trị viên phân quyền thao tác cơng việc sau: - Tìm kiếm báo, tin tức theo chủ đề - Theo dõi thống kê đăng - Tạo tài khoản đăng ký, dăng nhập - Liên hệ với trang tin tức Thay đổi, thêm xóa bỏ thơng tin hình ảnh tin tức quản trị viên muốn giới thiệu cho người dùng Về tổ chức lưu trữ, thực yêu cầu sau: - Thêm, xóa, sửa thơng tin, hình ảnh tin tức đăng tải lên, phục vụ cho công tác quản lý, thống kê tình hình hoạt động trang web - Thêm xóa, sửa thơng tin, hình ảnh tin tức 1.2 Công cụ phát triển 1.2.1 Giới thiệu ASP.NET ASP.NET khung ứng dụng web thiết kế phát triển Microsoft Nó ngôn ngữ mã nguồn mở tập hợp NET Framework kế thừa ASP cổ điển (Active Server Pages) Với phiên 1.0 NET Framework, phát hành lần vào tháng năm 2002 ASP.NET xây dựng CLR (Common Language Runtime) cho phép lập trình viên thực thi mã ngơn ngữ NET (C #, VB, v.v.) Nó thiết kế đặc biệt để làm việc với HTTP cho nhà phát triển web để tạo trang web động, ứng dụng web, trang web dịch vụ web cung cấp tích hợp tốt HTML, CSS JavaScript .NET Framework sử dụng để tạo nhiều ứng dụng dịch vụ Console, Web Windows, v.v Nhưng lập trình ASP.NET sử dụng để tạo ứng dụng web dịch vụ web Đó lý gọi ASP.NET tập hợp NET Framework 1.2.2 Đặc điểm ASP.NET • Code Behind Mode/ Trạng thái code rời Đây đặc trưng tảng ASP.net dành cho lập trình viên Thơng qua việc tách rời hoạt động code máy tính, việc trì ứng dụng tảng ASP.net dễ dàng Các lập trình viên sử dụng file aspx viết ứng dụng tảng Vì thế, có tập tin với đuôi khác nhau: Mypage.aspx.cs biểu thị rõ cho đoạn mã code trang Vì vậy, nhà phát hành tạo tập tin riêng cho website, tập tin riêng dành cho coder để tiến hành viết đoạn mã • State Management/Quản lý trạng thái ASP.Net có phương tiện để kiểm sốt quản lý trạng thái, HTTP biết đến giao thức "khơng trạng thái" Lấy ví dụ ứng dụng giỏ hàng: user chọn lựa xong muốn mua đưa đưa định mua hàng trang web, người nhấn nút gửi Ứng dụng cần ghi nhớ mục mà người dùng chọn mua Đây hành động ghi nhớ trạng thái ứng dụng thời điểm Vì HTTP giao thức không trạng thái nên user truy cập web bán hàng, HTTP không lưu trữ thơng tin giỏ hàng Do đó, cần thêm số thao tác coding bổ sung để đảm bảo giỏ hàng chuyển đến trang bán hàng Việc triển khai trở nên phức tạp vài thời điểm Nhưng ASP.Net quản lý trạng thái thay cho bạn nhờ tính ghi nhớ giỏ hàng chuyển mục chọn mua qua trang bán hàng • Caching – Bộ nhớ Cache ASP.Net thực chức Caching, qua cải thiện hiệu suất làm việc cho ứng dụng Với việc lưu nhớ đệm cache, trang thường xuyên người dùng yêu cầu lưu trữ vị trí tạm thời Các trang truy xuất nhanh người dùng nhận phản hồi tốt Nhờ vậy, nhớ đệm giúp cải thiện đáng kể hiệu suất ứng dụng 1.2.3 Cơ sở liệu SQL Server Bất kì trang website có khối lượng liệu cần phải lưu trữ Đối với trang web bán hàng liệu khách hàng, liệu nguồn hàng, các trang web học tập thông tin sinh viên hay tài liệu giảng Các trang tin tức liệu tin tức, người viết hay thông tin tài khoản quản trị liệu quan trọng cần thiết phải lưu trữ Và SQL hệ quản trị sở liệu mà chọn để làm việc Hiện nay, website lớn, hoạt động với lượng người dùng đông đảo mạng xã hội Facebook, Yahoo, hay Google, Twitter,… sử dụng hệ quản trị liệu SQL Server để hỗ trợ cho việc lưu trữ thông tin thực hiệu Từ thấy tính hữu dụng, phổ biến SQL Server lĩnh vực thiết kế phát triển website CHƯƠNG 2: PHÂN TÍCH , THIẾT KẾ 2.1 Tổng quan UML • Biểu đồ usecase - Use case ( Use Case Diagram) cung cấp tranh tồn cảnh xảy hệ thống xảy hệ thống - Use case mô tả chuỗi hành động mà hệ thống thực để đạt kết có ý nghĩa tác nhân • Biểu đồ lớp - Biểu đồ lớp (Class Diagram) cho ta khung nhìn tĩnh lớp mơ hình phần mơ hình Nó cho ta thấy thuộc tính thao tác lớp, loại quan hệ lớp - Có nhiều lớp dùng biểu đồ lớp, xét đến sử dụng loại lớp : lớp biên, lớp điều khiển lớp sở liệu: + Lớp biên: lớp thể phần giao diện mà người dùng trực tiếp tương tác với hệ thống qua giao diện lớp + Lớp thực thể: lớp biểu diễn cho thực thể có mối quan hệ với liên quan đến hệ thống + Lớp điều khiển: lớp trung gian lớp biên lớp thực thể Lớp đóng vai trò lấy xử lý liệu để hiển thị lớp biên • - Biểu đồ hoạt động Biểu đồ hoạt động biểu đồ mô tả dịng cơng việc (work flow), dịng nghiệp vụ (business flow) đối tượng hay phương thức hệ thống 2.2 Biều đồ phân cấp chức Hình 2.2 Sơ đồ phân cấp chức 2.3 Biểu đồ usercase 2.3.1 Danh sách tác nhân usecase • Danh sách tác nhân Stt Tác nhân Nhiệm vụ Admin + Adminstrator tác nhân giữ vai trò website: Quyền quản lý quyền cao hệ thống.Đây người chịu trách nhiệm lớn Những người giữ vai trị quản lý phân quyền cho nhân viên website + Tác nhân Adminstrator thực tất chức website như: Tạo,quản lý tài khoản thành viên, quản lý phân quyền chuyên mục, Đăng sửa xóa tin bài… + Tác nhân Adminstrator có quyền thêm, sửa, xóa,cập nhật thơng tin User + Đăng nhập vào hệ thống: Mỗi thành viên có số quyền giới hạn Adminstrator cấp cho + Đăng ký tài khoản thành viên muốn tham gia website + Đăng tin mới: Khi có thơng tin cần đăng Users cập nhật thơng tin đăng lên website + Sửa thông tin: Khi cần update, sửa thơng tin Users vào viết sửa thơng tin cho xác + Xóa thơng tin: Khi thông tin cũ không cần thiết Users có quyền xóa khỏi CSDL • Danh sách usercase STT Tên Usecase Actor liên quan Ghi Mức tổng quát Admin, users visitor Được quyền truy cập vào hệ thống thực chức phân quyền Đăng nhập Admin, users visitor Đăng nhập vào hệ thống theo thông tin đăng kí Quản lý người dùng Admin Được quyền thêm mới, 10 - + Ngược lại sai hệ thống yêu cầu nhập lại quay lại việc nhập thông tin kiểm tra thông tin nhập Kết thúc quy trình thêm tin 2.4.2 Đặc tả biểu đồ hoạt động sửa tin Hình 2.4.2 Biểu đồ hoạt động sửa tin Admin sửa tin hệ thống hiển thị giao diện sửa tin Admin sửa tin tin cập nhật - Kết thúc quy trình sửa tin - 15 2.4.3 Đặc tả biểu đồ hoạt động xóa tin Hình 2.4.3 Biểu đồ hoạt động chức xóa tin Đặc tả truy trình hoạt động xóa tin: - Admin xóa tin - Hệ thống hiển thị giao diện xóa tin(Admin xóa tin lựa chọn xóa nhiều tin lúc) - Sau chọn chức xóa tin Hệ thống hỏi lại chắn muốn xóa chưa: + Nếu khơng đồng ý hệ thống hủy việc xóa tin kết thúc q trình xóa trường hợp việc xóa tin khơng thành cơng + Nếu đồng ý, hệ thống yêu cầu Admin chọn danh sách viết muốn xóa chấp nhận xóa Hệ thốngtrả kết bạn xóa tin thành cơng - Kết thúc quy trình xóa tin 16 2.4.4 Đặc tả biểu đồ hoạt động tìm kiếm Hình 2.4.4 Biểu đồ hoạt động chức tìm kiếm Đặc tả truy trình hoạt động tìm kiếm thơng tin: - Admin u cầu tìm kiếm thơng tin - Lúc Admin tương tác việc tìm kiếm thơng qua giao diện trang chủ hệ thống - Hệ thống u cầu Admin nhập thơng tin muốn tìm kiếm phần đầu trang chủ - Việc tìm kiếm thực hiên Hệ thống vào thông tin cần tìm kiếm Admin để thao tác sở liệu - Kết trả theo yêu cầu tìm kiếm Admin - Kết thúc quy trình tìm kiếm thơng tin CHƯƠNG 3: PHÂN TÍCH THIẾT KẾ CƠ SỞ DỮ LIỆU 17 3.1 Các bảng sở liệu 3.1.1 Bảng Menu • Nội dung STT Tên trường Kiểu liệu Độ dài Id Int Text nvarchar 50 Link nvarchar 250 Display Order int Target nvarchar Status bit Mơ tả Khóa 50 Bảng 3.1.1 Bảng menu 3.1.2 Bảng Footer • ST T Tên trường Kiểu liệu id nvarchar Content ntext Status bit Độ dài Mô tả 50 ( khóa bảng) Nội dung Bảng 3.1.2 Footer 3.1.3 Bảng newsTag • Nội dung 18 ST T Tên trường Kiểu liệu NewsID Bigint TagID Varchar Độ dài Mơ tả Khóa 50 Khóa Bảng 3.1.3 Bảng newsTag 3.1.4 Bảng system Config • Nội dung ST T Tên trường Kiểu liệu ID nvarchar Name Nvarchar Type Nvarchar Value Nvarchar Status bit Độ dài Mơ tả Khóa 50 50 50 250 Bảng 3.1.4 Bảng system Config 3.1.5 Bảng FeedBack • Nội dung STT Tên trường Kiểu liệu Id Int Độ dài Mơ tả Khóa 19 \Name Nvarchar Phone Nvarchar Email Nvarchar Content ntext CreateDate Datetime Address Nvarchar Status bit 50 50 50 150 Trạng thái Bảng 3.1.5 Bảng FeedBack 3.1.6 Bảng About • Nội dung STT Tên trường Kiểu liệu id Int name nvarchar alias nvarchar status bit smalldescriptio n ntext description ntext Độ dài Mơ tả Khóa 250 250 20 createdate datetime modifieddate datetime Bảng 3.1.6 Bảng About 3.1.7 Bảng User • Nội dung STT Tên trường Kiểu liệu id Bigint username nvarchar password Nvarchar name Nvarchar email nvarchar phone Varchar modifieddate datetime createdate datetime status bit Độ dài Mơ tả Khóa 50 32 50 50 50 Bảng 3.1.7 Bảng User 21 3.1.8 Bảng NewsCategory • Nội dung ST T Tên trường Kiểu liệu id bigint Name Nvarchar metatitle nvarchar displayorder int seotitle nvarchar modifierdate datetime createdate datetime status bit Độ dài Mơ tả Khóa 250 250 250 Bảng 3.1.8 Bảng NewsCategory 3.1.9 Bảng News STT Tên trường Kiểu liệu id int name nvarchar categoryID bigint Alias nvarchar Image Status nvarchar bit Độ dài Mơ tả Khóa 250 250 22 ntext SmallDescriptio n Description ViewCount int 10 CreateDate datetime 11 MdifiedDate datetime 12 tags nvarchar ntext 500 Bảng 3.1.9 Bảng News 3.2 Sơ đồ thực thể liên kết Hình 3.2 Mơ hình thực thể liên kết 23 CHƯƠNG 4: PHÂN TÍCH THIẾT KẾ GIAO DIỆN 4.1 Phân tích thiết kế giao diện trang chủ chương trình • Mục đích: Giúp người dùng thao tác tất chức hệ thống • Phạm vi: Tất bạn đọc truy cập vào Website • Ràng buộc: Đăng nhập để thao tác toàn chức hệ thống • Giao diện chương trình Hình 4.1 Giao diện trang chủ • - Đặc tả: Đây giao diện chương trình cho phép người dùng thao tác với hệ thống Đây trang cập nhật đầy đủ thơng tin có hệ thống Website Người dùng đăng ký trở thành thành viên hệ thống Người dùng lựa chọn chuyên mục lớn hệ thống Website 24 - Người dùng việc đọc tin cịn tìm kiếm thơng tin gửi ý kiến phản hồi sau mỗi tin 4.2 Phân tích thiết kế giao diện trang quản trị • Mục đích: Cho phép Admin quản lý thơng tin hệ thống Website: quản trị người dùng, quản trị chuyên mục, quản trị viết, quản trị đăng, cho đăng • Phạm vi: Admin phải đăng nhập thành công vào hệ thống thực quyền tương ứng • • Ràng buộc: - Đầu vào: Thao tác theo quyền tương ứng admin - Đầu ra: Trả thông thao tác thành công hay không Giao diện chương trình Hình 4.2 Giao diện trang quản trị - Đây trang dành cho người quản trị hệ thống (admin) Người quản trị người có quyền cao quản lý tất thông tin Website: + Quản lý thành viên: thêm, sửa, xóa thơng tin thành viên + Quản lý chuyên mục + Quản lý banner + Quản trị người dùng + Thiết lập thông tin cho hệ thống 25 ... đăng nhập vào website Hệ thống yêu cầu Admin thành viên đăng nhập vào website Admin thành viên nhập tên mật Hệ thống kiểm tra tên mật với thơng tin đăng kí cho phép người dùng đăng nhập vào website... Website Admin phép tạo tài khoản cho người dùng cấp phát quyền cho người dùng sửa, xóa người dùng • Dịng kiện Admin truy xuất vào chức quản lý người dùng Admin chọn người dùng tạo tài khoản cách... triển khai trở nên phức tạp vài thời điểm Nhưng ASP.Net quản lý trạng thái thay cho bạn nhờ tính ghi nhớ giỏ hàng chuyển mục chọn mua qua trang bán hàng • Caching – Bộ nhớ Cache ASP.Net thực chức