VS Code는 회사에서도, 집에서도 많이 사용하는 IDE이다.

오늘은 간단하게 테스트할 것이 있어서 띄웠는데, MacOS에는 nodeJS가 설치가 되어 있지 않았다.

간단하게, "nodeJS"를 설치하고, 내친김에 Express를 설치하려고 한다.


NodeJS는 "https://nodejs.org/ko/" 또는 "https://nodejs.org/en/" 에서 다은 받아 설치하면, 된다. 
브로우저가 설치되어 있는 OS에 따라서 다운해서 설치할 바이너리가 달라진다. 



위 화면에 두개의 버전이 있는데, "10.14.2 LTS" 버전을 설치하기로 한다.

윈도우즈와 MacOS 버전 모두 바이너리 버전으로 설치하기 때문에, 다운 받아서 실행하면 바로 설치가 가능하다. (다른 방식으로 cli 명령으로 설치도 가능한데, 오늘은 쉽게 가기로 한다.)


설치가 완료되었으면, 설치 버전을 확인해 본다. nodeJS설치할때 같이 설치되는 패키지 매니져인 npm의 버전과 nodeJS의 버전을 아래과 같이 확인해 본다.

mymac$ npm -v

6.4.1

mymac$ node -v

v10.14.2


이번에는 nodeJS를 이용하여 웹을 개발할때 사용하는 Express 라는 Framework을 설치할 차례다.

Express는 "https://expressjs.com/ko/starter"에 나오는 순서대로 설치하면 된다.


아래와 같이 npm을 이용하여 express 패키지를 설치한다.  만약 설치시 권한문제로 설치가 단되면 sudo 명령을 사용해서 "sudo npm install express"와 같이 실행하면 된다.

mymac$ sudo npm install express

...


mymac$ sudo npm install express-generator -g 

...


자 이제 마지막으로, express를  이용하여 web 프로젝트를 생성해 본다.

아래의 "- e" 옵션은 templet엔진을 "ejs"를 사용하겠다는 옵션이다.

mymac$ express -e showdata

   create : showdata/

   create : showdata/public/

   create : showdata/public/javascripts/

   create : showdata/public/images/

   create : showdata/public/stylesheets/

   create : showdata/public/stylesheets/style.css

   create : showdata/routes/

   create : showdata/routes/index.js

   create : showdata/routes/users.js

   create : showdata/views/

   create : showdata/views/error.ejs

   create : showdata/views/index.ejs

   create : showdata/app.js

   create : showdata/package.json

   create : showdata/bin/

   create : showdata/bin/www


프로젝트가 생성이 되었으면 실행을 해보자.

아래와 같이 "showdata" 디렉토리로 이동해 들어가서, npm을 이용하여 기본 패키지를 설치하고, "npm start" 명령으로 서버를 동작시킨다.

mymac$ cd showdata

mymac$ npm install

mymac$ npm start


기본 포트는 3000번 포트를 사용하므로, 브라우저에서 "http://localhost:3000"을 치면 다음과 같은 화면이 나타나게 된다. 


만약, 실행 포트를 바꾸고 싶다면, "showdata/bin/www" 파일을 열어서 변경하면 된다.


 


  


 


WRITTEN BY
행복상자
행복한 마음으로 매일을 살고 싶은 개발자 입니다.

트랙백  0 , 댓글  0개가 달렸습니다.
secret

Visual Studio Code의 단축키들을 정리한 파일들이다. 가끔식 확인이 필요하거나 책상에 프린트에서 붙여 놓으면, 참고하는데 도움이 될 것이다.  VS Code의 메뉴상에서는 "도움말" > "바로가기 키참조"에서 확인 가능하다.


아래는 각 OS별로 작성된 Shortcut 키 매핑에 대한 파일들의 링크와 위치이다.



[MacOS용 Shortcut 파일] 

   https://code.visualstudio.com/shortcuts/keyboard-shortcuts-macos.pdf






