[Eulji_LikeLion_2024_BackEnd] 3차 Spring 웹 개발 기초

728x90

3차 목차

3-1 Spirng.io

1) Spring.io

2) 설정해보기 / 에러발생시

3) Running

3-2 디렉터리

3-3 라이브러리

1) 살펴 보기

2) 로깅

3-4 View

3-5 Build

3-6 정적

3-7 MVC and Templates

3-8 API 실습

3-1. Spring Start

1)Spring.io

Spring.io :https://start.spring.io/

저번 세션에서 간단하게 체험을 해보느라 자세하게 설명을 못들었을 것같아서 목차를 따로 만들었습니다.

스프링 프레임워크의 단점은 개발자가 직접 대부분의 설정을 수동으로 설정해야 한다는 점에서

많은 어려움이 있다는 단점이었다

스프링을 개발한 팀에서는 위와 같은 단점을 인지하였고 Spirng boot라는 것을 만들었습니다

Spring Boot는 spring의 기존 설정을 의존성으로 제공하며 편하게 개발자는 개발에만 집중할 수 있게 되었습니다.

제가 사용한 설정
Project : Gradle-Groovy
Language : Java

Spring boot : 3.2.4

java : 17 (java버전으로써 자신이 설치한 JDK버전 혹은 개발하고자 하는 JDK버전)

boot 3 java 17 이상
boot 2은 java 11 이상 사용- 이제는 지원X
뒤에 ( ) 붙어있는 건 아직 정식 릴리즈된것이 아닌겁니다
저는 공부하기 위함이기에 안정적인 정식출시된 버전을 사용합니다 (사진기준 3.2.4)

Dependencies는 간단하게 만들어져 있는 것을 불러오는 거라고 생각하면 될 듯합니다!
저는 ADD DEPENDNCIES에서 우선 spring web, Thymeleaf를 불러온 상태입니다

맨 아래 왼쪽에 있는 GENERATE를 누르면 zip파일 형식으로 다운로드가 자동으로 이뤄집니다

2) 설정 해보기

압축을 풀고나서

intellij에서 build.gradle를 실행을 합니다
실행후에 아래 사진과 같이 하단바에서
많은 다운로드및 설정이 진행되고 마무리된다. 다운로드가 끝난다면 일단 설정끝!

2-1) 설정진행중 에러

설정진행하다가 Error가 뜬다면..?

( 설치한 OpenJDK와 Spring.io에서 설정한 Java 의 버전이 동일하다고 할경우)

Intellij JDK 설치확인
Gradle JDK 설정

1, Intellij JDK설치 확인 부터 진행해보겠습니다.

왼쪽 위에 있는 File -> Project Structure 에서

Project Settings -> project에서 SDK를 필요한 JDK로 지정하면 완료입니다

그후 2번째 Gradle JDK 설정을 진행해보겠습니다
File -> Settings

Gradle가 기본설정인데 실행 속도가 느리기떄문에 다음과 같이 설정해놨다.(필수는아님)
Gradle의 SDK설정이 잘되어있는지 확인합니다.

sourceCompatibility = '17'

( build.gradle의 이부분을 확인하여 자신이 사용하는 위에서 설정한 버전과 같은지 확인하고

다를경우 프로젝트를 다시 만들거나 JDK를 재설치한다.)

한번 Gradle reload를 진행해보면 설치가 다시 진행될겁니다:)

3) Running

우선 Java는 늘 main에서 시작이 되기에 main함수를 실행 시켜 봅시다 ( main -> java-> .. Application)

main을 실행하고 나서 spring이 잘돌아가는지 확인해봅시다.

아래의 그림과 같이 진행하면 되겠습니다.

그후 localhost:8080을 주소창에 입력해서 확인한다

여기서 error가 뜨는 사람이 있다면 아래와 같은 코드인경우 해결방안을 이와같습니다.

Description:
Web server failed to start. Port 8080 was already in use.
Action:
Identify and stop the process that's listening on port 8080 or configure this application to listen on another port.

Process finished with exit code 1

사유는 8080포트를 사용중이기 때문에 8080을 이용을 못하고 있다는 의미입니다.

해결방안

(1) 8080을 할당중인 프로그램을 종료시켜 뺏기

cmd에 netstat -ano | findstr :8080
입력하여 사용중인 PID확인후 제거하기

저는 학교과제로 사용해야하는 프로그램이 선점했기 때문에 다른 방법으로 우회했습니다.

