báo cáo môn học lập trình web 1 website bán sách sachhay vn

Từ việc truy cập thông tin, giao tiếp, giáo dục, giải trí đến việc quản lý công việc và kinh doanh, ứng dụng web đang dần trở thành một phần không thể thiếu của chúng ta.. Trong báo cáo

TRƯỜNG ĐẠI HỌC YERSIN ĐÀ LẠT

KHOA CÔNG NGHẸ THÔNG TIN

PHẦN NHẠN XÉT CỦA GIẢNG VIÊN

Ngày tháng năm Ký và ghỉ rõ họ tên

MỤC LỤC

Chương 1: Tìm Hiểu về Lập Trình Web (Cơ Sở Lý Thuyết)

1.1 Khái Niệm .22++ 22112 1211111111211211111117210111110210011 1121111110011 10011

A.Chức Năng cơ bản

B.Các Mô hình phát triển web Ă.- - 11

Mô hình IMVC e.eee 44

Chương 2: Xây Dựng Ứng Dụng Web (Triển Khai Thực Tế)

2.1 Bài Toán Ứng Dụng . -: c2 2 21 2n He 18

2.2 Xây Dựng Chương Trình ch H ng giết 19

Chương 3: Kết Quả Chương Trình: - ác c ccksssseiersrrsrsves 20

Tài Liệu Tham Khảo .-c LH SH ng ng kg kế 23

DANH MUC HINH

STT Tên viết tất Tên đầy đủ AT CAN cà „ N

(Nếu là tiếng nước ngoài)

1 CMF Concurrent Max Flow 2 CSDL Cơ sở dữ liệu

11 DBMS Database Management Hệ quản trị cơ sở dữ liệu System

BÁO CÁO TIẾN ĐỌ

