본문바로가기

Getting Started

Atom Alopex Package

AlopexUI 사용자의 개발 편의성을 위하여 Atom Editor 용 Package를 제공합니다.
Alopex UI
Alopex Grid
Atom Editor
Atom Alopex Package

Atom Editor 사용자는 Editor 내에서 Package 를 검색하여, 설치 및 업데이트를 받으 실 수 있습니다.
Atom Menu > Packages > Settings View > Install Packages/Themes > alopex 로 검색

주요 기능
  • Provide Welcome/Guide Page (with reference link , recommend other useful utility package)
  • HTML markup attributes autocompletions.
  • JavaScript API snippets.
  • UI component snippets (HTML markup).
  • Provide reusable ComponentSet (markup+script).
  • Download useful UI Template.

Welcome/Guide Page

Alopex 관련 Homepage 안내 및 기타 유용한 atom package 를 추천해드립니다.

Code Autocomplete/Snippets

AlopexUI를 이용한 개발 시 편의성을 위하여 코드 자동완성 및 스니펫 기능을 제공합니다.

HTML markup

HTML markup 작성 시 class 속성에 사용 가능한 AlopexUI 컴포넌트 목록을 제시해주며
또한, 선언된 Component 에서 사용 가능한 속성과 값을 자동으로 선별하여 제시합니다.
단, html 요소를 작성 가능한 파일에서 사용 가능합니다.(예:html,php,jsp 파일 등)

JavaScript API snippets

AlopexUI/Grid 의 JavaScript API 목록과 필요한 매개 변수 요소를 제시합니다.
단, JavaScript 파일 또는 HTML markup의 script 요소 안에서 사용 가능합니다.

UI Component snippets

AlopexUI 컴포넌트의 이름을 입력하는 것만으로도 해당 컴포넌트의 HTML markup을 자동 입력하여줍니다.

Reusable ComponentSet

자주 사용되는 화면 구성 요소별로 HTML markup과 그에 따른 JavaScript API 제어 부분이 포함 된 코드를 자동 입력하여줍니다.

Download UI Template

AlopexUI Homepage에서 제공하는 사이트 UI Template을 지정한 폴더 위치에 복사합니다.

Setting

Atom Menu > Packages > Settings View > Manage Packages > atom-alopex > Settings

Settings 화면에서 다음의 항목을 설정할 수 있습니다

  • Atom 구동 시 Welcome/Guide Page를 항상 볼 것인지 유무
  • HTML markup autocomplete 기능 사용 유무
  • Atom 구동 시 tree-view 기능 항상 표시 유무