Debian 10에 Ionic Framework를 설치하는 방법

이 페이지에서

전제 조건
시작하기\n
Node.js 설치
Ionic 프레임워크 설치\n
Ionic으로 프로젝트 만들기\n
애플리케이션 시작\n
결론

Ionic은 고품질의 크로스 플랫폼 네이티브 및 웹 앱을 구축하기 위한 무료 오픈 소스 프레임워크입니다. 간단한 명령으로 프로젝트를 생성하는 데 도움이 되는 강력한 명령줄 인터페이스가 함께 제공됩니다. Ionic은 앱 개발을 위해 Android, IOS 및 Universal Windows 플랫폼을 지원합니다. Ionic은 Cardova 플러그인을 사용하여 카메라, GPS 및 손전등에 액세스합니다.

이 게시물에서는 Debian 10 서버에 Ionic Mobile App Framework를 설치하는 방법을 보여줍니다.

전제 조건

Debian 10을 실행하는 서버.\n
루트 암호는 서버에서 구성됩니다.\n

시작하기

먼저 다음 명령을 실행하여 시스템 패키지를 업데이트된 버전으로 업데이트합니다.

apt-get update -y

모든 패키지가 업데이트되면 다음 명령을 사용하여 다른 필수 패키지를 설치할 수 있습니다.

apt-get install curl gnupg2 wget -y

Node.js 설치

다음으로 시스템에 Node.js를 설치해야 합니다. 기본적으로 Node.js의 최신 버전은 Debian 저장소에 포함되어 있지 않습니다. 따라서 노드 소스 리포지토리를 시스템에 추가해야 합니다.

다음 명령을 사용하여 노드 소스 리포지토리를 추가할 수 있습니다.

curl -sL https://deb.nodesource.com/setup_14.x | bash -

리포지토리가 추가되면 다음 명령을 사용하여 Node.js를 설치합니다.

apt-get install nodejs -y

Node.js를 설치한 후 다음 명령을 사용하여 Node.js 버전을 확인합니다.

node --version

다음 출력이 표시되어야 합니다.

v14.17.1

다음으로 시스템에 Cordova도 설치해야 합니다. 다음 명령으로 설치할 수 있습니다.

npm install -g cordova

설치가 완료되면 다음 단계로 진행할 수 있습니다.

이온 프레임워크 설치

먼저 ionic CLI 유틸리티를 서버에 설치해야 합니다. 다음 명령으로 설치할 수 있습니다.

npm i -g @ionic/cli

ionic을 설치한 후 다음 명령을 사용하여 ionic 버전을 확인합니다.

ionic -v

다음 출력이 표시되어야 합니다.

6.16.3

Ionic으로 프로젝트 만들기

이제 다음 명령을 사용하여 첫 번째 프로젝트를 만들 수 있습니다.

ionic start

React 또는 Angular 중에서 프레임워크를 선택하고 프로젝트 이름을 지정하고 아래와 같이 템플릿을 선택하라는 메시지가 표시됩니다.

Pick a framework! ????

Please select the JavaScript framework to use for your new app. To bypass this prompt next time, supply a value for the
--type option.

? Framework: Angular

Every great app needs a name! ????

Please enter the full name of your app. You can change this at any time. To bypass this prompt next time, supply name,
the first argument to ionic start.

? Project name: myapp

Let's pick the perfect starter template! ????

Starter templates are ready-to-go Ionic apps that come packed with everything you need to build your app. To bypass this
prompt next time, supply template, the second argument to ionic start.

? Starter template: tabs
? Preparing directory ./myapp in 3.69ms
? Downloading and extracting tabs starter in 591.18ms
? Integrate your new app with Capacitor to target native iOS and Android? No

Your Ionic app is ready! Follow these next steps:

- Go to your new project: cd ./myapp
- Run ionic serve within the app directory to see your app in the browser
- Run ionic capacitor add to add a native iOS or Android project using Capacitor
- Generate your app icon and splash screens using cordova-res --skip-config --copy
- Explore the Ionic docs for components, tutorials, and more: https://ion.link/docs
- Building an enterprise app? Ionic has Enterprise Support and Features: https://ion.link/enterprise-edition

애플리케이션 시작

이제 디렉터리를 프로젝트로 변경하고 다음 명령을 사용하여 애플리케이션을 시작합니다.

cd myapp
ionic serve --host 0.0.0.0 --port 8100,/p>

다음 출력이 표시되어야 합니다.

> ng run app:serve --host=0.0.0.0 --port=8100
[INFO] Development server running!
       
       Local: http://localhost:8100
       External: http://216.98.11.73:8100
       
       Use Ctrl+C to quit this process

[INFO] Browser window opened to http://localhost:8100!

이제 웹 브라우저를 열고 URL http://your-server-ip:8100을 사용하여 애플리케이션에 액세스하십시오. 다음 화면에 이온 애플리케이션이 표시되어야 합니다.

결론

축하합니다! Debian 10 서버에 Ionic 프레임워크를 성공적으로 설치했습니다. 이제 Ionic 프레임워크를 사용하여 모바일 애플리케이션 생성을 시작할 수 있습니다.