Tải bản đầy đủ (.pdf) (88 trang)

Đồ Án 3 Xây Dựng Website Giới Thiệu Và Đặt Mua Nhạc Bản Quyền.pdf

Bạn đang xem bản rút gọn của tài liệu. Xem và tải ngay bản đầy đủ của tài liệu tại đây (11.81 MB, 88 trang )

<span class="text_page_counter">Trang 1</span><div class="page_container" data-page="1">

<b>HƯNG YÊN – 2022</b>

</div><span class="text_page_counter">Trang 2</span><div class="page_container" data-page="2">

<b>Nhận xét của giảng viên hướng dẫn: </b>

</div><span class="text_page_counter">Trang 3</span><div class="page_container" data-page="3">

<b>LỜI CAM ĐOAN </b>

Em xin cam đoan đồ án “Xây dựng website giới thiệu và đặt mua nhạc bản quyền” là kết quả thực hiện của bản thân em dưới sự hướng dẫn của ầy Vũ Xuth ân Thắng.

Những phần sử dụng tài liệu tham khảo trong đồ án đã được nêu rõ trong phần tài liệu tham khảo. Các kết quả trình bày trong bài tập lớn và chương trình xây dựng được hoàn toàn là kết quả do bản thân em thực hiện.

Nếu vi phạm lời cam đoan này, em xin chịu hoàn toàn trách nhiệm trước khoa và nhà trường.

NGUYỄN HOÀNG LONG

</div><span class="text_page_counter">Trang 4</span><div class="page_container" data-page="4">

<b>LỜI CẢM ƠN </b>

Để có thể hồn thành đồ án này, lời đầu tiên em xin phép gửi lời cảm ơn tới các thầy c bộ môn Công nghệ phần mềm, Khoa Công nghệ thôô ng tin – Trường Đại học Sư phạm Kỹ thuật Hưng Yên đã tạo điều kiện thuận lợi cho em thực hiện đồ án này.

Đặc biệt em xin chân thành cảm ơn ầy Vũ Xuth ân Thắng đã rất tận tình hướng dẫn, chỉ bảo em trong suốt thời gian thực hiện đồ án vừa qua.

Em cũng xin chân thành cảm ơn tất cả các Thầy, các Cô trong Trường đã tận tình giảng dạy, trang bị cho em những kiến thức cần thiết, quý báu để giúp em thực hiện được đồ án này.

Mặc dù em đã có cố gắng, nhưng với trình độ cịn hạn chế, trong q trình thực hiện đề tài khơng tránh khỏi những thiếu sót. Em hi vọng sẽ nhận được những ý kiến nhận xét, góp ý của các Thầy giáo, Cô giáo về những kết quả triển khai trong đồ án.

Em xin trân trọng cảm ơn!

</div><span class="text_page_counter">Trang 5</span><div class="page_container" data-page="5">

1.3. Giới hạn và phạm vi của đề tài ... 13

1.3.1 Đối tượng nghiên cứu ... 13

2.2. Phương pháp phân tích thiết kế hướng đối tượng ... 17

2.3. Thiết kế và lập trình front-end ... 21

2.4. Tổng quan về ASP.NET MVC ... 27

2.5. Công nghệ thao tác dữ liệu Entity framework (hoặc ADO.NET) ... 32

2.6. Mơ hình thao tác dữ liệu 3 layer ... 36

</div><span class="text_page_counter">Trang 6</span><div class="page_container" data-page="6">

3.2.1 Thiết kế cơ sở dữ liệu ... 65

3.2.2 Thiết kế lớp đối tượng ... 67

3.2.3 Thiết kế giao diện ... 79

CHƯƠNG 4: TRIỂN KHAI WEBSITE... 83

4.1 Triển khai các chức năng cho phân hệ người dùng ... 83

4.1.1 Trang chủ ... 83

4.1.2 Trang Xem Sản phẩm ... 84

4.1.3 Trang Quản lý giỏ hàng ... 85

4.2 Triển khai các chức năng cho phân hệ quản trị nội dung ... 85

4.3 Kiểm thử và triển khai ứng dụng ... 85

</div><span class="text_page_counter">Trang 7</span><div class="page_container" data-page="7">

<b>DANH MỤC CÁC THUẬT NGỮ </b>

<b>STT Từ viết tắt Cụm t ừ tiếng anh Diễn giải </b>

1 MVC Model View Control Mẫu thiết kế ph n mầ ềm

</div><span class="text_page_counter">Trang 8</span><div class="page_container" data-page="8">

<b>DANH MỤC CÁC BẢNG </b>

Bảng 3.1: Các chức năng của trang quản trị ... 39

Bảng 3.2: Dịng sự kiện chính của UseCase quản lý thể loại nhạc ... 41

Bảng 3.3: Dòng sự kiện phụ nhập thể loại nhạc ... 41

Bảng 3.4: Dòng sự kiện phụ sửa thể loại nhạc ... 42

Bảng 3.5: Thông tin mô tả thể loại nhạc ... 62

Bảng 3.6: Thông tin mô tả tác phẩm nhạc ... 63

</div><span class="text_page_counter">Trang 9</span><div class="page_container" data-page="9">

DANH MỤC<b> CÁC HÌN</b>H VẼ, ĐỒ THỊ

Hình 3.1: Biểu đồ UseCase tổng quát trang quản trị ... 40

Hình 3.2: UseCase quản lý thể loại nhạc ... 40

Hình 3.3: Biểu đồ lớp VOPC của Use Case Quản lý sản phẩm ... 67

Hình 3.4: Biểu đồ lớp VOPC của Use Case Thêm sản phẩm ... 68

Hình 3.5: Biểu đồ lớp VOPC của Use Case Sửa sản phẩm ... 68

Hình 3.6: Biểu đồ lớp VOPC của Use Case Xoá sản phẩm ... 69

Hình 3.7: Biểu đồ lớp VPOC của Use Case Quản lý nhà cung cấp ... 69

Hình 3.8: Biểu đồ lớp VPOC của Use Case Quản lý đơn hàng nhập ... 70

Hình 3.9: Biểu đồ lớp VPOC của Use Case Thống kê doanh thu ... 70

Hình 3.10: Biểu đồ lớp VPOC của Use Case trang người dùng ... 71

Hình 3.11: Biểu đồ lớp VPOC của Use Case xem chi tiết sản phẩm ... 72

Hình 3.12: Biểu đồ lớp VPOC đặt hàng ... 72

Hình 3.13: Biểu đồ tuần tự quản lý sản phẩm ... 73

Hình 3.14: Biểu đồ tuần tự thêm sản phẩm ... 73

Hình 3.15: Biểu đồ tuần tự sửa sản phẩm ... 74

Hình 3.16: Biểu đồ tuần tự xóa sản phẩm ... 74

Hình 3.17: Biểu đồ tuần tự thêm đơn nhập hàng ... 75

Hình 3.18: Biểu đồ tuần tự thêm giá ... 75

Hình 3.19: Biểu đồ tuần tự thêm nhà cung cấp ... 76

Hình 3.20: Biểu đồ tuần tự đặt hàng ... 76

Hình 3.21: Biểu đồ tuần tự đặt hàng ... 77

Hình 3.22: Biểu đồ lớp chi tiết cho Use Case Xem sản phẩm theo loại ... 77

Hình 3.23: Biểu đồ lớp chi tiết cho Use Case Đăng nhập... 78

Hình 3.24: Biểu đồ lớp chi tiết cho Use Case Thêm loại sản phẩm ... 78

Hình 3.25: Biểu đồ lớp chi tiết cho Use Case Sửa loại sản phẩm... 79

Hình 3.26: Giao diện trang chủ ... 79

Hình 3.27: Giao diện trang danh sách sản phẩm ... 80

Hình 3.28: Giao diện trang chi tiết sản phẩm ... 80

</div><span class="text_page_counter">Trang 10</span><div class="page_container" data-page="10">

Hình 3.29: Giao diện trang giỏ hàng ... 81 Hình 3.30: Giao diện trang đăng nhập ... 81 Hình 3.31: Giao diện trang quản lý thể loại nhạc ... 82

