2023-03-09 Spring Boot 시작 / Intellij / MVC / Thymeleaf 문법

get, post, db연결 2주...안걸리게 햇는데 이것도 그럴듯

 

굉장히 오래된 언어고, 배울게 매우 많다

2주동안 배워도 1프로 정도 .. 

 

 

Spring이란?

• Java 기반의 웹 어플리케이션을 만들 수 있는 백엔드 프레임워크
• Java로 다양한 어플리케이션을 만들기 위한 프로그래밍 툴
• 수많은 국내 기업과 해외 기업에서 많이 사용하는 프레임워크

java 기반의 웹 어플리케이션을 만들 수 있는 프레임워크

 

 

orm - 시퀄라이즈

 

스프링 프레임워크 특징

1. IoC ( Inversion of Control, 제어 반전 )

2. DI ( Dependency Injection, 의존성 주입 )

3. AOP ( Aspect Object Programming, 관점 지향 프로그래밍 )

4. POJO ( Pain Old Java Object 방식 )

 

loC 제어반전 

• Inversion of Control, 제어 반전

• 객체의 생성부터 소멸까지 개발자가 직접 하는 것이 아닌 Spring Container 가 대신해주는 것

• 제어권이 개발자가 아닌 IoC 에 있으며, IoC 가 개발자의 코드를 호 출해 필요한

객체를 생성, 소멸해 생명주기를 관리한다.

 

1) 일반 객체 생성

2) loC 객체: 제어권이 외부에 있는 객체

→ Apple 객체의 제어권이 Sample 에 있는 것이 아닌, SampleTest에게 있다.

→ 의존성을 역전시켜 제어권을 직접 갖지 않는 것이 IoC

 

1번 사진은 Sample 에서 Apple 이 만들어졋는데, Sample 이 생성부터 소멸까지 Apple 을 관리

2번 사진은 new Apple이 만들어진것은 SampleTest 지만, 쓰고있는것은 Sample이다.

Sample 은 그냥 사용만하고, Apple 의 제어권을 가진 객체는 SampleTest (사용과 제어하는 곳이 다른 것을 제어반전)

 

 

Di 의존성 주입

• Dependency Injection, 의존성 주입

• 구성 요소의 의존 관계가 소스코드 내부가 아닌 외부의 설정 파일 을 통해 정의되는 것.

• DI를 통해서 IoC를 이룬다.

• 이를 통해 코드 간의 재사용률을 높이고, 모듈 간의 결합도를 낮출 수 있다.

 

제어반전을 이루려면 제어권을 누군가에게 줘야겟죠  제어권은 넘겨주지만 실제사용은 우리가 해야하니.. 의존성을 주입시킨다..?

넘겨줌으로써 저친구가 사용할 수 있게 한다 Di를 통해 ioC를 이룬다라고 말한다고 한다.

생성자, 함수에서 다른곳에서 만들어진 것을 내가 사용할 수 있게 의존성을 주입받는 것

2, 3의 차이는 getter냐 생성자냐..1번은 처음 배우는 것

di 는 라이브러리나 프레임워크를 연동할 때 직접 작성하는게 아닌, 연결해서 사용할 때 많이 사용합니다.

 

 

aop 관점 지향 프로그래밍

• Aspect Object Programming, 관점 지향 프로그래밍

• 어떤 로직을 기준으로 핵심적인 관점, 부가적인 관점으로 나누어 서 보고 그 관점을 기준으로 각각 모듈화하겠다는 것

• 기능을 비즈니스 로직과 공통 모듈로 구분한 후, 개발자의 코드 밖 에서 필요한 시점에 비즈니스 로직을 삽입하여 실행되도록 한다.

 

어떤 지향 프로그래밍 (객체, 지향, 패턴 등..)

자바는 객체 지향 프로그래밍입니다.

 

• 계좌이체와 입출금 로직을 처리할 때 공통적으로 로깅과 보안 작업을 수행해 야 한다.

• 일반적으로 이 경우, 공통의 코드를 두 개의 로직에 모두 넣고 사용한다.

• AOP는 공통관심(로깅, 보안)을 따로 빼내어 객체별로 처리하는 것이 아닌 관 점별로 외부에서 접근해

사용하도록 만든다.

계좌이체와 입출금의 공통적인 두개의 로직을 처리하는 것이 보안처리입니다.