이런경우에는 4744를 죽이면 되겠습니다

(2) 우리가 피해서 다른포트를 사용하기

여기있는 application.properties에 서버 포트값을 변경해준다.

server.port=8081

application.properties가 없을경우 만들어서 코드를 입력해주세요.

그러고 다시 run을 하면 8081로 정상적으로 돌아갑니다.

그후 localhost:입력한포트로 접속합니다.

3-2. 디렉터리

스프링 부트 디렉터리를 간단하게 알아가보려고 합니다

- main

실제 코드를 작성하는 공간으로 프로젝트 실행에 필요한 소스 코드,리소스 파일 등등

모두 main 디렉터리 안에 들어 있습니다

main 디렉터리는 java와 resources 디렉터리로 구성되어 있다

java - 소스코드를 저장
resources - 내부에 static, templates,application.yml으로 구성되어 있으며
- static에는 js,css,image와 같은 정적 파일을 넣을때 사용한다
- application.yml는 스프링 부트 설정을 할 수 있는 파일이며 스프링 부트 서버가 실행되면 자동 로딩되는 파일

- test

프로젝트의 소스 코드를 테스트를 할 목적의 코드나 리소스 파일이 들어 있는 곳입니다

- build.gradle

빌드를 설정하는 파일

해당 파일에서 의존성이나 플러그인 설정등 과 같이 빌드에 필요한 설정을 할때 사용합니다

- setting.gradle

빌드할 프로젝트의 정보를 설정하는 파일입니다

3-3. 라이브러리

1) 살펴보기

Gradle에서 Dependencies에서 우리가 불러온 Thymeleaf..web...만 있는게 아니네요

자세히 보면 Libraries에서는 다양한것들이 다운로드 되어있는데

Web에서 필요한 라이브러리가 있고 Thymeleaf에서 필요한 라이브러리들이 설치되어있음을알수있다.

즉. 의존관계가 있는 라이브러리를 함께 다운로드한다.

우리가 설치한 라이브러리들의 의존/연관성

spring-boot-starter-web
- spring-boot-starter-tomcat: 톰캣 (웹서버)
- spring-webmvc: 스프링 웹 MVC
spring-boot-starter-thymeleaf: 타임리프 템플릿 엔진(View)
spring-boot-starter(공통): 스프링 부트 + 스프링 코어 + 로깅
- spring-boot
- spring-core
- spring-boot-starter-logging
  - logback, slf4j
spring-boot-starter-test

junit: 테스트 프레임워크
mockito: 목 라이브러리
assertj: 테스트 코드를 좀 더 편하게 작성하게 도와주는 라이브러리
spring-test: 스프링 통합 테스트 지원

2) 로깅(logging)

로깅은 운영중인 웹 어플리케이션의 문제의 원인을 파악하기 위해 로그를 남기는 행위이다.

문제의 정보를 얻기 위해서 문제,예외,중요한 기능이 돌아가는 곳에 적절하게 로그를 기록하여야한다.

그럼 System.out.println()을 사용하지 않고 굳이 logging을 사용하는 이유

logging

스레드 정보, 클래스 이름 같은 부가 정보를 함께 볼 수 있고, 출력 모양을 조정할 수 있다.
개발서버,, 운영서버마다 로그를 상황에 맞게 조절할 수 있다.
파일,네트워크등 로그를 별도의 위치에 기록 가능하고 파일에서는 일별로 로그를 분할하는 것도 가능

3-4 View

스프링 부트가 제공하는 Welcome Page

static/index.html을 올려두면 기능 제공
https://docs.spring.io/spring-boot/docs/current/reference/html/web.html#web.servlet.spring-mvc.welcome-page

thymeleaf 템플릿 엔진

: loop를 쓰거나 모양을 바꿀 수 있다.

공식 사이트 : http://www.thymeleaf.org/
스프링 공식 튜토리얼 : http://spring.io/guides/gs/serving-web-content/
스프링부트 메뉴얼 : http://docs.spring.io/spring-boot/docs/3.0.6.RELEASE/reference/html/spring-boot-features.html#boot-features-spring-mvc-template-engines

thymeleaf 템플릿엔진 동작 확인

실행 : http://localhost:8080/hello

내장 톰켓 서버를 통해 컨트롤러에서 리턴 값으로 문자를 반환하면 뷰 리졸버(viewResolver)가 화면을 찾아서 처리한다.
스프링 부트 템플릿엔진 기본 viewName 매핑
resources:templates/+{ViewName}+.html