</div><span class="text_page_counter">Trang 11</span><div class="page_container" data-page="11">

CHƯƠNG 1: TỔNG QUAN VỀ ĐỀ TÀI

<b>1.1. </b>Lý do chọn đề tài

Như chúng ta cũng đã thấy trong xã hội hiện nay thì nội dung nhạc bản quyền ngày càng trở lên được thắt chặt v được chà ú ý hơn trước.Trước đây khi internet và cơng nghệ cịn ang sđ ơ khai th ại Việt Nam ẫn trì t v àn lan tình trạng đĩa l ,ậu đĩa copy những bài nhạc mà các nhạc sĩ, ca sĩ,producer phát hành để nhằm thu lợi bất chính.Hiện nay thì cơng nghệ đã phát triển một cách vượt bậc nhưng tuy nhiên ình t trạng nghe nhạc, tải nhạc, sử dụng các bài hát… mà không trả tiền thù laocho tác giả đang diễn ra ngày càng nhiều, ảnh hưởng trực tiếp đến tâm lý của tác giả, họ trở nên dè dặt, không có động lực để tiếp tục sáng tạo; bởi những đứa con tinh thần ừa ra đời đã ngay lập tức bị sao chép, ăn cắp; mà cũng do một phần là vtiền thù lao đáng ra phải được nhận từ thành quả của mình để tiếp tục phục vụ cho việc sáng tạo thì đã khơng đủ kinh phí để thực hiện.Và chính những điều đó làm ảnh hưởng rất lớn tới các producer, ạc sĩ,ca snh ĩ khi họ muốn sản xuất những bài ạc nhbản quyền ất ch lượng tới người nghe.Chính vì thế, ừ những khó khăn đó mà em tmuốn tạo một Website bán nhạc bản quyền .Việc áp dụng cơng nghệ thơng tin giúp cho người có nhu cầu mua cảm thấy thoải mái,thuận tiện trong việc mua ạc bản nhquyền.

<b>1.2. </b>Mục tiêu của đề tài1.2.1 Mục tiêu tổng quát

- Mục tiêu chung của đồ án à l đưa ra 1 Website giới thiệu và đặt mua nhạc bản quyền ử dụng ASP.Net MVC và SQL Server s

- Web có thể hiển thị và tương thích với mọi loại thiết bị điện tử như laptop, máy tính bảng.

- Dựa trên những hạn chế, bất cập của hệ thỗng cũ để tài được xây dựng nhằm mục đích đáp ứng nhu cầu đặt mua khơng mất nhiều thời gian mà khách hàng đã có thể mua được ạc bản quynh ền chỉ bằng một Click chuột. Điều đó nhằm mục đích:

</div><span class="text_page_counter">Trang 12</span><div class="page_container" data-page="12">

1.Mang lại hiệu quả, lợi ích kinh tế: giảm chi phí hoạt động, tăng doanh thu đối với ười chủ sở hữu ng website.

Mang lại lợi ích sử dụng: tăng khả năng tương tác giữa người dùng và người bán hàng, 2 bên dễ dàng trao đổi thơng tin nhạc bản quyền thuận tiện, nhanh chóng. Hoàn thiện các chức năng còn thiếu của hệ thống cũ, cung cấp đa dạng, phong phú các thể loại nhạc . Đồng thời, cũng tạo ra 1 thị trường nhạc bản quyền chất lượng và nhiều màu sắc âm nhạc.

1.2.2 Mục tiêu cụ thể

<small>• </small> Áp dụng HTML, CSS, JAVASCRIP, JQUERY thiết kế giao diện web

<small>• </small> Giao diện trang web cần bắt mắt, dễ sử dụng

<small>• </small> Trình bày thơng tin 1 cách logic để thuận tiện cho việc tìm kiếm nhanh chóng. Trang web cho phép người quản trị quản lí các thơng tin sau:

<small>• </small> Quản lí khách hàng

<small>• </small> Quản lí thể loại nhạc

<small>• </small> Quản lí nhạc bản quyền

<small>• </small> Quản lí hóa đơn

<small>• </small> Quản lí chi tiết hóa đơn

<small>• </small> Quản lí giỏ hàng Quản lí thông tin của user đăng nhập vào trang web

<small>• </small> Thống kê báo cáo.

<small>• </small> Trang web cho phép người dùng thực hiện các chức năng sau:

<small>• </small> Tìm kiếm nhạc bản quyền

<small>• </small> Thực hiện mua nhạc,đăng ký dịch vụ theo tháng

<small>• </small> Tiến hành đặt mua

<small>• </small> Sửa thơng tin đơn đặt mua

<small>• </small> Sửa đổi thơng tin cá nhân tài khoản

<small>• </small> Đăng nhập, đăng kí tài khoản

<small>• </small> Xóa thơng tin đơn đặt mua

<small>• </small> Lưu thơng tin các bản nhạc mà khách hàng đã xem.

</div><span class="text_page_counter">Trang 13</span><div class="page_container" data-page="13">

<b>1.3. Giới hạn và phạm vi của đề tài</b>

1.3.1 Đối tượng nghiên cứu Đối tư ng nghiên cứu: ợ

- Các địa điểm,phương thức đặt mua bán nh c b n quy n ạ ả ề- Người quản lý các cửa hàng cho mua bán nh c b n quy n ạ ả ềKhách thể nghiên c u: ứ

- Khảo sát xin ý ki n cế ủa các khách hàng đã sử ụ d ng qua các trang web - Các n n t ng nhề ả ạc trực tuy n ế

- Các khách hàng đang có nhu cầu đặt mua nhạc bản quyền. 1.3.2 Phạm vi nghiên cứu

Phạm vi không gian: tại địa điểm cho mua bán nhạc bản quyềnPhạm vi thời gian: 2022

<b>1.4. </b>Nội dung thực hiện Website được thiết kế với:

<small>• </small> Giao diện hài hoà, thân thiện, giúp người dùng dễ dàng sử dụng.

<small>• </small> Trang chủ sẽ hiển thị danh sách các ạc bản quynh ền mới nhất và bán chạy nhất giúp cho người dùng có thể dễ dàng hơn trong việc tìm kiếm.

<small>• </small> Khách hàng có thể dễ dàng tìm thấy thơng tin chi tiết các bài nhạc mà họ quan tâm.

<small>• </small> Khách hàng có thể chọn các bản nhạc mà họ cần dựa trên khả năng tài chính và chức năng cần thiết bằng cách thêm vào giỏ hàng

<small>• </small> Có chức năng đăng ký, đăng nhập.

Khách hàng có thể gửi ý kiến phản hồi, góp ý đến Website để gó phần làm p Website thêm phong phú và phát triển.

Xây dựng một hệ thống bán hàng trực tuyến đơn giản, thân thiện, dễ sử dụng, cho phép khác hàng xem thông tin và đặt hàng qua mạng, người quản trị quản lý các thông tin về đơn đặt mua cũng như người dùng.

</div><span class="text_page_counter">Trang 14</span><div class="page_container" data-page="14">

Các chức năng:

<small>• </small> Quản lý thể loại nhạc (quản trị)

Hiển thị thông tin và phân loại nhạc theo dòng nhạc. Bài nhạc hiển thị lên website sẽ được hiển thị đầy đủ thơng tin như: hình ảnh, tên bài nhạc, giá.

<small>• </small> Quản lý giỏ hàng (người dùng)

Khi tham khảo đầy đủ thông tin về bài nhạc,khách hàng có thể đặt mua ngay tại Website thông qua chức năng giỏ hàng mà không cần phải đến địa điểm giao dịch, giỏ hàng được làm mô phỏng như giỏ hàng trong thực tế có thể thêm, bớt, thanh toán tiền các bải nhạc có sẵn trong giỏ hàng. Khi chọn thanh tốn giỏ hàng khách hàng phải ghi đầy đủ các thông tin cá nhân, thông tin này được hệ thống lưu trữ và xử lý.

<small>• </small> Quản lý đăng ký thành viên và đăng nhập hệ thống (quản trị)

