|
1 | 1 | # 개발환경 설정 |
2 | 2 |
|
3 | | -* Node 설치 |
4 | | -JS의 단독 실행환경(V8 컴파일러), 라이브러리(fs, http 모듈 등) 제공 |
| 3 | +## Node 설치 |
| 4 | +Node는 Chrome의 V8 자바 스크립트 엔진에 기반한 자바 스크립트 런타임입니다. 노드는 자바스크립트의 단독 실행환경을 제공합니다. 필수적인 라이브러리(fs, http 모듈 등)를 제공하며 NPM 도구가 같이 설치됩니다. NPM 도구로 추가적으로 필요한 써드파티 라이브러리를 쉽게 설치할 수 있습니다. |
5 | 5 |
|
6 | | -* IDE Tool 설치 |
7 | | -Atom |
| 6 | +1. 브라우저에서 `node download` 키워드로 검색합니다. |
| 7 | +2. 사이트에서 OS에 맞는 노드를 다운받고 설치합니다. |
| 8 | +3. 콘솔에서 다음 명령으로 정상 설치여부를 확인합니다. |
| 9 | + |
| 10 | +```console |
| 11 | +$ node -v |
| 12 | +v10.14.1 |
| 13 | +``` |
| 14 | + |
| 15 | +## IDE Tool 설치 |
| 16 | +IDE 도구로써 Atom 에디터를 사용합니다. Atom은 현대적이고 사용자 친화적이며 개발대상에 맞추어 사용할 수있는 텍스트 편집기입니다. 커스터마이징을 통해 생산적으로 사용할 수 있습니다. Atom은 HTML, JavaScript, CSS 및 Node.js 통합으로 구축 된 데스크탑 응용 프로그램입니다. |
| 17 | + |
| 18 | +1. 브라우저에서 `atom download` 키워드로 검색합니다. |
| 19 | +2. 사이트에서 OS에 맞게 제안합니다. 다운받고 설치합니다. |
| 20 | +3. 설치는 자동으로 이루어지고 설치가 완료되면 아톰 에디터가 기동합니다. |
| 21 | +4. 노드를 인식시키기 위해서 아톰 에디터의 재 시작이 필요합니다. |
| 22 | + |
| 23 | +다음 사이트에서 기본적인 사용법을 확인하세요. |
| 24 | +`https://flight-manual.atom.io/getting-started/sections/atom-basics/` |
| 25 | + |
| 26 | +## 패키지 설치 |
| 27 | + |
| 28 | +패키지 설치를 위해서 아톰에서 `File > Settings > Install` 순으로 접근합니다. 검색박스에 패키지명의 전체 이름 또는 일부 이름을 넣고 `Packages` 버튼을 클릭합니다. 원하는 패키지 리스트에서 `Install` 버튼을 클릭하면 다운로드 및 설치가 진행됩니다. |
| 29 | + |
| 30 | +테마를 검색하고자 할 때는 `Packages` 버튼 대신 `Themes` 버튼을 클릭하세요. `https://atom.io/themes` 사이트를 참고해서 마음에 드는 테마를 추가하세요. |
| 31 | + |
| 32 | +패키지 소개정보를 살펴보고 쓸만한 패키지들을 설치하세요. |
| 33 | + |
| 34 | +`https://atom.io/packages` |
| 35 | + |
| 36 | +### 필수 패키지 |
| 37 | + |
| 38 | +#### atom-runner |
| 39 | +Runs scripts inside of Atom. |
| 40 | + |
| 41 | +#### file-icons |
| 42 | +Assign file extension icons and colours for improved visual grepping. |
| 43 | + |
| 44 | +#### highlight-selected |
| 45 | +Highlights the current word selected when double clicking. |
| 46 | + |
| 47 | +#### atom-beautify |
| 48 | +Beautify HTML, CSS, JavaScript, PHP, Python, Ruby, Java, C, C++, C#, Objective-C, CoffeeScript, TypeScript, Coldfusion, SQL, and more in Atom. |
| 49 | + |
| 50 | +#### autoclose-html |
| 51 | +Automates closing of HTML Tags. |
| 52 | + |
| 53 | +#### open-in-browsers |
| 54 | +Open in IE/Chrome/Firefox/Opera. |
| 55 | + |
| 56 | +#### docblockr |
| 57 | +A helper package for writing documentation. |
| 58 | + |
| 59 | +#### emmet |
| 60 | +It provides abbreviations for HTML auto-completion and intellisense inspired in CSS selectors, which makes the coding of HTML code much faster and comfortable. |
| 61 | + |
| 62 | +#### atom-typescript |
| 63 | +The only TypeScript plugin you will ever need. |
| 64 | + |
| 65 | +#### linter |
| 66 | +You can visualize errors and other types of messages with ease. |
| 67 | + |
| 68 | +#### linter-eslint |
| 69 | +Lint JavaScript on the fly, using ESLint. |
| 70 | + |
| 71 | +#### autocomplete-modules |
| 72 | +Autocomplete for require/import statements. |
| 73 | + |
| 74 | +#### autocomplete-paths |
| 75 | +Adds path autocompletion to autocomplete+. |
| 76 | + |
| 77 | +### 추천 패키지 |
| 78 | + |
| 79 | +#### pigments |
| 80 | +A package to display colors in project and files. |
| 81 | + |
| 82 | +#### editorconfig |
| 83 | +Helps developers maintain consistent coding styles between different editors. |
| 84 | + |
| 85 | +#### minimap |
| 86 | +A preview of the full source code. |
| 87 | + |
| 88 | +#### git-plus |
| 89 | +Do git things without the terminal. |
| 90 | + |
| 91 | +또는 이미 설치되어 있는 github 패키지를 이용한다. |
| 92 | +`https://flight-manual.atom.io/using-atom/sections/github-package/` |
| 93 | + |
| 94 | +#### hyperclick |
| 95 | +Pluggable text-clicking UI for Atom. |
| 96 | + |
| 97 | +#### js-hyperclick |
| 98 | +A hyperclick provider that lets you jump to where variables are defined. |
| 99 | + |
| 100 | +#### markdown-pdf |
| 101 | +Convert markdown to pdf, png or jpeg on the fly. |
| 102 | + |
| 103 | +#### markdown-preview-enhanced |
| 104 | +One of the 'BEST' markdown preview extensions for Atom editor! |
| 105 | + |
| 106 | +#### markdown-table-editor |
| 107 | +Markdown table editor/formatter. |
| 108 | + |
| 109 | +#### pdf-view |
| 110 | +Atom PDF viewer based on PDF.js. |
| 111 | + |
| 112 | +#### todo-show |
| 113 | +Finds all the TODOs, FIXMEs, CHANGEDs, etc. in your project. |
| 114 | + |
| 115 | +#### javascript-snippets |
| 116 | +JavaScript & NodeJS Snippets for Atom |
0 commit comments