MEAN Stack 환경이 마이크로소프트에서 나온 Visual Studio Code 잘 맞는다는 이야기 귀동냥에 고대로 실행함 해본다.

일단 첫번째로는 Node.js 와 Express Framework 까지만 환경 설정하는걸로.

이 웹사이트의 매뉴얼대로만 해도 고대로 잘 됨.


설치환경 맥,맥OS,Mac OS X,맥 요시미테,Mac OS X Yosemite



순서

  1. node.js 설치 / Visual Studio Code 설치


  2. 익스프레스 설치
    npm install -g -express-generator
    express myExpressApp

    위 과정까지의 화면입니다.


    아 설치시에는 sudo 권한 필요합니다.

    cd myExpressApp
    npm install
    npm start


    아. 이것도 sudo 권한 필요합니다. ㅎㅎㅎ

    다음은 실행된 화면입니다.


    여기까지는 기본적인 Node.js 와 express 를 설치하는 과정이었습니다.
    이제 이 설치된 환경을 Visual Studio Code 에 적용시키는 과정입니다.^^


  3. TSD(TypeScript Definition Manager) 설치

    npm install -g tsd



    tsd query node --action install
    tsd query express --action install




    이제 전반적인 준비는 마쳤다. 


  4. Visual Studio Code 실행



  5. 이제 작업하면서 생성된 myExpressApp 디렉토리를 Visual Studio Code 에서 연결.





  6. 위와 같이 디렉토리를 선택하여 파일을 불러오면 이제 디버그 탭으로 이동하여 Lanch를 실행하여 줍니다.




  7. 실행화면




  8. 정상적으로 실행이 되었으나 디버깅 밑에 깔끔하게 아닌 느낌표가 나타나 있다.




    이제 이 부분은 디렉토리 설정 문제인데, app.js 파일 최 상단에 코드 한줄 추가 해준다.

    /// <reference path="./typings/node/node.d.ts"></reference>


이렇게 Visual Studio Code 에 node.js + express 환경을 설정하였다. 일단은 무작정 따라하기 였으므로,
추후 AngularJS 와 데이터베이스를 적용하는 것 까지 "시간봐서" 포스팅 해야겠다. ㅋㅋ



저작자 표시
신고
  1. ㅇㅅㅇ 2015.09.25 20:58 신고

    좋은 포스트 감사합니다 회사에서 MEAN 세미나로 여럿이 모여 환경구성 같이 했네요.
    다음 시간이 되실때 포스트가 궁금합니다. ㅎㅎ

+ Recent posts