Cordova 프레임워크: Ionic 대 Framework7

요즘은 웹 개발자가 세상을 지배합니다. JavaScript는 프로그래밍할 수 있는 모든 곳에서 사용됩니다. 이러한 영역 중 모바일 앱 개발은 첫 번째 분기 방법 중 하나였습니다. 약 10년 전 PhoneGap은 iOS 및 Android용 HTML 및 JavaScript 앱 설치를 허용했습니다.

그 이후로 기술에는 기복이 있었습니다. 개발의 용이성에도 불구하고 이러한 앱은 분명히 기본 앱과 상당히 달랐습니다. Vanilla HTML 및 브라우저 기반 JavaScript는 브라우저를 대상으로 했으며 이 새로운 분야로 완벽하게 마이그레이션할 방법이 없었습니다.

오늘날까지도 주요 문제는 다음과 같습니다.

• 네이티브 디자인 및 애니메이션 준수의 어려움
• 복잡한 화면 전환 효과
• 터치 이벤트 처리
• 큰 목록에 대한 성능
• 고정 요소 위치 지정
• 다양한 화면 크기에 맞게 조정
• 기본 제어 요소의 위치(예: iOS 상태 표시줄)
• 다양한 모바일 브라우저에 적응

Cordova 앱용 프레임워크를 사용하는 이유

Cordova 기술은 위의 문제가 있는 앱으로 인해 종종 과소평가됩니다. 프레임워크는 이를 상쇄하고 HTML 앱을 디자인과 성능 모두에서 가능한 한 기본 앱에 가깝게 만드는 것을 목표로 합니다.

몇 가지 하이브리드 앱 예를 살펴보겠습니다. 그들은 현대 세계에서 웹 개발자의 확장을 촉진하도록 설정된 Onsen UI 외에 현재 가장 성공적인 두 가지 프레임워크인 Framework7과 Ionic으로 만들어졌습니다.

아이오닉 프레임워크 정보

Ionic은 2012년 Drifty Co.에서 개발했으며 Angular를 기반으로 합니다. 그 이후로 활발한 개발을 진행했으며 상당한 투자와 강력한 개발자 커뮤니티를 받았습니다. 공식 웹 사이트는 수백만 개의 앱이 이를 기반으로 개발되었다고 주장합니다.

이 글을 쓰는 시점에서 가장 최신 버전은 Angular 5를 기반으로 한 Ionic 3입니다. Angular로부터의 유연성과 독립성을 목표로 하는 Ionic 4는 초기 베타 버전입니다.

UI 엔진, 멋진 구성 요소 라이브러리 및 기본 장치 기능에 액세스하기 위한 인터페이스 외에도 Ionic은 여러 추가 기능, 서비스 및 유틸리티를 제공합니다.

아이오닉 CLI

Ionic의 명령줄 인터페이스는 대화형 프로젝트 초기화(예: 마법사), 페이지 및 구성 요소 생성, 이동 중에 앱을 빌드하고 라이브 다시 로드할 수 있는 개발 서버 실행에 사용됩니다. 또한 Ionic 클라우드 서비스와의 통합도 제공합니다.

랩 및 DevApp

Lab은 Ionic 개발자의 브라우저에서 다른 플랫폼의 응용 프로그램 작업을 모방할 수 있는 매우 유용한 미니 서비스입니다. DevApp을 사용하면 앱을 실제 장치에 빠르게 배포할 수 있습니다.

패키징, 배포 및 모니터링

Ionic은 테스터와 사용자를 위한 애플리케이션 구축, 디버깅, 테스트 및 업데이트를 간소화하고 가속화하는 웹 서비스 번들과 함께 제공됩니다.

그러나 Ionic의 계획은 자주 변경됩니다. Auth, Push, Analytics, View와 같은 일부 기존 서비스가 폐쇄되어 가입자들의 항의가 있었습니다.

창조자

기능적 인터페이스를 개발하기 위한 Ionic의 드래그 앤 드롭 그래픽 편집기입니다.

프레임워크 소개7

이 프레임워크는 2014년 러시아 스튜디오 iDangero에서 개발했습니다. 궁극적으로 한 개발자는 GitHub 리포지토리에 대한 몇 명의 사소한 기여자를 포함하지 않고 프로젝트에서 작업했습니다.

원래 Framework7은 최근에 출시된 iOS 7 스타일의 UI 구성 요소 집합으로 구성되어 이름을 얻었습니다. 이후 Android 테마가 추가되었으며 두 테마 모두 최신 iOS 및 Material Design용으로 업데이트되었습니다.