위에서 저와 같은 방법으로 포트를 변경한 경우는입니다:)

http://localhost:8081/hello

3-5. Build

Cmd창을 킵니다.

1. gradlew.bat build (추가내용 + ) ./gradlew build (리눅스혹은 git bush, 맥 사용자)
2. cd build/libs
3. java -jar hello-spring-0.0.1-SNAPSHOT.jar
4. 실행 확인

cmd창에서 파일이 저장되어있는 폴더까지 들어갑니다!
gradlew.bat build 입력후

입력후 생기는 모습!

위에 빌드가 끝나면 아래처럼 빌드파일이 생깁니다.

build가 생겼다!

build파일 안에 있는 libs파일로 들어간다

그후 java -jar hello-spring-0.0.1-SNAPSHOT.jar 입하면 실행이된다 (실행하기전 intellij에서 run되어있는지 확인)

(에러가 뜨셨다면[BackEnd] 2주차 Q&A의 JAVA_HOME확인)

build파일에 libs를 들어간 후에 파일 생성된것을 확인하는 모습

java -jar hello-spring-0.0.1-SNAPSHOT.jar을 입력하고나면

스프링이 작동하는 모습이 보입니다.

정상적으로 localhost에서 돌아감을 볼 수 있다.

+)
build는 어떻게 지우나요!

gradlew.bat clean 또는 gradlew.bat clean build
둘의 차이점
프로젝트 빌드 제거 gradlew.bat clean
제거와 동시에 새로운 빌드 gradlew.bat clean build

+추가내용) ./gradlew clean .
/gradlew clean build
(리눅스혹은 git bush 맥 사용자)

왼쪽 gradlew.bat clean 오른쪽 gradlew.bat clean build

왼쪽엔 build파일이 없고 오른쪽에는 build파일이 있는것이 확인된다!

3-6. 정적 컨텐츠

Spring Boot -정적 컨텐츠

정적 컨텐츠는 웹 페이지에서 동적으로 생성되지 않고,
미리 만들어진 HTML, CSS, JavaScript 파일 등으로 이루어진 정적인 파일들을 말합니다.
이러한 파일들은 서버에서 클라이언트에 직접 전송되며,
클라이언트 측에서는 웹 페이지를 불러올 때 이 파일들을 받아와 렌더링하게 됩니다.

(서버에서 뭐하는것이 없이 웹브라우저로 바로 내려주는거 라고 이해하면 편할듯하다.)

스프링 부트에서 정적컨텐츠 요약
정적.html -> 내장 톰켓 서버 요청받음 -> 스프링에게 넘김 -> 컨테이너에서 관련 컨트롤러가 없네..?

-> 그럼 resources : static/정적.html을 찾음 -> 출력

3-7 MVC and Templates

MVC : Model, View, Controller 각자의 역할에 집중할 수 있도록 하기위함.

Controller를 조작하면 Controller는 Model을 통해 가져온 데이터 바탕으로 View를 통해 시각적으로 사용자에게 전달

@Controller

@Controller
public class HelloController {
 @GetMapping("hello-mvc")
 public String helloMvc(@RequestParam("name") String name, Model model) {
 model.addAttribute("name", name); //키값 name을 넣으면 name을 변수로 보내는 식
 return "hello-template";
 }
}

@Controller
뷰에 표시될 데이터가 있는 Model 객체를 만들고 올바른 뷰를 선택하는 일을 담당합니다.
@ResponseBody를 사용하여 HTTP Response Body에 데이터를 담아 요청을 완료할 수 있습니다.

@RequestParam
컨트롤러의 메소드 매개변수에 지정하면,
Spring은 해당 매개변수의 이름과 일치하는 요청 매개변수를 찾아서 값을 할당합니다.

@GetMapping
Spring Framework에서 제공하는 애노테이션 중 하나로, HTTP GET 요청을 처리하는 메소드

view : 화면을 그리는데 역량을 집중하는 것

resources/templates/hello-template.html

<html xmlns:th="http://www.thymeleaf.org">
<body>
<p th:text="'hello ' + ${name}">hello! empty</p>
</body>
</html>

변수 : ${키값} 를 받는다!

실행

http://localhost:8080/hello-mvc?name=spring

간단정리

hello-mvc.html -> 내장 톰켓 서버 -> 스프링에서 Controller에 매핑(Mapping)이 있어! 확인후 호출