iêng. Mỗi khách hàng giao dịch tại Website sẽ được quyền đăng ký môt tài khoản rTài khoản này sẽ được sử dụng khi hệ thống yêu cầu. Một tài khoản do khách hàng đăng ký sẽ lưu trữ các thông tin cá nhân của khách hàng.

Khách hàng có thể liên hệ với nhân viên bán hàng về các thắc mắc, ý kiến của mình.

<small>• </small> Quản lý nhạc bản quyền, đơn hàng

Người quản trị có thể cập nhật thơng tin các mặt hàng, loại hàng, quản lý thông tin đơn hàng.

1.5. Phương pháp tiếp cận

<small>• </small> Khảo sát chi tiết hệ thống quản lý và bán nhạc bản quyền

<small>• </small> Khảo sát những yêu cầu của khách hàng về hệ thống

<small>• </small> Nhóm khảo sát thực tế bằng việc đưa ra chức năng được yêu cầu sẵn của đề tài.

<small>• </small> Thu thập được các tài liệu liên quan đến website về đặt mua nhạc bản quyền.

<small>• </small> Phân tích hệ thống sau khi đã khảo sát: hệ thống quản lý để đưa ra những giải pháp, những ý tưởng mới cho việc xây dựng, thiết kế hệ thống website sau này.

</div><span class="text_page_counter">Trang 15</span><div class="page_container" data-page="15">

CHƯƠNG 2: <b>C</b>Ơ SỞ LÝ THUYẾT

<b>2.1. Quy trình phát triển phần mềm </b>

Quy trình xây d ng ph n m m bao g m t p h p các thao tác và k t qu ự ầ ề ồ ậ ợ ế ảtương quan sử dụng trong việc phát triển để sản xuất ra một sản phẩm phần mềm. Mỗi m t ph n m m l i cộ ầ ề ạ ó đặc đ ểm và yêu c u khác nhau, tuy nhiên t t ci ầ ấ ả đều cần phải tr i quaả các bước sau:

<b>Bước 1: Phân tích yêu c u </b>ầ

Phân tích yêu c u là công vi c bao g m các tác vầ ệ ồ ụ xác định yêu c u cho mầ ột hệthống mới hoặc được thay đổ ựa trên cơ sởi d là các nhu c u trong quá trình s d ng. ầ ử ụViệc phân tích yêu cầu có ý nghĩa quan trọng đối v i thành công c a m t d án. ớ ủ ộ ựCác yêu c u phầ ải có tính đo được, ki m thể ử được, có liên quan đến các nhu cầu hoặc cơ hội doanh nghiệp đã được xác định, và phải được định nghĩa ở mức độ chi tiết đủ cho việc thiết kế hệ ống. th

<b> </b>Bướ<b>c 2: Thi t k</b>ế <b>ế phần mề m </b>

Là m t quá trình gi i quy t vộ ả ế ấn đề và l p kậ ế hoạch cho m t gi i pháp phộ ả ần mềm. Sau khi các mục đích và các đặc điểm kĩ thuật c a ph n mủ ầ ềm được giải quyết, l p trình viên sậ ẽ thiế ết k ho c thuê ặ người thi t kế ế để phát tri n m t kể ộ ế hoạch cho gi i pháp ph n m m. Nó bao g m các thành ph n c p th p, các vả ầ ề ồ ầ ấ ấ ấn đề thuật toán cũng như một khung nhìn kiến trúc. Thiết kế chức năng, cơ sở dữ liệu và giao diện.

<b>Bước 3: Lập trình máy tính</b>

L p trình máy tính (g i t t là l p trình) là kậ ọ ắ ậ ỹ thuật cài t m t ho c nhi u thuđặ ộ ặ ề ật tốn trừu tượng có liên quan v i nhau b ng m t ho c nhi u ngôn ng lớ ằ ộ ặ ề ữ ập trình đểtạo ra một chương trình máy tính có các thành tố nghệ thuật, khoa h c, toán h c, k ọ ọ ỹnghệ. Các ngôn ng l p trình khác nhau hữ ậ ỗ trợ các phong cách l p trình khác nhau. ậMột ph n c a cơng vi c l p trình là vi c l a ch n m t trong nh ng ngôn ng phù ầ ủ ệ ậ ệ ự ọ ộ ữ ữhợp nh t vấ ới các bài toán c n gi i quy t. Các ngôn ng l p trình khác nhaầ ả ế ữ ậ u địi hỏi

</div><span class="text_page_counter">Trang 16</span><div class="page_container" data-page="16">

lập trình viên ph i x lý các chi tiả ử ết ở mức độ khác nhau khi cài đặt các thu t toán. ậSự thống nh t trong các cách x lý s t o thu n lấ ử ẽ ạ ậ ợi cho vi c l p trình và hi u qu ệ ậ ệ ảcủa chương trình.

<b>Bước 4: Ki m th </b>ể <b>ử phần mềm </b>

Kiểm th ph n m m là m t cuử ầ ề ộ ộc kiểm tra được tiến hành để cung c p cho các ấbên liên quan thông tin về chất lượng c a s n ph m ho c d ch vủ ả ẩ ặ ị ụ được ki m thể ử. Kiểm th có th cung c p cho doanh nghi p mử ể ấ ệ ột quan điểm, một cách nhìn độc đáo về ph n mầ ềm để ừ đó đánh giá và thấ t u hiểu được nh ng r i ro trong quá trình tri n ữ ủ ểkhai ph n m m. Tùy thu c vào t ng pầ ề ộ ừ hương pháp, việc kiểm th có thử ể được thực hiện b t c lúc nào trong quá trình phát tri n ph n m m. Theo truy n thấ ứ ể ầ ề ề ống thì các nỗ l c ki m thự ể ử được ti n hành sau khi các yêu cế ầu được xác định và vi c l p trìnệ ậ h được hồn tất trong phương pháp phát triển “Agile” thì việc kiểm thử được tiến hành liên t c trong su t quá trình xây d ng ph n mụ ố ự ầ ềm. Như vậy, m i mỗ ột phương pháp ki m th b chi phể ử ị ối theo một quy trình phát tri n ph n m m nhể ầ ề ất định.

<b> </b>Bướ<b>c 5: Tri n khai ph</b>ể <b>ần mềm </b>

Sau khi ph n mầ ềm được ki m th và ể ử khắc ph c nh ng sai sót sụ ữ ẽ được triển khai đưa vào sử dụng trong thực tế. Đối với những phần mềm thiết kế theo thỏa thuận v i khách hàng, vi c triớ ệ ển khai đơn giản ch lỉ à hướng d n cho khách hàng ẫcách s dử ụng đạt hi u qu cao. V i nh ng ph n m m mang tính thơng d ng, việ ả ớ ữ ầ ề ụ ệc triển khai còn qua các chương trình giới thiệu và đưa sản phẩm ra thị trường. Trong q trình triển khai cũng ln đánh giá hiệu qu s d ng c a ph n m m, xem xét ả ử ụ ủ ầ ềnhững nhược điểm để lên kế hoạch thiế ết k phần mềm hiệu quả hơn.

<b> </b>Bướ<b>c 6: B o trì ph</b>ả <b>ần mềm </b>

B o trì ph n m m bao gả ầ ề ồm điều ch nh các lỉ ỗi mà chưa được phát hi n trong ệcác giai đoạn trước chu kỳ sống của phần mềm, nâng cấp tính năng sử dụng và an toàn v n hành c a ph n m m. B o trì ph n m m có thậ ủ ầ ề ả ầ ề ể chiếm đến 65%-75% công sức chu kỳ s ng c a m t ph n m m. Quá trình phát tri n ph n m m bao g m rố ủ ộ ầ ề ể ầ ề ồ ất nhiều giai đoạn: thu thập yêu cầu, phân tích, xây dựng, kiểm tra, triển khai và bảo

</div><span class="text_page_counter">Trang 17</span><div class="page_container" data-page="17">