최근에 프로젝트 개발 속도가 빨라졌고 구성 요소 집합에서 대중적인 기술과 도구를 통합하는 모바일 응용 프로그램을 위한 본격적인 프레임워크로 확장되었습니다.

Framework7의 지원과 Vue.js를 사용한 예제는 v1부터 존재했으며 v3도 React를 지원합니다. 이것이 프로젝트가 Angular 및 TypeScript만 제공하는 더 인기 있는 Ionic과 진지하게 경쟁할 수 있게 해주는 것입니다.

설치 및 첫 실행

이온

Ionic 작업을 시작하려면 NPM과 함께 설치하십시오.

 npm install -g ionic

그런 다음 향후 응용 프로그램에 대한 템플릿을 선택합니다. 공식 Ionic 웹 사이트는 여러 템플릿을 제공하거나 빈 템플릿을 선택하여 ionic start myApp blank 를 사용하여 처음부터 애플리케이션을 빌드할 수 있습니다.

심플한 디자인을 선택합시다. 다음 명령을 실행합니다.

 ionic start Todo tabs

설치 프로그램 이 "네이티브 iOS 및 Android를 대상으로 하기 위해 Cordova와 새 앱을 통합하시겠습니까?" 라고 물으면 "예"라고 대답하십시오. 그러면 자동으로 애플리케이션을 Cordova와 통합하고 모바일 플랫폼에 배포할 수 있도록 준비합니다.

다음 단계에서 설치 프로그램은 Ionic Pro SDK에 연결할 것을 제안합니다. 예제를 간단하게 유지하기 위해 지금은 "아니오"라고 대답하십시오.

추가 @ionic/lab 패키지를 설치하여 iOS, Android 및 Windows 장치의 브라우저 내 모방인 편리한 디버깅 UI를 얻으십시오.

 cd Todo npm i --save-dev @ionic/lab

이제 디버그 모드에서 애플리케이션을 시작할 수 있습니다. 이를 통해 웹 브라우저에서 실시간으로 애플리케이션을 개발하고 디버그할 수 있습니다.

 ionic lab

결과적으로 몇 가지 유용한 주소를 얻을 수 있습니다.

Ionic Lab 디버깅 서비스는 포트 8200에서 시작됩니다. 애플리케이션 자체는 포트 8100에서 실행되며 Ionic Lab의 전체 화면 열기 링크가 그곳으로 연결됩니다. 실행 중인 Ionic Lab이 있는 브라우저 창이 자동으로 열립니다.

또한 Ionic은 로컬 네트워크 에서 애플리케이션 주소를 제공합니다. 이것은 장치가 로컬 네트워크에 있는 한(예: Wi-Fi를 통해) 모바일 장치 브라우저에서 응용 프로그램을 열 수 있으므로 매우 유용합니다. 또한 홈 화면에 추가 버튼을 사용하여 전체 화면 모드에서 애플리케이션을 다시 열 수 있습니다. 이것은 기기에서 애플리케이션을 테스트하는 가장 빠른 방법입니다.

또 다른 방법은 모바일 장치에 설치할 수 있고 로컬 네트워크를 통해 응용 프로그램에 대한 액세스를 제공하는 Ionic DevApp 응용 프로그램입니다. 기본 장치 기능에 대한 액세스 및 로그 표시를 위한 플러그인 지원(Ionic Native)을 제공합니다.

프레임워크7

F7의 개발 도구는 Ionic의 것보다 덜 고급이며 자동 초기화 CLI는 문서화되어 있지 않습니다. 그러나 공식 웹 사이트는 개발을 시작하는 데 도움이 되는 템플릿 프로젝트가 포함된 여러 GitHub 리포지토리를 제공합니다.

Ionic의 Tabs 템플릿과 유사하게 F7은 Tabbed Views 를 제공하지만 Framework7을 React와 통합하는 보다 기능적인 템플릿을 사용할 것입니다. React에 대한 지원이 v3에 추가되었습니다. 이를 위해 템플릿 리포지토리를 복제합니다.

 git clone https://github.com/framework7io/framework7-template-react.git Todo

프로젝트 폴더로 전환하고 종속성을 가져오고 프로세스를 시작합니다.

 cd Todo npm install npm start

