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 Th
Trang 1TRƯỜ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
Trang 2TRƯỜ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
Lê Minh Sáng Giới Tính: Nam Dân tộc: Kinh
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
Trang 3LỜ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
Trang 4MỤ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
Trang 52.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
Trang 6KẾ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
Trang 7DANH 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
Trang 8Hì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
Trang 9DANH SÁCH THUẬT NGỮ VIẾT TẮT
Trang 10Hiệ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
Trang 116 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
Trang 12CHƯƠ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
Trang 13bả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
Trang 14củ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
Trang 151.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)
Trang 16- 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 < >
<tên_thẻ>nội dung</tên_thẻ>
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
Trang 17CSS (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 đó
Trang 181.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ư <font> 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
Trang 19- 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
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
Trang 20CHƯƠ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
Trang 21Phát triển ứng dụng cho thiết bị di động đã trở thành một trong những ngành công nghiệp được chú ý nhất trong thời gian qua và ngày càng nhiều doanh nghiệp cũng như các lập trình viên độc lập tham gia
Cơn sốt khiến tất cả các doanh nghiệp sản xuất ứng dụng phải giải quyết bài toán lập trình nên các ứng dụng vừa đẹp, vừa tiện dụng, vừa hay, phù hợp với thị hiếu và nhu cầu của người dùng Và xu hướng này chắc chắn sẽ còn phát triển trong 5-7 năm tới
2.2 Giới thiệu về lập trình ứng dụng trên thiết bị di động
Trên thị trường ứng dụng di động hiện nay, 3 hệ điều hành chiếm thị phần cao nhất là: Android, iOS và Windows Phone, tiếp sau là 1 số hệ điều hành khác như BlackBerry… Sau đây là giới thiệu về 3 hệ điều hành đứng đầu là Android, iOS và Windows Phone:
Hình 2.1 Biểu đồ phân tích thị phần ứng dụng của 3 hệ điều hành
2.2.1 Android
Theo biểu đồ thống kê của IDC, ta dễ nhận ra Android luôn chiếm hơn 70% thị phần của mảng di động Ứng dụng Android được viết bằng ngôn ngữ Java, do đó các lập trình viên Java có thể dễ dàng chuyển hướng qua mảng này
Android có quá nhiều thiết bị với đủ kích cỡ màn hình, cùng với vô số phiên bản (từ 2.0 cho tới 4.4 và hiện này là phiên bản Android 7.0 N) Điều này gây khá nhiều khó khăn cho lập trình viên khi viết app: Cần phải test đủ thứ, đảm bảo ứng dụng tương thích với nhiều thiết bị, không bị lỗi giao diện,
Trang 22Nếu muốn đưa ứng dụng lên Google Store, sẽ phải mua 1 tài khoản Android Developer Phí tài khoản này là 25$/năm
Hình 2.2 Cửa hàng ứng dụng CH Play của Android
Bộ phận kiểm duyệt của Apple Store cũng khắt khe hơn Google Play Store, nhiều khi phải chờ khá lâu để ứng dụng của mình được duyệt
Nếu muốn đưa ứng dụng lên Apple Store sẽ phải trả 100$/năm cho tài khoản Apple Developer, và mất thêm 1 khoản kha khá để mua thiết bị (iPhone, iPad) về test
Trang 23Hình 2.3 Cửa hàng ứng dụng App Store của Apple
2.2.3 Windows Phone
Windows Phone đã chậm chân khi gia nhập thị trường di động, nơi Android và iOS đã làm mưa làm gió khá lâu Mặc dù Microsoft đã có một số chính sách hỗ trợ developer, hệ thống ứng dụng trên Window App Store vẫn còn khá nghèo nàn Windows Phone được viết bằng ngôn ngữ C# kết hợp với XAML Windows Phone dễ code hơn, debug nhanh và tiện hơn Android Với Android, nếu không có thiết bị, ta phải debug trên máy ảo, chạy rất chậm… máy ảo của Window Phone lại rất tốt và nhanh
Tài khoản Window Phone Developer có giá rất rẻ, chỉ có 19$ và dùng mãi mãi
Hình 2.4 Cửa hàng ứng dụng của Windows Phone
2.3 Xu hướng phát triển của ứng dụng thiết bị di động
Hiện nay lập trình di động có 2 xu hướng phát triển chính là:
Trang 242.3.1 Dùng các ứng dụng Native
Cách phổ biến nhất để xây dựng các ứng dụng di động là sử dụng các công cụ native (gốc) đi cùng với nền tảng đó Native App nghĩa là lập trình viên sẽ sử dụng IDE, SDK mà nhà sản xuất cung cấp để lập trình ra một ứng dụng, xây dựng ứng dụng
đó thành file cài và gửi lên App Store để kiểm duyệt Với những ứng dụng game, xử lý ảnh, cần tính toán nhiều thì Native App là lựa chọn tốt nhất
- Một số ứng dụng Native:
Visual Studio
Hình 2.5 Giao diện ứng dụng Visual Studio
Visual Studio là (IDE – Integrated Development Environment) một bộ công cụ phát triển phần mềm do Microsoft phát triển Visual Studio cũng là một phần mềm được sử dụng bởi các lập trình viên để xây dựng nên các sản phẩm phần mềm Visual Studio có những điểm mạnh sau đây:
Hỗ trợ lập trình trên nhiều ngôn ngữ như C/C++, C#, F#, Visual Basic, HTML, CSS, JavaScript Phiên bản Visual Studio 2015 có hỗ trợ ngôn ngữ Python
Visual Studio là một công cụ hỗ trợ việc Debug một cách mạnh mẽ, dễ dàng nhất (Break Point, xem giá trị của biến trong quá trình chạy, hỗ trợ debug từng câu lệnh)
Trang 25 Giao diện Visual Studio rất dễ sử dụng đối với người mới bắt đầu
Visual Studio hỗ trợ phát triển ứng dụng desktop MFC, Windows Form, Universal App, ứng dụng mobileWindows Phone 8/8.1, Windows 10, Android (Xamarin), iOS và phát triển website Web Form, ASP.NET MVC và phát triển Microsoft Office
Visual Studio hỗ trợ kéo thả để xây dựng ứng dụng một cách chuyên nghiệp, giúp các bạn mới bắt đầu có thể tiếp cận nhanh hơn
Visual Studio cho phép chúng ta tích hợp những extension từ bên ngoài như Resharper (hỗ trợ quản lý và viết mã nhanh cho các ngôn ngữ thuộc Net), hay việc cài đặt thư viện nhanh chóng thông qua Nuget
Visual Studio được sử dụng đông đảo bởi lập trình viên trên toàn thế giới
Android Studio
Hình 2.6 Giao diện ứng dụng Android Studio
Android Studio là môi trường phát triển tích hợp để xây dựng ứng dụng dựa trên nền tảng Android do Google phát triển và được công bố vào ngày 16 tháng 5 năm
2013 Android Studio bắt đầu phát triển với phiên bản 0.1 vào tháng 5 năm 2013, cho đến hiện tại Google đã phát triển cập nhật phiên bản 1.5.1 vào khoảng tháng 12 năm
2015 Android studio dựa vào IntelliJ IDEA, là một IDE tốt nhất cho Java hiện nay
Do đó Android Studio sẽ là môi trường phát triển ứng dụng tốt nhất cho Android
Trang 26Công cụ này cho phép các lập trình viên dễ dàng tạo các ứng dụng, thay đổi nội dung và có khả năng tăng tốc sản phẩm, thiết kế giao diện đẹp và nhanh hơn Ngoài ra
nó còn cho phép chạy ứng dụng trên máy ảo, tiện lợi cho việc kiểm tra kết quả khi không có thiết bị
Gradle là nơi lưu trữ thư viện bên ngoài được tích hợp vào ứng dụng nhằm hỗ trợ xây dựng ứng dụng tốt hơn Phiên bản hiện tại giúp người dùng thao tác tiện lợi, sửa lỗi nhanh Công cụ lint giúp người dùng luôn giữ được hiệu suất ổn định, khả năng tương thích với các thiết bị, công cụ và những vấn đề khác… Giao diện chỉnh sửa đa dạng cho phép người dùng kéo thả các thành phần giao diện người dùng, tùy chọn xem trước bố cục trên các màn hình có kích thước khác nhau
Android Studio hỗ trợ mạnh mẽ trong việc xây dựng ứng Wear Android Build-in
hỗ trợ cho Google Cloud Platform trong việc tích hợp Google Cloud Messaging và App Engine
Android Studio cũng có một vài yêu cầu khá gay gắt cho việc sử dụng chúng Về phiên bản hệ điều hành phải là Microsoft Windows, Mac OS X, GNOME hay KDE hoặc Unity trên Ubuntu hay Fedora hoặc GNU / Linux Debian Bộ nhớ trong phải ít nhất là 2GB RAM, ổ đĩa phải có 500 MB không gian trống
Để có thể sử dụng máy ảo, bạn cần có ít nhất là 1GB RAM trống Môi trường phát triển phần mềm JDK phiên bản 7 trở lên, độ phân giải màn hình thấp nhất phải từ 800x 1280px
Xcode
Hình 2.7 Giao diện ứng dụng Xcode
Trang 27Phần mềm Xcode làn một IDE tích hợp các công cụ phát triển phần mềm do Apple phát triển và cung cấp cho các lập trình viên để phát triển các ứng dụng cho các thiết bị chạy hệ điều hành của Apple ( Mac OS, iOS) Xuất hiện lần đầu tiên năm
2003, bạn có thể tải phần mềm này từ AppStore (miễn phí) cho người dùng Mac OS X Lion và OS X Moutain Lion Trình biên dịch của Xcode gọi là Apple LLVM Compiler Trình biên dịch này hỗ trợ các ngôn ngữ lập trình như C, C++, Objective –
C, Objective C++, Java, AppleScript, Python và Ruby…
Xcode cũng cung cấp một chế độ gỡ lỗi thông minh hỗ trợ người dùng trong việc phát hiện lỗi, cảnh báo lỗi Xcode còn có tính năng sửa chữa các lỗi tự động Trong nhiều trường hợp Xcode sẽ không chỉ báo cáo một lỗi nó sẽ trình bày một giải pháp tốt
để khắc phục lỗi bằng cách nhấp chuột vào lỗi để sửa chữa Ví dụ như thêm một dấu chấm phẩy còn thiếu… Một phím tắt ngay lập tức sẽ sửa chữa lỗi và cho phép người dùng tiếp tục viết ứng dụng
Hơn thế nữa, kèm theo Xcode là một bộ tài liệu hướng dẫn từng bước, chi tiết và tiện lợi nhằm hỗ trợ người dùng trong việc lập trình Trong quá trình viết ứng dụng, nếu bạn muốn tìm hiểu thêm một đối tượng, bạn có thể sử dụng tới bộ tài liệu này để
có được hướng dẫn, ví dụ minh họa dễ hiểu
2.3.2 Dùng Framework
Framework thường là của các hãng thứ ba phát triển để lập trình đa nền tảng Framework là một thư viện các lớp đã được xây dựng hoàn chỉnh, bộ khung để phát triển các phần mềm ứng dụng Người lập trình viên chỉ cần tìm hiểu và khai thác các vật liệu này rồi thực hiện để gắn kết chúng lại với nhau, tạo ra sản phẩm Nếu có sẵn
bộ Framework thì lập trình viên chỉ viết lệnh lấy chúng ra từ Framework và ghép chúng lại
- Một số Framework:
PhoneGap
Trang 28Hình 2.8 Giao diện ứng dụng PhoneGap
Có thể được xem là cái tên nổi tiếng tiếp theo trong các giải pháp phát triển di động đa nền tảng, nhưng nó cũng có nhiều điểm gây khó hiểu cho mọi người PhoneGap về cơ bản là một tập các hàm JavaScript API, nó cho phép bạn có thể truy cập những khả năng gốc trong thiết bị di động Nó cũng là một wrapper và cho phép bạn xây dựng một ứng dụng web mà sẽ được cài đặt cục bộ trên thiết bị đó
Khi bạn xây dựng một ứng dụng sử dụng PhoneGap, thì về cơ bản là bạn đang xây dựng một trang web di động sử dụng HTML5 và JavaScript, cũng giống như bạn
đã xây dựng những trang web khác hiện nay, nhưng bạn đang đặt mã HTML và JavaScript đó trên thiết bị di động
Nếu bạn đang phát triển một ứng dụng PhoneGap, thì bạn có thể phát triển nó giống như một trang web di động đa nền tảng Bạn có thể sử dụng bất kỳ mobile framework nào mà bạn muốn, như Sencha Touch, hoặc JQuery Mobile, v.v…
Công cụ cho PhoneGap này phụ thuộc hoàn toàn vào môi trường mà bạn muốn xây dựng ứng dụng trên đó Bạn có thể phát triển nó trong bất cứ môi trường nào mà bạn thích và về cơ bản là sử dụng một plugin cho IDE trong hầu hết các trường hợp Cần phải có một số bước nhỏ thao tác bằng tay, vì thế công việc setup này không dễ cho lắm Nhưng một lợi ích lớn của PhoneGap là cho phép upload dự án của bạn vào
Trang 29bất cứ môi trường nào khác môi trường mà bạn đã tạo nó, và có thể build một cách tự động cho những nền tảng khác
Jquery
JQuery là một thư viện kiểu mới của JavaScript, được tạo bởi John Resig vào năm 2006 với một phương châm tuyệt vời: Write less, do more jQuery làm đơn giản hóa việc truyền tải HTML, xử lý sự kiện, tạo hiệu ứng động và tương tác Ajax Với jQuery, khái niệm Rapid Web Development đã không còn quá xa lạ jQuery là một bộ công cụ tiện ích JavaScript làm đơn giản hóa các tác vụ đa dạng với việc viết ít code hơn Dưới đây liệt kê một số tính năng tối quan trọng được hỗ trợ bởi jQuery:
Thao tác DOM – jQuery giúp dễ dàng lựa chọn các phần tử DOM để traverse một cách dễ dàng như sử dụng CSS, và chỉnh sửa nội dung của chúng bởi sử dụng phương tiện Selector mã nguồn mở, mà được gọi là Sizzle
Xử lý sự kiện − jQuery giúp tương tác với người dùng tốt hơn bằng việc
xử lý các sự kiện đa dạng mà không làm cho HTML code rối tung lên với các Event Handler
Hỗ trợ AJAX − jQuery giúp bạn rất nhiều để phát triển một site giàu tính năng và phản hồi tốt bởi sử dụng công nghệ AJAX
Hiệu ứng − jQuery đi kèm với rất nhiều các hiệu ứng đa dạng và đẹp mắt
mà bạn có thể sử dụng trong các Website của mình
Gọn nhẹ − jQuery là thư viện gọn nhẹ - nó chỉ có kích cỡ khoảng 19KB (gzipped)
Được hỗ trợ hầu hết bởi các trình duyệt hiện đại − jQuery được hỗ trợ hầu hết bởi các trình duyệt hiện đại, và làm việc tốt trên IE 6.0+, FF 2.0+, Safari 3.0+, Chrome và Opera 9.0+
Cập nhật và hỗ trợ các công nghệ mới nhất − jQuery hỗ trợ CSS3 Selector
và cú pháp XPath cơ bản
Kết luận
Qua chương 2, chúng tôi đã giới thiệu về lập trình ứng dụng trên thiết bị di động Chương 3 và chương 4 chúng tôi sẽ giới thiệu kĩ hơn tổng quan về JQuery Mobile và thiết kế ứng dụng quản lý sinh viên ngoại trú
Trang 30CHƯƠNG 3: TỔNG QUAN VỀ JQUERY MOBILE
3.1 Giới thiệu về JQuery
Đầu tiên trước khi bắt đầu học tập JQuery, chúng ta cần phải có một kiến thức cơ bản về:
- Mục đích của JQuery là giúp chúng ta sử dụng JavaScript được dễ dàng hơn
- JQuery cung cấp rất nhiều lệnh phổ biến mà yêu cầu rất nhiều dòng lệnh JavaScript để thực hiện, và chúng được gói gọn lại để chúng ta có thể gọi thông qua một dòng lệnh
- JQuery cũng làm đơn giản hóa rất nhiều thứ từ JavaScript, ví dụ như câu lệnh gọi AJAX và thao tác DOM (Document Object Model)
- Thư viện JQuery bao gồm các chức năng sau:
Thao tác trên HTML/DOM
Còn khi dùng JQuery, cũng là gọi hàm thôi nhưng nó ngắn gọn hơn nhiều, $(<tên tag>) Không chỉ có thế, $() còn rất đặc biệc khi cho phép chúng ta lựa chon ngẫu
Trang 31nhiên một element trên trang mà ko cần phải duyệt tuần tự Một khi đã “lấy” được các element trên trang một cách thuận tiện, ta sẽ tha hồ biến đổi, tạo hiệu ứng cho chúng,
từ việc đổi màu text, màu background, làm nó bay nhảy trên màn hình, phóng to thu nhỏ,… cho tới thay đổi nội dung mà ko cần load lại toàn bộ trang với kỹ thuật Ajax
3.2 JQuery Mobile
3.2.1 JQuery Mobile là gì?
- JQuery Mobile là một Framework được phát triển tương tự như thư viện JQuery nhưng nó được xây dựng dành cho các ứng dụng chạy trên Mobile Với JQuery thì ta chỉ xem như là một thư viện nhưng với JQuery Mobile thì ta có thể xem nó như là một Framework vì nó có đầy đủ các tính chất để tạo nên một ứng dụng hoàn chỉnh
- JQuery Mobile hoạt động hầu hết trên các thiết bị Smartphone và Tablet hiện nay như:
Apple® iOS: iPhone, iPod Touch, iPad (tất cả các phiên bản)
Android™: tất cả các thiết bị (tất cả các phiên bản)
Blackberry®: Torch (phiên bản 6)
Palm™: WebOS Pre, Pixi
Nokia®: N900
Hình 3.1 Các nền tảng di động đang được JQuery Moblie hỗ trợ
- JQuery Mobile được xây dựng dựa trên nền (cú pháp) của thư viện JQuery nên nếu chúng ta biết về JQuery thì rất dễ học bộ Framework này Ngoài ra JQuery Mobile còn đi kèm một file CSS để xây dựng giao diện dựa trên nền tảng HTML5, CSS3, Javascript và Ajax
3.2.2 Lịch sử của JQuery Mobile
JQuery Mobile là mộtkhung công tác web đượctối ưu hoá về cảm ứng, cụ thể hơn là một thư viện JavaScript, hiện đang được phát triển bởi nhóm dự án JQuery Sự phát triển tập trung vào việc tạo ra một khuôn khổ tương thích với một loạt các điện
Trang 32Khuôn mẫu JQuery Mobile tương thích với các khuôn khổ và nền tảng ứng dụng dành cho thiết bị di động khác như PhoneGap, Wordlight và nhiều hơn nữa
JQuery Mobile phát hành lần đầu vào ngày 16 tháng 10 năm 2010, phiên bản ổn định là phiên bản 1.4.5 được phát hành ngày 31 tháng 10 năm 2014 và được viết bằng JavaScript
3.2.3 Tại sao sử dụng JQuery Mobile?
Thông thường để xây dựng một ứng dụng trên thiết bị di động thì chúng phải xây dựng giao diện, xử lý sự kiện, xử lý hiệu ứng nên mất khá nhiều thời gian, chưa tính đến những vấn đề như tương thích trình duyệt và hệ điều hành Nhưng nếu chúng ta sử dụng JQuery Mobile thì nó không còn khó khăn nữa vì phương châm của JQuery
Mobile là "write less, do more" tức là "viết ít nhưng có tác dụng nhiều", nghĩa là
chúng ta không còn lo lắng vấn đề tương thích trình duyệt và các hệ điều hành của Smartphone nữa
3.2.4 Các tính năng cơ bản của JQuery Mobile
Đơn giản: Khung làm việc đơn giản, chúng ta có thể sử dụng mã JavaScript hay không cần dùng mã để tạo ra một trang web
Khả năng hỗ trợ các thiết bị di động: Các mã trong HTML5, CSS3 hay JavaScript đều hỗ trợ cho tất cả các thiết bị Còn JQuery Mobile thì lại hỗ trợ tối ưu cho các thiết bị di động bằng cách cải thiện được lỗi của HTML5, CSS3 và JavaScript
Dễ sử dụng: Nó được thiết kế với chủ ý giúp những người truy cập các trang web
dễ dùng hơn
Kích cỡ nhỏ: Kích cỡ tổng thể của khung JQuery Mobile khoảng 12kb với thư viện JavaScript, 6kb cho CSS và các biểu tượng khác
Tạo giao diện: Nó có cung cấp cho chúng ta một hệ thống giao diện, giúp chúng
ta có thể đưa ra các ứng dụng theo cách của riêng mình
3.2.5 Những vấn đề khi xây dựng App Mobile
- Có một câu hỏi nữa đặt ra là tại sao ta không viết ứng dụng cho từng nền tảng? Điều này rất tốt nhưng chúng ta sẽ phải tốn chi phí khá nhiều vì:
Android và Blackberry được viết từ Java
iOS được viết từ C
Window Phone được viết từ C# và NET,