trì phần mềm. Nhiệm ụ ủa giai đoạv c n b o trì ph n m m là gi cho ph n mả ầ ề ữ ầ ềm được cập nh t khi môậ i trường thay đổi và yêu cầu người sử dụng thay đổi. Mỗi một giai đoạn xây dựng phần mềm lại địi hỏi các kỹ năng phân tích và ứng dụng kiến thức công nghệ khác nhau. Để xây d ng ph n m m thi t th c, mang l i hi u qu kinh t ự ầ ề ế ự ạ ệ ả ếcao đòi hỏi con người lập trình viên phải tuân thủ các yêu cầu trong từng giai đoạn thiết kế.

<b>2.2. Phương pháp phân tích thiết kế hướ g đối tượng n</b>

<b>Khái niệm OOAD (Object Oriented Analysis and Design)</b>

Phân tích và thiết kế hướng đối tượng là một kỹ thuật tiếp cận phổ biến dùng để phân tích, thiết kế một ứng dụng, hệ thống. Nó dựa trên bộ các nguyên tắc chung, đó là một tập các hướng dẫn để giúp chúng ta tránh khỏi một thiết kế xấu. 5 nguyên tắc SOLID trong thiết kế hướng đối tượng:

<small>• </small> Một lớp chỉ nên có một lý do để thay đổi, tức là một lớp chỉ nên xử lý một chức năng đơn lẻ, duy nhất thôi. Nếu đặt nhiều chức năng vào trong một lớp sẽ dẫn đến sự phụ thuộc giữa các chức năng với nhau và mặc dù sau đó ta chỉ thay đổi ở một chức năng thì cũng phá vỡ các chức năng cịn lại.

<small>• </small> Các lớp, module, chức năng nên dễ dàng Mở (Open) cho việc mở rộng (thêm chức năng mới) và Đóng (Close) cho việc thay đổi.

<small>• </small> Lớp dẫn xuất phải có khả năng thay thế được lớp cha của nó.

<small>• </small> Chương trình khơng nên buộc phải cài đặt một interface mà nó khơng sử dụng đến.

<small>• </small> Các module cấp cao không nên phụ thuộc vào các module cấp thấp. Cả hai nên phụ thuộc thông qua lớp trừu tượng. Lớp trừu tượng không nên phụ thuộc vào chi tiết. Chi tiết nên phụ thuộc vào trừu tượng.

<b>❖ Khái niệm UML </b>

UML là ngơn ngữ mơ hình hóa hợp nhất dùng để biểu diễn hệ thống. Nói một cách đơn giản là nó dùng để tạo ra các bản vẽ nhằm mô tả thiết kế hệ thống. Các

</div><span class="text_page_counter">Trang 18</span><div class="page_container" data-page="18">

bản vẽ này được sử dụng để các nhóm thiết kế trao đổi với nhau cũng như dùng để thi công hệ thống (phát triển), thuyết phục khách hàng, các nhà đầu tư v.v..

<small>• </small> Tại sao lại là OOAD và UML?

OOAD cần các bản vẽ để mơ tả hệ thống được thiết kế, cịn UML là ngôn ngữ mô tả các bản vẽ nên cần nội dung thể hiện. Do vậy, chúng ta phân tích và thiết kế theo hướng đối tượng và sử dụng UML để biểu diễn các thiết kế đó nên chúng thường đi đơi với nhau.

<small>• </small> OOAD sử dụng UML

UML sử dụng để vẽ cho nhiều lĩnh vực khác nhau như phần mềm, cơ khí, xây dựng v… trong phạm vi các bài viết này chúng ta chỉ nghiên cứu cách sử dụng UML cho phân tích và thiết kế hướng đối tượng trong ngành phần mềm. OOAD sử dụng UML bao gồm các thành phần sau:

<small>• </small> View (góc nhìn)

Mỗi góc nhìn như thầy bói xem voi, nó khơng thể hiện hết hệ thống nhưng thể hiện rõ hệ thống ở một khía cạnh. Chính vì thế trong xây dựng có bản vẽ kiến trúc (nhìn về mặt kiến trúc), bản vẽ kết cấu (nhìn về mặt kết cấu), bản vẽ thi cơng (nhìn về mặt thi công). Trong phần mềm cũng như vậy, OOAD sử dụng UML có các góc nhìn sau:

</div><span class="text_page_counter">Trang 20</span><div class="page_container" data-page="20">

<small>• </small> Diagram (bản vẽ)

Diagram chúng ta có thể dịch là sơ đồ. Tuy nhiên ở đây chúng ta sử dụng từ bản vẽ cho dễ hình dung. Các bản vẽ được dùng để thể hiện các góc nhìn của hệ thống.

Trong đó,

<small>• </small> Use Case Diagram: bản vẽ mô tả về ca sử dụng của hệ thống. Bản vẽ này sẽ giúp chúng ta biết được ai sử dụng hệ thống, hệ thống có những chức năng gì. Lập được bản vẽ này chúng ta sẽ hiểu được yêu cầu của hệ thống cần xây dựng.

<small>• </small> Class Diagram: bản vẽ này mô tả cấu trúc của hệ thống, tức hệ thống được cấu tạo từ những thành phần nào. Nó mơ tả khía cạnh tĩnh của hệ thống.

<small>• </small> Object Diagram: Tương tự như Class Diagram nhưng nó mơ tả đến đối tượng thay vì lớp (Class).

<small>• </small> Sequence Diagram: là bản vẽ mô tả sự tương tác của các đối tượng trong hệ thống với nhau được mô tả tuần tự các bước tương tác theo thời gian.

<small>• </small> Collaboration Diagram: tương tự như sequence Diagram nhưng nhấn mạnh về sự tương tác thay vì tuần tự theo thời gian.

<small>• </small> State Diagram: bản vẽ mơ tả sự thay đổi trạng thái của một đối tượng. Nó được dùng để theo dõi các đối tượng có trạng thái thay đổi nhiều trong hệ thống.

<small>• </small> Activity Diagram: bản vẽ mô tả các hoạt động của đối tượng, thường được sử dụng để hiểu về nghiệp vụ của hệ thống.

<small>• </small> Component Diagram: bản vẽ mơ tả về việc bố trí các thành phần của hệ thống cũng như việc sử dụng các thành phần đó.

<small>• </small> Deployment Diagram: bản vẽ mô tả việc triển khai của hệ thống như việc kết nối, cài đặt, hiệu năng của hệ thống v.v…

</div><span class="text_page_counter">Trang 21</span><div class="page_container" data-page="21">

<small>• </small> Notations (ký hiệu)

Notations là các ký hiệu để vẽ, nó như từ vựng trong ngôn ngữ tự nhiên. Chúng ta phải biết từ vựng thì mới ghép thành câu, thành bài được. Chúng ta sẽ tìm hiểu kỹ các notations trong từng bản vẽ sau này. Dưới đây là vài ví dụ về notation.

<small>• </small> Mechanisms (qu tắc, cơ chế)y

Mechanisms là các quy tắc để lập nên bản vẽ, mỗi bản vẽ có qu tắc riêng và chúng y ta phải nắm được để tạo nên các bản vẽ thiết kế đúng. Các quy tắc này chúng ta sẽ bàn kỹ trong các bài về các bản vẽ.

<b>2.3.</b> Thiết kế và lập trình <b>front-end ❖ Front End: </b>

Front End (còn được biết đến như client-side) là tất cả những gì liên quan đến điều mà người dùng nhìn thấy mỗi khi truy cập vào một trang web, bao gồm phạm trù thiết kế và các ngôn ngữ như HTML hay CSS.

Người dùng tương tác trực tiếp với nhiều khía cạnh thuộc front-end như: nhận biết vị trí đặt để của logo, màu sắc chủ đạo, tìm kiếm và đọc thơng tin, sử dụng các button và tính năng trên web… Mục đích cuối cùng của Front End là nhằm mang lại một giao diện bắt mắt, giúp người dùng dễ dàng thao tác và sử dụng.

❖ Ngôn ngữ HTML

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

</div><span class="text_page_counter">Trang 22</span><div class="page_container" data-page="22">

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. Lưu ý: HTML khơng phải là ngơn ngữ lập trình.

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ị.

Có bốn loại phần tử đánh dấu trong HTML:

<small>• </small> Đánh dấu Có cấu trúc miêu tả mục đích của phần văn bản

