Đề cương công nghệ web và ứng dụng

TRƯỜNG ĐẠI HỌC SƯ PHẠM KỸ THUẬT HƯNG YÊN KHOA CÔNG NGHỆ THÔNG TIN CÔNG NGHỆ WEB VÀ ỨNG DỤNG TÀI LIỆU LƯU HÀNH NỘI BỘ Trang Trang MỤC LỤC 1.1 Giới thiệu về môn học 1.2 Lịch sử phát triển công nghệ web 10 1.2.1 Lịch sử đời công nghệ web 10 1.2.2 Các giai đoạn phát triển công nghệ web 11 1.3 Khái quát về công nghệ web 14 1.3.1 Khái niệm website 14 1.3.2 Các yêu cầu tối thiểu Webiste 14 1.4 Những thành phần cấu tạo nên một website 15 1.4.1 Ngôn ngữ siêu văn 15 1.4.2 Ngôn ngữ kịch 15 1.4.3 Các thành phần stypesheet 15 1.4.4 Ngôn ngữ xử lý liệu phía server 16 BÀI THIẾT KẾ WEBSITE VỚI HTML 20 2.1 Giới thiệu về HTML 20 2.1.1 Khái niệm 20 2.1.2 Ví dụ tạo file HTML 20 2.1.3 Sử dụng file với HTM hay HTML 21 2.2 Thành phần HTML 22 2.2.1 Các dạng thẻ HTML 22 2.2.2 Thành phần HTML 22 2.2.3 Các thuộc tính thẻ HTML 23 2.2.4 Các loại thẻ HTML 23 BÀI THIẾT KẾ WEBSITE VỚI HTML 32 3.1 Các loại thẻ nâng cao trong HTML 32 3.1.1 HTML layout 32 3.1.2 HTML Fonts 32 3.1.3 Frames 33 3.1.4 Bảng HTML 35 Trang 3.1.5 Forms trường nhập liệu 38 BÀI THẢO LUẬN: CÁC BƯỚC XÂY DỰNG WEBSITE 42 4.1 Tiếp cận dự án (Initiation) 42 4.2 Phân tích yêu cầu (Analisys, planning) 42 BÀI CASCADING STYLE SHEETS 43 5.1 Cơ bản về cascading style sheets 43 5.1.1 Khái niệm Cascading style sheets (CSS) 43 5.1.2 Cách sử dụng Style 43 5.2 Các loại Style trong ứng dụng website 47 5.2.1 Style Sheet "ngoại" (External Style) 47 5.2.2 Style sheet "nội" (Internal Style) 48 5.2.3 Style sheet "địa phương" (Inline Style) 49 5.2.4 Sự ưu tiên: 50 BÀI THẢO LUẬN VỀ XÂY DỰNG WEB SỬ DỤNG CSS 53 6.1 Các tiêu chí thiết kế giao diện website 53 6.1.1 Màu sắc 53 6.1.2 Khung nhin 53 6.2 Khuôn chữ 53 BÀI NGÔN NGỮ KỊCH BẢN JAVASCRIPT 54 7.1 Giới thiệu javascript 54 7.1.1 Giới thiệu javascript 54 7.1.2 Lịch sử phát triển 55 7.2 Đặc điểm ngôn ngữ javascript 55 7.2.1 Nhúng mã javascript trang HTML 55 7.2.2 Sử dụng thẻ SCRIPT 56 7.2.3 Sử dụng file nguồn JavaScript 57 7.2.4 Biến cách khai báo biến 59 7.2.5 Điều khiển rẽ nhánh javascript 62 7.2.6 Các điều khiển lặp javascript 64 Trang 7.2.7 Một số hàm thư viện javascript 66 7.2.8 Xây dựng hàm kiện javascript 82 7.2.9 Xây dựng đối tượng javascript 86 BÀI TRUY CẬP THÀNH PHẦN DỮ LIỆU VỚI JAVASCRIPT 94 8.1 Khái niệm DOM 94 8.2 Dùng DOM để truy xuất đến phần tử tài liệu HTML 97 8.3 Giới thiệu DHTML 97 8.3.1 Khái niệm 97 8.3.2 Cấu trúc trang DHTML 98 BÀI THẢO LUẬN CÁC BƯỚC XÂY DỰNG WEBSITE 100 BÀI 10 XÂY DỰNG TRANG WEB ĐỘNG 101 10.1 Cơ trang web động 101 10.1.1 Khái niệm trang web động 101 10.1.2 So sánh trang web động trang web tĩnh 102 10.2 Cấu trúc trang web 103 10.3 Ngôn ngữ thường dùng 103 10.3.1 Servlet 103 10.3.2 Servlet 103 10.3.3 ASP 104 10.3.4 PHP 104 10.3.5 ASP.NET 104 10.4 Giới thiệu ngôn ngữ ASP.NET 104 10.4.1 Khái niệm nguồn gốc xuất xứ 104 10.4.2 Những ưu điểm bật ASP.NET 105 10.5 Cách thức thực thi trang web động 106 10.5.1 Thực thi bên phía máy chủ với ASP.NET 106 10.5.2 Môi trường xây dựng 108 10.5.3 Cách thức xây dựng trang web động đơn giản 111 Trang BÀI 11 CÁC ĐỐI TƯỢNG ĐIỀU KHIỂN CƠ BẢN TRONG ASP.NET 118 11.1 Điều khiển (Standard control) 118 11.1.1 Label 119 11.1.2 Điều khiển Literal 119 11.1.3 HyperLink 119 11.1.4 TextBox 120 11.1.5 Image 121 11.2 Điều khiển hợp lệ liệu – Validation 121 11.2.1 RequiredFieldValidator 122 11.2.2 Điều khiển CompareValidator 123 11.2.3 Điều khiển RegularExpressionValidator 126 11.2.4 Điều khiển CompareValidator 128 11.2.5 Điều khiển CustomValidator 130 11.2.6 Điều khiển ValidationSummary 135 11.3 Điều khiển làm việc với CSDL (Data Control) 137 11.4 Điều khiển Navigation 137 11.5 Điều khiển Login 137 11.6 Điều khiển Webpart 137 11.7 Điều khiển làm việc với báo biểu 137 11.8 Điều khiển HTML 137 BÀI 12 CÁC ĐỐI TƯỢNG VÀ BIẾN TRONG ASP.NET 141 12.1 Respone 141 12.1.1 Đối tượng Response dùng để làm ? 141 12.1.2 Các thành phần (thuộc tính phương thức) 141 12.1.3 Ví dụ sử dụng 141 12.2 Request 142 12.2.1 Đối tượng Request dùng để làm ? 142 12.2.2 Các thành phần (thuộc tính phương thức) 142 Trang 12.2.3 Ví dụ sử dụng 143 12.3 Server 145 12.3.1 Đối tượng Server dùng để làm ? 145 12.3.2 Các thành phần (thuộc tính phương thức) 145 12.3.3 Ví dụ sử dụng 145 12.4 Application 146 12.4.1 Đối tượng Application dùng để làm ? 146 12.4.2 Khái niệm biến toàn ứng dụng 146 12.4.3 Đối tượng Application 146 12.5 Cookie 147 12.5.1 Cookie làm việc nào? 147 12.5.2 Tạo Cookies 148 12.5.3 Đọc liệu từ Cookies 150 12.5.4 Thiết lập thuộc tính cho Cookies 151 12.5.5 Xóa Cookies 152 12.5.6 Làm việc với Cookies nhiều giá trị: 152 12.6 Session 154 12.6.1 thêm liệu vào Session 154 12.6.2 Lấy liệu từ Session 155 12.6.3 Lưu trữ sở liệu Session 156 12.6.4 Sử dụng đối tượng Session 156 12.6.5 Điều khiển kiện Session 157 12.6.6 Điều khiển Session hạn 157 12.6.7 sử dụng Cookieless Session State 158 12.7 Sử dụng Profiles 159 12.7.1 Profiles dùng để làm gì? 159 12.7.2 Creating Profile Groups 162 12.7.3 Hỗ trợ người sử dụng nặc danh 164 Trang BÀI 13 KẾT 168 NỐI CƠ SỞ DỮ LIỆU TRONG TRANG WEB SỬ DỤNG ASP.NET 13.1 Tầm quan trọng việc sử dụng sở liệu 168 13.2 Kết nối CSDL sử dụng ADO.NET 168 13.2.1 Kiến trúc ADO.NET 170 Trang BÀI 1 GIỚI THIỆU VỀ CÔNG NGHỆ WEB 1.1 Giới thiệu về môn học Khái niệm website hình thành từ thập niên 90 mà trình duyệt vào giai đoạn hoàn thiện phát triển mạnh mẽ ngày Không có lí khiến hoài nghi lợi ích mà công nghệ web mang lại cho cho phát triển giới giai đoạn tương lai Liệu đến lúc công nghệ web hoàn toàn thay cho ứng dụng desktop Mới cộng đồng mã nguồn mở hi vọng đưa ứng dụng web đến gần với ứng dụng desktop Giả sử mong muốn họ trở thành thực mà ứng dụng web có đủ sức mạnh để thay cho ứng dụng Desktop công việc trở nên đơn giản nhiều Bạn thử tưởng tượng thay công ty có hàng trăm máy tính phải cài hàng trăm ứng dụng Desktop giống thay vào cài ứng dụng web để người dùng công ty mà họ có khả làm việc nhà Mọi trao đổi diễn môi trường web, công việc ngày thực dựa tảng công nghệ web phần mềm kết nối môi trường internet xong điều chưa phổ biến Chúng ta hoàn toàn tin tưởng vào tương lai phát triển mạnh mẽ công nghệ web Mới số ý tưởng cho phải cài đặt hệ điều hành khởi động từ máy tính trình duyệt web tương đương với hệ điều hành sử dụng để thay cho hệ điều hành Mặc dù ý tưởng chưa thành thực xong cho thấy khả ứng dụng rộng rãi công nghệ web tương lai mà người muốn hướng tới Chính lợi ích module vào tìm hiểu chi tiết nguyên lý để xây dựng ứng dụng tảng công nghệ web Qua xây dựng website cho riêng phát triển để sau trường có kiến thức định lĩnh vực xây dựng website cho doanh nghiệp tương lai Module cung cấp kiến thức HTML (Ngôn ngữ sử dụng phổ biến trình duyệt web thành phần thiếu), CSS (Cascading style sheet công cụ xây dựng giao diện cho website), Javascript (Công cụ hỗ trợ việc tạo hiệu ứng toán phía trình duyệt), ASP.NET (Ngôn ngữ xây dựng website động tiên tiến vào bậc nay….) bắt tay xây dựng khâu việc xây dựng website hoàn chỉnh Trang 1.2 Lịch sử phát triển công nghệ web 1.2.1 Lịch sử ra đời của công nghệ web 6/8/1991 ngày đáng nhớ thời điểm mã máy tính "non nớt" cho www đăng alt.hypertext để người tải tìm hiểu Cũng hôm công nghệ web giới biết đến Jeff Groff, người tham gia viết mã với Berners-Lee, cho biết ý tưởng tạo dựng web thực hình thành đơn giản: "Chúng nghĩ người sử dụng không cần phải xoay sở với vấn đề kỹ thuật phức tạp" Web giống khăn trải giường với nhiệm vụ cố che phủ rắc rối liệu lưu hành Internet Paul Kunz, nhà khoa học thiết lập máy chủ web châu Âu vào tháng 12/1991, cho biết đầu thập niên 90, máy tính giống "ốc đảo" thông tin Một lần đăng nhập truy cập tài nguyên hệ thống Chuyển sang máy tính khác đồng nghĩa với việc họ phải đăng nhập thêm lần phải sử dụng lệnh khác để truy xuất liệu Web lôi kéo ý Kunz ông chứng kiến Berners-Lee trình diễn khả hoạt động web hệ thống IBM Sau đó, Kunz thiết lập máy chủ web, cho phép chuyên gia vật lý rà soát 200.000 liệu dễ dàng hết Tuy nhiên, dù nhà vật lý bị web quyến rũ, đa số người lại không nhận biết khả tiềm ẩm Kunz cho điều nhiều tổ chức thực ý tưởng tương tự Công nghệ tiếng Gopher Đại học Minnesota (Mỹ), với tham vọng hóa giải phức tạp máy tính kết nối Internet Gopher mắt vào mùa xuân năm 1991 lưu thông Gopher cao hẳn so với lưu thông web vài năm Trong thời gian đó, Berners-Lee, Jeff Groff đồng nghiệp tích cực giới thiệu phát minh họ hội thảo, gặp gỡ Dự án www thực thăng hoa chuyên gia Marc Andreessen thuộc Đại học Illinois (Mỹ) giới thiệu trình duyệt web máy tính vào tháng 4/1993 Trình duyệt Mosaic thành công số tính coi quy ước công nghệ web ngày Cũng vào năm 1993, Đại học Minnesota thu phí Sự phát triển công Gopher khiến người ta bắt đầu phải tìm đến giải nghệ web so với Gopher pháp thay Nguồn: MIT Ngoài ra, theo Ed Vielmetti, nhà nghiên cứu Trang 10 if (sqlconn.State != ConnectionState.Open) { sqlconn.Open(); } } catch (Exception exp) { HttpContext.Current.Response.Write("Lỗi exp.ToString()); mở liệu" + } } #endregion //phuong thuc dong du lieu #region closedata() "Đóng liệu" public static void closedata() { if (sqlconn.State != ConnectionState.Closed) { sqlconn.Close(); sqlconn.Dispose(); } } Trang 198 #endregion // điền liệu vào DataTable từ thủ tục Database public static DataTable FillDatatable(string store,string _thamso, string _giatri) { opendata(); DataTable datatable = new DataTable(); sqlcom = new SqlCommand(); sqlcom.CommandText = store; sqlcom.Connection = sqlconn; _giatri); sqlcom.Parameters.AddWithValue(_thamso, sqlcom.CommandType CommandType.StoredProcedure; = try { sqladapter = new SqlDataAdapter(sqlcom); sqladapter.Fill(datatable); sqladapter.Dispose(); } finally { closedata(); } Trang 199 return datatable; } } } Trong lớp bạn thấy có đối tượng data DataAdapter DataTable học kỹ phần sau ví dụ bạn cần hiểu qua DataAdapter đọc liệu từ nguồn liệu, DataTable đối tượng lưu trữ liệu không kết nối, bảng tạm để chứa liệu ko cần biết liệu từ nguồn Bước 4: Tạo giao diện sử dụng Code: adminIntrodure.aspx style="padding:15px 15px 15px 15px" Trang 200 width="100%" cellpadding="0" Giới thiệu ID="txtNoidung" Vị trí ID="txtvitri" Trang 202 Trang 203 Trang 205 ID="lblthongbao" Trang 206 Code adminIntrodure.aspx.cs using System; using System.Data; using System.Configuration; using System.Collections; using System.Web; using System.Web.Security; using System.Web.UI; using System.Web.UI.WebControls; using System.Web.UI.HtmlControls; using Website.Library; using Website.Modules.Introdure; Trang 207 public partial class Desktop_Introdure_adminIntrodure : System.Web.UI.Page { string ssql; void Loaddatagrid() { ssql = "select pkIntrodureID,sTitle,iPosition from tblIntrodure"; DatagridHelper.fill_datagrid(gridintro, ssql, "pkIntrodureID"); foreach this.gridintro.Items) (DataGridItem item in { LinkButton lbn = (LinkButton)this.gridintro.Items[item.ItemIndex].FindCon trol("Delete"); "javascript:return giới thiệu này')"); lbn.Attributes.Add("onclick", confirm('Bạn có chắn xoá mục } } protected EventArgs e) void Page_Load(object sender, { if (!IsPostBack) { Loaddatagrid(); } Trang 208 } private IntrodureInfo Getcontent() { IntrodureInfo intro = new IntrodureInfo(); try { intro.pkIntrodureID int.Parse(lblidintro.Text); = } catch { } intro.sTitle = txtTitle.Value; intro.sSumary = txtTomtat.Text; intro.sContent = txtNoidung.Text; intro.iPosition = int.Parse(txtvitri.Text); return intro; } protected EventArgs e) void btnaddnew_Click(object sender, { panelupdate.Visible = true; panelview.Visible = false; Trang 209 txtNoidung.Text = ""; txtTitle.Value = ""; this.txtTomtat.Text = ""; txtvitri.Text = "1"; btnaccept.Text = "Ghi"; } protected void gridintro_OnItemCommand(object sender, DataGridCommandEventArgs e) { lblidintro.Text e.CommandArgument.ToString(); = if (e.CommandName == "Edit") { IntrodureInfo IntrodureDB.Getinfo(lblidintro.Text); introdure = txtTitle.Value = introdure.sTitle; txtTomtat.Text = introdure.sSumary; txtvitri.Text introdure.iPosition.ToString(); = txtNoidung.Text = introdure.sContent; btnaccept.Text = "Cập nhật"; panelupdate.Visible = true; panelview.Visible = false; } else Trang 210 { IntrodureDB.Delete(lblidintro.Text); Loaddatagrid(); } } protected EventArgs e) void btnaccept_Click(object sender, { IntrodureInfo introdure = Getcontent(); if (btnaccept.Text == "Ghi") { IntrodureDB.Insert(introdure); } else { IntrodureDB.Update(introdure); } panelupdate.Visible = false; panelview.Visible = true; Loaddatagrid(); } protected EventArgs e) void btcancel_Click(object sender, Trang 211 { panelview.Visible = true; panelupdate.Visible = false; Loaddatagrid(); } protected sender, EventArgs e) void lbncapnhatvitri_Click(object { foreach (DataGridItem item in gridintro.Items) { TextBox txt = (TextBox)this.gridintro.Items[item.ItemIndex].FindContro l("txtVitri"); IntrodureDB.UpdateIndex(gridintro.DataKeys[item.ItemInde x].ToString(), txt.Text); } } } Trang 212 ... Lịch sử phát triển công nghệ web 10 1.2.1 Lịch sử đời công nghệ web 10 1.2.2 Các giai đoạn phát triển công nghệ web 11 1.3 Khái quát về công nghệ web 14 1.3.1 Khái niệm website ... đến lúc công nghệ web hoàn toàn thay cho ứng dụng desktop Mới cộng đồng mã nguồn mở hi vọng đưa ứng dụng web đến gần với ứng dụng desktop Giả sử mong muốn họ trở thành thực mà ứng dụng web có... cho ứng dụng Desktop công việc trở nên đơn giản nhiều Bạn thử tưởng tượng thay công ty có hàng trăm máy tính phải cài hàng trăm ứng dụng Desktop giống thay vào cài ứng dụng web để người dùng công