일반적으로 계좌이체때 보안 넣고 입출금때 보안작업을 넣을것같지만, 공통관심(공통적으로 해야하는 작업)을 따로 빼내서 외부에서 접근하도록 만든 것이 관점지향프로그래밍입니다.

 

 

pojo 단순한 자바 오브젝트

• Plain Old Java Object, 단순한 자바 오브젝트

• 객체 지향적인 원리에 충실하면서 환경과 기술에 종속되지 않고 필요에 따라 재 활용될 수 있는 방식으로

설계된 오브젝트

• getter / setter 같이 기본적인 기능만 가진 Java 오브젝트

 

클래스의 getter, setter 같이 기본적인 기능, 형태만 가진 오브젝트를 많이 사용한다

 

 

---

Spring Boot 란?

스프링과 스프링부트는 다른데

• Spring을 더 쉽게 이용하기 위한 도구

• Spring을 이용할 시, 필요한 여러 가지 세팅 작업들 ( ex) 톰캣 서버 설 정, XML 설정 등 ) 없이 쉽고 빠르게

프레임워크를 사용할 수 있도록 만들어진 것

 

코드 설정만이 아닌, 개발보다 설정이 많은 작업이 소요되는 어렵고 복잡하다.

스프링은 진입하기가 어렵다.

그런것들을 설정할 필요 없게 빠르게 하는것이 스프링부트입니다.

 

XML 설정 / 톰켓 / .. 추가적인 설정들이 자동화되어있어서 개발하기 편합니다.

비유를 하자면 Node.js에서 npm 한것을 패키지에서 관리하는데

만약 패키지제이슨이 없으면.. 따로 찾아서 스스로 해야하는데 매우 복잡할 것 입니다.

 

 

 

인텔리제이 설치하기

lntellij 무료 커뮤니티 버전 사용

구글

 

 

플러그인 추천 버전 상관 x

Atom Material lcons

프로젝트 구조(패키지, 폴더, 파일)을 Atom ide 디자인을 입혀서 아이콘 모양을 바꿔주는 플러그인

대략적인 전체적인 코드 의 양을 체크하거나 위에 적어놓은 메소드를 찾을 때 유용하

Console 출력을 상황에 맞게 색상 별로 나눠서 출력해준다.

 

 

플러그인 추천 ver. Ultimate

gitToolBox

vscode 에서의 git

 

---

Spring Boot 시작하기

 

https://start.spring.io/

• Spring Boot 기반으로 Spring 관련 프로젝트를 만들어주는 사이트

• Spring에서 운영하고 있으며, 해당 사이트에서 프로젝트 시작을 많이 한다.

 

커뮤니티는 시작이 안된다.. 스프링은 가능하지만 저 사이트에서 세팅 받아서 시작해보자

 

구르비 스크립트

언어는 자바 ( kotlin 이 점점 느는 추세 + 그래서 라이브러리같은게 많이 없다)

 

2.7.9

2, 3버전에 코틀린 언어가 생김 

000(괄호가 있는 버전) => 안정적 x / 정식 출시 x

 

 

👍중요 부분 :add dependenies

라이브러리 셋팅

 

3개의 라이브러리를 셋팅하겠습니다

Lombok 은 다이어트 라이브러리라고도 한다.

 

원하는 셋팅 후 generate 버튼을 눌러주면, 파일이 생성됩니다.

이 파일을 git 이 있는 폴더에 풀어주고

 

위의 예시처럼 폴더를 엽니다.

오픈해서 해당 폴더 파일을 선택해줍니다.

 

 

---

IntelliJ 프로젝트 실행하는 법

자바할때 메인함수 사용햇는데

그것처럼 Application.java 이 그러한 역할을 합니다.

초록색 세모 버튼을 누르고 run 시킵니다.

 

잘 실행되고 있는지 확인해보려면, localhost:8080으로 가봅시다.

만든게 아무것도 없어서 이렇게 뜹니다.

 

 

실행 화면 보여주기

• ./src/main/resources/static에 index.html 생성

 

한번 실행하면, currentfile 이던 부분이 Application으로 저장됩니다.

스프링은 바보라서, 변형되어 저장된부분을 이해하지 못하기때문에

이 버튼을 눌러 재실행을 하는 것!

 

static - 정적 파일

위치하고 있는 파일을 보여준다.

 

Static에 이미지를 넣고 8080/변형디자인.png를 쓰면 아래처럼 사진이 뜹니다. 이게 정적 파일입니다.

 

 

 

 

