웹 개발자를위한 가장 유용한 10 가지 아톰 패키지
Atom을 사용해 보셨나요? 꽤 새로울지라도 많은 사람들이 Atom과 사랑에 빠졌습니다. GitHub에서 만든 텍스트 편집기는 많은 장점을 제공하며 무엇보다도 사용상 무료입니다. Atom에는 Git 및 트리 뷰와의 통합과 같은 몇 가지 기본 제공 패키지가 함께 제공됩니다. 그러나 개발 목적으로 다른 패키지가 필요합니다..
이 게시물에서 우리는 웹 개발자가 가지고 있어야하는 몇 가지 패키지를 선택했습니다. 어떤 것은 지저분한 코드를 정리하는 데 도움이되며, 다른 것들은 Atom을 떠나지 않고도 파일에 더 잘 액세스 할 수 있도록 도와줍니다. 10 가지 필수 Atom 패키지가 있습니다..
색상 선택기
이름에서 알 수 있듯이이 패키지를 사용하면 색상을 선택할 수 있으며 마우스 오른쪽 버튼을 클릭하고 '색상 피커'를 선택하는 것만 큼 쉽습니다. 또는 CMD / CTRL + SHIFT + C를 눌러 수행 할 수도 있습니다. HEX, HEXa, RGB, RGBa, HSL, HSLa, HSV, HSVa, VEC3 및 VEC4 또는 색상 변수 중 하나가 포함 된 CSS / SASS / LESS 파일의 텍스트 위에 커서를 놓으면 색상 선택기가 작동합니다. SASS 또는 LESS. 또한 형식 간 변환 기능도 있습니다..
개미
개미 텍스트 편집기 환경이 무엇이든간에 설치해야하는 플러그인 인 것 같습니다. 약어 확장 및 약어와 같은 Emmet의 주요 기능을 사용하면 HTML, CSS, Sass / SCSS 및 LESS 구문을 작성할 때 신속하게 작업 할 수 있습니다. 예를 들어, HTML에서는 다음과 같이 입력하십시오. p> a.mylink
그런 다음 Tab 키를 눌러 완전한 HTML 태그를 가져옵니다. . The Cheat Sheet는 Emmet의 약어 구문을 빨리 배우도록 도와줍니다..
미니 맵
Sublime Text에 익숙하다면 오른쪽 사이드 윈도우의 미니 미리보기에 익숙 할 것입니다. 이 기능은 창 높이가 너무 긴 소스 코드를 빠르게 스크롤하는 데 유용합니다. 와 미니 맵, 당신은 Atom을 위해 이것을 얻는다. 위치를 왼쪽이나 오른쪽으로 설정하고 코드 하이라이트를 켜거나 끄는 등의 작업을 할 수도 있습니다. Minimap에는 컬러 형광펜과 같은 기능을 확장하는 플러그인이 포함되어 있습니다..
아름답게 하다
아름답게 하다 지저분한 코드를 더 깔끔하고 읽기 쉽게 만들어 줄 것입니다. HTML, CSS, JavaScript, PHP, Python, Ruby, Java, C, C ++, C #, Objective-C, CoffeeScript, typescript 및 SQL과 같은 프로그래밍 언어를 지원합니다. 이 패키지를 설치 한 후 실행하려면 마우스 오른쪽 버튼을 클릭하고 '편집자의 콘텐츠를 아름답게해라', 또는 via 패키지> Atom Beautify> Beautify
.
아톰 린터
아톰 린터 주요 언어에 대한 linting 플러그인의 '집'으로 제공되어 linters의 최상위 API를 제공합니다. JavaScript, CoffeeScript, CSS / SASS / SCSS / LESS / STYLUS, Ruby, Python 용 linters가 있습니다. 한 언어로 JavaScript를위한 JSHint, JSCS 및 JSXHint와 같이 하나 이상의 플러그인을 사용할 수 있습니다..
이 기본 패키지를 설치 한 후에는 다음을 수행해야합니다. 당신이 일하는 언어를위한 특정 린터를 설치하십시오., 예를 들어 JavaScript를 사용하고 있고 JSHint를 linter로 선택한 경우 다음을 실행하여 설치할 수 있습니다. $ apm install linter-jshint
터미널에.
파일 아이콘
파일 아이콘 해당 파일 유형에 따라 파일 이름에 아이콘을 추가하십시오. 탭이나 트리 뷰에서 파일을 열면 시각적으로 개선됩니다. 파일 아이콘은 사용자 정의 할 수 있습니다. 자신의 아이콘을 추가하고 패키지 / 파일 아이콘 / 스타일
예배 규칙서. 기본 아이콘은 8 가지 색상과 3 가지 변형 (밝은, 중간 및 어두운 색상)으로 제공됩니다..
자바 스크립트 스 니펫
자바 스크립트 스 니펫 JS 소스 코드의 일부분을 빠르게 작성할 수 있습니다. 정의 된 약어로 단어에 대한 코드 워드를 작성할 필요가 없습니다. 예를 들면 다음과 같습니다. cl
만들다 console.log
과 미군 병사
...에 대한 getElementById
. 이 기능은 Emmet와 유사하지만 JavaScript 코드로 실행됩니다. 이 Atom 패키지는 함수, 콘솔 및 루프와 같은 많은 JavaScript 구문을 제공합니다.
CSS 빗
CSS 빗 스타일 시트 코드를 일관되게 형식을 지정하여 깔끔하고 아름답게 만듭니다. Yandex, Zen 또는 CSSComb 자체를 기반으로 미리 만들어진 정렬 환경 설정을 사용하거나 자신의 환경 설정을 사용하여 정렬 규칙을 만들 수도 있습니다. 이 패키지를 설치 한 후 CTRL + ALT + C를 누르거나 상황에 맞는 메뉴를 통해 정렬 작업을 수행 할 수 있습니다. 패키지> CSS 빗> 빗
.
힘내 플러스
힘내 플러스 Atom 편집기를 떠나지 않고 Git과 작업 할 수있다. 편집기 내에서 Git 커밋, 체크 아웃, 푸시 / 풀, diff 및 기타 git 명령을 만들 수 있습니다. 당신은 사용자 이름
과 user.email
git config 파일에 모든 기능이 작동하도록하십시오. 모든 자식 명령에 액세스하려면 CMD + SHIFT + H를 사용하여 팔레트를 열거 나 패키지> Git Plus
.
원격 편집
원격 편집 편집기에서 나가거나 다른 ftp 응용 프로그램을 사용하지 않고도 원격 파일을보고 편집 할 수 있습니다. 시작하려면 먼저 새 호스트를 만든 다음 메뉴를 통해 추가하십시오. 패키지> 원격 편집> 새 호스트 추가
로그인 정보를 삽입하십시오. 이제 원격 파일을 탐색하고 CTRL + ALT + B를 사용하여 등록 된 호스트를 찾아 파일을 볼 수 있습니다.