Ionic là một Framework mã nguồn mở có thể được sử dụng để phát triển các ứng dụng di động lai bằng các công nghệ Web như CSS, HTML5 và Sass. Ionic cung cấp một giao diện dòng lệnh mạnh mẽ có thể được sử dụng để tạo một dự án bằng một lệnh đơn giản. Ionic hỗ trợ Android, IOS và Universal Windows Platform để phát triển ứng dụng. Ionic sử dụng plugin Cardova để truy cập Camera, GPS và Đèn pin.
Trong hướng dẫn này, chúng ta sẽ học cách cài đặt Ionic framework trên Ubuntu 18.04 (Bionic Beaver).
Bạn có thể thêm Node.js PPA bằng lệnh sau:
Tiếp theo, cài đặt Node.js bằng lệnh sau:
Tiếp theo, bạn sẽ cần cài đặt Cordova vào hệ thống của mình. Bạn có thể cài đặt bằng lệnh sau:
Sau khi Ionic được cài đặt, bạn có thể kiểm tra phiên bản Ionic bằng lệnh sau:
Đầu ra:
Lệnh trên sẽ tạo một thư mục HelloWorld.
Tiếp theo, hãy đổi thư mục thành HelloWorld và liệt kê nội dung:
Bạn sẽ thấy đầu ra sau:
Tiếp theo, bật nền tảng Android và xây dựng dự án cho Android bằng lệnh sau:
Vậy là xong! Bây giờ bạn có thể dễ dàng xây dựng ứng dụng của mình.
Trong hướng dẫn này, chúng ta sẽ học cách cài đặt Ionic framework trên Ubuntu 18.04 (Bionic Beaver).
Yêu cầu
- Một máy chủ chạy Ubuntu 18.04 trên hệ thống của bạn.
- Một người dùng không phải root có quyền sudo.
Cài đặt Node.js và Cordova
Trước tiên, bạn sẽ cần cài đặt Node.js vào hệ thống của mình. Theo mặc định, phiên bản mới nhất của Node.js không có trong kho lưu trữ mặc định của Ubuntu 18.04. Vì vậy, bạn sẽ cần thêm PPA cho node.js vào hệ thống của mình.Bạn có thể thêm Node.js PPA bằng lệnh sau:
Mã:
sudo apt-get install python-software-properties -y
curl -sL https://deb.nodesource.com/setup_8.x | sudo -E bash -
Mã:
sudo apt-get install nodejs -y
Mã:
sudo npm install -g cordova
Cài đặt Ionic Framework
Ionic đi kèm với một tiện ích dòng lệnh tiện lợi để khởi động, xây dựng và đóng gói các ứng dụng Ionic. Bạn có thể cài đặt bằng cách chỉ cần chạy lệnh sau:
Mã:
sudo npm install -g ionic
Mã:
ionic -v
Mã:
3.20.0
Tạo dự án với Ionic
Tiếp theo, bạn sẽ cần tạo một dự án Cordova mới ở đâu đó trên máy tính để chứa mã cho ứng dụng của mình: Bạn có thể thực hiện việc này bằng lệnh sau:
Mã:
ionic start HelloWorld blank
Tiếp theo, hãy đổi thư mục thành HelloWorld và liệt kê nội dung:
Mã:
cd HelloWorld/
ls -l
Mã:
total 260-rw-r--r-- 1 3434 3434 92 9 tháng 6 15:43 ionic.config.jsondrwxr-xr-x 536 root root 20480 9 tháng 6 15:46 node_modules-rw-r--r-- 1 3434 3434 1135 9 tháng 6 15:43 package.json-rw-r--r-- 1 root root 224175 9 tháng 6 15:46 package-lock.jsondrwxr-xr-x 6 3434 3434 4096 9 tháng 6 15:43 src-rw-r--r-- 1 3434 3434 519 30 tháng 5 23:39 tsconfig.json-rw-r--r-- 1 3434 3434 178 30 tháng 5 23:39 tslint.json
Mã:
ionic platform add android
ionic cordova build android
ionic cordova emulate android