---

spring MVC 패턴

 

Thymeleaf 템플릿

• 템플릿 엔진의 일종으로, html 태그에 속성을 추가해 페이지에 동 적으로 값을 추가하거나 처리할 수 있게 도와주는 것

• Spring Boot 사용시 권장되는 템플릿 엔진

기본적으로 html 형태를 유지하고 있고 쉽다함

 

뷰를 보여주기위한 템플릿 엔진 언어라서 컨트롤러가 필요합니다.

 

 

Controller 만들기

@Controller

이 클래스가 이 프로젝트에서 컨트롤러 동작을 한다고 Spring Container에게 알려주는 것  

앤터로 임포트 시키기

 

* 임포트 하는 법

• 앤터
• 다작성한후 마우스 알트 앤터 

@GetMapping("/hi") ㅡ> 노드js 에서 app.get url 읽는 것과 같음

url 을 매핑시킴

누군가 "/hi" 라는 주소로 접속했을때  getHi () 라는 함수를 실행

package sesac.sesac.spring.controller;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;

@Controller
public class HelloController {
    
    @GetMapping()
    public String getHi(){
        return "hi";
    }
}

 

에러가 뜨네요! ㅡ> 뜨는 이유는 getHi 가 리턴하는 하이는

res.render("hi") 로 읽기 때문에 오류가 뜹니다. 지금 우리는 hi라는 파일이 없어서 뜨는 오류입니다.

 

 

Template view 만들기

템플릿을 설정해주는 경로는 resources / templates 에 파일을 생성해주면 됩니다.

 

package sesac.sesac.spring.controller;

import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;

@Controller
public class HelloController {

    @GetMapping("/hi") // app.get url받았던 친구
    public String getHi(Model model){
        model.addAttribute("msg", "hi!!");
        // res.render("hi", model); ejs파일에 데이터를 보내던것과 비슷한 역할이 model
        return "hi"; // res.render("hi") hi라는 파일은 리소스/템플릿 안에 위치해야함
    }
}

모델을 설정할때 attribu~~이거 일일이 썼는데, 직접 쓰는게 아니라고 하네요  ("msg", "hi!!")

 

 

Thymeleaf 속성 넣어주기

ejs 템플릿처럼 템플릿이라는 것을 가르쳐주는 방법은

html 태그에 저렇게 써줍니다. 

<html lang="en" xmlns:th="http://www.thymeleaf.org">

템플릿에서 받는 값은 컨트롤러에서 모델에서 보내는 값입니다.

 

Spring Boot 동작 환경

---

Thymeleaf 문법

< div th: [속성]="서버에서 받는 값 및 조건식 or 내가 쓰고싶은 말" />

• html 태그 안에 소 문법을 추가한다.

• 이때, 태그는 div 뿐만이 아니라 html에서 지원하는 태그들 모두 사용 가능하다.

 

th:text

태그 안의 텍스트를 서버에서 전달받은 값에 따라 표현하고자 할 때 사용하는 문법

<span th:text="${hello}">message</span>

 

 

th:utext

• text와 유사
• 변수에서 받은 값에 html 태그가 있다면 태그값을 반여해서 표시해준다.

"<strong>안녕</strong>"값이 서버에서 넘어오면 <strong>이라고 읽히는게 아닌

"안녕"을 굵게 해주는 태그로서 읽어주는것!

 

 

th:value

element 들의 value 값을 지정할때 사용한다.

 

th:with

변수 값을 지정해서 사용하고자 할 때 사용

위와 같이 사용한다면 서버에서 전달받은 ‘hello’ 값이 저장된 temp 라는 변수가 만들어지고,

Thymeleaf 문법 내에서 사용 가능 하다.

 

th:switch

• Switch-case 문을 이용할 때 사용되는 문법

• th:case 에서 case 문을 다루고, * 로 case문에서 다루지 않은 모든 경우가 처리된다. ( * 는 일반 문법에서의 default )

핼로우란 변수값을 실행할건데 만약 admin이면 첫번째 실행

둘다 아니면, 마지막을 실행해라

 

th:if

• 근데 else / else if 가 없다.
• if 와 unless 만 존재 => th:unless 에 if에 적은 조건과 같아야 위의 if가 아닌 경우를 인식 할 수 있다는 것 주의!
• 헬로라는 조건이 맞으면 위에 실행 / 아니면 밑을 실행

 