실행 결과는 Ionic과 유사합니다. 실제 장치에서 즉시 액세스할 수 있도록 네트워크 내에서 로컬 링크와 링크를 얻습니다.

이제 브라우저에서 http://localhost:3000/ 을 열 수 있습니다. Framework7에는 내장된 장치 에뮬레이터가 포함되어 있지 않으므로 Chrome DevTools의 장치 모드를 사용하여 유사한 결과를 얻습니다.

보시다시피 Framework7은 iOS와 Material Design을 두 가지 표준 테마로 가지고 있다는 점에서 Ionic과 유사합니다. 테마는 플랫폼에 따라 선택됩니다.

안타깝게도 공식 React 템플릿에서 Vue.js를 지원하는 유사한 템플릿과 달리 Webpack은 아직 구현되지 않았으며 이로 인해 Hot Module Replace를 사용하여 페이지를 다시 로드하지 않고 애플리케이션을 빠르게 업데이트할 수 없습니다. 그래도 소스 코드를 변경할 때마다 페이지를 다시 로드하는 기본 라이브 다시 로드 기능을 사용할 수 있습니다.

코르도바 설정

Cordova를 사용하여 장치 및 에뮬레이터에 애플리케이션을 설치하려면 Cordova CLI는 물론 iOS 및 Android용 개발 도구를 다운로드하고 설정해야 합니다. 이에 대한 자세한 내용은 이전 기사와 Cordova 공식 웹사이트의 iOS 플랫폼 가이드 및 Android 플랫폼 가이드 섹션에서 확인할 수 있습니다.

이온

경험에 따르면 Ionic 문제의 대부분을 성공적으로 해결하려면 실제 장치에서 가끔 테스트하는 브라우저 기반 디버깅으로 충분합니다.

iOS 및 Android용 통합을 수락하고 Ionic이 config.xml 파일의 필수 설정과 resources 폴더의 리소스를 준비하고 있음에도 불구하고 Cordova를 사용하여 두 플랫폼을 모두 애플리케이션에 연결해야 합니다.

 cordova platform add ios cordova platform add android

이제 "실제" 에뮬레이터에서 Cordova 앱을 시작하고 모바일 장치에 설치하고 App Store 및 Google Play로 보낼 수도 있습니다.

다음 명령은 USB로 연결된 iOS 기기에 애플리케이션을 설치합니다. 그렇지 않으면 앱이 iOS 시뮬레이터에 설치됩니다.

 cordova run ios

아마도 Xcode 명령줄 도구는 개발자 인증서를 설정해야 할 필요성에 대해 알려줄 것입니다. Xcode에서 프로젝트를 열고 필요한 작업을 수행해야 합니다. 이 작업은 한 번만 수행하면 되며 이후에는 Cordova CLI로 애플리케이션을 실행할 수 있습니다.

때때로 iOS 시뮬레이터가 자동으로 실행되지 않습니다. 이 경우 Spotlight와 같이 수동으로 시작하십시오.

Android 에뮬레이터는 비슷한 방식으로 시작할 수 있습니다.

 cordova run android 

cordova run 명령은 ionic serve / ionic lab 서버를 사용하지 않는 이미 컴파일된 응용 프로그램을 시작하고 설치하므로 Live Reload가 작동하지 않습니다. 애플리케이션을 실시간으로 개발 및 디버그하려면 로컬 네트워크에서 브라우저를 사용하거나 Ionic DevApp 애플리케이션을 설치하십시오.

경험에 따르면 Ionic 문제의 대부분을 성공적으로 해결하려면 실제 장치에서 가끔 테스트하는 브라우저 기반 디버깅으로 충분합니다.

프레임워크7

앞서 선택한 "React" Framework7 템플릿은 Cordova에 대한 설정 자동화를 제공하지 않으므로 플랫폼을 수동으로 추가해야 합니다. 프로젝트 폴더의 cordova 하위 폴더에 Cordova 프로젝트를 생성합니다.

 cordova create cordova/ com.example.todo Todo cd cordova/ cordova platform add ios cordova platform add android cd ../

템플릿은 Create React App을 기반으로 하므로 Cordova 환경에서 컴파일된 프로젝트를 실행하려면 "homepage": "." 를 추가해야 합니다. ./package.json 파일로 설정합니다. 이 파일은 프로젝트의 루트 수준에서 찾을 수 있습니다.

