ĀY BAN NHÂN DÂN THÀNH PHà Hâ CHÍ MINH TR¯âNG CAO ĐÀNG BÁCH KHOA NAM SÀI GÒN GIÁO TRÌNH MÔN HàC/MÔ ĐUN: L¾P TRÌNH WEB NÂNG CAO NGÀNH/NGHÀ: TIN HàC ĀNG DĀNG TRÌNH ĐÞ: CAO ĐÀNG Ban hành kèm theo Quyết định số: 459/QĐ-NSG, ngày 31 tháng 08 năm 2022 của Hiệu trưởng Trường Cao Đẳng Bách Khoa Nam Sài Gòn Tp. Hồ Chí Minh, năm 2022 Giáo trình Lập trình web nâng cao TUYÊN BÞ BÀN QUYÀN Tài liáu này thußc lo¿i sách giáo trình nên các nguãn thông tin có thß đ°ợc phép dùng nguyên bÁn hoặc trích dùng cho các mÿc đích về đào t¿o và tham khÁo. Mọi mÿc đích khác mang tính lách l¿c hoặc sử dÿng vái mÿc đích kinh doanh thiếu lành m¿nh sẽ bị nghiêm cấm. Trang 2/68 Giáo trình Lập trình web nâng cao MĀC LĀC LâI GIàI THIàU .5 Bài 1: Kết hợp PHP vái MySQL.
Thiết kế Layout sử dÿng HTML, CSS, Bootstrap. Ôn tÁp HTML, CSS. Sử dÿng Bootstrap trong thiết kế Layoutweb. Hoàn thành giao dián web.
Các thao tác xử lý trên c¢ så dữ liáu. Truy vấn lọc dữ liáu. Truy vấn thêm, sửa, xóa, cÁp nhÁt dữ liáu. Hißn thị, tìm kiếm dữ liáu lên website.
Hißn thị dữ liáu từ c¢ så dữ liáu lên giao dián. Tìm kiếm dữ liáu trên website. QuÁn trị dữ liáu trên website. Hißn thị dữ liáu lên trang quÁn trị.
Thao tác sửa dữ liáu. Thao tác xóa dữ liáu .30 Bài 2: Hoàn chỉnh Website. Website tin tức. Thiết kế giao dián.
Thiết kế c¢ så dữ liáu. QuÁn trị dữ liáu .42 Trang 3/68 Giáo trình Lập trình web nâng cao 2. Hißn thị dữ liáu lên giao dián. Website th°¢ng m¿i.
Thiết kế giao dián. Thiết kế c¢ så dữ liáu. QuÁn trị dữ liáu. Đăng ký host, tên miền.65 TÀI LIàU THAM KHÀO:.68 Trang 4/68 Giáo trình Lập trình web nâng cao LâI GIàI THIàU Môn học này thußc khái kiến thức chuyên môn nghề trong ch°¢ng trình đào t¿o ngành tin học ứng dÿng há cao đẳng.
LÁp trình web nâng cao là môn học bắt bußc trong ch°¢ng trình ngành Tin học ứng dÿng trình đß cao đẳng. Nßi dung giáo trình gãm 2 bài: - Bài 1: Kết hợp PHP vái MySQL - Bài 2: Hoàn chỉnh Website Trong quá trình biên so¿n chúng tôi đã kết hợp kinh nghiám giÁng d¿y trong nhiều năm cāa nhóm tác giÁ vái mong muán có thß giúp cho học sinh – sinh viên dß dàng nắm bắt đ°ợc nßi dung cāa môn học. Mặc dù, rất cá gắng trong quá trình biên so¿n, nh°ng chắc chắn không thß tránh khßi những thiếu sót, vì vÁy, nhóm tác giÁ chúng tôi rất mong nhÁn đ°ợc ý kiến đóng góp cāa b¿n đọc đß giáo trình ngày mßt hoàn thián h¢n. HCM, ngày 31 tháng 08 năm 2022 Tham gia biên so¿n 1.
Chā biên: ThS Lê Thị Thùy Trang 2. Trang 5/68 Giáo trình Lập trình web nâng cao GIÁO TRÌNH MÔN HàC/MÔ ĐUN Tên môn hác/mô đun: LÀP TRÌNH WEB NÂNG CAO Mã môn hác/mô đun: MH22 Vß trí, tính chất, ý nghĩa và vai trò cÿa môn hác/mô đun: - Vị trí: Môn học này thußc khái kiến thức chuyên môn nghề trong ch°¢ng trình đào t¿o ngành tin học ứng dÿng há cao đẳng. - Tính chất: LÁp trình web nâng cao là môn học bắt bußc trong ch°¢ng trình ngành Tin học ứng dÿng trình đß cao đẳng. Māc tiêu cÿa môn hác/mô đun: 1.
Về kiến thức: − Trình bày đ°ợc quá trình trao đổi dữ liáu giữa server và client; − Trình bày đ°ợc cú pháp lánh nhúng mã PHP; − Trình bày đ°ợc trình tự các b°ác kết hợp bootstrap, CSS, HTML; − Trình bày đúng cú pháp câu lánh MySQL. Về kỹ năng: − Thiết kế đ°ợc giao dián website bằng boottrap, CSS, HTML; − Sử dÿng đ°ợc câu lánh MySQL kết hợp vái ngôn ngữ lÁp trình PHP đß hißn thị dữ liáu lên trang web; − QuÁn trị đ°ợc c¢ så dữ liáu website. Về năng lực tự chā và trách nhiám: − Rèn luyán lòng yêu nghề, t° thế tác phong công nghiáp, tính kiên trì, sáng t¿o trong công viác. Nßi dung cÿa môn hác/mô đun: Bài 1: K¿t hÿp PHP vái MySQL 1.
Māc tiêu: − Sử dÿng đ°ợc các láp cāa bootstrap; − Kết hợp đ°ợc ngôn ngữ PHP vái MySQL đß hißn thị dữ liáu; − Thực hián đ°ợc trang quÁn trị dữ liáu. Thi¿t k¿ Layout sử dāng HTML, CSS, Bootstrap 2. Ôn t¿p HTML, CSS Thiết kế trang chā - Home Trang 6/68 Giáo trình Lập trình web nâng cao Trang 7/68 Giáo trình Lập trình web nâng cao Thiết kế trang hỗ trợ - Support Trang 8/68 Giáo trình Lập trình web nâng cao Thiết kế trang Blog Trang 9/68 Giáo trình Lập trình web nâng cao Thiết kết trang giái thiáu – About Us Trang 10/68 Giáo trình Lập trình web nâng cao Trang 11/68 Giáo trình Lập trình web nâng cao Thiết kế trang liên há - Contact Us Trang 12/68 Giáo trình Lập trình web nâng cao Nguãn: https://www.com/free-css-templates/ 2. Sử dāng Bootstrap trong thi¿t k¿ Layoutweb TÁi ứng dÿng bootstrap: https://getbootstrap.com/ GiÁi nén th° mÿc Chép tÁp tin cần sử dÿng 2.
Hoàn thành giao dián web 2. T¿o c¡ sở dữ liáu - Start Apache và MySQL - Vào Databases trên thanh menu hoặc kích vào New Trang 13/68 Giáo trình Lập trình web nâng cao - Database name: điền tên database cần t¿o, ví dÿ: tintuc. - Collation: chọn d¿ng ngôn ngữ hißn thị, b¿n có thß chọn utf8_general_ci. - Click Create đß t¿o database - T¿o table – phpMyAdmin Trang 14/68 Giáo trình Lập trình web nâng cao - Click vào database tintuc å danh sách bên trái, click chọn tab Structure.
- ä phần Create table điền tên table (ví dÿ: tin_xahoi) và sá cßt (ví dÿ: 5 cßt). Click vào button Go đß sang b°ác điền thông tin cho từng cßt. - id: Sá thứ tự cho mỗi hàng dữ liáu (record), sá này sẽ cho tăng tự đßng (auto increment) và th°ãng chọn là khóa chính (primary key), chọn dữ liáu là sá (INT), vái chiều dài 10 ký tự (t°¢ng ứng vái thứ tự lên tái 10 sá tự nhiên). - title: tiêu đề cho tin tức, do tiêu đề th°ãng ngắn, ta chọn dữ liáu là TEXT vái chiều dài 100 ký tự.
- date: ngày viết tin tức, chọn dữ liáu là DATE. - description: dòng mô tÁ ngắn cho tin tức, chọn dữ liáu là TEXT vái chiều dài 200 ký tự. - content: Nßi dung cho tin tức, đây là nßi dung dài, nên chọn kißu dữ liáu là LONGTEXT vái chiều dài 1000 ký tự. Trang 15/68 Giáo trình Lập trình web nâng cao - Click button Save bên d°ái đß kết thúc viác t¿o table.
- Table vừa t¿o sẽ có d¿ng nh° sau: Trang 16/68 Giáo trình Lập trình web nâng cao - Chỉnh AUTO INCREMENT cho id - Viác này cần thiết, vì mỗi khi thêm mßt hàng dữ liáu thì mÿc id sẽ tự đßng đ°ợc tăng thêm 1. - T¿i hàng id, cßt Action, Click chọn Change. - ä màn hình điều chỉnh, tìm và click chọn checkbox å vị trí A_I. - Click Save đß thay đổi điều chỉnh và xem kết quÁ.
Trang 17/68 Giáo trình Lập trình web nâng cao Chỉnh KHÓA CHÍNH cho id: Mỗi table chỉ có mßt khóa chính, khóa chính có tác dÿng xác định tính duy nhất cāa mỗi hàng dữ liáu trong table, ngoài ra đ°ợc dùng đß t¿o mái liên há 1-n tham chiếu đến các table khác. T¿i hàng id, cßt Action, Click chọn Primary, khi đó sẽ có màn hình confirm xuất hián, click Ok đß xác nhÁn. Trang 18/68 Giáo trình Lập trình web nâng cao Tạo 1 record dữ liệu: - Chọn table tin_xahoi click chọn tab Insert. - ä màn hình chèn record, điền dữ liáu t°¢ng tự nh° hình bên d°ái: - id: không cần điền, dữ liáu sẽ tự tăng.
- Các vị trí khác chỉ quan tâm đến tr°ãng Value - Click Go đß insert dữ liáu, nếu tất cÁ đúng sẽ xuất hián câu thông báo <rows inserted=, nếu báo lỗi thì xem thông báo lỗi đß chỉnh cho phù hợp. Trang 19/68 Giáo trình Lập trình web nâng cao - Click chọn tab Browser đß xem dữ liáu đ°ợc insert. Trang 20/68 Giáo trình Lập trình web nâng cao 2. Các thao tác xử lý trên c¡ sở dữ liáu 2.
Truy vấn lác dữ liáu Lệnh SELECT trong MySQL: Lánh SELECT có nhiám vÿ lấy danh sách dữ liáu cāa mßt hoặc nhiều bÁng trong database, tuy nhiên ph¿m vi cāa bài này chúng ta chỉ đề cÁp đến SELECT mßt table, trong bài học về JOIN chúng ta sẽ tìm hißu SELECT nhiều table. Cú pháp cāa lánh SELECT nh° sau: Trong đó: - SELECT field1, field2, field3,. là danh sách các fields cần lấy - FROM table_name tên table cần lấy - WHERE <dieu_kien_loc> là các điều kián đß lấy các dòng dữ liáu Trang 21/68 Giáo trình Lập trình web nâng cao - ORDER BY field_name, ASC|DESC: là cách sắp xếp cho field_name theo kißu ASC (tăng dần) hoặc DESC (giÁm dần) - LIMIT start, limit là lấy limit records kß từ record thứ start trong kết quÁ. Ví dÿ: Lấy danh sách sinh viên gãm các thông tin sv_id, sv_name, sv_description từ bÁng SINHVIEN.
Đß lấy tất cÁ các fields thì ta sử dÿng dấu sao (*). Lệnh SELECT có WHERE: Đß lọc danh sách sinh viên theo mßt tiêu chí nào đó thì ta sử dÿng thêm chức năng WHERE trong SELECT. Ví dÿ tôi muán lấy sinh viên có tên là 'Mr Kinh' thì tôi sẽ viết câu truy vấn nh° sau: BÁng các toán tử quan há thông dÿng: Các toán tử quan há chính là các toán tử thß hián mái quan há giữa hai vế (vế phÁi và vế trái). Trang 22/68 Giáo trình Lập trình web nâng cao Ví dÿ 1: Lấy danh sách sinh viên có sv_id lán h¢n 2.
Ví dÿ 2: Lấy danh sách sinh viên có tên không phÁi là Mr Cuong Ví dÿ 3: Lấy danh sách sinh viên có sv_id bé h¢n 3 BÁng các toán t° luÁn lý thông dÿng: Toán tử luÁn lý dùng đß thß hián suy luÁn giữa hai mánh đề (mánh đề trái, mánh đề phÁi) và từ đó trÁ về kết quÁ đúng hoặc sai. Trang 23/68 Giáo trình Lập trình web nâng cao Ví dÿ 1: Lấy danh sách sinh viên có sv_id > 1 và có tên là Mr Cuong Ví dÿ 2: Lấy danh sách sinh viên có id = 2 hoặc có tên là Mr Kinh Lệnh SELECT có ORDER BY: ORDER dùng đß sắp xếp kết quÁ trÁ về cāa câu truy vấn, nó có hai tham sá là tên field và kißu sắp xếp. Sau đây là cách dùng cāa cÁ hai tr°ãng hợp. Sắp xếp tăng dần: Sắp xếp giÁm dần: Trang 24/68 Giáo trình Lập trình web nâng cao Lênh SELECT có LIMIT: LIMIT dùng đß giái h¿n hết quÁ trÁ về và rất th°ãng hay sử dÿng kết hợp vái thuÁt toán phân trang đß tác đß website ch¿y nhanh h¢n.
Nó có hai tham sá đó là vị trí record cần lấy (start) và lấy bao nhiêu record (limit).