안녕하세요!
또 왔습니다.
이번엔 제가 좋아하는 IntelliJ에 대해 설명드리는 시간입니다.
설치는 빠르게 빠르게 넘어가도록 하겠습니다.
이전 글 보러가기!!
-> [Spring Boot] 2. 나의 첫 스프링 부트 프로젝트 시작하기!
[Spring Boot] 2. 나의 첫 스프링 부트 프로젝트 시작하기!
안녕하세요! 이젠 조금 더 실전으로 나가볼까 합니다. 바로 스프링 부트 프로젝트를 만드는 날입니다!! 프레임워크는 똑똑한 사람들이 만들어놓은 프로젝트 틀이 있다고 했잖아요? 그래서 우리
hel-p.tistory.com
IntelliJ 설치
요 사이트로 들어가서 설치파일을 다운로드해봅시다~ -> IntelliJ IDEA 다운로드
IntelliJ IDEA 다운로드: 우수성과 인체 공학이 담긴 JetBrains Java IDE
www.jetbrains.com
본인에게 맞는 운영체제를 선택 후 무료/유료버전 중 어떤걸 사용할 건지 고르시면 됩니다!
만약 대학생이시라면 학교 메일을 통해 대학생 인증 후 Ultimate를 사용하시는것을 추천드립니다.
https://www.jetbrains.com/shop/eform/students 에 접속하셔서 학생 인증을 받아보세요.
아~~~주 간단합니다. 넘어갈게요!
IntelliJ로 프로젝트 열기
바탕화면에 생겨난 저 녀석을 더블클릭해줍시다.
위와 같은 화면이 나오면 설정 파일이 있냐고 물어보는 건데 그냥 없다하고 넘어가시면 됩니다.
이제 초기 화면의 등장입니다!!
2023년 버전을 다운받으신 분들은 Enable New UI 버튼을 클릭해주세요.
심플해지고 이쁜 UI로 설정하실 수 있답니다.
아마 꺼졌다가 다시 켜질건데 조금 기다려주시면 됩니다.
우리는 만들어진 프로젝트 폴더가 있기 때문에 New Project가 아닌 Open을 클릭해보겠습니다.
이전 시간에 만들었던 프로젝트 폴더가 있는 경로로 가줍시다.
저희가 이전에 프로젝트 생성할 때 build.gradle 파일 살펴봤던거 기억하시나요?
프로젝트를 열 때 해당 파일을 선택하고 Open하게되면 프로젝트에 필요한 것들을 자동으로 구성하게 됩니다.
그게 build.gradle 역할이거든요ㅎㅎ
하지만 프로젝트 폴더를 선택하고 OK를 눌러도 IntelliJ가 알아서 잘 구성해주기 때문에 shopping폴더를 선택하셔도 됩니다.
Open as File을 선택하면 build.grade 파일 하나만을 불러오기 때문에 프로젝트로 구성하기 위해 Open as Project를 선택해줍시다.
믿어줍시다!
이제부터 이곳이 저희가 코드를 작성할 공간 되시겠습니다.
IntelliJ 화면 살펴보기
아마 에디터의 오른쪽 아래에 위의 사진처럼 로딩바가 막 지나가고 계실겁니다.
저희가 구성한 프로젝트 파일들 외에 build.gradle에서 작성한 구성들을 설치하는 과정입니다. 이 과정이 끝날 때 까지 기다려주세요.
트리
왼쪽 위에는 프로젝트의 구성을 볼 수 있는 트리가 있습니다.
아마 처음은 Project로 선택이 되어 있을 겁니다.
저는 Packages 설정이 마음에 들어 Packages를 선택했고, 하나하나 눌러보면서 본인에게 맞는 트리 형태로 작업하시는걸 추천드립니다.
플러그인
화면 오른쪽 위 톱니바퀴를 누르시면 Plugin이라는 탭이 있습니다.
위에 선택되어 있는 플러그인을 설치하시면 IntelliJ가 한글화됩니다. 설치 후 프로그램 재시작하시면 됩니다.
이 외에도 여러 유용한 플러그인들을 설치하여 더욱 편하게 IntelliJ를 구성하실 수 있습니다.
실행
화면 오른쪽 위쯤에 위와 같은 버튼들이 보일것입니다.
▶ 버튼을 누르면 왼쪽에 보이는 ShoppingApplication이라는 것이 실행됩니다.
어디선가 들어본 ShoppingApplication을 알아보고 프로젝트의 구성을 살펴봅시다.
프로젝트 살펴보기
먼저 저희의 프로젝트인 shopping에서 main 패키지 속 모든 트리들을 펼쳐봅시다.
저희가 spring initializr에서 봤었을 때의 구성이랑 같은 것을 볼 수 있습니다.
build.gradle, settings.gradle등이 안보이는데 트리 형식을 제가 패키지로 해놓아서 그렇습니다.
트리 형식을 프로젝트로 해 놓게 되면 모든 파일들을 다 볼 수 있습니다.
일단은 간단하게 프로젝트들을 볼 수 있는 패키지 형식으로 확인해보겠습니다.
Application
ShoppingApplication.java를 확인하기 위해 해당 파일을 더블클릭하여 열었습니다.
Application이 저희의 프로그램 중 모든 것을 실행시켜주는 main의 역할로, application을 실행하는 것이 하나의 저희가 만든 프로그램 서버를 실행한다라고 생각하시면 됩니다.
그래서 위에 실행 창에서 ShoppingApplication이 default 옵션으로 실행 할 파일로 지정된 이유이기도 합니다.
Gradle
Gradle에서 저희가 프로젝트를 build할 때 설정한 구성들을 확인할 수 있습니다. 화면 제일 오른쪽에 있는 코끼리를 클릭하시면 됩니다.
Tasks와 Dependencies 두 폴더가 보이게 됩니다.
Tasks는 나중에 설명드리고 우선 Dependencies에 대해 설명드리겠습니다.
Dependencies는 프로젝트를 만들기 위해 이미 만들어진 다른 기능들을 가져와서 생기는 종속성에 대해 보여주는 공간입니다.
저희가 프로젝트를 생성하면서 Spring Web과 Lombok이란 두 기능을 가져왔던 것을 기억하실텐데, 그 두개가 위에서 빨간색으로 밑줄 친 두개입니다.
Spring Web은 또 이 기능을 위해 가져온 또 다른 기능들인 json, tomcat 등의 기능들을 종속성으로 갖게되고, 이게 트리를 열다보면 엄청나게 많은 기능들이 Spring Web을 실행하기 위해 존재하는지 확인하실 수 있습니다.
Resources
왼쪽 트리 구성을 프로젝트로 한 후 저희의 main 패키지를 펼쳐보면 아래와 같이 resources라는 폴더도 보이게 됩니다.
트리 구성을 패키지로 설정하게 되면 따로 resources폴더 없이 같이 보이게 되는데, 사실은 따로 구성되어있는것입니다.
여기서 static, templates 폴더는 Spring Web이란 기능을 추가하면서 생기게 되는 폴더입니다. Web의 주요 파일인 html을 해당 폴더에 넣으면 Spring Web이 자동으로 인식해서 나의 서버로 웹페이지를 띄워주는 역할을 하는 곳입니다.
두 폴더에 대한 차이는 Spring Web에 대해 설명드릴 때 알려드리겠습니다.
이 외에도 해당 공간에는 이미지, 동영상처럼 프로젝트를 구성하면서 필요한 여러 자원들을 저장해놓는 공간을 담당하고있습니다.
application.properties는 데이터베이스 접속 설정처럼 외부의 설정을 정의하는 공간입니다.
key=value 형식으로 사용해서 프로젝트 내의 다른 파일에 key값을 사용하여 value를 불러올 수 있습니다.
Test
마지막으로 저희의 프로젝트중에서 아직 안살펴본 공간인 test패키지를 살펴보겠습니다.
main 패키지와 같이 com.naver.shopping 패키지 안에 Application이 하나 존재합니다.
그러나 해당 Application은 서버를 실행시키기 위함이 아니고, 저희가 만든 기능들이 잘 동작하는지 테스트해보는 공간입니다.
추후에 저희가 기능을 개발하게 되면 여기 test패키지에서 기능 테스트를 하는 방법을 설명드리겠습니다.
Welcome page 만들기
국룰의 시간. HelloWorld를 찍어보겠습니다.
web에서 해볼까요?
Hello World 해보기
static 폴더에서 우클릭해서 HTML파일을 새로 만들어봅시다.
static 폴더에서 html파일을 만드는 방법은 위에서 설명드렸다시피 static이나 templates폴더 안의 html파일만 Spring Web이 찾아서 작업해 줄 수 있어서입니다.
그럼 만들어진 index.html의 body에 지긋지긋한 Hello World!!!를 입력해봅시다.
이제 실행해보시면 됩니다.
💡여기서 실행이란!
index.html을 실행하는 것이 아니고 위에서 말씀드렸다시피 Application을 실행해야 Spring 서버가 실행이 됩니다.
기타 다른 파일들은 Application이 찾아서 실행할 수 있도록 구성하는 것 뿐입니다.
실행버튼을 클릭하면 아래에 IntelliJ의 실행 화면이 나오게 됩니다.
아스키 아트로 스프링도 나오고 뭔가 간지나는 것들이 주루룩 나옵니다.
여기에서 저희의 Spring 서버가 실행이 된 것인데요. 보아하니 8080번 포트에 저희의 서버가 실행된 것 같습니다.
한번 접속해봅시다.
(localhost:8080)
성공적으로 저희가 index.html에 작성한 내용대로 나오는 것을 보실 수 있습니다.
왜 되지?
아무리 static폴더에 html파일을 만들었다 하더라도 따로 경로를 지정해서 index.html 페이지를 보여주도록 구성한 게 하나 없는데, 그냥 localhost:8080에 접속하니 바로 저희가 작성한 html 화면이 나왔습니다.
실행 화면에서 중요한 애들만 한줄한줄 읽으면서 알아보도록 하겠습니다.
- 맨 처음 Application을 실행하면서 Java 버전을 정립하게 됩니다.
- 여기서부터 Spring Web 기능을 추가하면 실행되는 것으로 위의 dependencies에서 확인한 바와 같이 Spring Web 안의 tomcat 기능이 실행되게 되고, 기본적으로 8080번 포트를 사용하게 됩니다.
- Spring에서 가장 기본으로 사용할 서버와 엔진을 Tomcat으로 지정합니다. 이로써 Spring의 서버는 Tomcat이 됩니다.
- welcome page를 추가하는 단계를 거칩니다. 해당 줄이 핵심입니다.
Spring Web에서 가장 기본적으로 있는 기능 중 하나인 welcome page 기능이 실행됩니다.
제가 위에서 html 파일을 만들 때 이름을 꼭 index로 지정하라고 했던 이유인데요.
Spring Web은 static폴더에 있는 index.html을 자동으로 welcome page로 지정합니다.
이는 말 그대로 환영하는 페이지로, 우리의 spring프로젝트에 들어오게 되면 맨 처음 보여지는 페이지를 설정할 수 있는 것입니다.
welcome page는 자동으로 우리의 프로젝트 서버의 가장 root 경로로 매핑이 되고, 그래서 localhost:8080만 입력하고 따로 경로도 입력하지 않았지만 자동으로 index.html의 내용이 나왔던 것입니다.
마치며
오늘은 IntelliJ IDEA라는 에디터를 설치해서 우리의 프로젝트인 shopping 프로젝트를 열어보고, 가장 간단한 welcome page를 만들어보았습니다.
아직은 시작부분이니 엄청 간단하고 멋지지 않은 프로젝트이지만 스프링 기능들을 배우면서 하나하나 추가하는 재미가 있을겁니다. 아마도요?
다음에는 앞으로 저희가 만들어갈 프로젝트의 요구사항에 대해 살펴보겠습니다. 그리고 그 요구사항중 일부를 구현하며 스프링의 계층 구조에 대해 알아보는 시간도 가지도록 하겠습니다.
마지막으로 해당 글부터 Github에 진행되는 코드를 올리기로 했습니다.
GitHub - KIMB0B/blog_spring: https://hel-p.tistory.com/category/%ED%94%84%EB%A0%88%EC%9E%84%EC%9B%8C%ED%81%AC/Spring%20boot
https://hel-p.tistory.com/category/%ED%94%84%EB%A0%88%EC%9E%84%EC%9B%8C%ED%81%AC/Spring%20boot - GitHub - KIMB0B/blog_spring: https://hel-p.tistory.com/category/%ED%94%84%EB%A0%88%EC%9E%84%EC%9B%8C...
github.com
해당 Repository에서 한 글당 하나씩 커밋을 추가할 예정입니다.
이번 글의 commit은 아래 링크로 들어가시면 확인 가능합니다.
Initial project + Welcome Page · KIMB0B/blog_spring@c667f3e
Initial project + Welcome Page · KIMB0B/blog_spring@c667f3e
[https://hel-p.tistory.com/26]
github.com
최초 commit이다보니 관련되지 않은 많은 파일들의 추가 기록도 있어서 index.html과 build.grade 정도만 참고하시면 될 것 같습니다.
다음 글 보러가기!!
-> [Spring Boot] 4. 기능 구현 시작 - 회원 (스프링의 계층 구조 알아보기)
[Spring Boot] 4. 기능 구현 시작 - 회원 (스프링의 계층 구조 알아보기)
안녕하세요. 오늘부턴 제대로 기능을 구현해보려고 합니다. 와아아아아아!!!!!!!!!! 갑자기 네이버의 대표님이 나에게 딱 와서 종이 하나만 딱 던져주고 갔다고 가정해볼게요. 거기엔 우리가 이제
hel-p.tistory.com
'프레임워크 > Spring boot' 카테고리의 다른 글
| [Spring Boot] 5. 기능 구현 시작 - 할인정책과 주문 (2) | 2023.12.01 |
|---|---|
| [Spring Boot] 4. 기능 구현 시작 - 회원 (스프링의 계층 구조 알아보기) (7) | 2023.04.20 |
| [Spring Boot] 2. 나의 첫 스프링 부트 프로젝트 시작하기! (0) | 2023.04.06 |
| [Spring Boot] 1. 객체 지향 프로그래밍을 해야 하는 이유 (2) | 2023.03.31 |
| [Spring Boot] 0. 스프링 부트 프레임워크 알아보기 (5) | 2023.03.21 |
