[Spring Boot] [VS Code] VSCode에 Spring Boot 개발 환경 세팅 및 샘플 프로젝트 생성, 실행

안녕하세요, 오늘은 MS(마이크로 소프트)의 오픈소스 무료 소스코드 편집 툴인 VS Code(비주얼 스튜디오 코드)에 Spring Boot 개발 환경을 세팅하고 간단히 프로젝트 생성 및 실행을 해보도록 하겠습니다. VSCode에서 스프링부트를 사용해보니, Eclipse 기반 STS와 비교하면 확실히 가볍고 빠른 장점이 있고, IntelliJ에 비교하면 무료 오픈소스이기 때문에 누구나 쉽게 접근이 가능합니다. 

1. Extension 설치

혹시 VSCode 설치가 안되어 있다면, VSCode 설치는 [ [Node.js 개발환경] Node.js 및 VS code 설치, Node.js 초기 프로젝트 생성 및 실행 ] 포스팅을 참고하세요~

VSCode 자체가 JAVA 언어만을 위한 툴이 아니라서 별도로 JAVA 언어 사용을 위한 Extension들을 설치해줘야합니다. 그전에 기본적으로 JAVA_HOME 환경변수 세팅은 완료되어 있어야 합니다. 그다음으로는 Spring Boot관련 Extension들을 설치해주면 VSCode에서 Spring Boot 프로젝트를 실행할 수 있게 됩니다.

VSCode에서 단축키 [Ctrl] + [Shift] + [X] 혹은 아래 좌측 메뉴의 Extensions 메뉴를 클릭합니다.

 

VsCode Extensions 메뉴
Extension 메뉴

 

 

아래의 2개 Extension Pack을 검색하여 Install 해주고, 설치가 완료되면 VSCode를 Reload 해줍니다.

  • Extension Pack for Java
  • Spring Boot Extension Pack

 

Java Extension PackSpringBoot Extension Pack
JAVA, Spring Boot Extension Pack

 

 

2. Spring Boot 프로젝트 생성

위에서 설치한 Spring Initializr를 이용해서 Spring Boot 프로젝트를 생성하도록 하겠습니다.

먼저, [Ctrl] + [Shift] + [P] 혹은 상단 메뉴 [View] > [Command Palette]를 실행하여, Spring Initializr를 입력합니다. 아래와 같이 Maven/Gradle 프로젝트를 선택하여 생성할 수 있는데 여기서는 Maven 프로젝트를 생성해보도록 하겠습니다.

 

Spring Initializr 실행
Spring Initializr

 

그런 다음, STS 혹은 spring.io 페이지 등에서 프로젝트 생성할 때 작성하는 아래와 같은 기본정보들을 입력 혹은 선택하도록 되어있습니다.

  • 스프링 부트 버전
  • 프로젝트 언어
  • 그룹 ID
  • Artifact ID
  • 패키지 타입
  • 자바버전
Spring Boot 기본정보 작성
Project 정보 입력

 

그리고 마지막으로 Dependency를 선택하도록 되어 있는데, 필요한 Dependency를 검색해서 선택하면 되고, 나중에 pom.xml 파일에 수동으로 추가를 해도 상관은 없습니다. 테스트로 Spring Web 디펜던시를 추가합니다.

 

Dependency 추가
Dependency 추가

 

모든 Dependecy를 선택하고 Enter를 누르면, 어느 경로에 프로젝트를 생성할 건지 선택을 하게 되면 아래와 같이 성공적으로 프로젝트가 생성되었다는 메시지가 뜹니다. 새 WorkSpace에 Open을 할지 현재 Workspce에 추가 (Add to Workspace)를 할지를 선택하면 생성된 프로젝트가 오픈됩니다.

경축! 아무것도 안하여 에스천사게임즈가 새로운 모습으로 재오픈 하였습니다.
어린이용이며, 설치가 필요없는 브라우저 게임입니다.
https://s1004games.com

 

프로젝트 생성 알림창

 

 

 

3. Spring Boot 프로젝트 실행

Exploere 탭에서 생성된 프로젝트의 resource > static (없으면, static 폴더 생성) 경로로 가서 우클릭을 통해, index.html 파일을 생성해줍니다.

 