Framework7 프로젝트를 컴파일하고 결과를 Cordova 프로젝트에 복사합니다.

 npm run build rm -rf cordova/www/* cp -r build/* cordova/www/

이제 기기나 에뮬레이터에서 애플리케이션을 시작할 수 있습니다.

 cd cordova/ cordova run ios 

당신은 끝났습니다! Framework7이 Ionic의 개발 표준과 초기 설정 편의성을 따라잡기를 바랍니다.

작업 목록 생성

이온

마지막으로 응용 프로그램 만들기를 시작하겠습니다! 이것은 To Do 응용 프로그램이기 때문에 기본 페이지( src/pages/home/home.html 파일)에는 "완료 표시" 및 "새 항목 추가" 기능이 있는 작업 목록이 포함됩니다.

Ionic은 목록에 대한 <ion-list> 및 <ion-item> 구성 요소를 제공합니다. 먼저 <ion-content> 요소에서 padding 속성을 제거하여 목록을 전체 화면으로 만듭니다. 목록에서 <ion-label> 요소를 사용하여 텍스트를 배치하고 완료된 작업을 표시하기 위해 <ion-toggle> 요소를 추가합니다.

 <ion-content> <ion-list> <ion-item> <ion-label>Hello</ion-label> <ion-toggle></ion-toggle> </ion-item> <ion-item> <ion-label>Toptal</ion-label> <ion-toggle></ion-toggle> </ion-item> <ion-item> <ion-label>Blog</ion-label> <ion-toggle></ion-toggle> </ion-item> </ion-list> </ion-content>

Ionic Lab 서비스가 실행 중인 브라우저 탭으로 돌아갑니다. 애플리케이션이 자동으로 업데이트되었습니다.

엄청난! 이제 작업 데이터를 JS 개체로 이동하고 Angular를 사용하여 HTML 프레젠테이션을 설정합니다. src/pages/home/home.ts 파일로 이동하여 HomePage 클래스 인스턴스의 tasks 속성을 만듭니다.

 export class HomePage { tasks = [{ name: 'Hello' }, { name: 'Toptal' }, { name: 'Blog' }]; constructor() { } }

이제 HTML 코드에서 tasks 배열을 참조할 수 있습니다. *ngFor Angular 구문을 사용하여 각 배열 요소에 대한 목록 요소를 반복적으로 생성합니다. 코드가 작아집니다.

 <ion-list> <ion-item *ngFor="let task of tasks"> <ion-label>{{task.name}}</ion-label> <ion-toggle></ion-toggle> </ion-item> </ion-list>

이제 페이지 머리글에 새 작업을 생성하는 버튼을 추가하면 됩니다. 이렇게 하려면 <ion-navbar> , <ion-buttons> , <button> 및 <ion-icon> 구성 요소를 사용합니다.

 <ion-header> <ion-navbar> <ion-title>To Do List</ion-title> <ion-buttons end> <button ion-button icon-only (click)="addTask()"> <ion-icon name="add-circle"></ion-icon> </button> </ion-buttons> </ion-navbar> </ion-header>

(click)="addTask()" Angular 구성에 유의하십시오. 짐작할 수 있듯이 버튼에 탭 핸들러를 추가하고 구성 요소에 대한 addTask() 메서드를 호출합니다. 버튼을 누를 때 작업 이름 대화 상자를 열도록 이 메서드를 구현해 보겠습니다.

이를 위해서는 AlertController Ionic 구성 요소가 필요합니다. 이 구성 요소를 사용하려면 해당 유형을 가져옵니다.

 import { AlertController } from 'ionic-angular';

그리고 페이지의 생성자 매개변수 목록에 지정합니다.

 constructor(public alertCtrl: AlertController) { }

이제 addTask() 메서드에서 호출할 수 있습니다. 컨트롤러 다음에 설정하십시오. 다음 호출을 사용하여 대화 상자 창을 만들고 표시할 수 있습니다.

 this.alertCtrl .create(/* options */) .present();

options 개체에서 메시지 헤더, 필드 설명 및 두 개의 버튼을 지정합니다. "확인" 버튼은 tasks 배열에 새 작업을 추가합니다.

 handler: (inputs) => { this.tasks.push({ name: inputs.name }); }

this.tasks 배열에 요소를 추가하면 구성 요소가 반응적으로 다시 빌드되고 새 작업이 목록에 표시됩니다.