<small>• </small> Đánh dấu trình bày miêu tả phần hiện hình trực quan của phần văn bản bất kể chức năng của nó là gì (ví dụ, boldface sẽ hiển thị đoạn văn bản boldface) (Chú ý là cách dùng đánh dấu trình bày này bây giờ khơng cịn được khun dùng mà nó được thay thế bằng cách dùng CSS).

<small>• </small> Đánh dấu liên kết ngồi chứa phần liên kết từ trang này đến trang kia cụ thể

<small>• </small> Các phần tử thành phần điều khiển giúp tạo ra các đối tượng (ví dụ, các nút và các danh sách).

Cấu trúc của một trang HTML

</div><span class="text_page_counter">Trang 23</span><div class="page_container" data-page="23">

<h1> Thẻ tag này đại diện cho các tiêu đề trang.

<p> Thẻ tag này đại diện cho định dạng các đoạn văn trong trang web.

❖ Ngôn ngữ CSS:

- CSS (Cascading Style Sheets) là mã bạn sử dụng để tạo kiểu cho trang web của mình, Giống như HTML, CSS không thực sự là một ngôn ngữ lập trình. Nó

</div><span class="text_page_counter">Trang 24</span><div class="page_container" data-page="24">

khơng phải là một ngơn ngữ đánh dấu đó là một ngơn ngữ định kiểu. Điều này có - nghĩa là nó cho phép bạn áp dụng kiểu có chọn lọc cho các phần tử trong tài liệu HTML.

<small>• </small> Cơ cấu bộ quy tắc CSS:

<small>• </small> Selector: Tên phần tử HTML bắt đầu của bộ quy tắc. Nó chọn (các) phần tử được tạo kiểu (trong trường hợp này là phần tử p). Để tạo kiểu cho một phần tử khác, chỉ cần thay đổi bộ chọn.

<small>• </small> Declaration: Một quy tắc duy nhất như: color: red; xác định thuộc tính của phần tử nào bạn muốn tạo kiểu.

<small>• </small> Properties: Những cách mà bạn có thể tạo kiểu cho một phần tử HTML. (Trong trường hợp này, color là một thuộc tính của phần tử). Trong CSS, bạn chọn thuộc tính nào bạn muốn tác động trong quy tắc của mình.

<small>• </small> Giá trị thuộc tính: Ở bên phải của thuộc tính sau dấu hai chấm(:), chúng ta có giá trị thuộc tính, mà chọn một trong số nhiều lần xuất hiện có thể cho một thuộc tính cụ thể (color có rất nhiều giá trị ngồi red).

<small>• </small> Chọn nhiều phần tử: Bạn cũng có thể chọn nhiều kiểu phần tử và áp dụng một quy tắc duy nhất được đặt cho tất cả các yếu tố đó. Bao gồm nhiều bộ chọn được phân biệt bởi dấu phẩy (,).

<small>• </small> Các bộ chọn khác:

Bộ chọn phần tử (đôi khi được gọi là thẻ hoặc loại bộ chọn)

Tất cả (các) thành phần HTML của loại được chỉ định.

pChọn <p>

Bộ chọn ID Phần tử trên trang có ID được chỉ #my-id

</div><span class="text_page_counter">Trang 25</span><div class="page_container" data-page="25">

định. (Trên một trang HTML nhất định, bạn chỉ được phép chọn một phần tử cho mỗi ID và tất nhiên là mỗi ID cho mỗi phần tử).

Chọn <p id=”my id”> or <a id=”my-id”>

-Bộ chọn Class (Các) thành phần trên trang có lớp (class) được chỉ định (lớp có thể đề xuất hiện nhiều lần trên một trang).

Chọn <p class=”my class”> và <a class=”my-class”>

-Bộ chọn thuộc tính

(Các) thành phần trên trang có thuộc tính được chọn

img[src]Chọn <img

src=”myimage.png”> nhưng khơng phải <img>

(Các) thành phần được chỉ định, nhưng chỉ khi ở trạng thái được chỉ định, ví dụ: rê chuột.

Chọn <a>, nhưng chỉ khi con trỏ chuột đang di chuột qua liên kết.

❖ Tác dụng của CSS:

<small>• </small> Hạn chế tối thiểu việc làm rối mã HTML của trang Web bằng các thẻ quy định kiểu dáng (chữ đậm, chữ in nghiêng, chữ có gạch chân, chữ màu), khiến mã nguồn của trang Web được gọn gàng hơn, tách nội dung của trang Web và định dạng hiển thị, dễ dàng cho việc cập nhật nội dung.

<small>• </small> Tạo ra các kiểu dáng có thể áp dụng cho nhiều trang Web, giúp tránh phải lặp lại việc định dạng cho các trang Web giống nhau.

<b>❖ Có 3 cách để sử dụng CSS: </b>

<small>• </small><b> “Inline CSS”: Áp dụng trực tiếp trên một đối tượng nhất định bằng thuộc </b>

tính style.

</div><span class="text_page_counter">Trang 26</span><div class="page_container" data-page="26">

<small>• </small>“Internal CSS”: Đặt CSS ở đầu trang Web để áp dụng kiểu dáng cho tồn bộ trang ấy, khi đó chỉ cần đặt đoạn CSS vào trong cặp thẻ <style> rồi đặt vào trong phần header của Web (giữa <head> và </head>).

<small>• </small><b> “External CSS”: Đặt các thuộc tính CSS vào một tệp tin riêng biệt (*.css), </b>

khi đó có thể tham chiếu đến từ nhiều trang Web khác nhau.

<small>• </small> Tham chiếu tới tệp tin CSS trên từ trang Web bằng đoạn mã: <link rel=”stylesheet” type=”text/css” href=”…/style.css”/>

<b>❖ JavaScript: </b>

JavaScript (viết tắt là JS): là một ngơn ngữ lập trình được sử dụng để tạo ra những trang web tương tác. Nó được tích hợp và nhúng trong HTML. JavaScript cho phép kiểm soát các hành vi của trang web tốt hơn so với khi chỉ có một mình HTML. JavaScript kết hợp vào HTML, chạy trên Windows, Macintosh và các hệ thống hỗ trợ Netscape khác. JavaScript hoặc JS sẽ giúp tăng tính tương tác trên website. Script này chạy trên các trình duyệt của người dùng thay vì trên server và thường sử dụng thư viện của bên thứ 3 nên có thể tăng thêm chức năng cho website mà không phải code từ đầu.

<b>❖ jQuery: </b>

jQuery: jQuery là một thư viện JavaScript dùng để chuẩn hóa và đơn giảnhóa các tương tác, hiệu ứng động trên trình duyệt. Có tác dụng giúp đơn giản hóa việc viết code JavaScript bằng cách thay thế các khía cạnh bất tiện, dài dịng và ngun bản của JavaScript bằng một cái gì đó tinh tế và thanh lịch hơn.

<b>❖ AngularJS </b>

<small>• </small> AngularJS là một Framework được xây dựng trên nền tảng JavaScript.

<small>• </small> AngularJS hoạt động dựa trên việc bổ sung thêm các thuộc tính (attribute) cho các tag của HTML.

<small>• </small> AngularJS rất mạnh trong lập trình giao diện phía client và tổ chức ứng dụng web Single Page Application (SPA).

</div><span class="text_page_counter">Trang 27</span><div class="page_container" data-page="27">

<small>• </small> AngularJS rất phổ biến, được rất nhiều lập trình viên ưa chuộng và sử dụng trong các project.

<small>• </small> AngularJS hoạt động uyển chuyển với các trình duyệt khác nhau.

<small>• </small> Angular được Google release năm 2010.

<small>• </small> Angular có 2 dịng phiên bản phát triển hồn toàn khác nhau: Angular 1.x và Angular 2,3,4,5,6,7,8. Angular 1.x có tên chính thức

là AngularJS – là một kỹ năng buộc phải có hiện nay. Hầu hết các dự án hiện nay đều chọn AngularJS vì dễ học, dễ làm. Từ các phiên bản 2 trở đi có tên chính thức là Angular.

