UBND TỈNH QUẢNG NAM TRƯỜNG ĐẠI HỌC QUẢNG NAM KHOA C ÔNG NGHỆ THÔNG TIN ----- ----- SANTIPHAB PHOMMALAYSY XÂY DỰNG WEBSITE DU LỊCH LÀO VỚI CSS KHÓA LUẬN TỐT NGHIỆP ĐẠI HỌC Quảng Nam, tháng 6 năm 20 20 UBND TỈNH QUẢNG NAM TRƯỜNG ĐẠI HỌC QUẢNG NAM KHOA C ÔNG NGHỆ THÔNG TIN ----- ----- KHÓA LUẬN TỐT NGHIỆP ĐẠI HỌC Tên đề tài: XÂY DỰNG WEBSITE DU LỊCH LÀO VỚI CSS Sinh viên thực hiện SANTIPHAB PHOMMALAYSY MSSV: 2116100147 CHUYÊN NGÀNH: LẬP TRÌNH WEB KHÓA 2016 - 2020 Cán bộ hướng dẫn ThS LÊ THỊ NGUYÊN AN MSCB: 1000 Quảng Nam, tháng 6 năm 20 20 MỤC LỤC Phần 1 MỞ ĐẦU Error! Bookmark not defined Lý do chọn đề tài: Error! Bookmark not defined 1 2 Mục tiêu của đề tài Error! Bookmark not defined 1 3 Đối tượng và phạm vi nghiên cứu Error! Bookmark not defined 1 4 Phương pháp nghiên cứu Error! Bookmark not defined 1 5 L ịch sử nghiên cứu Error! Bookmark not defined 1 6 Đóng góp c ủ a đ ề tài Error! Bookmark not defined 1 7 Cấu trúc đề tài Error! Bookmark not defined Chương 1:CƠ SỞ LÝ THUYẾT Error! Bookmark not defined 1 1 CÁC KHÁI NIỆM CƠ BẢN Error! Bookmark not defined 1 1 1 URL Error! Bookmark not defined 1 1 2 HTTP Error! Bookmark not defined 1 1 3 Word Wide Web Error! Bookmark not defined 1 1 4 Giới thi ệu ngôn ngữ HTML Error! Bookmark not defined 1 1 5 Cấu trúc cơ bản của một file HTML Error! Book mark not defined 1 2 NGÔN NGỮ CSS Error! Bookmark not defined 1 2 1 Giới thiệu Error! Bookmark not defined 1 2 2 Cú pháp của CSS Error! Bookmark not defined 1 3 CÔNG CỤ SỬ DỤNG Error! Bookmark not defined 1 3 1 Notepad++ Error! Bookmark not defined Chương 2 PHÂN TÍCH & THIẾT KẾ HỆ THỐNG 21 2 1 PHÂN TÍCH & THIẾT KẾ HỆ THỐNG 21 2 1 1 ĐẶC TẢ BÀ I TOÁN 21 2 1 2 DANH SÁCH CÁC TÁC NHÂN 22 2 2 ĐẶC TẢ CÁC ÚC 22 2 3 BIỂU ĐỒ UC CHI TIẾT 23 2 3 1 Biểu đồ UC tổng quát 24 2 3 2 Biểu đồ hoạt động 25 2 3 3 Biểu đồ tuần tự 26 CHƯƠNG 3 DEMO CHƯƠNG TRÌNH 27 Phần 3 KẾT LUẬN 30 Phần 4 TÀI LIỆU THAM KHẢO 31 LỜI CẢM ƠN Đầu tiên, em xin gửi lời mời cảm ơn sâu sắc tới cô Th S Lê Thị Nguyên A n ,cô đã n hiệt tình giúp đỡ và hướng dẫn em trong quá trình thực hiện khóa luận này Em xin gửi đến quý t hầy cô đang giảng dạy tại T rường Đại học Quảng Nam nói chung và thầy cô trong khoa công nghệ thông tin nói rieeng lời biết ơn chân thành ,cảm ơn thầy cô vì đã hết lòng truyền đạt chio em những kiến thức trong nh ững năm thán ngôi trên ghế nhà trường Kính chúc quý thầy cô luôn mạnh khỏe,gặt hái được nhiều thành công trong sự nghiệp Dù đã cố gắng hết sức thực hiện đề tài nhưng cũng khó tránh khỏi thiếu sót,em rất mong nhận được sự gót ý của quý thầy cô,các anh chị và các bạn để bản thân Quảng Nam, tháng 4 năm 2020 Sinh viên thực hiện Santiphab Phommalaysy 1 II NỘI DUNG ĐỀ TÀI Phần 1 MỞ ĐẦU 1 1 Lý do chọn đề tài: Lào – đất nước láng giềng xinh đẹp và bình yên, mê hoặc du khách với những ngôi chùa tôn nghiêm, những thác nước tuyệt đẹp, những pho tượng phật nhiều hình dáng độc đáo và nụ cười thân thiện, hiếu khách của người dân Với những nét văn hóa đặc sắc, những ngôi chùa với lối kiến trúc đặc biệt, những món ăn ngon phù hợp với khẩu vị Việt Nam Lào đang là một điểm đến được rất nhiều bạn trẻ lựa chọn trong chuyến hành trình khám phá của mình Với việc xây dựng Website nói chung, và xây website du lịch Lào với CS S Mục đích là để nhắm vào tất cả mọi người hay mọi nước trong Đông Nam Á biết nơi du lịch, phong tục tập quán, tiếng nói, món ăn ngon đặc sản, tính cách của con người Lào Như vậy, để có cái nhìn toàn cảnh về chuyên đề này, khóa luận đi sâu vào nghiên cứu trên đề tài: “Xây dựng website du lịch Lào với CSS” 1 2 Mục tiêu của đề tài Nắm vững những kiến thức về nội dung chính, hiểu được về HTML, CSS, và các công cụ thiết kế web Biết vận dụng những kiến thức vào xây dựng trang thông tin điện tử (Website) 1 3 Đối tượng và phạm vi nghiên cứu Ứng dụng các kiến thức về nội dung chính, hiểu được về HTML, CSS, Biết vận dụng những kiến thức vào xây dựng trang Web 1 4 Phương pháp nghiên cứu Em đi sâu nghiên cứu vào nội dung chính của đề tài khóa luận tốt nghiệp, tìm hiểu ngôn ngữ HTML, CSS, áp dụng xây dựng trang Website vào việc quảng cáo và tự hào đất nước mình 1 5 Lịch sử nghiên cứu - Nội dung đã được dạy và học ở học phần phân tích thiết kế Website - Có nhiều người cũng như các nhóm nghiên cứu đã ch ọn kiến thức này làm nội dung cho đề tài nghiên cứu của họ 2 1 6 Đóng góp của đề tài Khóa luận tóm tắt các kiến thức về sự thiết kế và sử dụng tin tức nơi du lịch và phong tục tập quán của đất nước Lào 1 7 Cấu trúc đề tài Chương 1: Cơ sở lý thuyết Chươn g này trình bày các khái niệm cơ bản về web, ngôn ngữ và phần mềm hỗ trợ được sử dụng trong quá trình thiết kế website Chương 2: Phân tích & thiết kế hệ thống Chương này đặc tả bài toán sau đó phân tích và thiết kế, xây dựng hệ thống Chương 3: Demo chươ ng trình 3 Phần 2 NỘI DUNG NGHIÊN CỨU Chương 1: CƠ SỞ LÝ THUYẾT 1 1 CÁC KHÁI NIỆM CƠ BẢN 1 1 1 URL URL viết tắt của (Uniform Resource Locator), URL cung cấp một cách chính xác để xác định vị trí một nguồn tài nguyên trên web, các hệ thống hoạt động trên internet URL chứa tên của giao thức sử dụng để truy cập vào tài nguyên và tên của tài nguyên Phần đầu tiên của một URL xác định giao thức nào được sử dụng Phân thứ hai xác định địa chỉ IP hoặc tên miền nơi có tài nguyên năm Giao thức URL bao gồm HTTP (Hypertext Tra nsfer Protocol) và HTTPS (HTTP Secure) cho tài nguyên web, “mailto” cho các địa chỉ email, “ftp” cho các tập tin trên File Transfer Protocol server , và telnet cho một phiên truy cập máy tính từ xa Một URL được sử dụng chủ yếu để trỏ đến một trang web, mộ t thành phần của một trang web hoặc một chương trình trên một trang web Tên tài nguyên của URL bao gồm: • Một tên miền xác định một máy chủ hoặc các dịch vụ web • Một tên chương trình hoặc một đường dẫn đến tập tin trên máy chủ Ví dụ, https://www mona - media com/project/instagetter/index html Các nguồn tài nguyên sẽ được lấy ra bằng cách sử dụng giao thức HTTPS Các nguồn tài nguyên có được thông qua tên miền (DNS) www mona - media com Và đường dẫn đến tài nguyên cụ thể là /project/instagetter/index html 1 1 2 HTTP Với những người thường xuyên sử dụng internet, cụm từ HTTP có lẽ đã trở nên quá quen thuộc Nó quen thuộc đến nỗi nhiều người thường xuyên đọc và sử dụng chúng nhưng lại không hề biết đến ý nghĩa của cụm từ này Vậy HTTP kỳ thực là gì? HTTP là chữ viết tắt của HyperText Transfer Protocol (giao thức truyền tải siêu văn bản) Đây là một giao thức ứng dụng trong bộ các giao thức TCP /IP (gồm một nhóm các giao thức nền tảng cho internet) 4 Hình 1 1 Mô hình hoạt động của HTTP HTTP hoạt động dựa trên mô hình Client - Server Trong mô hình này, các máy tính của người dùng sẽ đóng vai trò làm máy khách (Client) Sau một thao tát nào đó của người dùng, các máy khách sẽ gửi yêu cầu đến máy chủ (Server) và chờ đợi câu trả lời từ những máy chủ này Để có thể nói chuyện được với nhau, các máy chủ và máy khách phải thực hiện việc trao đổi thông qua các giao thức Một trong những giao thức được sử dụng thường xuyên nhất chính là HTTP HTTP là chữ viết tắt của HyperText Transfer Protocol (giao thức truyền tải siêu văn bản) Đây là một giao thức ứng dụng trong bộ các giao thức TCP/IP (gồm một nhóm các giao thức nền tảng cho internet) Khi bạn gõ m ột địa chỉ Web URL vào trình duyệt Web, một lệnh HTTP sẽ được gửi tới Web server để ra lệnh và hướng dẫn nó tìm đúng trang Web được yêu cầu Trang Web này sau đó sẽ được kéo về và mở trên trình duyệt Web Nói đơn giản hơn, HTTP là giao thức giúp cho việc t ruyền tải file từ một Web server vào một trình duyệt Web để người dùng có thể xem một trang Web đang hiện diện trên trình duyệt • ĐIỀU NGƯỜI DÙNG INTERNET CẦN LƯU Ý Rõ ràng việc sử dụng giao thức HTTPS giúp tăng cường khả năng bảo mật và phòng vệ đáng kể cho người dùng internet Cũng chính bởi điều này, các hệ thống ngân hàng, tổ chức tín dụng đều sử dụng giao thức HTTPS trên các Website của mình Điều này cũng đã được sự hưởng ứng của cả Google và Facebook Với người dùng internet, điều mà bạn cần lưu ý khi truy nhập vào các hệ thống thanh toán điện tử hoặc các website yêu cầu việc nhập liệu những thông tin nhạy cảm về người dùng nằm ở chính giao thức mà Website đó sử dụng Ở các doanh nghiệp 5 hoặc các hệ thống thanh toán điện tử uy tín, việc sử dụng gia o thức HTTPS gần như là một trong những yêu cầu bắt buộc đối với các doanh nghiệp này Bởi vậy việc không sử dụng giao thức HTTPS đồng nghĩa với việc bạn phải xếp website đó vào diện nghi vấn Rất có thể, đây chỉ là một trang Web giả danh nhằm lấy đi thôn g tin về tài khoản của bạn Đề kiểm tra một Website có sử dụng giao thức HTTPS hay không cũng vô cùng đơn giản Các bạn chỉ cần để ý đến phần link đường dẫn khi truy nhập vào Website mở đầu bằng http:// hay https:// Bên cạnh đó, link đường dẫn của các Web site có sử dụng giao thức HTTPS thường đi kèm với một biểu tượng nhỏ hình ổ khóa Khi đưa con trỏ chuột hướng vào biểu tượng này, trên đó sẽ hiện ra tên của đơn vị xác thực như đã nói ở trên Đây là dấu hiệu cho thấy Website mà bạn đang truy nhập không phả i là giả mạo Chỉ như vậy thôi rõ ràng là chưa đủ cho việc đảm bảo an toàn thông tin trên internet Tuy nhiên với những điều cơ bản này, các bạn cũng sẽ phần nào hiểu được cách thức mà các Website hoạt động và có cho mình những kinh nghiệm cơ bản nhất để t ự bảo vệ chính bản thân mình 1 1 3 Word Wide Web World Wide Web là mạng lưới nguồn thông tin cho phép ta khai thác thông qua một số công cụ, chương trình hoạt động dưới các giao thức mạng World Wide Web là công cụ, phương tiện hay đúng hơn là một dịch vụ của Internet • Lịch sử trang web World Wide web đã được tạo ra vào năm 1990 của CERN bởi kỹ sư Tim Berners - Lee Ngày 30 tháng từ năm 1993, CERN thông báo rằng World Wide web sẽ được miễn phí để sử dụng cho bất cứ ai Trước khi giới thiệu về HTML và các gi ao thức HTTP và các giao thức khác như FTP, được sử dụng để lấy các tập tin cá nhân từ một máy chủ Những giao thức này cung cấp một cấu trúc thư mục đơn giản mà người sử dụng chuyển và chọn các tập tin để tải về Văn bản được thường xuyên nhất được trì nh bày như là các tập tin văn bản thuần tuý mà không có định dạng hoặc đã được mã hoá trong trình xử lý các định dạng 6 • Phân loại website là công việc của một cá nhân, một doanh nghiệp hoặc các tổ chức, và thường dành riêng cho một số chủ đề cụ thể hoặc mụ c đích Bất kỳ trang web có thể chứa một siêu liên kết vào bất kỳ trang web khác, do đó, phân biệt các trang web cá nhân, như cảm nhận của người sử dụng Tạm thời phân loại như sau: Trang web cá nhân Trang web thương mại Trang web của chính phủ Trang web t ổ chức phi lợi nhuận Trình duyệt web Trình duyệt web là một phần mềm ứng dụng cho phép người sử dụng xem và tương tác với các văn bản, hình ảnh, đoạn phim, nhạc, trò chơi và các thông tin khác ở trên một trang web của một địa chỉ web trên mạng toàn cầu hoặ c mạng nội bộ Văn bản và hình ảnh trên một trang web có thể chứa siêu liên kết tới các trang web khác của cùng một địa chỉ web hoặc địa chỉ web khác Trình duyệt web cho phép người sử dụng truy cập các thông tin trên các trang web một cách nhanh chóng và dễ dàng thông qua các liên kết đó Trình duyệt web đọc định dạng HTML để hiển thị, do vậy một trang web có thể hiển thị khác nhau trên các trình duyệt khác nhau Một số trình duyệt web hiện nay cho máy tính cá nhân bao gồm Internet Explorer, Mozilla Firefo x, Safari, Opera, Avant Browser, Konqueror, Lynx, Google Chrome, Flock, Arachne, Epiphany, K - Meleon và AOL Explorer 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ụ chay trên Internet, chẳng hạn như dịch vụ thư điện tử Web được phát minh và đưa vào sử dụng vào khoảng năm 1990, 1991 bởi viện sĩ Viện Hàn lâm Anh Tim Berners - Lee và Robert Cailliau (Bỉ) tại CERN, Geneva, Switzerland Các tài liệu trên World Wide Web được lưu trữ trong một hệ thống siêu văn bản (hypertext), đặt tại các máy tính trong mạn g Internet Người dùng phải sử dụng 7 một chương trình được gọi là trình duyệt web (web browser) để xem siêu văn bản Chương trình này sẽ nhận thông tin (documents) tại ô địa chỉ (address) do người sử dụng yêu cầu (thông tin trong ô địa chỉ được gọi là tên m iền (domain name), rồi sau đó chương trình sẽ tự động gửi thông tin đến máy chủ (Web Server)và hiển thị trên màn hình máy tính của người xem Người dùng có thể theo các liên kết siêu văn bản (hyperlink) trên mỗi trang web để nối với các tài liệu khác hoặc gửi thông tin phản hồi theo máy chủ trong một quá trình tương tác Hoạt động truy tìm theo các siêu liên kết thường được gọi là duyệt Web Quá trình này cho phép người dùng có thể lướt các trang web để lấy thông tin Tuy nhiên độ chính xác và chứng thực của thông tin không được đảm bảo 1 1 4 Giới thiệu ngôn ngữ HTML Ngôn ngữ HTML (HyperText Markup Language – ngôn ngữ siêu văn bản) là một trong các loại ngôn ngữ được sử dụng trong lập trình web Khi truy cập một trang web cụ thể là click vào các đường link, bạn sẽ được dẫn tới nhiều trang các nhau và các trang này được gọi là một tài liệu HTML (tập tin HTML) Một trang HTML như vậy được cấu thành bởi nhiều phần tử HTML nhỏ và được quy định bằng các thẻ tag Bạn có thể phân biệt một trang web được viết b ằng ngôn ngữ HTML hay PHP thông qua đường link của nó Ở cuối các trang HTML thường hay có đuôi là HTML hoặc HTM Hình 1 2 Mô hình của HTML Một trang HTML được cấu thành bởi nhiều phần tử HTML nhỏ và được quy định bằng các thẻ tag HTML là ngôn ngữ lập t rình web được đánh giá là đơn giản Mọi trang web, mọi trình duyệt web đều có thể hiển thị tốt ngôn ngữ HTML Hiện nay, phiên bản mới 8 nhất của HTML là HTML 5 với nhiều tính năng tốt và chất lượng hơn so với các phiên bản HTML cũng Vậy, đối với các website , ngôn ngữ HTML đóng vai trò như thế nào ? HTML, theo đúng nghĩa của nó, là một loại ngôn ngữ đánh dấu siêu văn bản, thế nên các chức năng của nó cũng xoay quanh yếu tố này Cụ thể, HTML giúp cấu thành các cấu trúc cơ bản trên một website (chia khung sườn, bố cục các thành phần trang web) và góp phần hỗ trợ khai báo các tập tin kĩ thuật số như video, nhạc, hình ảnh Hình 1 3 Mô hình hoạt động JavaScript,CSS,HTML Ưu điểm nổi trội nhất và cũng là thế mạnh của HTML là khả năng xây dựng cấu trúc và làm cho we bsite trở thành một hệ thống hoàn chỉnh Ưu điểm nổi trội nhất và cũng là thế mạnh của HTML là khả năng xây dựng cấu trúc và khiến trang web đi vào quy củ một hệ thống hoàn chỉnh Nếu bạn mong muốn sở hữu một website có cấu trúc tốt có mục đích sử dụng nh iều loại yếu tố trong văn bản, hãy hỏi HTML Nhiều ý kiến cho rằng tùy theo mục đích sử dụng mà lập trình viên hay người dùng có thể lựa chọn ngôn ngữ lập trình riêng cho website của bạn, tuy nhiên thực chất HTML chứa những yếu tố cần thiết mà dù website c ủa bạn có thuộc thể loại nào, giao tiếp với ngôn ngữ lập trình nào để xử lý dữ liệu thì nó vẫn phải cần đến ngôn ngữ HTML để hiển thị nội dung cho người truy cấp Nói đúng hơn, dù website của bạn được xây dựng như thế nào, trên nền tảng nào thì nó cũng c ần đến sự hỗ trợ của HTML, dù ít dù nhiều Đối với các lập trình viên hay nhà phát triển web, họ đều phải học HTML như một loại ngôn ngữ cơ bản trước khi bắt tay vào thiết kế trang web nào 1 1 5 Cấu trúc cơ bản của một file HTML Cấu trúc cơ bản của HTML 9 Cấu trúc cơ bản của trang HTML/XHTML có dạng như sau, thường gồm 3 phần: : Phần khai báo chuẩn của html hay xhtml : Phần khai báo ban đầu, khai báo về meta, title, CSS, javascript : Phần chứa nội dung của trang web, nơi hiển thị nội dung Cấu trúc cơ bản Tiêu đề trang web Phần thân viết ở đây Cấu trúc cơ bản của trang web Mỗi trang web đều có cách thể hiện cấu trúc khác nhau, có trang 1 cột, có trang 2 và cũng có trang chứa nhiều cột, bên dưới đây chúng ta tham khảo một trang đơn giản sử dụng 2 cột để layout • Phần đầu: header, có thể chứa logo, câu slogan, các liên kết, các banner liên kết, các button, đoạn flash, hoặc các form ngắn như form tìm kiếm • Phần liên kết toàn cục: global navigation, dùng để chứa các liên kết đến những trang quan trọng trong toàn bộ trang, tro ng phần này có thể chứa thêm các liên kết con (sub navigation) • Phần thân của trang: page body, phần này chứa phần nội dung chính (content) và phần nội dung phụ (sidebar) • Phần nội dung chính: content, phần này chứa nội dung chính cần thể hiện cho người dù ng xem 10 • Phần nội dung phụ: sidebar, phần này có thể chứa liên kết phụ của từng trang (local navigation), hoặc các banner chứa liên kết liên quan, hoặc có thể dùng để chứa các liên kết quảng cáo • Phần cuối trang web: footer, phần này thường chưa phân liên hệ như: tên công ty, địa chỉ, số điện thoại, mail liên hệ, và đặc biệt là copyright, hoặc có thể chứa các liên kết toàn trang, các banner liên kết Hình 1 4 Mô hình cấu trúc cơ bản của trang HTML 1 2 NGÔN NGỮ CSS 1 2 1 Giới thiệu • Định nghĩa CSS là viết tắt của Cascading Style Sheets Đây là một ngôn style sheet được sử dụng để mô tả giao diện và định dạng của một tài liệu viết bằng ngôn ngữ đánh dấu (markup) Nó cung cấp một tính năng bổ sung cho HTML Nó thường được sử dụng với HTML để thay đổi phong cách của trang web và giao diện người dùng Nó cũng 11 có thể được sử dụng với bất kỳ loại tài liệu XML nào bao gồm cả XML đơn giản, SVG và XUL CSS được sử dụng cùng với HTML và JavaScript trong hầu hết các trang web để tạo giao diện người dùng cho các ứng dụng web và giao diện người dùng cho nhiều ứng dụng di động • CSS làm được những gì? Bạn có thể thêm giao diện mới vào các tài liệu HTML cũ Bạn hoàn toàn có thể thay đổi giao diện trang web của mình chỉ với một vài thay đổi trong mã CSS • Tại sao sử dụng CSS Đây là ba lợi ích chính của CSS: 1) Giải quyết một vấn đề lớn Trước khi có CSS, các thẻ như phông chữ, màu sắc, kiểu nền, các sắp xếp phần tử, đường viền và kích thước phải được lặp lại trên mọi trang web Đây là một quá trình rất dài tốn th ời gian và công sức Ví dụ: Nếu bạn đang phát triển một trang web lớn nơi phông chữ và thông tin màu được thêm vào mỗi trang, nó sẽ trở thành một quá trình dài và tốn kém CSS đã được tạo ra để giải quyết vấn đề này Đó là một khuyến cáo của W3C 2) Tiết k iệm rất nhiều thời gian Định nghĩa kiểu CSS được lưu trong các tệp CSS bên ngoài vì vậy có thể thay đổi toàn bộ trang web bằng cách thay đổi chỉ một tệp 3) Cung cấp thêm các thuộc tính CSS cung cấp các thuộc tính chi tiết hơn HTML để định nghĩa giao diện của trang web Các điểm chính của CSS được đưa ra dưới đây: CSS là viết tắt của Cascading Style Sheet CSS được sử dụng để thiết kế các thẻ HTML CSS là một ngôn ngữ được sử dụng rộng rãi trên web 12 HTML, CSS và JavaScript được sử dụng để thiết kế web Nó giúp các nhà thiết kế web áp dụng phong cách trên các thẻ HTML • Ví dụ về CSS h1 { color:white; background - color:#00eeee; padding:5px; } p{ color:blue; } Write Your First CSS Example
This is Paragraph
1 2 2 Cú pháp của CSS Bộ quy tắc CSS chứa selector và khối khai báo 13 Hình 1 5 Mô hình cú pháp của CSS Selector: Bộ chọn cho biết phần tử HTML bạn muốn tạo kiểu cách Nó có thể là bất kỳ thẻ nào như , , Declaration Block: Khối khai báo có thể chứa một hoặc nhiều khai báo được phân cách bởi dấu chấm phẩy (;) Đối với ví dụ trên, có hai khai báo: 1 color: yellow; 2 font - size: 11 px ; Mỗi khai báo chứa một tên thuộc tính và giá trị, được phân cách bởi dấu hai chấm Property: Một property là một kiểu của thuộc tính của phần tử HTML Nó có thể là color, border, Value: Các giá trị được gán cho thuộc tính CSS Trong ví dụ trên, giá trị “yellow” được gán cho thuộc tính color Selector{Propertyl: valuel; Property2: value2; ;} 1 3 CÔNG CỤ SỬ DỤNG 1 3 1 Notepad++ Notepad++ hay được gọi là Notepad plus plus là một text editor đơn giản nhẹ nhàng trong quá trình làm việc và sử dụng nó Ngoài phần mềm này ra thì nếu bạn là một trình viên chẳng hạn thì cũng ít nhiều bạn cũng biết tới các phần mềm IDE Editor mạnh mẽ hỗ trợ code như là Sublime Text, Zend Studio với rất nhiều Plugin hỗ trợ bạn Nhưng nhe nhất, linh hoạt trong việc tắt m ở thì có lẽ Notepad++ sẽ là sự lựa chọn hàng đầu của bạn 14 1 3 2 Giới thiệu Notepad++ là một phần mềm mã nguồn mở làm nhiệm vụ biên tập mã nguồn, được coi là thay thế cho Notepad Notepad++ được viết bằng ngôn ngữ C++ trên nền Win32 API và STL thuần túy, đảm bảo tốc độ thực thi cao hơn và có kích thước chương trình nhỏ gọn Notepad++ hỗ trợ nhiều ngôn ngữ bao gồm tất cả ngôn ngữ lập trình hiện nay như C/C++, C#, Java, HTML, PHP, Trong môi trường Windows, Notepad++ là một lựa chọn rất lý tưởng Tiền đề bài viết Trong quá trình học tập và làm việc, thao tác với nhiều ngôn ngữ và nhiều trình soạn thảo là việc thường gặp ở mỗi lập trình viên Trong bài viết này tôi muốn cung cấp cho bạn đọc cách cài đặt và sử dụng phần mềm Notepad++ để phục vụ quá trình học tập và làm việc trong chuyên ngành công nghệ 1 3 3 Đối tượng hướng đến Các bạn học viên đang bắt đầu quá trình học tập và làm việc trong các ngành công nghệ và lập trình, nhất là các học viên STDIO Training Những bạn muốn tìm kiếm một chương trình hỗ tr ợ đắc lực có thể hỗ trợ nhiều ngôn ngữ và được sử dụng trong suốt quá trình từ giai đoạn khởi đầu đến giai đoạn chuyên nghiệp 1 3 4 Cài đặt Dễ dàng download bản cài đặt mới nhất tại trang chủ: https://notepad - plus - plus org (Ví dụ này thực hiện tại phiên bản Notepad++ 7 7 ngày 24 tháng 9 năm 2019) Sau khi download bản cài đặt phù hợp Khởi động file cài đặt và chọn ngôn ngữ 15 Chọn Next: Chọn I Agree để đồng ý với những điều khoản của chương trình Chọn đường dẫn lưu chương trinh 16 Chọn các Components cần thiết Có thể chọn tạo Shortcut trên Desktop trước khi Install 17 Sau khi cài đặt thành công nhấn Finish để hoàn tất và chạy thử chương trình Ứng dụng Ví dụ dễ nhất để có thể thấy được sự hỗ trợ của Notepad++ là với các câu lệnh HTML 18 Nhấn Ctrl + N để tạo trang mới và copy dòng code bên dưới Nhấn Ctrl + S và lưu file dưới dạng * html Lúc này ta có thể quan sát giao diện trực quan của Notepad++ so với Notepad 19 Trên thanh công cụ chọn Run - > Launch in Chrome hoặc tổ hợp phím Ctrl + Alt + Shifl + R để thực thi file trên Chrome ta được kết quả 20 21 Chương 2 PHÂN TÍCH & THIẾT KẾ HỆ THỐNG 2 1 PHÂN TÍCH & THIẾT KẾ HỆ THỐNG 2 1 1 ĐẶC TẢ BÀI TOÁN Một nơi du lịch cần thực hiện tin học hóa việc đăng kí tour du lịch thông qua website Đây là trang web giới thiệu về tất cả những gì liên quan đến lĩnh vực du lịch của Lào đến khách háng tham quan website, nhằm thu hút khách hàng tham quan website Chủ đạocủa website là giới thiệu các điểm du lịch trong và ngoài nước, các kỳ quan hay các chương trình về tour du lịch, các lễ hội trong năm tại các điểm du lịch Tại đây người dùng có thể xem thông tin về các tour du lịch do công ty cung cấp, cho phép đặt tour trực tuyến, tham khảo giá tour, tìm kiếm tour phù hợ p Có 2 cách để tìm kiếm thông tin: Tìm nhanh và tìm chi tiết Tìm nhanh: cho phép người dùng tìm kiếm nhanh bất kỳ thông tin nào trong website thông qua thao tác đơn giản là nhập từ khóa cần tìm và nhấn enter để ra kết quả Tìm chi tiết: cho phép người dù ng giới hạn khu vực tìm kiếm thông tin để kết quả hiển thị ra chính xác hơn Người dùng (tương ứng với user name và password) truy cập vào trang web để tìm hiểu thông tin về các tour du lịch trong và ngoài nước Người dùng có thể đăng kí tour du lịch, dịch vụ visa, vé máy bay, vé tàu xe, đăng kí thuê xe ô tô trực tuyến với công ty thông qua website Truy cập vào website người dùng có thể tìm hiểu về thông tin các địa điểm du lịch, các danh làm thắng cảnh trên thế giới Đối với người quản lý: Người quản lý cần nắm bắt thông tin nhân viên, thông tin khuyến mại từ các địa điểm du lịch, thông tin về các đối tác kinh doanh Sau khi tìm hiểu đầy đủ thông tin về các tuor du lịch, người dùng có thể làm việc trực tuyến với nhân viên của công ty để đăng ký tour d u lịch cho mình Khi khách hàng đăng kí du lịch chúng tôi sẽ có một phiếu đăng kí cho khách hàng có thể đang kí trực tuyến hoặc đăng kí trực tiếp tại Nhân viên cần xác định các thông tin: - Khách hàng có yêu cầu dịch vụ gì không ? - Tour du lịch mà khách hàng đăng kí 22 - Khách hàng muốn đặt khách sạn hay không loại khách sạn mà khách hàn muốn đặt - Khách hàng muốn ăn uống nghỉ ngơi tại nhà hàng như thế nào? - Khách hàng muốn thuê xe không? - Thông tin về khách hàng: họ tên, giới tính, tuổi, CMTND (hộ chiếu), địa chỉ, điện thoại, email Với mỗi thông tin về các dịch vụ, khách sạn, nhà hàng, xe cộ, các tour du lịch, các địa danh chúng ta đều có dữ liệu đầy đủ để khách hàng có thể yên tâm Nhân viên cần đưa ra các thông tin sau cho khách hàng được rõ: - Thông tin về tour du lịch - Thông tin khuyến mại của các khu du lịch - Thông tin về các địa danh, danh lam thắng cảnh - Thông tin khách sạn, nhà hàng, các dịch vụ, visa Nhà quản lý: cần nắm bắt các thông tin về nhân viên của mình, năm bắt các thông tin về khuyến mại giảm giá từ các khu du lịch một cách nhanh nhậy… đưa ra chiến lược kinh doanh hợp lý 2 1 2 DANH SÁCH CÁC TÁC NHÂN Du Khách: là người truy cập website, đăng kí, xem thông tin về dịch vụ phong tục tập quán và nơi du lịch của đất nước Lào Du Khách: là những khách thăm đã đăng kí thành viên của hệ thống, đăng nhập, tìm kiếm, đặt hàng, xem, sửa, xóa thông tin giỏ hàng, đăng xuất, xem, sửa thông tin cá nhân, đổi mật khẩu, thanh toán Người quản trị: điều hành, quản lý và theo dõi mọi hoạt động củ a hệ thống: quản lý sản phẩm (thêm, xóa, sửa), quản trị người dùng (xóa), quản lí hóa đơn (xem thông tin, xóa, phê duyệt hóa đơn) 2 2 ĐẶC TẢ CÁC ÚC 1 UC_Xem trang tin Tác nhân: khách xem Mô tả: cho phép khách xem đăng ký làm thành viên của hệ thống 23 Luồng sự kiện: yêu cầu nhập lại 2 UC_Cập nhập trang tin Tác nhân: khách xem Mô tả: cho phép khách xem đăng ký làm thành viên của hệ thống Luồng sự kiện: yêu cầu nhập lại 3 UC_Đăng nhập Tác nhân: khách xem Mô tả: cho phép khách xem đăng ký làm thành viên của hệ thống Luồng sự kiện: yêu cầu nhập lại 4 UC_Đăng xuất Tác nhân: khách xem Mô tả: cho phép khách xem đăng ký làm thành viên của hệ thống Luồng sự kiện: yêu cầu nhập lại 5 UC_Đăng ký thành viên Tác nhân: khách xem Mô tả: cho phép khách xem đăng ký làm thành viên của hệ thống Luồng sự kiện: yêu cầu nhập lại 6 UC_Chỉnh sửa thông tin thành viên Tác nhân: khách xem Mô tả: cho phép khách xem đăng ký làm thành viên của hệ thống Luồng sự kiện: yêu cầu nhập lại 7 UC_Đặt Tour du lịch Tác nhân: khách xem Mô tả: cho phép khách xem đăng ký làm thành viên của hệ thống Luồng sự kiện: yêu cầu nhập lại 24 2 3 BIỂU ĐỒ UC CHI TIẾT 2 3 1 Biểu đồ UC tổng quát Hình 2 1 Sơ đồ UC tổng quát DangKyThanhVien CapnhapThongtinUser DangNhap DangXuat Dat Tour du lich Xem trang tin NguoiQuanTri KhachTham Capnhaptrangtin 25 2 3 2 Biểu đồ hoạt động a Biểu đồ hoạt động: xem thong tin đặt Tour b Biểu hoạt động: Khách hàng Đăng ký Tour Khach Hang Xem thong tin Tour du lich Chon Tour du lich can xem Dat Tour Hien thi danh muc cac Tour du lich He Thong Ket Thuc Hien thi thong tin ve Tour du lich Khach Hang Chon 1 Tour Xem thong tin Tour du lich Chon dat Tour Hien thi man hith nhap Thonh tin khach hang Khach hang nhap thong tin Kiem tra thong tin khach hang Chon hinh thuc thanh toan Khach hang tra tien dat coc Khach hang nhan ve du lich Thanh toan chi phi Tour k et thuc Thuc hien Tour khong dung Dung ngay bat dau thuc hien Tour xac nhan chua xac nhan khong dong y khong dong y Dong y 26 2 3 3 BIỂU ĐỒ TUẦN TỰ a Biểu đồ tuần tự UC_Đăng ký thành viên b Biểu đồ tuần tự UC_Đăng nhập Hình 2 2 Biểu đồ tuần tự UC_Cập nhập trang tin : KhachTham : KhachTham Trang thong tin Trang thong tin CSDL CSDL 1: Mo trang tin 2: Xem trang tin 3: Xem 4: Dang ky thanh vien 5: Chinh sua thong tin 6: Luu thong tin vao CSDL : KhachTham : KhachTham Cua so trang tin Cua so trang tin CSDL CSDL 1: Mo cua so trang thong tin 2: Nhap ten, pass 3: Kiem tra ten, pass 4: Dung mo cua so co ten Khach dang nhap 5: Neu Sai, yeu cau Khach nhap lai Ten, pass 27 CHƯƠNG 3 DEMO CHƯƠNG TRÌNH A Trang chủ Biểu diễn cho, diễn cho thấy các hình ảnh về nơi du lịch và phong tục tập quán của đất Lào, và văn hóa đất nước xinh đẹp… 3 1 GIAO DIỆN TRANG CHỦ B Trang nơi du lịch biểu diễn cho thấy các nơi du lịch và phong cảnh đẹp để tự hào và thu hút các khách du lịch đi thăm quan đất nước lào 28 3 2 GIAO DIỆN GIỚI THIỆU NƠI DU LỊCH C Phong tục và tập quán Biểu diễn sự cuộc sống của người lào, văn hóa phong tục tập quán, quan hệ gia đình theo phong tục của người lào 3 3 GIAO DIỆN PHONG TỤC VÀ TẬP QUÁN D Món ăn lào Biểu diển cho thấy rằng các m ón ăn ngon mà người lào thường xuyên ăn và món ăn đặc sản của đất nước lào khi nước ngoài qua lào phải được ăn thử và đâm mê đến món ăn lào 29 3 4 GIAO DIỆN GIỚI THIỆU MÓN ĂN E Chỗ nghỉ ngơi Đây là một chỗ nghỉ ngơi mà có sự thuận lợi và nổi tiếng trong tỉnh champasak và được chấp nhận từ khách được dịch vụ nhiều nhất tron g tỉnh champasak khi được đi du lịch đất nước lào, nói riêng là tỉnh champasak 3 5 GIAO DIỆN CHỖ NGHỈ NGƠI 30 Phần 3 KẾT LUẬN Ngôn ngữ HTML,CSS cho phép chúng ta thiết kế và xây dựng trong trang thông tin điện tử (Website) có tính nâng cao Thời đại mà công nghệ thông tin đã trở thành một nhu cầu không thể thiếu, việc một xây dựng trang thông tin trên mạng là một phương pháp tối ưu để đưa thông tin cho con người, đặc biệt là để quảng cáo,tự hào cho đất nướ c Lào, làm cho mọi người nhớ về phong tục tập quán, nơi du lịch,tiếng cười và sự sống của con người cũng như đất nước Lào Với thời gian và năng lực có hạn, trong một thời gian em đã nghiên cứu và ứng dụng ngôn ngữ HTML, CSS để xây dựng website du lịch Lào với CSS Đề tài này được hoàn thành song không thể tránh khỏi những thiếu sót và kết quả đạt được chưa cao Kính mong sự thông cảm của các thầy cô và các bạn Để hoàn thành trong đề tài này, một lầ n nữa em xin chân thành cảm ơn c ô giáo Th S Lê Thị Nguyên A n là người đã quan tâm, giúp đỡ em trong suốt thời gian qua Và cho em bày tỏ lòng biết ơn tới các thầy giáo, cô giáo trong khoa công nghệ thông tin đã giúp em hoàn thành đề tài này Em xin chân thành cảm ơn 31 Phần 4 TÀI LIỆU THAM KHẢO [1] ThS Trần Thị Diệu Linh - Bài Giang Lập trình web [2] Trần Thị Diệu Hiền - Bài giảng Phân tích và thiết kế Hướng đối tượng với UML 2015 [3] Tài liệu trên Internet [4] Trang web www w3school com 32 NHẬN XÉT CỦA CÁN BỘ HƯỚNG DẪN Cán bộ hướng dẫn Sinh viên thực hiện Cán bộ chấm 1 Cán bộ chấm 2 ……………………………… ………………………………PHÂN TÍCH & THIẾT KẾ HỆ THỐNG
PHÂN TÍCH & THIẾT KẾ HỆ THỐNG
Một nơi du lịch cần thực hiện tin học hóa việc đăng kí tour du lịch thông qua website Đây là trang web giới thiệu về tất cả những gì liên quan đến lĩnh vực du lịch của Lào đến khách háng tham quan website, nhằm thu hút khách hàng tham quan website.Chủ đạocủa website là giới thiệu các điểm du lịch trong và ngoài nước, các kỳ quan hay các chương trình về tour du lịch, các lễ hội trong năm tại các điểm du lịch Tại đây người dùng có thể xem thông tin về các tour du lịch do công ty cung cấp, cho phép đặt tour trực tuyến, tham khảo giá tour, tìm kiếm tour phù hợp Có 2 cách để tìm kiếm thông tin: Tìm nhanh và tìm chi tiết Tìm nhanh: cho phép người dùng tìm kiếm nhanh bất kỳ thông tin nào trong website thông qua thao tác đơn giản là nhập từ khóa cần tìm và nhấn enter để ra kết quả Tìm chi tiết: cho phép người dùng giới hạn khu vực tìm kiếm thông tin để kết quả hiển thị ra chính xác hơn Người dùng (tương ứng với user name và password) truy cập vào trang web để tìm hiểu thông tin về các tour du lịch trong và ngoài nước
Người dùng có thể đăng kí tour du lịch, dịch vụ visa, vé máy bay, vé tàu xe, đăng kí thuê xe ô tô trực tuyến với công ty thông qua website
Truy cập vào website người dùng có thể tìm hiểu về thông tin các địa điểm du lịch, các danh làm thắng cảnh trên thế giới Đối với người quản lý:
Người quản lý cần nắm bắt thông tin nhân viên, thông tin khuyến mại từ các địa điểm du lịch, thông tin về các đối tác kinh doanh
Sau khi tìm hiểu đầy đủ thông tin về các tuor du lịch, người dùng có thể làm việc trực tuyến với nhân viên của công ty để đăng ký tour du lịch cho mình Khi khách hàng đăng kí du lịch chúng tôi sẽ có một phiếu đăng kí cho khách hàng có thể đang kí trực tuyến hoặc đăng kí trực tiếp tại
Nhân viên cần xác định các thông tin:
- Khách hàng có yêu cầu dịch vụ gì không ?
- Tour du lịch mà khách hàng đăng kí
- Khách hàng muốn đặt khách sạn hay không loại khách sạn mà khách hàn muốn đặt
- Khách hàng muốn ăn uống nghỉ ngơi tại nhà hàng như thế nào?
- Khách hàng muốn thuê xe không?
- Thông tin về khách hàng: họ tên, giới tính, tuổi, CMTND (hộ chiếu), địa chỉ, điện thoại, email
Với mỗi thông tin về các dịch vụ, khách sạn, nhà hàng, xe cộ, các tour du lịch, các địa danh chúng ta đều có dữ liệu đầy đủ để khách hàng có thể yên tâm
Nhân viên cần đưa ra các thông tin sau cho khách hàng được rõ:
- Thông tin về tour du lịch
- Thông tin khuyến mại của các khu du lịch
- Thông tin về các địa danh, danh lam thắng cảnh
- Thông tin khách sạn, nhà hàng, các dịch vụ, visa
Nhà quản lý: cần nắm bắt các thông tin về nhân viên của mình, năm bắt các thông tin về khuyến mại giảm giá từ các khu du lịch một cách nhanh nhậy… đưa ra chiến lược kinh doanh hợp lý
2.1.2 DANH SÁCH CÁC TÁC NHÂN
Du Khách: là người truy cập website, đăng kí, xem thông tin về dịch vụ phong tục tập quán và nơi du lịch của đất nước Lào
Du Khách: là những khách thăm đã đăng kí thành viên của hệ thống, đăng nhập, tìm kiếm, đặt hàng, xem, sửa, xóa thông tin giỏ hàng, đăng xuất, xem, sửa thông tin cá nhân, đổi mật khẩu, thanh toán
Người quản trị: điều hành, quản lý và theo dõi mọi hoạt động của hệ thống: quản lý sản phẩm (thêm, xóa, sửa), quản trị người dùng (xóa), quản lí hóa đơn (xem thông tin, xóa, phê duyệt hóa đơn).
ĐẶC TẢ CÁC ÚC
Mô tả:cho phép khách xem đăng ký làm thành viên của hệ thống
Luồng sự kiện: yêu cầu nhập lại
2 UC_Cập nhập trang tin
Mô tả: cho phép khách xem đăng ký làm thành viên của hệ thống Luồng sự kiện: yêu cầu nhập lại
Mô tả: cho phép khách xem đăng ký làm thành viên của hệ thống Luồng sự kiện: yêu cầu nhập lại
Mô tả: cho phép khách xem đăng ký làm thành viên của hệ thống Luồng sự kiện: yêu cầu nhập lại
5 UC_Đăng ký thành viên
Mô tả: cho phép khách xem đăng ký làm thành viên của hệ thống Luồng sự kiện: yêu cầu nhập lại
6 UC_Chỉnh sửa thông tin thành viên
Mô tả: cho phép khách xem đăng ký làm thành viên của hệ thống Luồng sự kiện: yêu cầu nhập lại
7 UC_Đặt Tour du lịch
Mô tả: cho phép khách xem đăng ký làm thành viên của hệ thống Luồng sự kiện: yêu cầu nhập lại
BIỂU ĐỒ UC CHI TIẾT
2.3.1 Biểu đồ UC tổng quát
Hình 2.1 Sơ đồ UC tổng quát
2.3.2 Biểu đồ hoạt động a Biểu đồ hoạt động: xem thong tin đặt Tour b Biểu hoạt động: Khách hàng Đăng ký Tour
Xem thong tin Tour du lich
Chon Tour du lich can xem
Hien thi danh muc cac Tour du lich
Hien thi thong tin ve Tour du lich
Xem thong tin Tour du lich
Hien thi man hith nhap Thonh tin khach hang
Khach hang nhap thong tin
Kiem tra thong tin khach hang
Chon hinh thuc thanh toan
Khach hang tra tien dat coc
Khach hang nhan ve du lich
Thanh toan chi phi Tour k et thuc
Thuc hien Tour khong dung Dung ngay bat dau thuc hien Tour xac nhan chua xac nhan khong dong y khong dong y
2.3.3 BIỂU ĐỒ TUẦN TỰ a.Biểu đồ tuần tự UC_Đăng ký thành viên b.Biểu đồ tuần tự UC_Đăng nhập
Hình 2.2 Biểu đồ tuần tự UC_Cập nhập trang tin
Trang thong tin CSDL CSDL
6: Luu thong tin vao CSDL
1: Mo cua so trang thong tin
4: Dung mo cua so co ten Khach dang nhap
5: Neu Sai, yeu cau Khach nhap lai Ten, pass
DEMO CHƯƠNG TRÌNH
Biểu diễn cho, diễn cho thấy các hình ảnh về nơi du lịch và phong tục tập quán của đất Lào, và văn hóa đất nước xinh đẹp…
B Trang nơi du lịch biểu diễn cho thấy các nơi du lịch và phong cảnh đẹp để tự hào và thu hút các khách du lịch đi thăm quan đất nước lào
3.2 GIAO DIỆN GIỚI THIỆU NƠI DU LỊCH
C Phong tục và tập quán
Biểu diễn sự cuộc sống của người lào, văn hóa phong tục tập quán, quan hệ gia đình theo phong tục của người lào
3.3 GIAO DIỆN PHONG TỤC VÀ TẬP QUÁN
Biểu diển cho thấy rằng các món ăn ngon mà người lào thường xuyên ăn và món ăn đặc sản của đất nước lào khi nước ngoài qua lào phải được ăn thử và đâm mê đến món ăn lào
3.4 GIAO DIỆN GIỚI THIỆU MÓN ĂN
E Chỗ nghỉ ngơi Đây là một chỗ nghỉ ngơi mà có sự thuận lợi và nổi tiếng trong tỉnh champasak và được chấp nhận từ khách được dịch vụ nhiều nhất trong tỉnh champasak khi được đi du lịch đất nước lào, nói riêng là tỉnh champasak
3.5 GIAO DIỆN CHỖ NGHỈ NGƠI