본문 바로가기

카테고리395

[Spring] 보드게시판 만들기(5) 게시글 상세보기 상세조회 위와 같이 해당 제목 글을 누르면 상세보기 페이지로 이동해서 해당 게시글 정보를 조회하는 상세보기를 해보려고한다. 위 기능도 쿼리를 작성해서 데이터를 넘겨줘야 하는 부분이므로, 가장 첫번째로 mapper로 가서 쿼리를 작성하자. board-mapper.xml 게시글 상세 조회를 위해서 select 태그를 이용했고, resultMap은 select 조회시 type과 Map으로 나뉘는데, 현재 여러 데이터를 받아와야 하므로 resultMap으로 board 정보를 받아왔다. BoardService 인터페이스 매개변수 및 리턴 타입 결정 방법(우선적으로 실행 시 쿼리를 작성) 매개변수 : 쿼리 실행 시 빈 값을 채울 용도 1. 쿼리에서 채워 줄 값이 없을 경우 : 매개변수 없음 2. 채워줄 값이 하나일.. 2023. 3. 25.
[Spring] 보드게시판 만들기(4) 등록 게시글 리스트 출력 board_list.html 먼저, 게시글 리스트를 조회하기 위해선 데이터를 받아와 html에 뿌려줘야한다. 데이터 리스트를 뽑는 쿼리를 작성하러 가보자. board-mapper.xml 보드 게시판에서 리스트를 조회하기 위해 이것 저것 이중 쿼리문을 이용해서 출력한 코드이다. 지금 당장은 위와 같은 소스 코드는 필요하지 않다. 이전에도 많이 썼던 리스트 조회를 적절하게 이용해내자. 이후 위 소스코드는 다음에 만들 프로젝트에서 막히는 쿼리 부분이 있을때 참고하러 오자. BoardService 인터페이스 리스트 출력 메소드 안에있는 PageVO 객체는 이후 페이징처리를 위해 추가한 것이므로 당장은 넣지 않아도 된다. BoardServiceImpl 클래스 @Service와 @Autowired 를 이용해 스프링.. 2023. 3. 23.
[Spring] 보드게시판 만들기(3) 글쓰기 board_list.html 글쓰기 버튼을 누르면 onclick으로 board 컨트롤러에 있는 regBoard경로로 찾아가게 된다. BoardController.java 컨트롤러 BoardVO 객체에 저장된 boardVO를 사용할 수 있도록 매개변수에 담아서 board_write 페이지로 이동하게 된다. 현재 BoardVO에 담겨진 데이터는 없다. board_writer.html 등록 버튼을 만들어 form태그로 감싸 submit으로 보내주었고, 이전 컨트롤러에서 boardVO를 가져왔기 때문에, 각 input, textarea 과 같은 태그에 값을 넣어주면 boardVO에 담아서 컨트롤러로 넘어갈 수 있게된다. 오른쪽과 같이 비밀글 체크박스에 클릭시 자바스크립트를 이용해 비밀번호가 나타날 수 있도록 하.. 2023. 3. 23.
[Spring] 보드게시판 만들기(2) 로그인 Session Spring을 활용해서 보드게시판 만들어보기 (2) 로그인 Session 위와 같이 데이터베이스에 저장된 정보로 로그인을 실행하면 로그인 성공 창과함께 위와 같이 환풍님 환영합니다. 라는 문구가 뜨며 접속할 수 있다. 이 기능은 Session을 이용해서 구현한 것이다. 여기서 다른 정보로 입력도 해보겠다. 이렇게 로그인 실패 알람이 뜨면서 다시 로그인 창으로 되돌아 온다. login.html 로그인 html에서 ID와 PW를 입력한 후 Login버튼을 누르면 submit을 통해 action의 컨트롤러 주소를 찾아가게 된다. 이때 method="post"를 통해 @Postmapping으로, th:object를 통해 memberVO 객체에 있는 th:field 속성으로 준 memId와 memPw를 가지고 간.. 2023. 3. 22.
[Spring] 보드게시판 만들기(1) 회원 가입 시작 전 보드게시판 메인페이지 board_list 레이아웃 간략 설명 board_list.html 화면 board_list.html 코드 HTML 삽입 미리보기할 수 없는 소스 board_list.html 게시글 목록 페이지 입니다. No 제목 제목 작성자 작성일 조회수 에 의해 layout.html의 content 내용으로 열리게된다. 등록된 게시글이 없습니다. [[${board.boardWriter}]] [[${board.regDate}]] [[${board.readCnt}]] 이후 board_list.html의 안의 태그로 게시글이 등록 됬을 때와 등록되지 않았을때 타임리프 구문의 , 를 사용하여 나타내주었다. 현재 게시글을 올리지 않았으므로 등록된 게시글이 없습니다. 가 출력될 것이다. 이전 다음.. 2023. 3. 22.
[Spring] 보드게시판 만들기(0) - 초기 세팅과 Fragment 일단 크게 src/main/java 폴더 src/main/resources 폴더로 구분할 수 있다. src/main/java 폴더 하위에 Controller과 VO, Service를 각각 만들어 주어야한다. 보드 게시판을 하기 위해서 먼저 멤버(Member)와 게시판(Board), 댓글(Reply)를 이용해 데이터베이스를 만들었다. DataBase 쿼리 작성 (테이블 생성) 이후 MemberVO, BoardVO, ReplyVO 각각의 VO 들을 생성해주었다. src/main/resources 에서 Mapper 들을 생성해주었다. board-mapper.xml 일단은 위 빨간 박스 안에 있는 내용들만 채워 넣자. member-mapper.xml reply-mapper.xml 코끼리 모양 build.grad.. 2023. 3. 21.
[Spring] Ajax(비동기 통신) 사용해보기 Ajax(비동기 통신, 자바스크립트) HTTP 방식으로 요청을 보내서 XML 문서를 응답으로 받아 자바스크립트 XML 개체로 접근하여 처리하는 기술 동기 VS 비동기 동기적 통신 비 동기적 통신 하나의 작업이 완료된 후에만 다음 작업을 진행가능한 구조 하나의 작업이 완료되지 않은 상태에서도 다른 작업을 얼마든지 시작할 수 있는 구조 사용자가 어떤 행동을 취했을 경우 그 요청이 서버로 전달되어 처리되고 결과가 반환되어 오기까지 다음 행동을 취하지 못하고 대기해야만 하는 것을 말한다. 사용자가 버튼을 클릭한 뒤, 그 행동에 대해 결과를 기다림 없이 다른 버튼을 클릭한다거나, 다른 입력 작업을 수행할 수 있다. Asynchronous JavaScript and XML HTML, CSS, 자바스크립트, DOM,.. 2023. 3. 21.
HTML을 부트스트랩(Bootstrap) 적용시키는 방법과 사용 팁, 주의사항 사이트 검색시 한글로 치지말고 영어로 쳐서 들어가자. 이후 Docs로 들어가면된다. 위 사진과 같이 태그는 태그가 끝나기 전에, 태그는 태그가 끝나기 전에 적절하게 붙여넣어 주면 완성이다. Bootstrap 적용 X Bootstrap 적용 O 왼쪽 스크롤에 Components 에 있는 Buttons을 살펴보면 위와 같이 각 클래스 이름들이 있다. 적절하게 사용해주면 이쁜 버튼들이 완성될 것 같다. Bootstrap 이용시 주의 사항 혹은 로 들어와야 Bootstrap이 적용이 잘 된다. 위 html 페이지 소스 코드 HTML 삽입 미리보기할 수 없는 소스 div6 은 col-6 으로 인해 화면의 반을 차지하고, 그 외는 각 3칸 씩 총 토탈 12칸으로 화면이 꽉찬다. 이처럼 Bootstrap은 하나의 열.. 2023. 3. 17.
[Spring] CSS 및 JS 적용시키는 방법 fragment html을 제외한 모든 파일 img, js, css 등은 static 파일이 기준이 된다. 그리고 경로 설정 시 맨 앞에 ' / ' 슬러쉬를 붙여주어야 한다. CSS static 폴더에 css 폴더를 생성하여 test.css를 생성하였다. 이후 template에 만들어준 fragment.html에 경로를 설정해주었다. 외부에 있는 html이랑 css를 찾는 폴더의 기준은 static이다. 태그를 넣는 위치는 가 끝나는 부분에 넣어주자. static 폴더는 접근할 때 반드시 앞에 '/' 슬러시를 넣어줘야한다. JS js 파일은 html의 body 끝나는 부분에 추가하여 준다. src 부분에도 당연히 ' / ' 슬러시를 추가하여야 경로가 똑바로 적용된다. fragment layout.html의 body 태그.. 2023. 3. 17.
[HTML] 스프링(Spring)에서 파일 생성 시 형식 추가 세팅 파일 메뉴의 Window -> Preferences를 클릭한다. 검색창에 template를 치고, HTML Files를 찾아 Templates를 선택하면 위와 같은 창이 뜨는데, New 혹은 Edit을 클릭하여 창을 생성 또는 수정한 후 OK를 누른다. 생성 or 수정한 HTML 파일 만들어보기 위와 같은 방법으로 마지막에 Finish를 누르면 생성이 된다 ! 2023. 3. 17.
[Spring] 페이지 나누기 (Thymeleaf Fragment ) 기능 적용 일단 페이지 실행을 위해 세개만 프로젝트를 만들 때 위 세개만 체크해주고 생성했다. implementation 'nz.net.ultraq.thymeleaf:thymeleaf-layout-dialect' 위 코드를 build.gradle에 dependencies 위와 같이 build.gradle을 수정해주면 반드시 프로젝트 우클릭해서 Gradle -> Refresh Gradle Project를 클릭해주자. templates에 두개의 폴더를 만들어준다. content와 fragment를 만들어주었다. 그리고 왼쪽과 같이 content / board_list.html fragment / header.html과 user_layout.html 을 만들어준다. user_layout.html xmlns:layout=.. 2023. 3. 16.
[Spring] DI(의존성 주입) @Autowired, @Resource, @Controller, @Service DI(의존성 주입)을 하는 방법 1. 프로그램 실행 시 필요할 것 같은 객체는 모두 만들어준다. 2. 만들어진 객체 중 필요한 객체를 의존성 주입시킨다. 프로젝트 생성시 기본 패키지 안에 있는 모든 클래스는 스프링이 자동으로 객체를 생성하는 자격이 된다. 객체 생성 어노테이션을 사용하여 객체를 생성한다. ( @Component, @Controller, @Service, @Repository 등) @Component는 스프링 초창기 버전에 사용했던 어노테이션이다. 초창기에는 밑에 있는 어노테이션들이 없었다. 이 클래스가 왜 객체를 만들어야하는지 애매모호했다. 그래서 세분화 시켰다. 역할을 부여하기 위해 세분화 한 것이 @Controller, @Service, @Repository 이다. 스프링 mapper.. 2023. 3. 15.

티스토리툴바