th:each

• 반복문이 필요한 경우 사용하는 문법
• 리스트와 같은 collection 자료형을 서버에서 넘겨주면 그에 맞춰 반복적인 작업이 이루어질 때 사용된다.

모델에 네임스라는 이름으로 배열을 전달해줫을때

li태그에 th:each 돌고 text에 이름을 넣어줫다.

for-each와 비슷

어찌 반복되냐?

포문은 그안에 내용만 반복시켯는데 / 얘는 다릅니다

애는 each 있는 부분까지 전부 반복

li 태그부터 반복하고싶으면 li태그에 지정해줘야 합니다. ㅡ> 반복하고자 하는 최상위에 지정해주면 됨

 

 

 

 

컨트롤러파일

package sesac.sesac.spring.controller;

import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;

@Controller
public class HelloController {

    @GetMapping("/hi") // app.get url받았던 친구
    public String getHi(Model model){
        model.addAttribute("msg", "안녕하세용!");
        // utext
        model.addAttribute("utext", "<strong>부아앙.!</strong>");
        // value
        // res.render("hi", model); ejs파일에 데이터를 보내던것과 비슷한 역할이 model
        return "hi"; // res.render("hi") hi라는 파일은 리소스/템플릿 안에 위치해야함
    }
}

hi 템플릿

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<!--msg는 내가 컨트롤러에서 모델에 담아서 보낸 친구-->
     <h1 th:text="${msg}">안녕</h1>
     <br>
    <p th:utext="${utext}">p태그</p>
    <br>
<!--with="변수이름"-->
    <span th:with="msg2='안녕? ' + ${msg}" th:text="${msg2}"></span>
</body>
</html>

 

---

실습1

if문이 필요해보이는군

 

컨트롤러

 

---

실습2

생성자와

getter * setter 생성

우클릭 > generate > getter setter 해주면 된다 

 

 

선생님 코드

package sesac.sesac.spring.controller;

import java.util.ArrayList;

import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;

import sesac.sesac.spring.Person;

@Controller
public class HelloController {

	@GetMapping("/hi") // app.get
	public String getHi(Model model){
		model.addAttribute("msg", "메세지입니다.!");
		model.addAttribute("utext", "<strong>utext 입니다.</strong>");
		// res.render("hi", model);
		return "hi"; // res.render("hi")
	}

	@GetMapping("/people")
	public String getPeople(Model model) {
		ArrayList<Person> people = new ArrayList<Person>();
		people.add(new Person("이름1", 10));
		people.add(new Person("이름2", 20));
		people.add(new Person("이름3", 30));
		people.add(new Person("이름4", 40));

		model.addAttribute("people", people);
		return "people";
	}
}

Person은 컨트롤러 파일이 아닙닏..ㅠㅠ

어레이 리스트를 쓰는데 안돈ㅇㅁㅇ

 

package sesac.sesac.spring;

public class Person {
	private String name;
	private int age;

	public Person(String name, int age ) {
		this.name = name;
		this.age = age;
	}
	public String getName() {
		return name;
	}

	public void setName(String name) {
		this.name = name;
	}

	public int getAge() {
		return age;
	}

	public void setAge(int age) {
		this.age = age;
	}
}

 

 

틀렷던 부분

컨트롤러 파일을 만들라고 하는 줄 알았다.

 

내 오답 Person 이란 클레스에서 ..

package sesac.sesac.spring.controller;

import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
import java.util.ArrayList;

@Controller

public class Person {
    public String name;
    public  int age;

    public Person(String name, int age){
        this.name = name;
        this.age = age;
    }

//    getter & setter

    

    @GetMapping("/people")
    public String getPesrson(Model model){

        ArrayList<Person> people = new ArrayList<Person>();
        
        // 내 오답
//        Person person1 = new Person("수남", 10);
//        Person person2 = new Person("박하", 3);
//        Person person3 = new Person("박밤", 1);
//        Person person4 = new Person("완이", 4);
        people.add(new Person("수남", 10));
        people.add(new Person("박하", 3));
        people.add(new Person("박밤", 1));
        people.add(new Person("완이", 4));
        
        model.addAttribute("people", people);
        return "person";
    }
}

getter & setter 안 만듬

 

정답은 결국

Person 이란 클래스에 

변수 / 생성자 / getter setter 만들기

 

컨트롤러 파일에서 객체를 생성