본문 바로가기

개발/Node.js

[Node.js] Node.js 무료 Editor Atom 설치 및 Node.js 샘플코드 작성




Node.js  무료 Editor Atom 설치 및 Node.js 샘플코드 작성




이번엔 Node.js 개발을 위한 ( 물론 다른언어도 지원한다 ) 무료 Editor 인 Atom 을 설치해보도록 하겠다.


Atom 의 대표적인 특징은 바로 GitHub 에서 만들었다는 것이다.


GitHub 는 개발자라면 대부분 써봤거나 또는 들어봤을 대표적인 오픈소스 저장소이다.


평소에 개발 스터디를 할때 소스를 어떻게 관리할까 고민하다가  처음 사용해봤는데 매우 편리하게 사용하고 있고


혼자서 개발할때도 Github 를 통해서 소스를 관리하고 있다.


갑자기 왜 Github 를 얘기를 하려나 싶을수 있는데 Atom 은 소스를 작성하고 Github 에 바로 올릴수 있다는 장점이 있다.


이외에도 UI도 깔끔하고 오픈소스 저장소르 유명한만큼 많은 패키지가 배포되어있다.


따라서 Node.js 를 사용하고 개발하고 또 소스를 효과적으로 관리하기 위해 Atom 을 설치해보도록 하겠다.


사실 메뉴얼이 따로 필요없을 정도로 너무나 설치가 간편하기 때문에 굳이 블로그 작성을 해야 할까 고민했지만 


혹시 이마저도 도움이 필요한 분이 있을까 하여 작성하도록 하겠다. 



먼저 아래 URL 를 클릭하여 Atom 사이트에 접속하도록 한다.


https://atom.io/



위와같이 홈페이지에 접속하게되면 바로 우측에 [Download] 버튼이 있고 클릭하면 설치파일을 다운로드한다.


이제 다운로드받은 설치파일을 실행한다. 




설치파일을 실행하면 위와같이 창이 나타날것이다.


의외로 좀 무거운 느낌이 있어서 컴퓨터 환경에 따라서 시간을 꽤 걸릴수도 있다. 하지만 따로 할게 없으니 간편하다.


저 안에 그림이 움직이고 있으면 설치를 진행중이다.


설치가 완료 되면 바로 Editor 가 열릴것이다.



위와 같이 Editor 가 열리면 모든 설치가 완료된것이다.


너무나 간단하게 설치가 완료되어 몇가지 더 해보도록 하겠다.


만약 어두운 환경보다 밝은 환경에서 코딩을 하고싶다면 우측 에 [ Choose a Theme ] 를 클릭한다 .  





그러면 위와같이 우측에 새로운창이 나타난다. 

화살표가 그려진 UI Theme 의 One Dark 라고 되어있는 걸 선택하여 One Light 로 변경한다.




화면이 밝게 변하였다. 개인적으로는 어두운 화면이 좀더 코딩할때 집중이 잘되는것같다.


이제 상단의 탭을 다 제거한다음 코드를 작성해보록 하겠다.


[File] -> [New File] 를 선택한다. 그럼 빈 페이지가 하나 생성될 것이다.


그럼 간단한 Node.js 코드를 작성해보록 하겠다.


만약 Node.js 를 설치하지 않았다면 이전 포스팅에 있으니 참고하도록 하자 


[Node.js] Node.js 설치하기 (Windows10)


샘플코드는 Node.js 홈페이지에서 참고하였다


샘플코드 확인



생성된 페이지를 저장하면 위와같이 보인다. 파일명은 원하는대로 해도 되지만 뒤에 .js 를 꼭 붙여야 한다. 


Sample.js 라는 파일이름 으로 저장하였다. 


어두운 바탕에 여러색깔이 들어가니 세련된 느낌을 준다. 


이제 실제로 실행되는지 확인해보도록 하겠다.


실행은 커멘드라인 에서 해야 한다.


[window키] + [R] 키를 눌른다음 실행입력 칸에 [cmd] 를 입력한다. 그럼 아래와 같이 커맨드라인이 보일것이다.


cd .js파일이 저장된경로 


node Sample.js  [ Enter ]



node 를 실행하면 위와 같이 Server running at http://127.0.0.1:3000 이라는 메시지가 출력될것이다.


서버가 실행되었고 127.0.0.1 은 현재 실행되고있는 컴퓨터의 IP 주소를 말한다. 3000은 포트번호다.


위 샘플코드에서 hostname 변수와 port 변수에 설정되어있는 값이 재대로 반영됬다는걸 알 수 있다.


이제 브라우저를 열어 http://127.0.0.1:3000 를 입력해보자





정상적으로 샘플코드가 실행된것을 확인할 수 있다.


이걸로 Atom 을 설치하고 Node.js 샘플코드를 실행해보았다.


다음에는 Node.js 를 공부하기 위한 최소한의 자바사크립트 문법 및 함수선언 에 대해서 알아보도록 하겠다.



'개발 > Node.js' 카테고리의 다른 글

[JWT in Node.js] JWT (json web token) 이란?  (0) 2019.08.19
[Node.js] Node.js 설치하기 (Windows10)  (4) 2018.06.08