전체 페이지 코드는 이제 다음과 같습니다.

 import { Component } from '@angular/core'; import { AlertController } from 'ionic-angular'; @Component({ selector: 'page-home', templateUrl: 'home.html' }) export class HomePage { tasks = [{ name: 'Hello' }, { name: 'Toptal' }, { name: 'Blog' }]; constructor(public alertCtrl: AlertController) { } addTask() { this.alertCtrl .create({ title: 'Add Task', inputs: [ { name: 'name', placeholder: 'Task' } ], buttons: [ { text: 'Cancel', role: 'cancel' }, { text: 'Add', handler: ({ name }) => { this.tasks.push({ name }); } } ] }) .present(); } } 

기기에 애플리케이션을 다시 설치합니다.

 cordova run ios

그게 다야! 그렇게 어렵지 않죠? 이제 Framework7에서도 동일한 작업을 수행해 보겠습니다.

프레임워크7

Framework7 템플릿은 모든 구성 요소 기능을 표시하도록 만들어 src/components/App.jsx 및 src/routes.js 파일의 src/components/pages/HomePage.jsx 페이지만 남겨두고 해당 콘텐츠를 정리하면 됩니다. 추가 코드 주석을 제거하십시오.

이제 작업 목록을 만듭니다. Framework7은 이를 위해 <List simple-list> 와 <ListItem> 컴포넌트를 제공합니다. 작업 완료 스위치를 배치하려면 <Toggle slot="after"/> 구성 요소를 추가하십시오. framework7-react 모듈에서 이러한 모든 구성 요소를 가져오는 것을 잊지 마십시오. 이제 페이지 코드는 다음과 같습니다.

 import React from 'react'; import { Page, Navbar, NavTitle, List, ListItem, Toggle } from 'framework7-react'; export default () => ( <Page> <Navbar> <NavTitle>To Do List</NavTitle> </Navbar> <List simple-list> <ListItem title="Hello"> <Toggle slot="after"/> </ListItem> <ListItem title="Toptal"> <Toggle slot="after"/> </ListItem> <ListItem title="Blog"> <Toggle slot="after"/> </ListItem> </List> </Page> );

그리고 응용 프로그램 자체는 다음과 같습니다.

꽤 좋은 시작입니다. HTML 코드에서 정적 데이터를 다시 이동해 보겠습니다. 이를 위해 우리가 가지고 있던 상태 비저장 대신 스마트 구성 요소를 사용하십시오. React에서 Component 추상 클래스를 가져옵니다.

 import React, { Component } from 'react';

그리고 state 변수 인스턴스에 작업 배열을 씁니다.

 export default class HomePage extends Component { state = { tasks: [{ name: 'Hello' }, { name: 'Toptal' }, { name: 'Blog' }] }; /* ... */ }

실제 응용 프로그램은 Redux 또는 MobX와 같은 보다 추상적인 데이터 흐름을 사용할 가능성이 높지만 작은 예에서는 내부 구성 요소 상태를 유지합니다.

이제 JSX 구문을 사용하여 배열의 각 작업에 대한 목록 요소를 반복적으로 생성할 수 있습니다.

 {this.state.tasks.map((task, i) => ( <ListItem title={task.name} key={i}> <Toggle slot="after"/> </ListItem> ))}

남은 것은 버튼이 있는 헤더를 추가하여 새 작업을 다시 만드는 것뿐입니다. <Navbar> 요소가 이미 있으므로 <NavRight> 요소에 <Link iconOnly> 를 추가합니다.

 <Navbar> <NavTitle>To Do List</NavTitle> <NavRight> <Link iconOnly iconF7="add_round_fill" onClick={this.addTask}/> </NavRight> </Navbar>

React에서는 onClick 속성을 사용하고 그 안에 콜백 포인터를 설정하여 탭 핸들러를 추가합니다. 작업 이름 대화 상자를 표시하는 핸들러를 구현합니다.

Framework7의 각 요소는 this.$f7 속성을 통해 애플리케이션 인스턴스에 액세스할 수 있습니다. 이 방법으로 dialog.prompt() 메서드를 사용할 수 있습니다. 대화 상자를 닫기 전에 React 구성 요소의 setState() 메서드를 호출하고 새 요소와 함께 이전 배열의 복사본을 전달합니다. 이렇게 하면 목록이 반응적으로 업데이트됩니다.

 addTask = () => { this.$f7.dialog.prompt('Task Name:', 'Add Task', (name) => { this.setState({ tasks: [ ...this.state.tasks, { name } ] }); }); };

