Atom - 바로 실행해보면서 배우는 HTML5/CSS3
바로 실행해보면서 배우는 HTML5/CSS3
  • Atom
    02 개발 환경 설정
    Atom

    Atom은 Github에서 만든 무료 에디터로, 다양한 프로그래밍 언어를 편집할 수 있으며 필요한 기능을 패키지 설치로 쉽게 확장할 수 있죠. Sublime Text, Textmate와 비슷한데, Node.js와 Electron을 기반으로 구성되어 있습니다. Atom 홈페이지에 접속하면 아래 사진의 노란색 버튼(Download)을 클릭하여 다운로드받을 수 있습니다.

    Atom은 윈도우, 리눅스 그리고 macOS를 모두 지원합니다. 설치를 완료하고 실행해보면 다음과 같이 실행됩니다.


    웹 개발을 위한 패키지 소개 및 설치


    상단 메뉴바에서 File을 클릭한 뒤 Setting을 통해 Themes 변경 및 Install에서 커스터마이징 할 수 있는 패키지를 설치할 수 있습니다.

    Install 탭에 들어가 보면 Editor를 Customizing 할 수 있는 몇 가지 Packages를 설치할 수 있습니다.

    wrap이라 검색하고 엔터를 치면 wrap-guide가 나옵니다. 에디터 안에서 오른쪽에 라인을 그려주는 Package인데 지워 사용하는 편이 더 깔끔하기 때문에 Disable 시키겠습니다.

    오른쪽 상단에 map이라 검색을 하면 minimap이 나옵니다. Code mini Map을 그려주는 유용한 Package이니 설치합니다.

    emmet 패키지는 웹 관련 코드를 자동완성 시켜주는 패키지입니다. 상당히 유용하지만 사용법을 어느 정도 숙지해야 하므로 인터넷에서 emmet 사용법을 검색해보신 뒤 사용하시기 바랍니다.

    이번에는 Editor로 들어와서 Soft Wrap에 체킹을 해줍니다. 라인이 허용치를 넘어가면 옆으로 스크롤이 생기는데 스크롤이 생기지 않고 아래로 넘어가도록 하는 옵션입니다.

    Q & A
    Q&A forum that anyone can ask and answer.
    Share your questions and answers with other students and grow together!
    Registered Questions(0)