끄적끄적

실습환경

Spring Boot 3.2.1

MySQL 8.0.25

해당 내용은 위 실습환경에 맞춰 작성되었으며, 이후 버전 업그레이드에 따라 내용 차이가 있을수 있습니다.

PC에 MySQL이 설치되어 있다 가정 후 진행하겠습니다.

1. 데이터베이스 생성

CREATE DATABASE MAPLE_GG;

생성 후 데이터베이스 확인 명령을 입력 시 정상적으로 생성된 것을 볼 수 있습니다.

show databases;
+--------------------+
| Database           |
+--------------------+
| information_schema |
| maple_gg           |
| mysql              |
| performance_schema |
+--------------------+

2. MySQL 의존성 추가

Spring 프로젝트 build.gradle 파일 내부에 해당 의존성을 추가합니다.

본인의 MySQL 버전에 맞게 작성합니다.

dependencies {
    # implementation 'mysql:mysql-connector-java:8.0.25'
    implementation 'mysql:mysql-connector-java:[MySQL 버전]'
}

3. application.yml 파일 내부에 DB 정보 입력합니다.

spring:
  datasource:
    driver-class-name: com.mysql.cj.jdbc.Driver
    url: jdbc:mysql://localhost:3306/MAPLE_GG?useSSL=false&allowPublicKeyRetrieval=true&serverTimezon=Asia/Seoul
    username: root
    password: root

Http( HyperText Transfer Protocol)

웹 상에서 정보를 주고받는 프로토콜의 한 종류.

클라이언트가 서버에 보내는 메시지를 요청(Request), 서버가 클라이언트에 보내는 메시지를 응답(Reponse)으로 부른다.

메시지는 Request line, Header, Body로 구성되어 있으며, 이 중 Body에 데이터를 실어 전송.

REST방식의 통신에선 JSON, XML 등의 형식의 데이터를 사용.

@RequestBody

클라이언트로부터 받은 JSON, XML등의 형식을 Java Object로 변환하기 위한 어노테이션

예제

@RestController
public class LoginController{
    
    @RequestMapping("/login")
    public LoginVO test(@RequestBody User user){
        LoginVO loginVo = userService.login(user); 
        return loginVo;
    }
}

'/login'로 들어온 요청의 JSON(XML)데이터를 Spring이 관리하는 MessageConverter중 하나인 MappingJackson2HttpMessageConverter 통해 User라는 Java Object로 전환.

@ResponseBody

클라이언트로 보내기 위해 Java Object를 JSON, XML등으로 변환하기 위한 어노테이션

예제

@ResponseBody
@RequestMapping(value = "/test")
public LoginVO test() throws Exception {

  LoginVO loginVO = new LoginVO();
  loginVO.setId("admin");

  return loginVO;
}

return되는 loginVO를 JSON(XML) 형식으로 매핑.

이 또한 Spring의 MessageConverter을 통해 자동으로 진행됨.

정리

클라이언트 → 서버 : @RequestBody

서버 → 클라이언트 : @ResponseBody

Mybatis로 개발하다보면 Mapper와 DAO 둘중 하나를 마주치게 된다.

이 둘중 어느상황에서 Mapper, DAO를 사용해야할지 정리해보았다.

DAO

정의

- Data Access Object 의 약어

- 데이터 엑세스를 추상화한 인터페이스

특징

- 기존 Mybatis에서 사용하던 규칙

- 인터페이스와 클래스가 결합된 형태  Ex) ExampleDAO - ExampleDAOImpl

- Business 로직과 DB 로직을 분리하여 유지보수 및 재사용성 향상

- [네임스페이스.sqlId] 와 같은 문자열로 SQL을 호출하기 때문에 버그 발생 가능

- selectOne, insert, delete 등 제공하는 메소드 사용 필수

- [applicationContext.xml] 내부에 sqlSession* Bean 선언 필요

<bean id="sqlSession" class="org.mybatis.spring.SqlSessionTemplate" destroy-method="clearCache">
	<constructor-arg name="sqlSessionFactory" ref="sqlSessionFactory"></constructor-arg>
</bean>

sqlSession*: DAO와 DB 사이에서 연결, 종료할 필요가 없게 해주며 트랜잭션관리, 쓰레드처리 등 안정성을 보장

구조

[ExampleController] - [ExampleService] - [ExampleServiceImpl] - [ExampleDAO] - [ExampleDAOImpl] - [ExampleXml]

Mapper

정의

- DB와 객체간의 매핑을 관리

- Mybatis 3.0 이후에 나온 최신 규칙으로 기존 DAO를 대체하여 사용 가능

특징

- 기존 DAO방식보다 좀더 최신 규칙으로 사용에 용이

- 단순 인터페이스방식으로 일일이 DAO를 만들지 않고 인터페이스만으로 개발 가능 Ex) ExampleMapper

- @Mapper 어노테이션을 사용하여 bean 등록

구조

[ExampleController] - [ExampleService] - [ExampleServiceImpl] - [ExampleMapper] - [ExampleXml]

1. CLI로 생성하기

VSCode 터미널에 아래의 명령어 입력

 vue create [프로젝트명]

• node_modules : npm 패키지 파일이 모인 디렉토리
• public : index.html, favicon.ico 등 정적 리소스가 모인 디렉토리
• src/assets : 이미지, CSS. 폰트 등을 관리하는 디렉토리
• src/components : Vue 컴포넌트 파일이 모인 디렉토리
• App.vue : Root 컴포넌트
• main.js : 가장 먼저 실행되는 JS파일로, Vue 인스턴스를 생성
• package-lock.json : 설치된 package의 디펜던시 정보를 관리하는 파
• package.json : 프로젝트에 필요한 package를 정의하고 관리하는 파일

생성된 프로젝트 폴더로 이동 후 아래 명령어 입력

npm run serve

브라우저로 http://localhost:8080/ 접속

1. Visual Studio Code 설치

https://code.visualstudio.com/

2. Node.js 설치

• Node.js : JavaScript를 이용해 서버프로그램을 개발할 수 있도록 제공해주는 Runtime 환경
• NPM(Node Package Manager) : 전 세계 개발자들의 JavaScript 소스들의 집합 장소

https://nodejs.org/ko/

3. VSCode 확장 프로그램 설치 - Vetur / Prettier / Vue 3 Snippets

4. Vue CLI 설치

VSCode의 터미널 창에 하위 코드를 입력

sudo npm install -g @vue/cli

(-g : 설치하는 패키지를 글로벌(전역)으로 사용하겠다)