전체 구성 요소 코드는 다음과 같습니다.

 import React, { Component } from 'react'; import { Page, Navbar, NavTitle, NavRight, Link, List, ListItem, Toggle } from 'framework7-react'; export default class HomePage extends Component { state = { tasks: [{ name: 'Hello' }, { name: 'Toptal' }, { name: 'Blog' }] }; addTask = () => { this.$f7.dialog.prompt('Task Name:', 'Add Task', (name) => { this.setState({ tasks: [ ...this.state.tasks, { name } ] }); }); }; render = () => ( <Page> <Navbar> <NavTitle>To Do List</NavTitle> <NavRight> <Link iconOnly iconF7="add_round_fill" onClick={this.addTask}/> </NavRight> </Navbar> <List simple-list> {this.state.tasks.map((task, i) => ( <ListItem title={task.name} key={i}> <Toggle slot="after"/> </ListItem> ))} </List> </Page> ); }

결과 확인:

남은 것은 장치를 다시 빌드하고 배포하는 것뿐입니다.

 npm run build rm -rf cordova/www/* cp -r build/* cordova/www/ cd cordova/ cordova run ios

완료!

이 두 프로젝트의 최종 코드는 GitHub에서 사용할 수 있습니다.

• 이온 토도 앱
• framework7 반응 할 일 앱

결과

이제 각 Cordova 프레임워크에 대한 전체 자습서를 보았습니다. Framework7은 Ionic과 어떻게 비교됩니까?

초기 설정

Ionic은 CLI 덕분에 훨씬 쉽게 설치할 수 있지만 F7은 처음부터 템플릿을 선택하고 설정하거나 단계별 설치에 더 많은 시간이 필요합니다.

구성 요소의 다양성

두 프레임워크 모두 iOS와 Material Design이라는 두 가지 테마로 훌륭하게 제작된 표준 구성 요소의 전체 세트를 가지고 있습니다. Ionic은 Windows 테마와 거대한 사용자 테마 시장에서 이러한 구성 요소를 추가로 제공합니다.

네이티브 디자인과 애니메이션을 완벽하게 모방하는 것 외에도 성능 최적화에 많은 관심을 기울여 환상적인 결과를 제공합니다. 두 프레임워크의 애플리케이션을 네이티브 애플리케이션과 구별하는 것이 거의 불가능한 경우가 많습니다.

Framework7은 Smart Select , Autocomplete , Calendar , Contacts List , Login Screen , Messages 및 Photo Browser 와 같은 더 복잡하고 유용한 구성 요소의 추가 목록을 제공합니다. 반면에 Ionic은 사용자가 만든 구성 요소의 거대한 선택을 제공합니다.

생태계와 커뮤니티

Ionic은 더 긴 수명, 강력한 재정 지원 및 활발한 커뮤니티 덕분에 이러한 매개변수에서 분명히 승리합니다. Ionic 인프라는 지속적으로 진화하고 있습니다. 지원 서비스 및 클라우드 솔루션이 새로운 솔루션으로 바뀌고 플러그인 수가 계속 증가하고 있습니다.

Framework7은 그 어느 때보 다 좋아졌지만 커뮤니티 지원이 많이 부족합니다.

타사 종속성

Framework7은 타사 솔루션과 관련하여 더 유연합니다. 가장 큰 장점은 아마도 프로젝트에서 Vue 또는 React를 사용하고 Webpack 또는 Browserify를 사용할지 여부를 선택할 수 있다는 것입니다. Ionic은 Angular를 기반으로 하며 이에 대한 지식이 필요합니다(따라서 TypeScript도 필요합니다).

그러나 최근 Ionic 개발자는 완전히 UI 프레임워크에 구애받지 않는다고 주장하는 새로운 Ionic 4 베타를 발표했습니다. 원하지 않는 경우 더 이상 Angular 종속성이 없습니다.

Cordova 프레임워크: 여전히 크로스 플랫폼 모바일 앱을 개발하는 강력한 방법

Cordova 사용 여부는 특정 프로젝트에 따라 다릅니다. 실제로 하이브리드 모바일 앱 개발 속도와 다중 플랫폼 지원이 주요 장점입니다. 그러나 그것은 항상 절충점이며 때로는 기본 접근 방식으로는 존재하지 않는 몇 가지 결함에 직면할 수 있습니다. 이 멋진 프레임워크와 커뮤니티는 이러한 결함을 줄이고 우리의 삶을 더 쉽게 만드는 데 큰 역할을 합니다. 그렇다면 시도해 보지 않으시겠습니까?