개발툴의 선택지는 크게 세가지였습니다.
- IntelliJ - 강력한 기능, 자동 코드생성의 편의성, 유료
- Eclipse - 10여년을 쓴 익숙함, 무료, 무거움
- Visual Studio Code - 적당한 편리함, 가벼움, 무료
개인적인 코멘트에서도 느끼실 수 있겠지만, Visual Studio Code(이하 vscode)가 최선의 선택이라고 생각했습니다. IntelliJ가 제일 낫다는 평가였지만, 아직 돈을 쓰고 싶지는 않았습니다. Eclipse는 제일 익숙한 툴이긴 하지만, 원하는 설정을 만들기에는 너무 복잡할 것 같았습니다. 결론은 뭐 특별한 근거도 이유도 없습니다.
1) Visual Studio Code
https://code.visualstudio.com/
Visual Studio Code - Code Editing. Redefined
Visual Studio Code is a code editor redefined and optimized for building and debugging modern web and cloud applications. Visual Studio Code is free and available on your favorite platform - Linux, macOS, and Windows.
code.visualstudio.com
파일을 받아서 원하는 곳에 설치하시면 됩니다. 어짜피 workspace는 따로 설정할 수 있으니 큰 문제는 없습니다.
한국어 언어팩을 설치합니다. 물론 선택사항입니다. 저는 아무래도 툴을 익히는데 도움이 되지 싶어서 설치했습니다.
일단 여기까지 설치가 되었다면 성공입니다.
2) node.js
https://nodejs.org/en/download/
node.js로 backend를 만들지 않음에도 불구하고 설치는 했습니다. 설치 안해도 된다고 생각했는데, 차후에 react 설치시에 문제가 생겼습니다. npm 명령어를 실행하기 위해 필요한 듯 합니다. 자세한 건 잘 모르겠습니다.
설치는 installer 버전과 binary 버전이 있는데 큰 차이는 없어보입니다. 저는 installer 버전을 사용했습니다.
설치 과정의 이미지는 생략합니다.
설치 후 설치폴더를 확인 했을때 아래와 같으면 정상적으로 설치되었다고 보아도 무방합니다.
위의 폴더를 path에 추가합니다.
- [제어판] - [시스템] - [고급시스템 설정] - [고급] 탭 - [환경변수] - PATH 에 추가
[파일] - [작업영역에 폴더 추가] 한 후 터미널로 해당 작업폴더에 접근한다.
아래와 같이 터미널에서 [node -v], [npm -v] 명령어를 입력했을때 아래와 같이 출력되면 정상
이 이후의 작업은 하지 않아도 무방합니다.
그냥 재미삼아 해볼 분들만 따라하세요.
터미널에서 아래와 같이 npm init -y 를 입력합니다.
실행 후에 package.json 파일이 생성됩니다.
해당 폴더에서 app.js라는 이름의 새 파일을 작성하고
테스트 소스코드를 작성한다.
const http = require('http');
const hostname = '127.0.0.1';
const port = 3000;
const server = http.createServer((req, res) => {
res.statusCode = 200;
res.setHeader('Content-Type', 'text/plain');
res.end('Hello Node.js\n');
});
server.listen(port, hostname, () => {
console.log(`Server running at http://${hostname}:${port}/`);
});
[실행] - [디버깅 시작] 하면 디버그 콘솔에 아래와 같이 console.log의 내용이 찍히고,
브라우저로 접근했을때 res.end 의 내용이 출력되면 정상.
디버그 콘솔의 제일 아랫 줄에 표시 된 대로 브라우저에 접속
(위 화면 기준으로 Server running at http://127.0.0.1:3000/)
'무작정 따라하기 > Spring boot + React.js + MySql' 카테고리의 다른 글
| [Spring boot + React.js + MySQL무작정 따라하기] (1) 서문 (0) | 2020.05.25 |
|---|