DB에는 컬럼명이 보통 스네이크형식 이며 board_no 이렇게 들어간다. 하지만 서버에서 객체의 멤버 변수의 이름은 카멜케이스로 boardNo이렇게 들어간다. 그렇기 때문에 returnType을 VO로 지정했을 경우 명칭이 달라서 데이터를 못받아오는 경우가 생기기 마련이다. 하나의 방법으로 별칭을 지정해서 select board_no as boardNo로 할 수도 있겠지만 너무 번거로운 작업이기 때문에 자동으로 변환해주는 방법을 설정할 것이다. 1. application.yml 설정하기 mybatis: config-location: classpath:mybatis-config.xml //혹시 오류가 난다면 여기 부분 제거 configuration: map-underscore-to-camel-case: ..
1. gradle에 의존성 추가 본 작업은 gradle로 했습니다. 그렇기에 제일 먼저 디펜던시를 추가해 줍니다. dependencies { compile 'org.mybatis.spring.boot:mybatis-spring-boot-starter:1.3.2' compile 'org.springframework.boot:spring-boot-starter-jdbc' compile 'mysql:mysql-connector-java' } 2. MySQL관련 config 설정 src > main > resources에 application.yml의 파일을 생성해줍니다. spring: datasource: url: jdbc:mysql://ip주소:port번호/DB이름?characterEncoding=utf8 ..
Spring Rest Docs과 Swagger란? Restful API를 사용하기 위해선 문서화가 굉장히 중요하다. 그렇기 때문에 자동화를 도와줄 툴이 필요한데 대표적으로 쓰이는 이 두개를 비교하여 선택하기 위한 게시글 입니다. Spring Rest Docs Swagger 장점 제품코드에 영향이 없다 API를 테스트 해 볼수 있는 화면을 제공한다. 테스트가 성공해야 문서작성된다. 적용하기 쉽다 단점 적용하기 어렵다 제품코드에 어노테이션 추가해야한다. 제품코드와 동기화가 안될 수 있다. API 문서의 목적은 개발하는 스펙을 정의하는 것이라 생각한다. Swagger는 API 동작을 테스트하는 용도에 더 특화되어 있습니다. 반면에 Spring Rest Docs는 깔끔 명료한 문서를 만들 수 있습니다. 그래서 ..
RESTful이란? Representational State Transfer라는 용어의 약자로서 웹의 장점을 최대한 활용할 수 있는 아키텍처 최근 서버 프로그램은 다양한 브라우저와 안드로이드폰, 아이폰과 같은 모바일 디바이스에서도 통신을 할 수 있어야한다. REST가 필요한 이유 -거대한 애플리케이션을 모듈, 기능별로 분리하기 쉬워졌다. RESTful API를 서비스하기만 하면 어떤 다른 모듈 또는 애플리케이션 이라도 RESTful API를 통해 상호간에 통신을 할 수 있기 때문이다. -WEB브라우저 외의 클라이언트를 위해서다. (멀티 플랫폼) REST의 특징 1. Uniform (유니폼 인터페이스) - 유니폼 인터페이스는 URI로 지정한 리소스에 대한 조작을 통일되고 한정적인 인터페이스로 수행하는 아키..
서버, 클라이언트 사이드 렌더링이란? 서버 사이드 렌더링은 UI를 서버에서 렌더링 하는 것을 의미합니다. 서버 사이드 렌더링을 구현하면 사용자가 웹 서비스에 방문 했을 때 서버쪽에서 초기 렌더링을 대신 해주는 것 입니다. 그리고 사용자가 html을 전달 받았을 때 그 내부에 렌더링된 결과물이 보입니다. 반대로 클라이언트 사이드 렌더링은 브라우저에서 모두 처리하는 것이죠. 즉, 자바스크립트를 실행해야 우리가 만든 화면이 사용자에게 보입니다. 처음에는 빈 페이지로 시작하여 자바스크립트가 실행되고 리액트 컴포넌트가 렌더링되면서 화면이 보이는 것입니다. 서버 사이드 렌더링의 장점 일단 구글, 네이버, 등의 검색 엔진이 우리가 만든 웹 애플리케이션의 페이지를 원활하게 수집할 수 있습니다. 리액트로 만든 SPA는 ..
리액트 앱은 컴포넌트 간에 데이터를 props로 전달하기 때문에 컴포넌트가 여기저기서 필요한 데이터가 있을 때 주로 최상위 컴포넌트인 App의 state에 넣어서 관리합니다. 만약 C 컴포넌트가 전역 상태를 업데이트 시키는 기능을 담당한다면 App에서는 const [value, setValue] = useState('hello'); 생성하여 App > A > B > C 순으로 전달해야 합니다. 이렇게 여러 번에 거쳐서 전달하게 될 경우 유지 보수성이 낮아질 가능성이 높기 때문에 Context API를 사용하여 Context에 만들어서 단 한 번에 원하는 값을 받아와 사용할 수 있습니다. import { createContext } from "react"; const ColorContext = create..
Route 사용하기 실습할 프로젝트를 생성하고 해당 프로젝트 안에서 react-router-dom을 설치하자. yarn add react-router-dom 그리고 라우터를 적용할 때는 src/index.js 파일에서 BrowserRouter 컴포넌트로 감싸면 됩니다. 이 컴포넌트는 웹 애플리케이션에 HTML5의 History API를 사용하여 페이지를 새로고침하지 않고도 주소를 변경하고, 현재 주소에 관련된 정보를 props로 쉽게 조회하거나 사용할 수 있도록 해 줍니다. import React from "react"; import ReactDOM from "react-dom"; import "./index.css"; import App from "./App"; import * as serviceWor..
SPA란? Single Page Application 즉, 한 개의 페이지로 이루어진 애플리케이션을 의미합니다. 전통적인 웹 페이지는 여러 페이지로 구성되어 있습니다. 기존에는 사용자가 다른 페이지로 이동할 때마다 새로운 html을 받아오고, 페이지를 로딩할 때 마다 서버에서 리소스를 전달받아 해석한 뒤 화면에 보여 주었습니다. 이렇게 사용자에게 보이는 화면은 서버측에서 준비 했습니다. 전통적인 웹은 보통 동적인 html을 생성해주는 템플릿 엔진을 많이 사용했죠. 요즘은 웹에서 제공되는 정보가 정말 많기 때문에 새로운 화면을 보여주어야 할 때마다 서버 측에서 모든 뷰를 준비한다면 성능상의 문제가 발생할 수 있습니다. 트래픽이 너무 많이 나올 수 있고, 사용자가 몰려서 높은 부하가 쉽게 걸릴 수도 있습니다..