<small>• </small> AngularJS biến HTML tĩnh thành HTML động. Nó mở rộng khả năng của HTML bằng cách thêm các thuộc tính, thành phần dựng sẵn và cung cấp khả năng tạo các thuộc tính tùy chỉnh bằng cách sử dụng JavaScript.

<b>2.4.Tổng quan về ASP.NET MVC </b>

<b>❖ Tổng quan về ASP.NET MVC </b>

Mẫu kiến trúc Model – View – Controller được sử dụng nhằm chi ứng dụng thành ba thành phần chính: model, view và controller. Nền tảng ASP.NET MVC giúp cho chúng ta có thể tạo được các ứng dụng web áp dụng mơ hình MVC thay vì tạo ứng dụng theo mẫu ASP.NET Web Forsm. Nền tảng ASP.NET MVC có đặc điểm nổi bật là nhẹ (lighweigt), dễ kiểm thử phần giao diện (so với ứng dụng Web Forms), tích hợp các tính năng có sẵn của ASP.NET. Nền tảng ASP.NET MVC được định nghĩa trong namespace System.Web.Mvc và là một phần của name space System.Web.

MVC là một mẫu thiết kế (design pattern) chuẩn mà nhiều lập trình viên đã quen thuộc. Một số loại ứng dụng web sẽ thích hợp với kiến trúc MVC. Một số khác vẫn thích hợp với ASP.NET Web Forms và cơ chế postbacks. Đơi khi có những ứng dụng kết hợp cả hai kiến trúc trên.

Nền tảng MVC bao gồm các thành phần dưới đây:

</div><span class="text_page_counter">Trang 28</span><div class="page_container" data-page="28">

Models: Các đối tượng Models là một phần của ứng dụng, các đối tượng này thiết lập logic của phần dữ liệu của ứng dụng. Thông thường, các đối tượng model lấy và lưu trạng thái của model trong CSDL. Ví dụ như, một đối tượng Product (sản phẩm) sẽ lấy dữ liệu từ CSDL, thao tác trên dữ liệu và sẽ cập nhật dữ liệu trở lại vào bảng Products ở SQL Server.

Trong các ứng dụng nhỏ, model thường là chỉ là một khái niệm nhằm phân biệt hơn là được cài đặt thực thụ, ví dụ, nếu ứng dụng chỉ đọc dữ liệu từ CSDL và gửi chúng đến view, ứng dụng khơng cần phải có tầng model và các lớp lien quan. Trong trường hợp này, dữ liệu được lấy như là một đối tượng model (hơn là tầng model).

<small>• </small> Views: Views là các thành phần dùng để hiển thị giao diện người dùng (UI). Thông thường, view được tạo dựa vào thơng tin dữ liệu model. Ví dụ như, view dùng để cập nhật bảng Products sẽ hiển thị các hộp văn bản, drop-down list, và các check box dựa trên trạng thái hiện tại của một đối tượng Product.

Controllers: Controller là các thành phần dùng để quản lý tương tác người dùng, làm việc với model và chọn view để hiển thị giao diện người dùng. Trong một ứng dụng MVC, view chỉ được dùng để hiển thị thông tin, controller chịu trách nhiệm quản lý và đáp trả nội dung người dùng nhập và tương tác với người dùng. Ví dụ, controller sẽ quản lý các dữ liệu người dùng gởi lên (query-string values) và gởi các giá trị đó đến model, model sẽ lấy dữ liệu từ CSDL nhờ vào các giá trị này.

Mẫu MVC giúp bạn tạo được các ứng dụng mà chúng phân tách rạch rịi các khía cạnh của ứng dụng (logic về nhập liệu, logic xử lý tác vụ và logic về giao diện). Mẫu MVC chỉ ra mỗi loại logic kể trên nên được thiếp lập ở đâu trên ứng dụng. Logic giao diện (UI logic) thuộc về views. Logic nhập liệu (input logic) thuộc về controller. Và logic tác vụ (Business logic – là logic xử lý thơng tin, mục đích chính của ứng dụng) thuộc về model. Sự phân chia này giúp bạn giảm bớt được sự phức tạp của ứng dụng và chỉ tập trung vào mỗi khía cạnh cần được cài đặt ở mỗi

</div><span class="text_page_counter">Trang 29</span><div class="page_container" data-page="29">

thời điểm. Ví dụ như bạn chỉ cần tập trung vào giao diện (views) mà không phải quan tâm đến logic xử lý thông tin của ứng dụng.

Để quản lý sự phức tạp của ứng dụng, mẫu MVC giúp cho chúng ta có thể kiểm thử ứng dụng dễ dàng hơn hẳn so với khi áp dụng mẫu Web Forms. Ví dụ, trong một ứng dụng ASP.NET Web Forms, một lớp thường được sử dụng để hiển thị thông tin xuất ra cho người dùng và đồng thời xử lý thông tin người dùng nhập. Việc xây dựng các bộ test tự động cho ứng dụng Web Forms là rất phức tạp, bởi để kiểm thử mỗi trang web, bạn phải khởi tạo đối tượng trang, khởi tạo tất cả các control được sử dụng trong trang và các lớp phụ thuộc trong ứng dụng. Và bởi vì có q nhiều lớp cần được khởi tạo để chạy được trang, thật khó để có thể viết các test chỉ tập trung vào một khía cạnh nào đó của ứng dụng. Và vì thế, kiểm thử đối với các ứng dụng dứa trên nền tảng Web Forms sẽ khó khăn hơn nhiều so với khi áp dụng trên ứng dụng MVC. Hơn thế nữa, việc kiểm thử trên nền tảng Web Forms yêu cầu phải sử dụng đến web server. Nền tảng MVC phân tách các thành phần và sử dụng các interface (khái niệm giao diện trong lập trình hướng đối tượng), và nhờ đó có thể kiểm thử các thành phần riêng biệt trong tình trạng phân lập với các yếu tố còn lại của ứng dụng.

Sự hân tách rạch ròi ba thành phần của ứng dụng MVC còn giúp cho việc plập trình diễn ra song song. Ví dụ như một lập trình viên làm việc với view, lập trình viên thứ hai lo cài đặt logic của controller và lập trình viên thứ ba có thể tập trung vào logic tác vụ của model tại cùng một thời điểm.

Bạn cần phải xem xét kỹ càng việc áp dụng mơ hình ASP.NET MVC hay mơ hình ASP.NET Web Forms khi xây dựng một ứng dụng. Mô hình MVC khơng phải là mơ hình thay thế cho Web Forms, bạn có thể dùng một trong hai mơ hình.

Trước khi quyết định sử dụng MVC hay Web Forms cho một website cụ thể, bạn cần phải phân tích lợi ích khi chọn một trong hai hướng.

</div><span class="text_page_counter">Trang 30</span><div class="page_container" data-page="30">

Lợi ích của ứng dụng web dựa trên mơ hình MVC

Nền tảng ASP.NET MVC mang lại những lợi ích sau:

<small>• </small> Dễ dàng quản lý sự phức tạp của ứng dụng bằng cách chia ứng dụng thành ba thành phần model, view, controller

<small>• </small> Nó khơng sử dụng view state hoặc server-based form. Điều này tốt cho những lập trình viên muốn quản lý hết các khía cạnh của một ứng dụng.

<small>• </small> Nó sử dụng mẫu Front Controller, mẫu này giúp quản lý các requests (yêu cầu) chỉ thông qua một Controller. Nhờ đó bạn có thể thiết kế một hạ tầng quản lý định tuyến. Để có nhiều thơng tin hơn, bạn nên xem phần Front Controller trên web site MSDN

<small>• </small> Hỗ trợ tốt hơn cho mơ hình phát triển ứng dụng hướng kiểm thử (TDD)

<small>• </small> Nó hỗ trợ tốt cho các ứng dụng được xây dựng bởi những đội có nhiều lập trình viên và thiết kế mà vẫn quản lý được tính năng của ứng dụng

Lợi ích của ứng dụng được xây dựng trên nền tảng Web Forms

