3월, 2018의 게시물 표시

Enact 개발환경 설정

Enact 개발환경 설정 Enact는 App 개발을 편리하게 도와주는 커맨드라인툴( Enact CLI )을 제공합니다. 이번 포스팅에서는 CLI를 이용하여 개발환경을 설정하는 방법을 소개합니다. 사전 준비 Enact 개발을 시작하기 앞서 몇 가지 software를 미리 설치해야 합니다. 가장 중요한 것은 Node JavaScript runtime 버전 6.4 이상입니다. 터미널창에서 node --version 명령으로 버전을 확인할 수 있습니다. 만약 설치되어 있지 않거나 예전버전이라면 위의 링크를 방문해서 설치해 주세요. Enact CLI 설치 Enact CLI는 Enact 앱을 생성, 테스트, 패키지등을 할 수 있도록 명령어를 제공합니다. npm 을 사용하여 설치할 수 있습니다. npm install -g @enact/cli 설치하고 나면 어디서든 enact 명령어를 실행할 수 있습니다. enact -v 명령을 통해 잘 설치되었는지 확인해 보세요. enact 전체 명령어에 대한 자세한 내용에 대해서는 다음을 참고하시기 바랍니다. package README Enact App 구조 새로운 앱을 생성하는데 사용하는 enact create [<directory>] 명령입니다. [<directory>] 는 옵션이며 기본값은 현재 디렉토리 입니다. create 명령은 기본 디렉토리 구조와 앱 환경을 설정합니다. 디렉토리 구조 앱 디렉토리는 다음을 포함합니다: README.md 앱을 생성하고 빌드하는데 필요한 유용한 팁들이 있습니다. package.json 앱을 정의하는 파일입니다. react 앱에서 사용하는 package.json과 동일할 목적을 갖고 있습니다. node_modules 외부 node module을 모두 포함하는 디렉토리 입니다. ( @enact/core , react 등) resources localization 파일을 포함하는 디렉토리 입니다.

Enact 프레임워크를 오픈합니다.

Enact 프레임워크를 오픈합니다 An app development framework built atop React that’s easy to use, performant and customizable. Enact(인액트)는 palm 과 webOS 의 프레임워크인 Enyo 를 전신으로 하는 새로운 웹앱 프레임워크의 이름입니다. 컴포넌트화, Virtual DOM, Package Management등 Web Front-end 개발을 위한 최신 트랜드를 적용하기 위하여 React 를 렌더링 라이브러리로 도입하였으며, 새로운 구조에서 모든 컴포넌트를 새로 개발하였습니다. 1년여간 webOS TV 를 통해 검증을 거치고 드디어 오픈을 하게되어 매우 기쁩니다. (webOS 4.0의 일부앱은 이미 Enact로 개발이 되었습니다) 목표 Enact의 목표는 견고하고 유지 보수가 쉬운 App을 작성하기 위한 기본요소를 제공하는 것입니다. 이를 위해 focus management, 국제화(i18n), Accessibiltiy(a11y), linting, test 및 빌드를 위한 최상의 솔루션을 모았습니다. 이를 재사용 가능한 컴포넌트로 구성하여 제공합니다. Enact는 이러한 컴포넌트를 cli 툴을 통해 매끄럽게 결합하여 개발자가 구현에 집중할 수 있도록 합니다. 주요기능 Focus Management: 4방향키 포커스 관리 Multi-resolution 지원 Internationalization: 다국어, 데이터포멧, RTL등 UI 컴포넌트(moonstone):  Storybook 참고 Virtuallize된 List와 Grid 컴포넌트를 지원합니다. Accessibility: 컴포넌트 레벨에 aria property와 role 적용 CLI Tool: Enact Application 생성, 빌드, 실행, 테스트등을 지원하며 Webpack, Babel, LESS, karma등을 사용합니다. npm 모듈로 제공되며 설치는 다음과 같이