국비과정

20230802 _[43일차]_02. jquery + json 으로 board2 만들기

phyho 2023. 8. 2. 18:20

이제 json을 이용해서 board2 를 만들건데

비동기 방식이니 페이지 전체가 아니라 아래에 표시된 부분만 로딩되도록 만들자. 

table에 tr을 append로 추가하는 함수 만들어줌.


한줄짜리 list 에는 아래형식으로 값들이 들어간다.

const 는 변하지 않는 상수를 의미한다.

 

const 배열 list를 선언해주고 아래처럼 배열속성 하나하나에다가 한 줄을 넣어줄예정 

 

한줄 한줄을 하나의 속성값으로 가지는 list 배열 생성

 


한줄로 써주고 팝업으로 띄워보면

아래처럼 나온다.

아래처럼도 쓸 수 있다.

대신 alert로 해보면 들여쓰기 공백까지 적용된채로 나온다.


list.length 를 팝업으로 띄워보면

모든 글자수 + 공백을 센다. "[ ~~ ]" 따옴표 때문에 전체를 String으로 인식해서 모든 글자수를 센 듯.

 

배열괄호를 묶었던 " [ ~~~ ] " 따옴표를 빼고 해봤더니

list 배열의 길이가 나온다.


 

배열 첫번째 값의 btitle 추출

 

for문으로 10줄 출력해주면

아래처럼 10줄 게시글이 나온다.

bno 수정해줌


보드 내용을 ajax 로 가져와보자.

type : "get"

 

지금 상태에서는 에러가 난다. (F12 눌러서도 확인가능)

에러 코드 보면 boardList2의 pageNo=1 을 실행할 수 없다고 뜬다.


com.phyho.rest  패키지 생성

RestController 클래스 생성

 

@Controller

@Autowired

선언 해주고 로그인 컨트롤러에 있던 아이디 중복검사 부분 가져오자 

( @ResponseBody 부분은 전부 여기에 모아줄 예정 )


@ResponseBody 선언은 아래처럼 적어주기도 한다.


대신 우리는 @RestController 를 사용할 예정 ( @ResponseBody 를 매번 선언안해줘도 된다. )

          @Controller에 @ResponseBody가 추가된 것


[Spring] @Controller와 @RestController 차이 - MangKyu's Diary (tistory.com)

 

[Spring] @Controller와 @RestController 차이

Spring에서 컨트롤러를 지정해주기 위한 어노테이션은 @Controller와 @RestController가 있습니다. 전통적인 Spring MVC의 컨트롤러인 @Controller와 Restuful 웹서비스의 컨트롤러인 @RestController의 주요한 차이점

mangkyu.tistory.com


아래처럼 LoginService 와 BoardService 를 모두 사용할거라면 각각에 대한 @Autowired 필요

 

그냥 loginService 하나만 사용하자

서비스에서는 DAO한테 일시키고

DAO에서는 쿼리문 실행시켜

mapper 에서는 글 10개만 가져와보자

 

 

게시판 2를 눌러보면 브라우저에서는 에러가 뜨지만 데이터 자체는 잘 불러와진다.

콘솔창에 출력해보면 데이터 잘 불러온거 확인가능.