<small>• </small> Nó hỗ trợ cách lập trình hướng sự kiện, quản lý trạng thái trên giao thức HTTP, tiện dụng cho việc phát triển các ứng dụng Web phục vụ kinh doanh. Các ứng dụng trên nền tảng Web Forms cung cấp hàng tá các sự kiện được hỗ trợ bởi hàng trăm các server controls.

<small>• </small> Sử dụng mẫu Page Controller. Xem thêm ở mục Page Controller trên MSDN

<small>• </small> Mơ hình này sử dụng view state hoặc server ased form, nhờ đó sẽ giúp -bcho việc quản lý trạng thái các trang web dễ dàng.

</div><span class="text_page_counter">Trang 31</span><div class="page_container" data-page="31">

<small>• </small> Nó rất phù hợp với các nhóm lập trình viên quy mô nhỏ và các thiết kế, những người muốn tận dụng các thành phần giúp xây dựng ứng dụng một cách nhanh chóng.

<small>• </small> Nói tóm lại, áp dụng Web Forms giúp giảm bớt sự phức tạp trong xây dựng ứng dụng, bởi vì các thành phần (lớp Page, controls,…) được tích hợp chặc chẽ và thường thì giúp bạn viết ít code hơn là áp dụng theo mơ hình MVC.

Các tính năng của nền tảng ASP.NET MVC

<small>• </small> Tách bạch các tác vụ của ứng dụng (logic nhập liệu, business logic, và logic giao diện), dễ dàng kiểm thử và mặc định áp dụng hướng phát triển TDD. Tất cả các tính năng chính của mơ hình MVC được cài đặt dựa trên interface và được kiểm thử bằng cách sử dụng các đối tượng mocks, mock object là các đối tượng mô phỏng các tính năng của những đối tượng thực sự trong ứng dụng. Bạn có thể kiểm thử unit test cho ứng -dụng mà khơng cần chạy controller trong tiến trình ASP.NET, và điều đó giúp unit test được áp dụng nhanh chóng và tiện dụng. Bạn có thể sử dụng bất kỳ nền tảng unit-testing nào tương thích với nền tảng .NET.

<small>• </small> MVC là một nền tảng khả mở rộng (extensible) & khả nhúng

(pluggable). Các thành phần của ASP.NET MVC được thiết kể để chúng có thể được thay thế một cách dễ dàng hoặc dễ dàng tùy chỉnh. Bạn có thể nhúng thêm view engine, cơ chế định tuyến cho URL, cách kết xuất tham số của action-method và các thành phần khác. ASP.NET MVC cũng hỗ trợ việc sử dụng Dependency Injection (DI) và Inversion of Control (IoC). DI cho phép bạn gắn các đối tượng vào một lớp cho lớp đó sử dụng thay vì buộc lớp đó phải tự mình khởi tạo các đối tượng. IoC quy định rằng, nếu một đối tượng yêu cầu một đối tượng khác, đối tượng đầu sẽ lấy đối tượng thứ hai từ một nguồn bên ngồi, ví dụ như từ tập tin

</div><span class="text_page_counter">Trang 32</span><div class="page_container" data-page="32">

cấu hình. Và nhờ vậy, việc sử dụng DI và IoC sẽ giúp kiểm thử dễ dàng hơn.

<small>• </small> ASP.NET MVC có thành phần ánh xạ URL mạnh mẽ cho phép bạn xây dựng những ứng dụng có các địa chỉ URL xúc tích và dễ tìm kiếm. Các địa chỉ URL khơng cần phải có phần mở rộng của tên tập tin và được thiết kế để hỗ trợ các mẫu định dạng tên phù hợp với việc tối ưu hóa tìm kiếm (URL) và phù hợp với lập địa chỉ theo kiểu REST.

<small>• </small> Hỗ trợ sử dụng đặc tả (các thẻ) của các trang ASP.NET(.aspx), điều khiển người dùng (.ascx) và trang master page (.marter). Bạn có thể sử dụng các tính năng có sẵn của ASP.NET như là sử dụng lồng các trang master page, sử dụng in line expression (<%= %>), sử d- ụng server controls, mẫu, data-binding, địa phương hóa (localization) và hơn thế nữa.

<small>• </small> Hỗ trợ các tính năng có sẵn của ASP.NET như cơ chế xác thực người dùng, quản lý thành viên, quyền, output caching và data caching, seession và profile, quản lý tình trạng ứng dụng, hệ thống cấu hình…

<small>• </small> ASP.NET MVC 3 cịn bổ sung một view engine mới là Razor View Engine cho phép thiết lập các view nhanh chóng, dễ dàng và tốn ít công sức hơn so với việc sử dụng Web Forms view engine.

<b>2.5. Công nghệ thao tác dữ liệu Entity framework (hoặc ADO.NET) ❖ Entity Framework là gì? </b>

Entity Framework ra đời nhằm hỗ trợ sự tương tác<b> giữa các ứng dụng trên nền tảng </b>

.NET với các cơ sở ữ liệ d u quan h . Hay, Entity Frmework chính là cơng c giúp ệ ụánh x giạ ữa các đối tượng trong ng d ng, ph n m m c a b n v các b ng c a mứ ự ầ ề ủ ạ ới ả ủ ột cơ sở dữ liệu quan hệ.

Emntity Framework giúp các nhà phát triển Web tương tác vớ ữ liệi d u quan h theo ệphương pháp hướng đối tượng với ít mã hơn so với các ứng dụng truyền thống. Lợi

</div><span class="text_page_counter">Trang 33</span><div class="page_container" data-page="33">

ích l n nh t c a nó là giúp l p trình viên giớ ấ ủ ậ ảm thiểu vi c l p trình mã nguệ ậ ồn để thực hiện truy cập và tương tác với cơ sở ữ liệu. d

Hiện nay, Entity framwork là 1 framework mạnh để phát tri n ng d ng Web vể ứ ụ ới sựhỗ trợ đông đảo của cộng đồng.

<b>❖ Lịch sử ra đời </b>

Entity Framework được cho ra mắt vào năm 2008. Nhờ ự ra đợ ủ s i c a nó vi c truy ệvấn cơ sở dữ liệu quan hệ trở lên đơn giản, dễ học, giúp giảm bớt thời gian phát triển dự án xuống đáng kể.

<b>❖ Lịch sử phiên bản lõi (core) của EF </b>

<small>• </small> EF Core 2.0 tháng 8 năm 2017 .NET Core 2.0, VS 2017

<small>• </small> Lõi EF 1.1 Tháng 11 năm 2016 .NET Lõi 1.1

<small>• </small> EF Core 1.0 tháng 6 năm 2016 .NET Core 1.0

<small>• </small> Tại sao l i sạ ử d ng Entity Framework? ụ

Sử dụng Entity Framework s ẽ đem lại những lợi ích sau:

<small>• </small> Nếu b n ạ thực hi n truy v n dệ ấ ữ liệu. B n có th s d ng Linq toạ ể ử ụ <b> Entities để</b>

thao tác với objects được sinh ra t Entity Frameworkừ <b>, nghĩa là bạ</b>n không phải viết code sql.

<small>• </small> Việc update các classes,commands d dàng mễ ỗi khi cơ sở ữ liệ d u có s thay ựđổi, điều này giúp bạn ti t kiệm thời gian đáng kể. ế

</div><span class="text_page_counter">Trang 34</span><div class="page_container" data-page="34">

<small>• </small> Entity Framework s tẽ ự động tạo ra các classes, commands tương ứng cho việc select, insert, update,delete dữ u tliệ ừ cơ sở ữ liệ d u quan h . ệ

<small>• </small> Entity Framework tự động t o ra các classes cho vi c truy suạ ệ ất cơ sở ữ liệu dgiúp l p trình viên giậ ảm được th i gian vi t code thao tác v i database. H ờ ế ớ ỗtrợ bạn không phải mất quá nhiều th i gian cho việc viờ ết code để thao tác với database.

<b>❖ Cấu trúc c a Entity Framework</b>ủCấu trúc được mơ tả đơn giản qua hình sau:

<b>❖ EDM (Entity Data Model): </b>

</div><span class="text_page_counter">Trang 35</span><div class="page_container" data-page="35">

