Mục tiêu của bài giảng Nắm vững các khái niệm căn bản của quá.trình thiết kế, cài đặt và triển khai 1 ứng dụng web; thiết kế và cài đặt 1 ứng dụng web hoàn chỉnh bằng PHP; triển khai ứng dụng web trên intranet, internet; một số kỹ thuật an toàn và bảo mật cho website. Mời các bạn cùng tham khảo bài giảng.
Trang 1PHÁT TRIỂN ỨNG DỤNG WEB
ThS Nguyễn Hồ Minh Đức
Trang 2Giới thiệu môn học
Mục tiêu:
Nắm vững các khái niệm căn bản của quá
trình thiết kế, cài đặt và triển khai 1 ứng
Trang 3Giới thiệu môn học
Nội dung môn học:
Giới thiệu về internet và những nguyên lý cơ
bản trong thiết kế web
Trang 4Giới thiệu môn học
Tài liệu tham khảo:
Bài giảng, bài tập:
http://itam.tut.edu.vn/courses
www.w3schools.com
www.php.net
http://msdn.microsoft.com/library/
Trang 5Giới thiệu môn học
SV đăng ký nhóm (2-4 người) báo cáo các
chuyên đề nhỏ liên quan đến nội dung môn
học
Trang 6Giới thiệu môn học
Liên hệ:
Nguyễn Hồ Minh Đức: duc.tdt@gmail.com ,
P209, khoa CNTT&TUD, ĐH Tôn Đức Thắng
Trang 7CHƯƠNG I GIỚI THIỆU VỀ WEB
Trang 8CÁC KHÁI NIỆM CƠ BẢN
Internet :
một hệ thống thông tin toàn cầu có thể được truy nhập công cộng gồm các mạng máy tính được liên kết với nhau
Hệ thống này truyền thông tin theo kiểu nối chuyển gói
dữ liệu (packet switching) dựa trên một giao thức liên
mạng đã được chuẩn hóa ( giao thức IP )
Intranet : là mạng cục bộ không nối vào Internet, truyền thông bằng giao thức TCP/IP
Mô hình Client-Server: mô hình khách-chủ
Server chứa tài nguyên dùng chung cho nhiều
Trang 9CÁC KHÁI NIỆM CƠ BẢN
Internet Service Provider (ISP): Nhà cung
cấp dịch vụ Internet cho khách hàng Mỗi ISP
dịch vụ Internet khác nhau.
Internet Protocol: tiêu chuẩn chi phối việc
chuyển tải thông tin giữa các máy tính trong
mạng
Trang 11CÁC KHÁI NIỆM CƠ BẢN
Web Browser: trình duyệt Web Dùng để truy xuất các tài liệu trên các Web Server
– Internet Explorer, FireFox, Opera, Safari,
Chrome,…
Home page: là trang web đầu tiên trong web
site
Hosting provider: là công ty hoặc tổ chức
đưa các trang của chúng ta lên mạng
Publish: Xuất bản trang web
Trang 12CÁC KHÁI NIỆM CƠ BẢN
Web server là một chương trình đáp ứng yêu cầu
truy xuất tài nguyên
Webserver là dạng phần mềm cài trên máy server để phục
vụ quản lý các website
Ví dụ : apache, iis,…
World Wide Web , gọi tắt là Web hoặc WWW , mạng
lưới toàn cầu là một không gian thông tin toàn cầu
mà mọi người có thể truy nhập (đọc và viết) qua các
máy tính nối với mạng Internet Thuật ngữ này
thường được hiểu nhầm là từ đồng nghĩa với chính
thuật ngữ Internet Nhưng Web thực ra chỉ là một
trong các dịch vụ chạy trên Internet (wikipedia)
Trang 13CÁC KHÁI NIỆM CƠ BẢN
URL , viết tắt của Uniform Resource Locator, được dùng để
tham chiếu tới tài nguyên trên Internet
URL mang lại khả năng siêu liên kết cho các trang mạng
Một URL gồm có nhiều phần được liệt kê dưới đây:
URL scheme thường là Tên giao thức (ví dụ: http, ftp) nhưng cũng có thể là một cái tên khác (ví du: news, mailto)
Tên miền (ví dụ: http://hoadep.vn )
Trang 14GIỚI THIỆU KHÁI QUÁT VỀ WEB
Web Page: là một file văn bản chứa những tag
duyệt web có thể hiểu và thông dịch được, file
được lưu với phần mở rộng là html hoặc htm.
Website: Một tập hợp nhiều web page, thể hiện
đó
Trang 15GIỚI THIỆU KHÁI QUÁT VỀ WEB
chuẩn được quy ước để thiết kế Web và được hiển thị bởi
trình duyệt Web
Hypertext (Hypertext link) là một từ hay một cụm từ đặc
biệt dùng để tạo liên kết giữa các trang web
Markup: là cách định dạng văn bản để trình duyệt hiểu và
thông dịch được.
Language: tập những quy luật để định dạng văn bản trên trang web.
bất kỳ trình soạn thảo văn bản nào: Notepad,
FrontPage hoặc Dreamweaver,…
Trang 16TAG HTML
<tagName ListProperties> Object </tagName>
TagName : tên tag HTML, liền với dấu “< “,
không có khoảng trắng
Object :đối tượng hiển thị trên trang Web
ListPropeties : danh sách thuộc tính của Tag
Trang 17TAG HTML
Trang 19CẤU TRÚC CƠ BẢN CỦA TRANG WEB
Trang 20CÁC TAG HTML CƠ BẢN
1 <Title> : Hiển thị nội dung tiêu đề của trang web trên
thanh tiêu đề của trình duyệt
Cú pháp:
<TITLE> Nội dung tiêu đề </TITLE>
2 <H n >: Tạo header, gồm 6 cấp header, được đặt trong
Trang 213 <P> : Dùng để ngắt đoạn và bắt đầu đoạn mới
Cú pháp:
<P ALIGN = “ Direction ” >
Nội dung của đoạn
</P>
4 <BR>: Ngắt dòng tại vị trí của tag.
5 <HR>: K ẻ đường ngang trang
Cú pháp:
<HR Align=” directtion ” Width= “ Value ” Size= value color= #rrggbb >
Trang 226 <FONT>: định dạng font chữ
– Định dạng Font chữ cho cả tài liệu thì đặt
tag <Font> trong phần <Body>
– Định dạng từng phần hoặc từng từ thì đặt
tại vị trí muốn định dạng
Cú pháp:
fontName3” size=“ value ” Color=” rrggbb ” >
Nội dung hiển thị
</FONT>
Trang 237 <BODY > : Chứa nội dung của trang web
<BODY>
Nội dung chính của trang web
</BODY>
– BgColor : thiết lập màu nền của trang
– Text : thiết lập màu chữ
– Link : màu của siêu liên kết
– Vlink : màu của siêu liên kết đã xem qua
– Background : load một hình làm nền cho trang – LeftMargin : Canh lề trái
–
Trang 24<BODY BGCOLOR=” #0000FF ” text=” yellow ”>
<FONT COLOR= LIMEGRREN >
Welcome to HTML
</FONT>
</BODY>
</HTML>
Trang 258 <IMG> : Chèn một hình ảnh vào trang Web
Cú pháp:
<Img src=” URL of Image ” alt=” Text ”
width= value height= value border= value >
9 <BgSound> : Chèn một âm thanh vào trangWeb Âm
thanh này sẽ được phát mỗi khi người sử dụng mở trang Web.
Cú pháp:
<BgSound src=” filenhac ” Loop= value >
10 <EMBED>: Cho phép đưa âm thanh trực tiếp vào trang
Trang 2710 <Marquee></Marquee> : Điều khiển đối tượng
chạy một cách tự động trên trang Web
Cú pháp:
<Marquee> Object </Marquee>
11 <! Ghi chú >: không hiển thị trong trang
Cú pháp:
<! Nội dung lời chú thích >
12 <B>: định dạng chữ đậm
Cú pháp
Trang 2813 Tag <I>: Định dạng chữ nghiêng
Cú pháp :
<I> Nội dung chữ nghiêng </I>
14 Tag <U>: Gạch chân văn bản
Cú pháp:
<U> Nội dung chữ gạch chân </U>
15 Tag <BIG> và <SMALL>: Chỉnh cở chữ to
hoặc nhỏ hơn cở chữ xung quanh
Cú pháp
<BIG> Nội dung chữ to </BIG>
<SMALL> Nội dung chữ nhỏ </SMALL>
Trang 2916 Tag <SUP> và <SUB> : Đưa chữ lên cao hoặc
xuống thấp so với văn bản bình thường
Cú pháp:
<SUP> Nội dung chữ dưa lên cao </SUP>
<SUB> Nội dung chữ đưa xuống thấp
Trang 30A = A + 1
Trang 3119 <EM>: Văn bản được nhấn mạnh (giống tag <I>)
Trang 32Cú pháp:
<BLOCKQUOTE>
Nội dung khối văn bản nhấn mạnh
</BLOCKQUOTE>
22 <PRE>: Giữ nguyên các định dạng như: ngắt dòng,
khoảng cách, thích hợp với việc tạo bảng
Trang 3423 <DIV> <SPAN>: Chia văn bản thành các khối,
Trang 35Ví dụ:
<HTML>
<HEAD><TITLE> Learning HTML </TITLE></HEAD>
<BODY>
<DIV align = cente r>
<FONT size = 4 color = hotpink face = Arial >
Trường Đại Học Tôn Đức Thắng<br>
Trang 36<SPAN STYLE = “FONT-SIZE:25; Color:BLUE”>
Creating Web Pages
</SPAN><font size=6 color=red > With HTML</font>
</BODY>
</HTML>