->return: hello-template model(name:spring)줌
->viewResolver이 templates/hello-template에 있는 return의 string 되어있는 값과 똑같은 걸 찾아서 Thymeleaf 처리요구

->Thymeleaf 엔진 처리를 하고 변환후 html를 출력

스프링 부트에서 템플릿 엔진 요약

thymeleaf 공식사이트

3-8 API 실습

서버에서 뷰 리볼버(viewResolver)를 사용하지않고 그냥 그대로 입력

@ResponseBody를 사용

요즘엔 객체반환인경우 JSON을 내려주는 방식

문자반환인경우는 문자그대로 출력

과거에는 xml을 많이 사용했지만 무거워서 사용하지않고
최근에는 JSON 방식을 기본값으로 통일되었다.

@ResponseBody 예시

@Controller
public class HelloController {
//문자반환
 @GetMapping("hello-string")
 @ResponseBody
 public String helloString(@RequestParam("name") String name) {
 return "hello " + name;
 }
 
 //객체반환
 @GetMapping("hello-api")
 @ResponseBody
 public Hello helloApi(@RequestParam("name") String name) {
 Hello hello = new Hello();
 hello.setName(name);
 return hello;
 }
 static class Hello {
 private String name;
 public String getName() {
 return name;
 }
 public void setName(String name) {
 this.name = name;
 }
 }

 
}

+) 자바 GETTER SETTER (윈도우 Alt + Inser t)
(프로 퍼티 접근방식)

@ResponseBody 사용

문자 반환을 할경우 HTTP의 BODY에 문자 내용을 직접 반환
객체를 반환하면 객체가 JSON으로 변환됨
viewResolver 대신에 HttpMessageConverter 가 동작
기본 문자처리: StringHttpMessageConverter
기본 객체처리: MappingJackson2HttpMessageConverter
byte 처리 등등 기타 여러 HttpMessageConverter가 기본으로 등록되어 있음

@ResponseBody 실행 및 사용원리

http://localhost:8080/hello-string?name=spring

http://localhost:8080/hello-api?name=spring

내장 톰켓 서버에서 API를 확인 컨테이너에서 @ResponseBody 가 붙어있으면
그대로 데이터를 넘겨야 겠구나라고 인식
문자/객체를 넘기면서 httpMessageConverter 동작
단순 문자면 stringConverter가 작동
객체면 jsonConverter가 작동하여

값 그대로 웹 브라우저로 보내게 된다.

참고 :클라이언트의 HTTP Accept해더와 서버의 컨트롤러 반환 타입 정보 둘을 조합하여
선택된다.

이 글은 을지대학교 백엔드 세션 강의를 위해 제작된 게시글입니다
언제나 조언부탁드립니다

728x90

'5.1 대외활동 > Likelion(12기 세션자료)' 카테고리의 다른 글

[Eulji_LikeLion_2024_BackEnd] 4차 요구사항 (0)	2024.04.08
[Eulji_LikeLion_2024_BackEnd] 3차 Q&A (의존성,api,git) (2)	2024.04.04
[Eulji_LikeLion_2024_BackEnd] 2차 Q&A (0)	2024.03.26
[Eulji_LikeLion_2024_BackEnd] 2차 SpringBoot 3 기본정리 (0)	2024.03.02
[Eulji_LikeLion_2024_BackEnd] 1차-(2) JAVA 심화 (0)	2024.03.02

<Dohi.h>

[Eulji_LikeLion_2024_BackEnd] 3차 Spring 웹 개발 기초

3차 목차

3-1. Spring Start

1)Spring.io

2) 설정 해보기

2-1) 설정진행중 에러

3) Running

3-2. 디렉터리

3-3. 라이브러리

1) 살펴보기

3-4 View

3-5. Build

3-6. 정적 컨텐츠

3-7 MVC and Templates

3-8 API 실습

'5.1 대외활동 > Likelion(12기 세션자료)' 카테고리의 다른 글

댓글

티스토리툴바

[Eulji_LikeLion_2024_BackEnd] 3차 Spring 웹 개발 기초

3차 목차

3-1. Spring Start

1)Spring.io

2) 설정 해보기

2-1) 설정진행중 에러

3) Running

3-2. 디렉터리

3-3. 라이브러리

1) 살펴보기

3-4 View

3-5. Build

3-6. 정적 컨텐츠

3-7 MVC and Templates

3-8 API 실습

'5.1 대외활동 > Likelion(12기 세션자료)' 카테고리의 다른 글

관련글

댓글

티스토리툴바