index.html 파일 생성
index.html 파일 생성

 

생성된 index.html을 오픈하여 ! (느낌표)를 입력하면 html5 기본 소스를 자동으로 작성할 수 있도록 선택할 수 있는 창이 나오는데 느낌표 1개(!)를 선택을 하면 아래와 같이 작성이 됩니다. <body> 태그 안에 "안녕하세요"를 입력하고 저장합니다.

 

html 파일 작성
index.html 작성

 

이제 프로젝트를 실행을 하겠습니다. main>java.com.example.demo 밑에 @SpringBootApplication과 함께 자동으로 생성된 DemoApplication.java 파일을 선택 후, [F5] 혹은 우측 상단에 Run Java 아이콘을 클릭하면 프로젝트가 실행이 됩니다.

 

프로젝트 실행 화면
프로젝트 실행

 

웹브라우저에서 http://localhost:8080로 이동을 하면 아래와 같이 내가 작성한 index.html 파일이 정상적으로 웹서버를 통해 오픈되는 것을 확인할 수 있습니다. 위와 같이, VS Code로 간단하게 Spring Boot 프로젝트를 생성하여 실행을 해봤습니다.

 

실행 화면

 

 

[출처] https://kim-oriental.tistory.com/21

 

 

 

본 웹사이트는 광고를 포함하고 있습니다.
광고 클릭에서 발생하는 수익금은 모두 웹사이트 서버의 유지 및 관리, 그리고 기술 콘텐츠 향상을 위해 쓰여집니다.
번호 제목 글쓴이 날짜 조회 수
49 org.eclipse.ui.navigator Class CommonViewer 졸리운_곰 2019.07.04 398
48 MessageBox Example : Dialog « SWT JFace Eclipse « Java file 졸리운_곰 2019.06.16 362
47 Add Table Selection Listener and Get Selected TableItem : Table Event « SWT « Java Tutorial file 졸리운_곰 2019.06.16 372
46 Building and delivering a table editor with SWT/JFace file 졸리운_곰 2019.06.16 430
45 Demonstrates CellEditors : Table « SWT JFace Eclipse « Java file 졸리운_곰 2019.06.16 279
44 Demonstrates TableViewers : Table « SWT JFace Eclipse « Java file 졸리운_곰 2019.06.16 323
43 Eclipse RCP Tutorial: How to Add a Progress Bar file 졸리운_곰 2015.11.07 457
42 SWT Custom Widgets - Tutorial file 졸리운_곰 2015.08.23 379
41 Show a tool tip inside a rectangle : ToolTip « SWT « Java Tutorial file 졸리운_곰 2015.08.22 284
40 [SWT, Java] Tooltip example 졸리운_곰 2015.08.22 270
39 [SWT, Java], Button by Image, 이미지로 버튼 생성 졸리운_곰 2015.08.22 416
38 [SWT] Image Button 졸리운_곰 2015.08.22 277
37 [SWT] eventListener에서 부모 class (이벤트발생 클래스) 얻기 졸리운_곰 2015.08.16 340
36 [SWT] MessageBox Example file 졸리운_곰 2015.08.16 494
35 [SWT] How to create your own dialog classes file 졸리운_곰 2015.08.16 347
34 [SWT] Number Input Dialog file 졸리운_곰 2015.08.16 275
33 [SWT] Demonstrates a Canvas file 졸리운_곰 2015.08.12 268
32 SWT Control in One Example file 졸리운_곰 2015.08.10 403
31 SWT Tree With Multi columns file 졸리운_곰 2015.08.06 373
30 SWT Tree Composite 졸리운_곰 2015.08.06 289
대표 김성준 주소 : 경기 용인 분당수지 U타워 등록번호 : 142-07-27414
통신판매업 신고 : 제2012-용인수지-0185호 출판업 신고 : 수지구청 제 123호 개인정보보호최고책임자 : 김성준 sjkim70@stechstar.com
대표전화 : 010-4589-2193 [fax] 02-6280-1294 COPYRIGHT(C) stechstar.com ALL RIGHTS RESERVED