Nội dung công |Phân [74/7 |rạ|T [rz T17|I |re|lf |T4il l1 |T4a [T44 | |146 | r4z | Hoàn

việc công 2 4 8 0 2 5 thành Phân công công | Cả x |x |X |X |X x |x |x |x X X X X X X X ee việc nhóm

Tim hiểu lý| Nguyễn |x |x |x |x |x x |x |x |x X X X X X X X thuyết và viết | Văn Phú

nội dung phần | Khánh x

Tổng hợp phần | Nguyễn |x |x |x |x |x x |x |x |x X X X X X X X X 1 Văn Phú

Chuẩn bị nội | Đoàn x |x |x |x |x x |x |x |x X X X X X X X

thuyết trình Khánh Ly

Thống nhất nội | Cá x |x |x |x |X x |x |x |x x x x x x x x

trình

Thuyết trình Nguyễn |x |x |x |x |x x |x |x |x X X X X X X X X Văn Phú

Tổng hop va| Kim Van|x |x |x |x |x x |x |x |x X X X X X X X

cao

Thiét kế | Khánh x |x |x |x |X x |x |x |x x x x x x x x x template Ly

Xây dung code | Kim Van|x |X |x |X |X x |x |x |x X X X X X X X

dung Web

Thu thập hình | Nguyén |x |x |x |x |x x |x |x |x X X X X X X X ảnh và kết quả | Văn Phú X ứng dụng Web

Demo lab Nguyén |x |x |x |x |x x |x |X |x X X x x x x x x Van Phu

LỜI NÓI ĐẦU

Xin chào thầy và các bạn,

Trong thời đại công nghệ ngày nay, ứng dụng web không chỉ là một phần không thể thiếu

trong cuộc sống hàng ngày, mà còn là cầu nối quan trọng, kết nối hàng tỷ người trên khắp thế giới Điều đó chứng mỉnh sức mạnh và ảnh hưởng lớn của lập trình web đối với cuộc

sống con người Ứng dụng web không chỉ là những trang web đơn thuần, mà chúng đã trở thành những công cụ mạnh mẽ hỗ trợ mọi khía cạnh trong đời sống Từ việc truy cập thông tin, giao tiếp, giáo dục, giải trí đến việc quản lý công việc và kinh doanh, ứng dụng

web đang dần trở thành một phần không thể thiếu của chúng ta Trong báo cáo này,

chúng tôi sẽ không chỉ giới thiệu về quá trình học và áp dụng kiến thức môn "Lập Trình Web ", mà còn nhìn nhận về vai trò quan trọng của lập trình web trong việc xây dựng những ứng dụng web có ảnh hưởng tích cực đến cuộc sống hàng ngày của chúng ta.Trén thực tế không có sự thành công nào mà không gắn liền với những sự hỗ trợ, giúp đỡ dù ít

hay nhiều, dù trực tiếp hay gián tiếp của người khác Trong suốt thời gian đã và đang học tập tại trường đến nay, em đã nhận được rất nhïềusự quan tâm giúp đỡ của quý Thầy Cô,

gia đình và bạn bè.Và đặc biệt, trong học kỳ này Em xin cảm ơn thầy Nguyễn Đức tấn đã hướng dẫn,góp ý, thảo luận để bài báo cáo này của em được hoàn thiện Trong thời gian được học tập và thực hành dưới sự hướng dẫn của cô, chúng em không những thu được

rất nhiều kiến thức bổ ích, mà còn được truyền sự say mê và thích thđối với bộ môn Đồ án lập trình web nâng cao.Mặc dù đã rất cố gắng hoàn thiện báo cáo với tất cả sự nỗ lực, tuy

nhiên, dbước đầu đi vào thực tế, tìm hiểu và xây dựng báo báo trong thời gian có hạn, với

lượng kiến thức còn hạn chế, nhiều bỡ ngỡ, nên báo cáo chắc chắn sẽ không thể tránh

khỏi những thiếu sót Chúng em rất mong nhận được sự quan tâm, thông cảm và những đóng góp quý báu của thầy cô và các bạn để đồ án này ngày càng hoàn thiện hơn

Phần 1: Tìm Hiểu về Lập Trình Web (Cơ Sở Lý Thuyết)

1.1 Khái niệm

Lập trình web là một lĩnh vực quan trọng trong ngành công nghiệp công nghệ thông tin, tập trung vào việc phát triển ứng dụng và trang web mà người dùng có thể truy cập

thông qua Internet Nó không chỉ đơn thuần là quá trình viết mã nguồn, mà còn liên quan đến thiết kế giao diện người dùng, tối ưu hóa trải nghiệm người dùng, và bảo đảm tính an

toàn và bảo mật của thông tin

A Chức năng cơ bản

Lập trình web bao gồm nhiều khía cạnh và chức năng cơ bản, trong đó:

A.1 Mã Ngôn Ngữ Web

¢ Str dung thé dé đánh dấu và tổ chức các phần khác nhau của trang

¢ CSS (Cascading Style Sheets):

* Mangén nei’ dung dé dinh dang va trang tri giao dién cua trang web * ac dinh kiéu font, mau sac, knoang cach, va cdc thudéc tinh thiét ké khac ® = JavaScript:

¢ Ng6n ngi lap trinh chay trén trinh duyét dé tao ra cac tuong tac déng va thay đổi nội dung trang mà không cần tải lại

e Cho phép thực hiện các chức năng như xử lý sự kiện, kiểm tra điều kiện, và thay

e© - Ruby được sử dụng trong kết hợp với framework Ruby on Rails để phát triển ứng dụng web nhanh chóng và hiệu quả

A.2 Framework và Thư Viện

+ React Qncuraris

®

v ý jQuery 3 `

GRUNT

= “PDev Viéc lam IT cho Top Developers

A.2.1 Framework

Framework la mét cấu trúc được xây dựng sẵn giúp lập trình viên xây dựng ứng

as js

* ASP.NET Core là mã nguồn mở, điều này có nghĩa là mã nguồn của nó có sẵn

để mọi người xem xét, cải thiện và sử dụng một cách tự do Nó cũng hỗ trợ đa nền tảng, nghĩa là có thể chạy trên Windows, Linux và macOS

2 Hiệu Năng Cao và Tối Ưu Hóa:

¢ ASP.NET Core duoc tdi uu hóa để cung cấp hiệu suất tốt, đặc biệt là trong việc

xử lý các yêu cầu HTTP và chịu tải cao 3 Cau Trúc Mô-đun và Middleware:

e© - Sử dụng cấu trúc mô-đun để linh hoạt kết hợp các thành phần của ứng dụng

và sử dụng middleware để xử lý yêu cầu HTTP và HTTP responses 4 Dependency Intiection:

* H6 tro’ Dependency Intiection (Dl), giúp quản lý các phụ thuộc và làm cho ứng

dụng dễ bảo trì và mở rộng 5 Hệ Thống Razor Pages va MVC:

® - Hỗ trợ cả Razor Pages (một mô hình lập trình dựa trên trang) và Model-View- Controller (MVC) để phát triển ứng dụng web theo các mô hình khác nhau ó Đa Ngôn Ngữ và Đa Framework:

e Hỗ trợ nhiều ngôn ngữ lập trình như C#, F#, và VB.NET Nó cũng có thể tích hợp với các framework phổ biến như Entity Framework để làm việc với cơ

sở dữ liệu

7 Tương Thích Cloud và Docker:

e_ Dễ dàng triển khai trên các dịch vụ đám mây như Azure, AWS, và Google Cloud Platform Hỗ trợ Docker giúp đóng gói ứng dụng và triển khai chúng dễ dàng trên các môi trường khác nhau

e ASP.NET Core duoc thiét ké dé cung cấp sự linh hoạt và hiệu suất cao cho

phát triển ứng dụng web, đặc biệt là trong môi trường đa nền tảng và đám mây

e Bootstrap: lA một framework (khuôn khổ) phổ biến được sử dụng để phát

triển trang web và ứng dụng di động Nó được tạo ra bởi Twitter và đã trở thành một dự án mã nguồn mở, giúp người phát triển xây dựng trang web linh hoạt, đáp ứng và có giao diện người dùng đẹp mắt một cách nhanh chóng

Dưới đây là một số đặc điểm chính của Bootstrap: 1 CSS va JavaScript:

e Bootstrap cung cap một bộ CSS và JavaScript sẵn có, giúp tạo ra giao diện

thân thiện và tương thích trên nhiều loại thiết bị

2 Responsive Design:

e Bootstrap hé trợ thiết kế đáp ứng, tức là trang web có thể thích ứng với

kích thước màn hình của người dùng, từ máy tính đến điện thoại di động 3 Grid System:

e©_ Sử dụng hệ thống lưới (grid system) linh hoạt giúp dễ dàng cấu trúc và tổ

chức các thành phần trên trang web 4 Components va Styles:

e Bootstrap cung cap mét loat cac thành phần giao diện người dùng như buttons, forms, navigation bars, modals, va nhiéu styles dé gitip tao ra giao dién thd vi va chuyén nghiép

e Framework nay tập trung vào sự đơn giản va tăng cường hiệu suất Nó tự động ánh xạ các thư mục và file theo quy ước để giảm đau đầu cho lập trình viên

A.2.2 Thư Viện

Thư viện là một bộ sưu tập các hàm, module, và class được viết sẵn để hỗ trợ lập

trình viên trong việc thực hiện các nhiệm vụ cụ thể ® tiQuery (JavaScript):

e© - Được sử dụng rộng rãi để đơn giản hóa việc tương tác với DOM và xử lý sự kiện trên trình duyệt

e© - Thư Viện: Cung cấp các công cụ và chức năng cụ thể để bạn sử dụng trong

ứng dụng của mình mà không yêu cầu một cấu trúc tổ chức cụ thể A.3 Giao Thức HTTP và API

A.3.1 Giao Thức HTTP (Hypertext Transfer Protocol)

o_ Định nghĩa: HTTP là một giao thức truyền tải dữ liệu giữa máy khách và máy chủ trên World Wide Web Nó định rõ cách dữ liệu được truyền tải và định dạng của nó, làm cho việc giao tiếp giữa các thành phần của một ứng dụng web trở nên hiệu quả

o Phuong thức:

e_ GET: Yêu cầu dữ liệu từ một nguồn cụ thể

e_ POST: Gửi dữ liệu đến một nguồn để xử lý, thường được sử dụng trong việc đăng ký và tải lên dữ liệu

e PUT: Cập nhật dữ liệu tại một nguồn cụ thể hoặc tạo nguồn mới nếu nó không tồn tại

e _ DELETE: Xóa dữ liệu tại một nguồn cụ thể A.3.2 API (Application Programming Interface)

e Dinh nghĩa: API là một bộ các quy tắc và công cụ cho phép các phần mềm khác tương tác với nhau Trong lập trình web, API thường được sử dụng để kết

nối và truyền thông giữa các ứng dụng và dịch vụ khác nhau

Cac Loai API:

e API Web: Str dung giao thức HTTP dé truyền tải dữ liệu qua mạng Có thể trả về

dữ liệu dưới dạng XML hoặc JSON

e API RESTful: Áp dụng các nguyên tắc của REST (Representational State Transfer) để tạo ra các dịch vụ web mạnh mẽ, dễ bảo trì, và có thể mở rộng

® A.3.3 Sự Tương Tác giữa HTTP và API e_ Quy Trình Tương Tác:

e Yéu Cau (Request): May khách gửi yêu cầu HTTP đến một địa chỉ cụ thể

e© - Xử Lý: Máy chủ xử lý yêu cầu và trả về một HTTP response

¢ Phan Héi (Response): May chủ gửi lại phản hồi với dữ liệu được yêu cầu hoặc thông báo lỗi

e Ưu Điểm của Giao Thức HTTP và API:

e _ Tính Linh Hoat: HTTP va API cho phép tương tác giữa các ứng dụng và dịch vụ khác nhau, tạo ra sự lĩnh hoạt trong phát triển và tích hợp

e Tính Mở Rộng: Khả năng mở rộng dự án thông qua việc kết nối với các API công

cộng hoặc tư nhân

e Tính Tích Hợp: Đơn giản hóa quá trình tích hợp các dịch vụ và chỉa sẻ dữ liệu giữa các ứng dụng

B Các Mô Hình Phát Triển Web

1 Mô Hình Client-Server: e Đặc Điểm:

e Chia thanh hai thành phần chính: máy chủ (server) và máy khách (client) e Máy chủ xử lý yêu cầu và cung cấp dữ liệu

e _ Máy khách hiển thị dữ liệu và tương tác với người dùng

Chia ứng dụng thành ba thành phần: Model, View và Controller Model: Chứa dữ liệu và logic xử lý

View: Hiển thị dữ liệu và tương tác với người dùng

Controller: Xử lý yêu cầu và điều hướng luồng điều khiển Ưu Điểm:

Tách biệt logic giúp dễ bảo trì và mở rộng ứng dụng

Cung cấp sự linh hoạt trong việc thay đổi giao diện người dùng mà không ảnh

hưởng đến logic xử lý Nhược Điểm:

Đôi khi có thể làm tăng độ phức tạp của ứng dụng

3 Mô Hình MVVM (Model-View-ViewModel): Đặc Điểm:

Mở rộng từ mô hình MVC

ViewModel: Giữ liên kết giữa Model và View

Dữ liệu được hiển thị trực tiếp trên View thông qua ViewModel

Mô hình MVC (Model-View-Controller) là một kiến trúc thiết kế phổ biến trong

phát triển phần mềm, đặc biệt là trong lập trình web Nó giúp tách biệt các thành phần

khác nhau của ứng dụng để dễ bảo trì, mở rộng và tái sử dụng mã nguồn Mô hình này được chỉa thành ba thành phần chính: Model, View, và Controller

1 Model:

1.4 Đặc Điểm Chính của Model:

e_ Model là một phần của mô hình MVC, chịu trách nhiệm quản lý dữ liệu và logic xử lý trong ứng dụng

1.2 Chức Năng Cơ Bản: e_ Quản Lý Dữ Liệu:

e Model giữ và duy trì thông tin liên quan đến ứng dụng, bao gồm cả dữ liệu

như thông tin người dùng, cài đặt, và bất kỳ thông tin nào khác cần thiết

Logic Xử Lý:

e Bên cạnh việc lưu trữ dữ liệu, Model cũng chứa các hàm và phương thức

để thực hiện các thao tác xử lý logic trên dữ liệu Điều này bao gồm các

phép toán, kiểm tra điều kiện, và mọi hoạt động cần thiết để duy trì tính nhất quán của dữ liệu

e _ Không Liên Quan Đến Giao Diện:

e Model không chứa bất kỳ logic liên quan đến giao diện người dùng nào Nó

tập trung hoàn toàn vào việc quản lý dữ liệu và logic kinh doanh 1.3 Quy Trình Hoạt Động Cơ Bản:

a Nhan Yêu Cầu từ Controller:

e Model nhan yêu cầu từ Controller, thường là thông qua các phương thức và hàm được xác định trong Model

e _ Xử Lý và Cập Nhật Dữ Liệu:

e_ Model thực hiện các thao tác cần thiết để xử lý yêu cầu, bao gồm việc cập nhật dữ liệu nếu cần thiết

b Thông Báo Kết Quả cho Controller:

e©_ Sau khi xử lý yêu cầu, Model thông báo cho Controller về kết quả, chẳng hạn như thông tin cập nhật, thông báo lỗi, hoặc bất kỳ sự kiện nào khác mà

Controller cần biết để cập nhật giao diện người dùng c _ Không Liên Quan Đến Giao Diện:

e _ Model không có trách nhiệm hiển thị thông tin cho người dùng Nó chỉ chịu trách nhiệm về dữ liệu và logic, giữ cho nó độc lập với giao diện người dùng

1.4 _ Ưu Điểm của Model trong Mô Hình MVC:

e Tach Biét Dữ Liệu và Logic:

e Model gitip tach biệt hoàn toàn dữ liệu và logic từ các thành phần khác của

ứng dụng Điều này giúp giữ cho mã nguồn dễ bảo trì và tái sử dụng

e Tinh Nhat Quan:

© Model git’ cho dé liu lu6én 6n dinh và nhất quán, đảm bảo rằng mọi thay

đổi được xử lý một cách đúng đắn

Tính Tái Sử Dụng: