4 분 소요

코딩 자율학습단 2주차

6장. 게시판 내 페이지 이동하기

1.링크

미리 정해 놓은 요청을 간편히 전송하는 기능으로 보통 페이지 이동을 위해 사용합니다.

  • HTML의 < a > 태그 혹은 < form > 태그로 작성
  • 클라이언트가 링크를 통해 어느 페이지로 이동하겠다고 요청하면 서버가 결과 페이지 응답

2.리다이렉트

클라이언트가 보낸 요정을 마친 후 계속해서 처리할 다음 요청 주소를 재지시하는 것입니다.

  • 분리된 기능을 하나의 연속적인 흐름으로 연결할 수 있음
  • 리다이렉트(재지시)를 받은 클라이언트는 해당 주소로 다시 요청을 보내고, 서버는 이에 대한 결과를 응답

3.뷰 파일에 링크 걸기

< a > 태그를 이용해 다음과 같은 형식으로 작성합니다.

< a href=”URL_ 주소” >링크를 걸 대상< /a >

4. 리다이렉트 정의하기

return 문을 사용해 다음과 같은 형식으로 작성합니다.

return “redirect:URL_주소”;

6장 수행 결과

image image image

셀프체크 수행 결과

image image image

7장. 게시글 수정하기: Update

1. 데이터 수정 1단계

수정 페이지를 만들고 기존 데이터를 불러옵니다.

  • 수정 페이지 요청
  • DB에서 데이터를 찾아 서버로 전송
  • 가져온 데이터를 모델에 등록
  • 뷰 페이지 출력

2. 데이터 수정 2단계

데이터를 수정해 DB에 반영한 후 결과를 볼 수 있게 상세 페이지로 리다이렉트합니다.

  • 폼 데이터 전달
  • DTO를 엔티티로 변환
  • DB 갱신
  • 리다이렉트

3. HTTP 메서드

HTTP는 클라이언트의 다양한 요청을 메서드를 통해 서버로 보내는 역할을 합니다. 대표적인 메서드로는 POST, GET, PATCH(PUT), DELETE가 있습니다.

  • POST: 데이터 생성 요청
  • GET: 데이터 조회 요청
  • PATCH(PUT) : 데이터 수정 요청
  • DELETE: 데이터 삭제 요청

4. UPDATE 문

데이터를 수정할 때 사용하는 SQL 문으로, 형식은 다음과 같습니다.

UPDATE 테이블명 SET 속성명=변경할_값 WHERE 조건;

7장 수행 결과

image image image image

셀프체크 수행 결과

image image image

8장. 게시글 삭제하기: Delete

1. 데이터 삭제 과정

클라이언트가 서버로 삭제 요청을 하면 서버는 DB에서 해당 데이터를 찾아 삭제하고, 클라이언트를 리다이렉트된 페이지로 보냅니다.

  • /articles/{id}/delete
  • delete(id)
  • redirect:/articles

2. RedirectAttributes

리다이렉트 페이지에서 사용할 일회성 데이터를 관리하는 객체입니다. 이 객체의 addFlashAttribute()라는 메서드로 리다이렉트된 페이지에서 사용할 일회성 데이터를 등록할 수 있습니다.

3. articleRepository.delete()

DB에 접근해 데이터를 삭제할 때 사용하는 메서드입니다. articleRepository.delete(target)이라고 작성하면 DB에서 target을 삭제합니다.

4. DELETE 문

DB 테이블에 저장된 내용을 행 단위로 삭제할 때 사용하는 SQL 문으로, 형식은 다음과 같습니다.

DELETE [FROM] 테이블명 WHERE 조건; – []: 생략 가능

8장 수행 결과

image image image

셀프체크 수행 결과

image image image

9. CRUD와 SQL 쿼리 종합

1. JPA 로깅 설정

JPA 동작 시 로그를 보기 위한 설정은 application.properties 파일에 작성합니다. 로깅 레벨은 총 7단계 중 하나를 선택할 수 있는데, SQL 로그를 보려면 DEBUG 레벨로 설정합니다. SQL 쿼리에 줄바꿈을 적용해서 보려면 format_sql 옵션을 true로 설정하고, JPA 쿼리에서 DB로 넘어가는 매개변수 값을 확인하기 위해 sql의 BasicBinderfmf TRACE로 설정합니다.

2. 기본키와 ID 자동 생성 전략

기본키(primary key)란 테이블에 저장된 각 데이터를 유일하게 구분할 수 있도록 지정한 속성을 말합니다. 보통 id를 기본키로 많이 사용하는데, @GeneratedValue 어노테이션의 전략을 IDENTITY로 설정하면 DB가 id를 자동으로 생성하므로 id 값이 중복되지 않습니다.

3. CRUD와 SQL 쿼리

서버에서 데이터의 생성, 조회, 수정, 삭제 등의 CRUD 요청을 하면 JPA의 리파지터리가 DB에 해당 요청을 전달합니다. 요청을 받은 DB는 자신의 언어인 SQL로 작성한 쿼리를 사용해 테이블에서 데이터를 관리합니다. 데이터의 생성 요청이 들어왔을 때는 INSERT 문, 조회 요청이 들어왔을 때는 SELECT 문, 수정 요청이 들어왔을 때는 UPDATE 문, 삭제 요청이 들어왔을 때는 DELETE 문을 수행합니다.

4. CREATE TABLE 문

테이블을 만드는 쿼리로, 테이블명, 속성명, 속성의 자료형, 기본키 등을 설정합니다.

CREATE TABLE 테이블명 ( 속성명1 자료형, 속성명2 자료형, 속성명3 자료형, PRIMARY KEY (기본키) );

5. INSERT 문

테이블에 데이터를 생성하는 쿼리로, 한 번에 하나 또는 여러 데이터를 삽입할 수 있습니다.

INSERT INTO 테이블명 (속성명1, 속성명2, 속성명3, …) VALUES (값1, 값2, 값3, …);

6. SELECT 문

테이블에 데이터를 조회하는 쿼리로, WHERE 절이 없으면 조건 없이 모든 데이터를 조회합니다.

SELECT 속성명1, 속성명2, 속성명3 FROM 테이블명 WHERE 조건;

7. UPDATE 문

테이블에 데이터를 수정하는 쿼리로, WHERE 절이 없으면 조건 없이 모든 데이터를 수정합니다.

UPDATE 테이블명 SET 속성명=변경할 값 WHERE 조건;

8. DELETE 문

테이블에서 데이터를 삭제하는 쿼리입니다. WHERE 절이 없으면 조건 없이 모든 데이터를 삭제하고 빈 테이블만 남습니다.

DELETE [FROM] – []: 생략 가능 테이블명 WHERE 조건;

9장 수행 결과

image

셀프체크 수행 결과

image

10. REST API와 JSON

1. REST API

서버 자원을 클라이언트에 구애받지 않고 사용할 수 있게 하는 설계 방식입니다. 클라이언트에서 정보를 요청하면 서버는 특정 기기에 종속되지 않고 모든 기기에서 통용할 수 있는 JSON 데이터를 응답으로 보냅니다.

2. JSON 데이터

자바스크립트 방식을 차용한 객체 표현식으로, 키와 값의 쌍으로 이루어진 속성으로 구성됩니다.

3. REST API 실습

{JSON} Placeholder 사이트에 가면 가짜 API를 사용해 무료로 각종 테스트를 할 수 있습니다. 이 책에서는 크롬 브라우저 확장 프로그램으로 Talend API Tester를 설치해 REST API 동작을 실습했습니다.

4. HTTP 상태 코드

클라이언트가 보낸 요청이 성공했는지 실패했는지 알려 주는 코드입니다. 응답은 100~500번대까지 5개 그룹으로 나뉘어 있습니다.

  • 1XX(정보): 요청이 수신돼 처리 중입니다.
  • 2XX(성공): 요청이 정상적으로 처리됐습니다.
  • 3XX(리다이렉션 메시지): 요청을 완료하려면 추가 행동이 필요합니다.
  • 4XX(클라이언트 요청 오류): 클라이언트의 요청이 잘못돼 서버가 요청을 수행할 수 없습니다.
  • 5XX(서버 응답 오류): 서버 내부에 에러가 발생해 클라이언트 요청에 대해 적절히 수행하지 못했습니다.

5. HTTP 메시지

HTTP 요청과 응답은 실제 텍스트 형식으로 전송되는데, 이를 HTTP 메시지라고 합니다.

HTTP 메시지는 시작 라인, 레더, 빈 라인, 본문으로 구성됩니다.

  • 시작 라인: HTTP 요청 또는 응답 내용이 있습니다. 시작 라인은 항상 한 줄로 끝납니다.
  • 헤더: HTTP 전송에 필요한 부가 정보가 있습니다.
  • 빈 라인: 헤더의 끝을 알리는 빈 줄로, 헤더가 모두 전송되었음을 알립니다.
  • 본문: 실제 전송하는 데이터가 있습니다.

10장 수행 결과

image image image image image image image

셀프체크 수행 결과

image image image image

댓글남기기