Là ngôn ng truy v n s dữ ấ ử ụng để ế vi t các truy v n t i object model. Tr v các thấ ớ ả ề ực thể được định nghĩa bên trong Conceptual model <b>.</b>

<b>❖ Entity Client Data Provide r:</b>

Nhiệm vụ chính c a nó là chuyủ ển đổi L2E hoặc những truy v n Entity SQL vào mấ ột truy vấn SQL. Nó được hi u bể ởi CSDL cơ bản. Giao ti p v i ế ớ ADO.Net data provider lần lượt g i ử và nh n d u t CSDL. ậ ữ liệ ừ

<b>❖ ADO.Net Data Provider: </b>

<b>Thực hiện giao ti p v i CSDL b ng s d</b>ế ớ ằ ử ụng chu n ADO.Ne ẩ t.

<b>❖ Những tính năng của Entity Framework </b>

Những tính năng đáng chú ý nhất của Entity framework:

<small>• </small> Entity framework hỗ trợ stored procedure.

<small>• </small> Nó làm vi c v i b t kệ ớ ấ ỳ cơ sở ữ liệ d u quan h nào có Entity Framework h p ệ ợlệ.

<small>• </small> Entity Framework t o tạ ruy vấn SQL t LINQ to Entities. ừ

<small>• </small> Nó được phát triển như một sản phẩm mã ngu n mồ ở.

<small>• </small> Entity framework là một sản phẩm của Microsoft.

<small>• </small> EF cho phép tạo nh ng câu l nh thêm, xóa, c p nh ữ ệ ậ ật.

<small>• </small> Theo dõi những thay đổi của các đối tượng trong b nh . ộ ớ

</div><span class="text_page_counter">Trang 36</span><div class="page_container" data-page="36">

<b>2.6. Mơ hình thao tác dữ liệu 3 layer</b>

2.6.1 Mơ hình 3 lớp là gì?❖ Khái niệm:

<small>• </small> Mơ hình 3 lớp hay còn được gọi là mơ hình Three Layer(3-Layer), mơ hình này ra đời nhằm phân chia các thành phần trong hệ thống, các thành phần cùng chức năng sẽ được nhóm lại với nhau và phân chia công việc cho từng nhóm để dữ liệu khơng bị chồng chéo và chạy lộn xộn.

<small>• </small> Mơ hình này phát huy hiệu quả nhất khi bạn xây dựng một hệ thống lớn, việc quản lý code và xử lý dữ liệu lỗi dễ dàng hơn.

❖ Ưu điểm:

<small>• </small> Phân loại rõ ràng các lớp có các nhiệm vụ khác nhau. Từ đó ta có thể quản lý và maintain project tốt hơn.

<small>• </small> Dễ dàng phân loại các hành động tại Business.

<small>• </small> Dễ dàng phân loại các hàm truy xuất tại Database, phân loại hàm theo table,…

<small>• </small> Ứng dụng được cho các project lớn ở bên ngồi.

<small>• </small> …

❖ Lưu ý khi xây dựng mơ hình 3 lớp:

<small>• </small> Cần một solution riêng cho project.

<small>• </small> Cần 3 project khác nhau để làm nên 3 lớp, tên Project đặt như sau:

<small>• </small> Lớp GUI: (VD: QuanLy_GUI)

<small>• </small> Lớp Business: (VD: QuanLy_BUS)

<small>• </small> Lớp Data Access: (VD: QuanLy_DAL)

<small>• </small> Lớp DTO: (VD: QuanLy_DTO)

</div><span class="text_page_counter">Trang 37</span><div class="page_container" data-page="37">

2.6.2 Giới thiệu về mơ hình 3 lớp

<i>Hình 2-4: Mơ hình 3 l p </i>ớ❖ <b>Mơ hình 3-layer gồm có 3 phần chính:</b>

<small>• </small> <b>Presentation Layer (GUI) </b>

<small>• </small> Lớp này có nhiệm vụ chính là giao tiếp với người dùng. Nó gồm các thành phần giao diện ( winform, webform, …) và thực hiện các công việc như nhập liệu, hiển thị dữ liệu, kiểm tra tính đúng đắn dữ liệu trước khi gọi lớp Business Logic Layer (BLL).

<small>• </small> Business Logic Layer (BLL) Layer này phân ra 2 thành nhiệm vụ:

<small>• </small> Đây là nơi đáp ứng các yêu cầu thao tác dữ liệu của GUI layer, xử lý chính nguồn dữ liệu từ Presentation Layer trước khi truyền xuống Data Access Layer và lưu xuống hệ quản trị CSDL.

<small>• </small> Đây cịn là nơi kiểm tra các ràng buộc, tính tồn vẹn và hợp lệ dữ liệu, thực hiện tính tốn và xử lý các yêu cầu nghiệp vụ, trước khi trả kết quả về Presentation Layer.

<small>• </small> <b>Data Access Layer (DAL) </b>

<small>• </small> Lớp này có chức năng giao tiếp với hệ quản trị CSDL như thực hiện các công việc liên quan đến lưu trữ và truy vấn dữ liệu ( tìm kiếm, thêm, xóa, sửa,…).

</div><span class="text_page_counter">Trang 38</span><div class="page_container" data-page="38">

2.6.3 Các thành phần của từng lớp

<b>❖ Presentation Layer (GUI) </b>

Có hai thành phần chính sau đây với những tác vụ cụ thể :

<small>• </small> UI Components : gồm các thành phần tạo nên giao diện của ứng dụng (GUI). Chúng chịu trách nhiệm thu nhận và hiển thị dữ liệu cho người dùng… Ví dụ : textbox, button, combobox, …

<small>• </small> UI Process Components : là thành phần chịu trách nhiệm quản lý các quá trình chuyển đổi giữa các UI… Ví dụ : Sắp xếp q trình kiểm tra thông tin khách hàng:

1. Hiển thị màn hình tra cứu ID.

2. Hiển thị màn hình thông tin chi tiết khách hàng tương ứng. 3. Hiển thị màn hình liên lạc với khách hàng.

<small>• </small>Business Components : chịu trách nhiệm kiểm tra các quy tắc nghiệp vụ, ràng buộc logic và thực hiện các công việc . Các thành phần này cũng thực hiện các dịch vụ mà Service Interface cung cấp và Business Workflows sẽ sử dụng nó.

<small>• </small>Business Entities : thường được sử dụng như Data Transfer Objects ( DTO ) . Bạn có thể sử dụng để truyền dữ liệu giữa các lớp (Presentation và Data Layer). Chúng thường là cấu trúc dữ liệu ( DataSets, XML,… ) hay các lớp đối tượng đã được tùy chỉnh. Ví dụ : tạo 1 class Student lưu trữ các dữ liệu về tên, ngày sinh, ID, lớp.

<small>• </small> Data Layer (DAL)

<small>• </small> Data Access Logic Components : chịu trách nhiệm chính lưu trữ và truy xuất dữ liệu từ các nguồn dữ liệu (Data Sources) như XML, file system,… Hơn nữa còn tạo thuận lợi cho việc dễ cấu hình và bảo trì. Service Agents : giúp bạn gọi và tương tác với các dịch vụ từ bên ngoài một cách dễ dàng và đơn giản.

</div><span class="text_page_counter">Trang 39</span><div class="page_container" data-page="39">

CHƯƠNG 3: <b>P</b>HÂN TÍCH VÀ THIẾT KẾ HỆ THỐNG

<b>3.1 Đặc tả yêu cầu phần mềm 3.1.1 Các yêu cầu chức năng </b>

a) Chức năng của phân hệ quản trị nội dung

<small>• </small> Các chức năng của trang quản trị

</div><span class="text_page_counter">Trang 40</span><div class="page_container" data-page="40">

<i>Hình 3.1: Bi</i>ểu đồ<i> UseCase t ng quát trang qu n tr</i>ổ ả ị

<small>• </small> Các biểu đồ phân rã của trang quản trị

<small>• </small> Use Case quản lý thể loại nhạc

<i>Hình 3.2: UseCase qu n lý th</i>ả <i>ể loại nhạc</i>

<small>• </small> Dịng sự kiện chính

</div>

×