Đăng ký Đăng nhập
Trang chủ Phát triển ứng dụng quản lý sinh viên ngoại trú trên thiết bị di động...

Tài liệu Phát triển ứng dụng quản lý sinh viên ngoại trú trên thiết bị di động

.PDF
65
312
95

Mô tả:

TRƢỜNG ĐẠI HỌC TÂY BẮC BÁO CÁO TỔNG KẾT ĐỀ TÀI NGHIÊN CỨU KHOA HỌC CẤP CƠ SỞ PHÁT TRIỂN ỨNG DỤNG QUẢN LÝ SINH VIÊN NGOẠI TRÚ TRÊN THIẾT BỊ DI ĐỘNG Mã ngành: KT3 Thuộc nhóm ngành khoa học: Khoa học Tự nhiên Sơn La, năm 2017 TRƢỜNG ĐẠI HỌC TÂY BẮC =====o0o===== BÁO CÁO TỔNG KẾT ĐỀ TÀI NGHIÊN CỨU KHOA HỌC CỦA SINH VIÊN PHÁT TRIỂN ỨNG DỤNG QUẢN LÝ SINH VIÊN NGOẠI TRÚ TRÊN THIẾT BỊ DI ĐỘNG Mã ngành: KT3 Thuộc nhóm ngành khoa học: Khoa học Tự nhiên Sinh viên thực hiện: Lƣu Hồng Quân Giới Tính: Nam Dân tộc: Kinh Dƣơng Văn Toản Giới Tính: Nam Dân tộc: Kinh Giới Tính: Nam Dân tộc: Kinh Lê Minh Sáng Lớp: K55 ĐH CNTT Khoa: Toán - Lý - Tin Năm thứ: 03/Số năm đào tạo:04 Ngành học: Công nghệ Thông Tin Sinh viên chịu trách nhiệm chính: Lƣu Hồng Quân Ngƣời hƣớng dẫn: ThS. Nguyễn Duy Hiếu Sơn La, năm 2017 LỜI CẢM ƠN Sau một thời gian học tập, nghiên cứu và triển khai đề tài: “Phát triển ứng dụng quản lý sinh viên ngoại trú trên thiết bị di động”, đến nay chúng tôi đã hoàn thành đề tài nghiên cứu của mình. Chúng tôi xin bày tỏ tấm lòng biết ơn sâu sắc nhất tới thầy giáo – Thạc sỹ Nguyễn Duy Hiếu đã trực tiếp hướng dẫn chúng tôi trong suốt quá trình chúng tôi thực hiện đề tài nghiên cứu khoa học này. Đồng thời chúng tôi cũng chân thành cảm ơn tới lãnh đạo Nhà trường, Ban chủ nhiệm Khoa cùng các thầy cô giáo đã giúp đỡ, tạo điều kiện để chúng tôi có cơ hội nghiên cứu, học tập và hoàn thành đề tài nghiên cứu khoa học này. Do hạn chế về trình độ chuyên môn và thời gian thực hiện đề tài không tránh khỏi những thiếu sót, rất mong nhận được sự góp ý của thầy cô để chúng tôi có thể hoàn thành tốt nhất đề tài nghiên cứu này. Chúng tôi xin chân thành cảm ơn! Sơn La, tháng 5 năm 2017 Sinh viên Lƣu Hồng Quân Dƣơng Văn Toản Lê Minh Sáng MỤC LỤC PHẦN MỞ ĐẦU..............................................................................................................1 1. Lý do chọn đề tài ..........................................................................................................1 2. Mục đích nghiên cứu ....................................................................................................1 3. Đối tượng nghiên cứu ...................................................................................................1 4. Phạm vi nghiên cứu ......................................................................................................1 5. Phương pháp nghiên cứu ..............................................................................................1 6. Bố cục đề tài..................................................................................................................2 CHƢƠNG 1: TỔNG QUAN VỀ THIẾT KẾ WEB ....................................................3 1.1. Lịch sử hình thành của thiết kế web ..........................................................................3 1.2. Xu hướng phát triển của thiết kế web .......................................................................5 1.2.1. Mobile-first ....................................................................................................5 1.2.2. Thiết kế website - Responsive Web Design ..................................................6 1.2.3. Sử dụng các framework của CSS và JavaScript ...........................................6 1.3. Căn bản về HTML/HTML5 ......................................................................................6 1.3.1. HTML là gì?...................................................................................................6 1.3.2. Tập tin HTML là gì? ......................................................................................7 1.3.3. Thẻ trong HTML............................................................................................7 1.3.4. Cấu trúc của HTML .......................................................................................7 1.3.5. Các phiên bản HTML ....................................................................................8 1.4. Căn bản về CSS/CSS3 ...............................................................................................8 1.4.1. CSS là gì? .......................................................................................................8 1.4.2. Lịch sử CSS ...................................................................................................8 1.4.3. Lợi thế của CSS .............................................................................................9 1.5. Căn bản về JavaScript ................................................................................................9 1.5.1. JavaScript là gì? .............................................................................................9 1.5.2. Các lợi thế của JavaScript ............................................................................10 1.5.3. Hạn chế của JavaScript ................................................................................10 CHƢƠNG 2. GIỚI THIỆU VỀ LẬP TRÌNH ỨNG DỤNG TRÊN THIẾT BỊ DI ĐỘNG .............................................................................................................................11 2.1. Sự phát triển của thiết bị di động.............................................................................11 2.2. Giới thiệu về lập trình ứng dụng trên thiết bị di động ............................................12 2.2.1. Android ........................................................................................................12 2.2.2. iOS................................................................................................................13 2.2.3. Windows Phone ...........................................................................................14 2.3. Xu hướng phát triển của ứng dụng thiết bị di động ................................................14 2.3.1. Dùng các ứng dụng Native ..........................................................................15 2.3.2. Dùng Framework .........................................................................................18 CHƢƠNG 3: TỔNG QUAN VỀ JQUERY MOBILE ..............................................21 3.1 Giới thiệu về JQuery .................................................................................................21 3.1.1. JQuery là gì? ................................................................................................21 3.1.2. JQuery dùng để làm gì? ...............................................................................21 3.2. JQuery Mobile .........................................................................................................22 3.2.1. JQuery Mobile là gì?....................................................................................22 3.2.2. Lịch sử của JQuery Mobile..........................................................................22 3.2.3. Tại sao sử dụng JQuery Mobile? .................................................................23 3.2.4. Các tính năng cơ bản của JQuery Mobile ...................................................23 3.2.5. Những vấn đề khi xây dựng App Mobile ....................................................23 3.2.6. Cách dùng JQuery Mobile ...........................................................................24 3.2.7. Cấu trúc của một trang JQuery Mobile .......................................................24 3.2.8. Đối tượng JQuery Mobile ............................................................................27 3.2.9. Tóm tắt các thành phần giao diện người dùng ............................................31 CHƢƠNG 4. PHÁT TRIỂN ỨNG DỤNG QUẢN LÝ SINH VIÊN NGOẠI TRÚ TRÊN THIẾT BỊ DI ĐỘNG ........................................................................................33 4.1. Lựa chọn mục tiêu ...................................................................................................33 4.2. Phân tích yêu cầu .....................................................................................................33 4.3. Thiết kế mức khái niệm ...........................................................................................34 4.3.1. Xác định tác nhân ........................................................................................34 4.3.2. Mô hình Use – Case người dùng .................................................................34 4.3.3. Mô hình hóa tương tác đối tượng ................................................................35 4.3.4. Biểu đồ lớp thực thể liên kết........................................................................44 4.4. Thiết kế giao diện người dùng .................................................................................44 4.4.1. Màn hình đăng nhập khi bắt đầu ứng dụng .................................................44 4.4.2. Các màn hình sau khi chọn người dùng ......................................................46 KẾT LUẬN VÀ KIẾN NGHỊ ......................................................................................55 1. Kết luận .......................................................................................................................55 2. Kiến nghị .....................................................................................................................55 TÀI LIỆU THAM KHẢO ............................................................................................56 DANH SÁCH HÌNH ẢNH Hình 1.1. Thiết kế phù hợp với kích thước màn hình của thiết bị ...................................6 Hình 1.2. Cấu trúc cơ bản của HTML ..............................................................................7 Hình 2.1. Biểu đồ phân tích thị phần ứng dụng của 3 hệ điều hành ..............................12 Hình 2.2. Cửa hàng ứng dụng CH Play của Android.....................................................13 Hình 2.3. Cửa hàng ứng dụng App Store của Apple .....................................................14 Hình 2.4. Cửa hàng ứng dụng của Windows Phone ......................................................14 Hình 2.5. Giao diện ứng dụng Visual Studio .................................................................15 Hình 2.6. Giao diện ứng dụng Android Studio ..............................................................16 Hình 2.7. Giao diện ứng dụng Xcode .............................................................................17 Hình 2.8. Giao diện ứng dụng PhoneGap ......................................................................19 Hình 3.1. Các nền tảng di động đang được JQuery Moblie hỗ trợ ................................22 Hình 3.2. Chèn đường dẫn từ CDN của jQuyery Mobile vào trang html .....................24 Hình 3.3. Tạo một trang JQuery Mobile ........................................................................25 Hình 3.4. Demo cấu trúc trang của JQuery Mobile .......................................................25 Hình 3.5. Kết cấu chung của một ứng dụng web JQuery Mobile..................................26 Hình 3.6. Các phần tử giao diện người dùng JQuery Mobile ........................................31 Hình 4.1. Mô hình Use – Case người dùng ....................................................................34 Hình 4.2. Trình tự đăng nhập của QTV..........................................................................35 Hình 4.3. Trình tự cấp quyền cho GV của QTV ............................................................36 Hình 4.4. Trình tự cấp quyền cho SV của QTV.............................................................36 Hình 4.5. Trình tự thêm GV của QTV ...........................................................................37 Hình 4.6. Trình tự sửa GV của QTV ..............................................................................37 Hình 4.7. Trình tự xóa GV của QTV..............................................................................38 Hình 4.8. Trình tự thêm SV của QTV ............................................................................38 Hình 4.9. Trình tự sửa thông tin SV của QTV ...............................................................39 Hình 4.10. Trình tự xóa SV của QTV ............................................................................39 Hình 4.11. Trình tự đăng nhập của GV ..........................................................................40 Hình 4.12. Chức năng Xem - Sửa thông tin của GV .....................................................40 Hình 4.13. Chức năng Xem - Sửa thông tin của QTV ...................................................41 Hình 4.14. Trình tự thêm SV của GV ............................................................................41 Hình 4.15. Trình tự sửa thông tin SV của GV ...............................................................42 Hình 4.16. Trình tự xóa SV của GV ...............................................................................42 Hình 4.17. Trình tự đăng nhập của SV...........................................................................43 Hình 4.18. Trình tự Xem – Sửa thông tin của SV..........................................................43 Hình 4.19. Biểu đồ thực thể liên kết ...............................................................................44 Hình 4.20. Màn hình đăng nhập của ứng dụng ..............................................................45 Hình 4.21. Màn hình quản lý của quản trị viên ..............................................................46 Hình 4.22. Màn hình quản lý giáo viên của quản trị viên ..............................................47 Hình 4.23. Màn hình quản lý cố vấn học tập của quản trị viên .....................................48 Hình 4.24. Màn hình quản lý lớp của quản trị viên .......................................................49 Hình 4.25. Màn hình chính sau khi đăng nhập của giáo viên ........................................50 Hình 4.26. Màn hình hiển thị thông tin của giáo viên ...................................................51 Hình 4.27. Màn hình quản lý lớp và sinh viên của giáo viên ........................................52 Hình 4.28. Màn hình chính sau khi đăng nhập của sinh viên ........................................53 Hình 4.29. Màn hình hiển thị thông tin của sinh viên....................................................54 DANH SÁCH THUẬT NGỮ VIẾT TẮT Tên viết tắt Ý nghĩa HTML HyperText Markup Language CSS Cascading Style Sheets W3C World Wide Web Consortium GPS Global Positioning System XAML Extensible Application Markup Language IDE Integrated Development Environment SDK Software Development Kit AJAX Asynchronous JavaScript DOM Document Object Model CDN Content Delivery Network CNTT Công nghệ thông tin QTV Quản trị viên GV Giáo viên SV Sinh viên PHẦN MỞ ĐẦU 1. Lý do chọn đề tài Sự bùng nổ công nghệ thông tin (CNTT) nói riêng và khoa học công nghệ nói chung đang tác động mạnh mẽ vào sự phát triển mọi mặt của đời sống xã hội. Công nghệ thông tin phát triển đã tạo ra những ứng dụng tiện ích, dễ sử dụng trong đời sống và trong trường học như quản lý bán hàng, quản lý nhân viên, quản lý thư viện, quản lý học sinh - sinh viên, quản lý thiết bị học tập và giảng dạy,… Hiện nay, tại nhiều nơi việc quản lý thông tin sinh viên của thầy cô cố vấn học tập là sử dụng những phương pháp bằng sổ sách, giấy tờ, Word, Excel,… Việc quản lý như vậy chưa thực sự thuận tiện trong nhiều trường hợp như khó cập nhật thông tin khi sinh viên thay đổi nơi ở, số điện thoại, thông tin cá nhân,… Có thể thấy tiềm năng ứng dụng của CNTT vào việc quản lý sinh viên là rất lớn. Việc quản lý thông tin của sinh viên, đặc biệt là sinh viên ngoại trú sẽ dễ dàng, thuận tiện, chính xác và được cập nhật thường xuyên hơn nếu có sự giúp sức của CNTT. Với những lý do trên, chúng tôi chọn nghiên cứu đề tài: “Phát triển ứng dụng quản lý sinh viên ngoại trú trên thiết bị di động”. 2. Mục đích nghiên cứu - Nghiên cứu về xây dựng ứng dụng di động nền web. - Nghiên cứu phát triển ứng dụng hỗ trợ thầy cô trong việc quản lý sinh viên ngoại trú. 3. Đối tƣợng nghiên cứu - Ứng dụng di động nền web. 4. Phạm vi nghiên cứu - Thiết kế ứng dụng di động nền web quản lý sinh viên ngoại trú. 5. Phƣơng pháp nghiên cứu - Tổng hợp tài liệu - Nghiên cứu tài liệu - Thực hành trên máy tính 1 6. Bố cục đề tài Đề tài gồm 4 chương: Chương 1: Tổng quan về thiết kế web Chương 2: Giới thiệu về lập trình ứng dụng trên thiết bị di động Chương 3: Tổng quan về JQuery Mobile Chương 4: Phát triển ứng dụng quản lý sinh viên ngoại trú trên thiết bị di động 2 CHƢƠNG 1: TỔNG QUAN VỀ THIẾT KẾ WEB 1.1. Lịch sử hình thành của thiết kế web Mặc dù Internet có lịch sử phát triển chưa thực sự lâu dài nhưng hiện nay nó có vai trò quan trọng trong lĩnh vực CNTT. Những tiện ích mà Internet mang lại giúp con người ngày càng thuận tiện hơn trong công việc, học tập, kết nối và giải trí. Có thể nói rằng: Internet có vai trò to lớn như ngày nay một phần lớn là nhờ sự phát triển của công nghệ website. Nhờ các hệ thống website, con người có thể tìm kiếm, truyền tải, quảng bá, trao đổi thông tin một cách dễ dàng và thuận tiện. Và hiện nay, công nghệ web phát triển mạnh mẽ không chỉ dừng lại ở việc phát triển các trang web thông thường, mà còn là phát triển các ứng dụng trên thiết bị di động nền web (web-based applications). Sự bắt đầu của thiết kế web: Năm 1989, khi làm việc tại CERN, Tim Berners-Lee đã đề xuất để tạo ra một dự án siêu văn bản toàn cầu mà sau này được gọi là World Wide Web. Trong thời gian 1991-1993 World Wide Web đã ra đời. Trang văn bản chỉ có thể được xem bằng cách sử dụng một trình duyệt line-chế độ đơn giản. Năm 1993, Marc Andreessen và Eric Bina, tạo ra các trình duyệt Mosaic. Vào thời điểm đó có nhiều trình duyệt, tuy nhiên phần lớn trong số họ là dựa trên Unix và không có sự tích hợp với các yếu tố thiết kế đồ họa như hình ảnh; âm thanh. Các trình duyệt Mosaic đã phá vỡ mốc này. W3C đã được thành lập trong tháng 10 năm 1994 để dẫn World Wide Web phát triển các giao thức phổ biến mà thúc đẩy sự phát triển của nó và đảm bảo khả năng tương tác của nó. Điều này khuyến khích bất kỳ một công ty độc quyền về trình duyệt và ngôn ngữ lập trình có thể sẽ bị thay đổi tác động của World Wide Web một cách toàn thể. W3C tiếp tục thiết lập các tiêu chuẩn mà hôm nay có thể thấy như HTML, CSS, JavaScript. Năm 1994, Andreessen thành lập Communications Corp mà sau này được biết đến như Netscape Communications, trình duyệt Netscape 0.9. Netscape tạo ra các thẻ HTML riêng của mình mà không quan tâm đến quá trình chuẩn mực truyền thống. Ví dụ, Netscape 1.1 bao gồm các thẻ cho việc thay đổi màu nền và định dạng văn bản với bảng trên các trang web. Trong suốt 1996-1999 các cuộc chiến trình duyệt bắt đầu, như Microsoft và Netscape đã đấu tranh cho sự thống trị bằng cách ra mắt nhiều cải tiến trong các phiên 3 bản của mình. Trong thời gian đó có rất nhiều công nghệ mới trong lĩnh vực này, đặc biệt là Cascading Style Sheets, JavaScript, và Dynamic HTML. Trên toàn bộ, “cuộc chiến” trình duyệt đã dẫn đến nhiều sáng tạo tích cực và giúp thiết kế web phát triển với một tốc độ nhanh chóng Sự phát triển của thiết kế website: Năm 1996, Microsoft phát hành bản trình duyệt đầu tiên của mình, trong đó đã hoàn thành với các tính năng và các thẻ riêng của mình. Nó cũng là trình duyệt đầu tiên hỗ trợ phong cách trang, mà lúc đó được xem như là một kỹ thuật tối ưu. Các đoạn mã HTML cho bảng ban đầu được dành cho việc hiển thị dữ liệu dạng bảng. Tuy nhiên các nhà thiết kế nhanh chóng nhận ra tiềm năng của việc sử dụng bảng HTML cho các công việc phức tạp, bố trí nhiều cột đó mà không thể thực hiện. Tại thời điểm này, thiết kế và thẩm mỹ tốt dường như được ưu tiên hơn cấu trúc đánh dấu tốt, và ít chú ý đến ngữ nghĩa và cách tiếp cận. Các trang web HTML được giới hạn trong các tùy chọn thiết kế của họ, thậm chí nhiều hơn như vậy với các phiên bản trước của HTML. Để tạo ra các thiết kế phức tạp, nhiều nhà thiết kế web có sử dụng các cấu trúc bảng phức tạp. CSS được giới thiệu vào tháng 12 năm 1996 bởi W3C để hỗ trợ trình bày và bố trí. Điều này cho phép mã HTML đơn giản và ngữ nghĩa hơn, cải thiện khả năng tiếp cận web. Năm 1996, flash (ban đầu được biết đến như là FutureSplash) đã được phát triển. Vào thời điểm đó, các công cụ phát triển nội dung Flash là tương đối đơn giản so với hiện nay, sử dụng bố trí cơ bản và các công cụ vẽ, ActionScript, và một thời gian sau nó cho phép các nhà thiết kế web vượt qua các nhược điểm của HTML, GIF và JavaScript. Tuy nhiên, vì Flash yêu cầu một plug-in, nhiều nhà phát triển web tránh sử dụng nó vì sợ hạn chế thị phần của mình do thiếu khả năng tương thích. Thay vào đó, các nhà thiết kế web dùng hình ảnh động gif (nếu họ không từ bỏ sử dụng đồ họa chuyển động hoàn toàn) và JavaScript cho các widget. Nhưng những lợi ích của Flash đã làm cho nó phổ biến trên thị trường để cuối cùng làm việc theo cách của mình cho đại đa số các trình duyệt, và đủ mạnh để được sử dụng để phát triển toàn bộ trang. Kết thúc cuộc chiến trình duyệt đầu tiên: Trong năm 1998 Netscape công bố mã Netscape Communicator dưới một giấy phép mã nguồn mở, cho phép hàng ngàn lập trình tham gia vào việc cải thiện các phần mềm. Tuy nhiên, họ đã quyết định bắt đầu từ đầu, trong đó hướng dẫn sự phát triển 4 của trình duyệt mã nguồn mở và ổn định nhanh chóng mở rộng sang một nền tảng ứng dụng hoàn chỉnh. Các dự án Web tiêu chuẩn đã được hình thành và phát huy tuân thủ trình duyệt với HTML và CSS tiêu chuẩn bằng cách tạo ra Acid1, Acid2 và Acid3 kiểm tra. Năm 2000 là một năm quan trọng đối với Microsoft. Internet Explorer đã được phát hành cho Mac; điều này là quan trọng vì nó là trình duyệt đầu tiên hỗ trợ đầy đủ HTML 4.01 và CSS 1, nâng cao thanh về việc tuân thủ các tiêu chuẩn. Nó cũng là trình duyệt đầu tiên hỗ trợ đầy đủ các định dạng PNG định dạng hình ảnh. Trong thời gian này Netscape đã được bán cho AOL và điều này được xem như là mất mát chính thức của Netscape so với Microsoft trong cuộc chiến trình duyệt. Giai đoạn 1988 – nay: Kể từ đầu thế kỷ 21 các trang web đã trở nên ngày càng phổ biến trong cuộc sống. Khi điều này xảy ra kéo theo các công nghệ của web cũng phát triển. Cũng đã có những thay đổi đáng kể trong cách mọi người sử dụng và truy cập website, và điều này đã thay đổi như thế nào trong các trang web được thiết kế. Trình duyệt hiện đại: Kể từ khi kết thúc cuộc chiến trình duyệt đã có nhiều trình duyệt mới đưa vào thị trường. Nhiều trong số này là mã nguồn mở có nghĩa là họ có xu hướng phát triển nhanh hơn và hỗ trợ nhiều hơn các tiêu chuẩn mới. Những tùy chọn mới được nhiều người xem tốt hơn so với Microsoft Internet Explorer. Các trình duyệt phổ biến có thể kể tới như: Google Chrome, Mozilla Firefox, Apple Safari, Opera… Tiêu chuẩn mới: W3C đã phát hành tiêu chuẩn mới cho HTML (HTML5) và CSS (CSS3), cũng như phiên bản JavaScript API (từng là một tiêu chuẩn). Trong những năm trở lại đây, HTML5, CSS3, JavaScript đặc biệt là JQuery đã được sử dụng rộng rãi, giải quyết nhiều bài toán về ứng dụng nền web: trò chơi, phần mềm quản lý, web services... 1.2. Xu hƣớng phát triển của thiết kế web 1.2.1. Mobile-first Là một quy trình thực hiện thiết kế đi từ giao diện cho mobile đầu tiên sau đó mới tới những thiết bị khác như ipad, laptop, desktop… Các trang web thiết kế thân thiện với thiết bị di động cũng dần trở thành một xu hướng tất yếu, một tiêu chuẩn web không thể thiếu ngày nay. 5 1.2.2. Thiết kế website - Responsive Web Design Thiết kế responsive là website tự động biết được kích thước màn hình của thiết bị khách truy cập là như thế nào để hiển thị cho phù hợp trên màn hình đó. Vì vậy, thiết kế web responsive cũng trở nên rất phổ biến trong những năm gần đây nhờ vào sự gia tăng của việc sử dụng Internet trên thiết bị di động. Thiết kế responsive được sử dụng phổ biến và an toàn vì nó đại diện cho một cách tương đối đơn giản và giá rẻ cho các doanh nghiệp để xây dựng một trang web điện thoại di động thân thiện với đầy đủ chức năng. Nhưng thiết kế web đáp ứng không đi kèm với một số vấn đề nếu không được thực hiện đúng cách, yếu tố hướng tới người dùng luôn được chú trọng nhiều nhất. Hình 1.1. Thiết kế phù hợp với kích thước màn hình của thiết bị 1.2.3. Sử dụng các framework của CSS và JavaScript Các Framework như Bootstrap, Jquery... đã tồn tại trong nhiều năm và tiếp tục chứng minh sự hữu ích trên các dự án cả cá nhân và chuyên nghiệp. Việc sử dụng các framework này giúp cho lập trình viên dễ dàng hơn trong việc tạo ra các website và cả những ứng dụng nền web. Hiện nay, các framework của JavaScript như AngularJS, NodeJS... đang tiến một bước dài trong sự phát triển của website cũng như ứng dụng nền web. Việc tạo ra các ứng dụng nền web theo đó cũng phát triển nhanh chóng và trở thành một trong những hướng mũi nhọn của công nghệ phần mềm hiện đại. 1.3. Căn bản về HTML/HTML5 1.3.1. HTML là gì? - HTML là một ngôn ngữ đánh dấu dùng để miêu tả tài liệu web (các trang web). 6 - HTML viết tắt của Hyper Text Markup Language (ngôn ngữ đánh dấu siêu văn bản). - Một ngôn ngữ đánh dấu bao gồm một tập các thẻ đánh dấu nội dung. - Tài liệu HTML được đánh dấu bằng các thẻ HTML. - Mỗi thẻ HTML dùng để mô tả một nội dung nào đó trên trang web. - HTML do Tim Berner-Lee giới thiệu năm 1990 và hiện đang được World Wide Web Consortium (W3C) tiếp tục duy trì. 1.3.2. Tập tin HTML là gì? - Tập tin HTML là một tập tin text có chứa các thẻ HTML (tập tin có phần mở rộng là .html hoặc .htm) - Tập tin HTML còn được gọi là một trang web. - Nếu cú pháp có bị sai thì trình duyệt vẫn không báo lỗi, nó chỉ hiển thị không như ý muốn. 1.3.3. Thẻ trong HTML - Thẻ HTML là những từ khoá được định nghĩa trước nằm trong cặp dấu <...> nội dung 1.3.4. Cấu trúc của HTML Hình ảnh dưới đây mô tả cấu trúc cơ bản của HTML (một trang web). Hình 1.2. Cấu trúc cơ bản của HTML 7 1.3.5. Các phiên bản HTML Phiên bản Năm HTML 1991 HTML 2.0 1995 HTML 3.2 1997 HTML 4.01 1999 XHTML 2000 HTML5 2014 Bảng 1.1. Các phiên bản của HTML 1.4. Căn bản về CSS/CSS3 1.4.1. CSS là gì? CSS (Cascading Style Sheets) là một ngôn ngữ dùng để định dạng cho các phần tử HTML (Ví dụ: chỉnh kích cỡ chữ, chỉnh font chữ, màu chữ, màu nền, hình nền, đường viền,....) dựa trên các cặp thuộc tính: giá trị thuộc tính. Với việc sử dụng CSS, ta có thể định dạng ra các phần tử HTML thật đặc biệt và chuyên nghiệp. 1.4.2. Lịch sử CSS CSS được phát triển bởi Håkon Wium Lie vào 10/10/1994 và được duy trì bởi một nhóm CSS Working Group của W3C. Nhóm này duy trì và công bố các tài liệu mới nhất về CSS. - Lịch sử các phiên bản của CSS: CSS1 (Cascading Style Sheets 1) được công bố bởi W3C vào 12/1996. Phiên bản này miêu tả ngôn ngữ CSS cũng như mô hình định dạng đơn giản đầu tiên cho tất cả các thẻ HTML. CSS2 được công bố vào 5/1998, được phát triển dựa trên CSS1. Phiên bản này bổ sung sự hỗ trợ tới một số thiết bị (như máy in, …), các thiết bị về âm thanh, các bảng. CSS3 được công bố vào 6/1999. Tại phiên bản này, CSS được phân chia thành các Module nhỏ và từng Module chịu trách nhiệm cho một tính năng cụ thể nào đó. 8 1.4.3. Lợi thế của CSS CSS tiết kiệm thời gian và công sức: Nếu đã học qua về HTML, sẽ thấy một điều rằng: HTML không chứa bất cứ một thẻ nào để định dạng một trang web. HTML được tạo để miêu tả nội dung của một trang web, còn CSS được dùng để định dạng chúng. Bắt đầu từ HTML 3.2, các thẻ như và các thuộc tính như color được thêm vào. Việc thiết kế các trang web lớn, với thông tin về font và color trải dài qua nhiều trang đơn, thì việc xác định font và thêm thuộc tính color vào các trang này tốn rất nhiều thời gian và công sức. Để xử lý vấn đề này, World Wide Web Consortium (W3C) đã tạo ra CSS. Và từ đó, với CSS, lập trình viên tiết kiệm khá nhiều thời gian và công sức. Thay vì phải thêm font và color cho từng trang web một, giờ đây, họ chỉ cần tạo một tệp .css ở ngoài, và sau đó thêm vào từng trang web. Và khi đó, có thể thay đổi giao diện của cả một website lớn chỉ trong một thời gian rất ngắn bằng cách tạo các thay đổi trong tệp .css. Sử dụng CSS giúp trang web tải nhanh hơn: Sử dụng CSS, không cần phải viết từng thuộc tính cho từng thẻ HTML mỗi khi cần đến. Chỉ cần viết một định dạng (style) CSS trong tệp .css và áp dụng cho tất cả các thẻ đó. Ít code hơn tức là sẽ giúp trang web tải nhanh hơn. Sử dụng CSS giúp dễ dàng bảo trì và nâng cấp trang web hơn. CSS có nhiều thuộc tính hơn HTML. Do đó, sử dụng CSS giúp tạo các trang web đẹp hơn nhiều khi so sánh với việc sử dụng các thẻ và thuộc tính HTML thuần. Sử dụng CSS là phù hợp với chuẩn quốc tế. Hiện tại, rất nhiều thuộc tính của HTML đã trở thành cũ và nhiều trình duyệt không còn hỗ trợ chúng nữa. Do đó, để tương thích với các trình duyệt trong tương lai, nên sử dụng CSS. 1.5. Căn bản về JavaScript 1.5.1. JavaScript là gì? JavaScript (JS) là một ngôn ngữ lập trình phía client: mã được thực thi bởi trình duyệt của người dùng, sau khi trang web gửi về từ server. JavaScript được sử dụng để tạo ra các trang web có tính tương tác: - Chèn nội dung động vào trang web - Đáp ứng lại các thao tác của người dùng 9 - Lấy thông tin từ máy tính người sử dụng - Thực hiện tính toán trên máy tính người sử dụng - Tạo các ứng dụng, chức năng tương tác cho trang web JavaScript là ngôn ngữ lập trình phổ biến bậc nhất thế giới, và là một trong ba ngôn ngữ (HTML, CSS, JavaScript) mà tất cả lập trình viên web nhất định phải học. JavaScript được nhúng vào trang web để kết hợp với HTML/CSS. 1.5.2. Các lợi thế của JavaScript Sự tương tác server ít hơn: Có thể kiểm tra đầu vào (input) của người sử dụng trước khi gửi trang tới server. Điều này làm tiết kiệm lưu lượng tải ở server, nghĩa là server hoạt động ít hơn. Phản hồi ngay lập tức tới khách truy cập: Họ không phải chờ cho một trang web tải lại để thấy xem nếu họ đã quên nhập cái gì đó. Khả năng tương tác tăng lên: Có thể tạo các giao diện mà phản ứng lại khi người sử dụng rê chuột qua chúng hoặc kích hoạt chúng thông qua bàn phím. Giao diện phong phú hơn: có thể sử dụng JavaScript để bao gồm những mục như các thành phần Drag và Drop (DnD), các con trượt (Slider), cung cấp một Rich Interface (giao diện giàu tính năng) tới website khách truy cập. 1.5.3. Hạn chế của JavaScript Chúng ta không thể xem JavaScript như là một ngôn ngữ chương trình chính thức (full-fledged). Nó thiếu các tính năng quan trọng sau: Client-side JavaScript không cho phép đọc và ghi các file, bởi vì lý do bảo mật. JavaScript không được sử dụng cho việc kết nối mạng các ứng dụng bởi vì không có những hỗ trợ có sẵn. JavaScript không có bất kỳ khả năng đa luồng hoặc đa xử lý. Một lần nữa, JavaScript là một ngôn ngữ chương trình thông dịch, nhẹ mà cho phép xây dựng khả năng tương tác trong các trang HTML tĩnh. Kết luận Qua chương 1, chúng tôi đã giới thiệu tổng quan về thiết kế web. Chương 2 chúng tôi sẽ giới thiệu về lập trình trên ứng dụng trên thiết bị di động. 10 CHƢƠNG 2. GIỚI THIỆU VỀ LẬP TRÌNH ỨNG DỤNG TRÊN THIẾT BỊ DI ĐỘNG 2.1. Sự phát triển của thiết bị di động Ngày nay, dân số đang bùng nổ cùng sự phát triển mạnh mẽ của công nghệ thông tin, nhu cầu sử sử dụng các thiết bị nhỏ gọn, nhưng vẫn đáp ứng được các chức năng như một máy tính cá nhân ngày càng cao. Để tăng số lượng người dùng thì các hãng thiết bị di động đó phải lên ý tưởng và phát triển các ứng dụng thu hút được nhiều tầng lớp người sử dụng, khuyến khích các nhà lập trình viên phát triển thêm nhiều ứng dụng để làm phong phú kho ứng dụng của họ. Một phần mềm ứng dụng trên thiết bị di động, còn được gọi tắt là ứng dụng di động, hoặc chỉ ứng dụng là phần mềm ứng dụng được thiết kế để chạy trên điện thoại thông minh, máy tính bảng và các thiết bị di động khác. Các ứng dụng thường có sẵn thông qua các nhà phân phối ứng dụng, bắt đầu xuất hiện vào năm 2008 và thường được điều hành bởi các chủ sở hữu của hệ điều hành di động, như App Store, Google Play, Windows Phone Store,...Một số ứng dụng miễn phí, trong khi một số ứng dụng phải được mua. Ứng dụng di động ban đầu được cung cấp với mục đích thông tin tổng quát và các dịch vụ thông dụng trên mạng toàn cầu, bao gồm email, lịch, danh bạ, thị trường chứng khoán và thông tin thời tiết. Tuy nhiên, nhu cầu chung của những người sử dụng thiết bị di động và khả năng phát triển của các nhà lập trình đã mở rộng thành các loại khác, chẳng hạn như trò chơi di động, GPS và các dịch vụ dựa trên địa điểm, định vị và ngân hàng, để theo dõi, mua vé và các ứng dụng y tế di động gần đây. Sự bùng nổ về số lượng và sự đa dạng của các ứng dụng đã tạo ra tiềm năng và thị trường lớn. Theo thống kê của hãng nghiên cứu thị trường ứng dụng Flurry, trong năm 2015, số phiên sử dụng các ứng dụng di động trên toàn cầu tăng 58% so với năm 2014. Đứng đầu bảng tăng trưởng về số phiên sử dụng là các ứng dụng cá nhân hóa (Personalization) với tốc độ lên tới 332%. Theo dự báo của Flurry, số phiên sử dụng ứng dụng di động sẽ tiếp tục tăng cao hơn nữa khi số lượng ứng dụng ngày càng gia tăng và chúng ngày càng thân thiện hơn với khách hàng di động. 11
- Xem thêm -

Tài liệu liên quan