[Windows용 Shortcut 파일

    https://code.visualstudio.com/shortcuts/keyboard-shortcuts-windows.pdf





[Linux용 Shortcut 파일]

    https://code.visualstudio.com/shortcuts/keyboard-shortcuts-linux.pdf




WRITTEN BY
행복상자
행복한 마음으로 매일을 살고 싶은 개발자 입니다.

트랙백  0 , 댓글  0개가 달렸습니다.
secret

지난 며칠전에 Windows 환경에서 리눅스나 Unix에서 사용하는 kill 명령과 비슷한 프로그램으로 "taskkill"에 대해서 이야기하였다. 내가 "taskkill"에 대해서 찾아보게된 계기는 Visual Studio의 Debug Mode상에서 생성된 Process를 중단할 필요에 의해서 였는데, 실제로 해보고 결과를 이야기하기로 하였었다. (지난 글)


"Taskkill"을 이용해서 Visual Studio개 생성한 Process의 제거는 결론적으로 실패였다.


우선 Visual Studio의 실행을 중단하고, 

TASKKILL /IM myprogram.exe /F /T

을 실행하거나 또는


TASKKILL /PID 1004 /F /T


를 실행해 보았지만, "Access Denied" 메시지를 보이고, 중단을 원하던 Process는 그대로 남아 있었다.


그래서, 또하나의 방법으로 "Power Shell"에서 제공하는 "Stop-Process" Cmdlet을 이용해 보기로 하였다. "Power Shell"은 kill 이라는 Alias명으로 이미정의 정의되어져서 "Stop-Process" 대신 사용이 가능하다.

(Power Shell의 "Stop-Process" 참조 사이트 : Version 6기준)


Powershell을 실행하고, 콘솔창에서 다음과 같이 실행하여 보았다.

Stop-Process -Name "myprogram.exe"

그러나 역시나 "Access Denied" 메시리즐 보이면서 Process를 중단하는 것을 실패했다. (다른 옵션들도 주고 테스트했지만 실패했다.)



뭔가 강력한 어떤것이 필요하다고 생각이 들어서, 이리 저리 찾아보니, WMI를 이용하는 방법을 찾았다. 

이전에 알던 WMI의 사용법은 Windows시스템에 대한 정보들을 얻어오는 방법으로 이용을 하곤 하였는데, 좀 다른 방식의 사용법으로 Process를 Kill하는 방법도 제공하고 있었다.


WMI를 사용하여 Process를 제거하는 방법은 다음과 같다.

WMIC process where name='myprogram.exe' delete


결과적으로는 그토록 중단시키려고 했던, 좀비 프로그램을 메모리에서 삭제해버리고야 말았다.


여러가지 방법들을 찾아서 실행하면서 이전에 모르던 많은 것들을 알게 되어서 나름 즐거웠다.

오랜만에 WMI를 살펴보니, Program 이름과 PID를 가져오는 방법도 제공하고 있는데, 좀 더 살펴보고 시간이 되면 정리해 봐야겠다.


공부할 것은 많다. 알게되는 것도 많지만, 잊어버리는 것도 그만큼 많은것 같다.



WRITTEN BY
행복상자
행복한 마음으로 매일을 살고 싶은 개발자 입니다.

트랙백  0 , 댓글  2개가 달렸습니다.
  1. taskkill 명령어가 안 먹혀서 검색하다 좋은 팁 알고 갑니다.
    WMI 로 하니 잘 되네요.
    감사합니다.
  2. 저도 이것 저것 해보다가 알아내기는 했는데,
    유익하다고 하시니 고맙습니다.
secret
마이크로 소프트 사이트에 "5 ways to speed up your PC" 라는 제목의 글이 올라와 있어서 잠시 일어 보았다. 위 링크의 사이트를 열어보면, 5가지 방법에 대해서 항목별로 정리도어 있는 것을 볼수가 있다.

간략하게 정리하면,
  • 1. Free up disk space
    - Remove temporary Internet files.
       (인터넷 임시 파일을 삭제한다.)
    - Remove downloaded program files (such as Microsoft ActiveX controls and Java applets)
       (ActiveX와 Java applets 같은 다운로드한 프로그램들을 삭제한다.)
    - Empty the Recycle Bin
       (휴지통을 비운다.)
    - Remove Windows temporary files
       (윈도우즈 임시저장 파일을 삭제한다.)
    - Remove optional Windows components that you don't use
       (사용하지 않는 윈도우즈 컴포넌트를 삭제한다.)
    - Remove installed programs that you no longer use
       (더 이상 사용되는 않는 프로그램을 삭제한다.)

    사용하지 않는 임시파일들과 프로그램들을 삭제한다. 윈도우의
    "시작>모든 프로그램>보조프로그램>시스템 도그>디스크 정리" 순으로 메뉴를 찾아 실행 시키면 디스크의 저장된 임시 파일들을 삭제할 수 있는 툴을 이용하여 정리하면 된다.
  • 2. Speed up access to data
       - 디스크 조각 모음을 실행시켜서, PC의 실행 속도를 향상시킨다.
       - 윈도우에서 제공하고 있는 툴은 다음 경로에서 실행시킬 수 있다. 
           "시작>모든 프로그램>보조프로그램>시스템 도그>디스크 조각 모임"
  • 3. Detect and repair disk errors
    - Check Disk를 실행하여 디스크의 Error가 있는지 확인한다.
    - 실행하는 방법은 "내 컴퓨터"에서 드라이브를 선택하고 왼쪽 마우스 버튼을 클릭하여, 나타난 메뉴중에서 등록정보를 선택한다. 

    그리고 위와 같은 화면이 나타나면, 도구 템을 선택하고, 이어서 상단의 "지금 검사(C)..." 버튼을 클릭한다.   그러면 아래와 같은 Pop-up화면이 나타나는데, 여기서 "불량 섹터 검사 및 복구 시도(N)"에 설정을 하고 시작 버튼을 누르면 된다.



  • 4. Protect your coputer against spyware
       - spyware를 검사하고 이를 제거한다.
  • 5. Learn all about ReadBoost
       - Windows Vist에서 지원한다. ReadBoost에 대한 세부 내용을 여기를 참고하면 된다.

 





WRITTEN BY
행복상자
행복한 마음으로 매일을 살고 싶은 개발자 입니다.

트랙백  0 , 댓글  0개가 달렸습니다.
secret