Ionic là một khuôn khổ mã nguồn mở và miễn phí để xây dựng các ứng dụng gốc và web đa nền tảng chất lượng cao. Nó đi kèm với một giao diện dòng lệnh mạnh mẽ giúp bạn tạo một dự án từ 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 bài đăng này, chúng tôi sẽ chỉ cho bạn cách cài đặt Ionic Mobile App Framework trên máy chủ Debian 10.
Sau khi tất cả các gói được đã cập nhật, bạn có thể cài đặt các gói cần thiết khác bằng lệnh sau.
Bạn có thể thêm kho lưu trữ nguồn Node bằng lệnh sau:
Sau khi kho lưu trữ được thêm vào, hãy cài đặt Node.js bằng lệnh sau:
Sau khi cài đặt Node.js, hãy xác minh phiên bản Node.js bằng lệnh sau:
Bạn sẽ thấy đầu ra sau:
Tiếp theo, bạn cũng cần cài đặt Cordova vào hệ thống của mình. Bạn có thể cài đặt nó bằng lệnh sau:
Sau khi cài đặt, bạn có thể tiến hành bước tiếp theo.
Sau khi cài đặt ionic, hãy xác minh phiên bản ionic bằng lệnh sau:
Bạn sẽ nhận được kết quả sau:
Bạn sẽ được yêu cầu chọn framework giữa React hoặc Angular, chỉ định tên dự án của bạn và chọn một mẫu như hiển thị bên dưới:
Bạn sẽ nhận được kết quả sau:
Bây giờ, hãy mở trình duyệt web của bạn và truy cập ứng dụng của bạn bằng URL
. Bạn sẽ thấy ứng dụng ionic của mình trên màn hình sau:
Trong bài đăng này, chúng tôi sẽ chỉ cho bạn cách cài đặt Ionic Mobile App Framework trên máy chủ Debian 10.
Điều kiện tiên quyết
- Một máy chủ chạy Debian 10.
- Một mật khẩu gốc được cấu hình trên máy chủ.
Bắt đầu
Đầu tiên, hãy cập nhật các gói hệ thống lên phiên bản đã cập nhật bằng cách chạy lệnh sau:
Mã:
apt-get update -y
Mã:
apt-get install curl gnupg2 wget -y
Cài đặt Node.js
Tiếp theo, 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ữ Debian. Vì vậy, bạn sẽ cần thêm kho lưu trữ nguồn Node vào hệ thống của mình.Bạn có thể thêm kho lưu trữ nguồn Node bằng lệnh sau:
Mã:
curl -sL https://deb.nodesource.com/setup_14.x | bash -
Mã:
apt-get install nodejs -y
Mã:
node --version
Mã:
v14.17.1
Mã:
npm install -g cordova
Cài đặt Ionic Framework
Trước tiên, bạn sẽ cần cài đặt tiện ích ionic CLI vào máy chủ của mình. Bạn có thể cài đặt bằng lệnh sau:
Mã:
npm i -g @ionic/cli
Mã:
ionic -v
Mã:
6.16.3
Tạo dự án bằng Ionic
Bây giờ, bạn có thể tạo dự án đầu tiên bằng lệnh sau:
Mã:
ionic start
Mã:
Chọn một framework! ????Vui lòng chọn framework JavaScript để sử dụng cho ứng dụng mới của bạn. Để bỏ qua lời nhắc này vào lần tới, hãy cung cấp giá trị cho tùy chọn--type.? Framework: AngularMọi ứng dụng tuyệt vời đều cần một cái tên! ????Vui lòng nhập tên đầy đủ của ứng dụng. Bạn có thể thay đổi điều này bất kỳ lúc nào. Để bỏ qua lời nhắc này vào lần tới, hãy cung cấp tên,đối số đầu tiên cho ionic start.? Tên dự án: myappHãy chọn mẫu khởi đầu hoàn hảo! ????Mẫu khởi đầu là các ứng dụng Ionic đã sẵn sàng, đi kèm với mọi thứ bạn cần để xây dựng ứng dụng của mình. Để bỏ qualời nhắc này vào lần tới, hãy cung cấp mẫu, đối số thứ hai cho ionic start.? Mẫu khởi đầu: tabs? Đang chuẩn bị thư mục ./myapp trong 3,69ms? Đang tải xuống và trích xuất tabs starter trong 591,18ms? Tích hợp ứng dụng mới của bạn với Capacitor để nhắm mục tiêu đến iOS và Android gốc? KhôngỨng dụng Ionic của bạn đã sẵn sàng! Thực hiện theo các bước sau:- Đi tới dự án mới của bạn: cd ./myapp- Chạy ionic serve trong thư mục ứng dụng để xem ứng dụng của bạn trong trình duyệt- Chạy ionic capacitor add để thêm dự án iOS hoặc Android gốc bằng Capacitor- Tạo biểu tượng ứng dụng và màn hình chào mừng bằng cordova-res --skip-config --copy- Khám phá tài liệu Ionic để biết các thành phần, hướng dẫn và nhiều thông tin khác: https://ion.link/docs- Xây dựng ứng dụng doanh nghiệp? Ionic có Hỗ trợ và Tính năng dành cho Doanh nghiệp: https://ion.link/enterprise-edition
Khởi động Ứng dụng
Bây giờ, hãy thay đổi thư mục thành dự án của bạn và khởi động ứng dụng bằng lệnh sau:
Mã:
cd myapp
ionic serve --host 0.0.0.0 --port 8100,/p>
Mã:
> ng run app:serve --host=0.0.0.0 --port=8100[INFO] Máy chủ phát triển đang chạy! Local: http://localhost:8100 External: http://216.98.11.73:8100 Sử dụng Ctrl+C để thoát khỏi quá trình này[INFO] Cửa sổ trình duyệt đã mở đến http://localhost:8100!