본문 바로가기

TIL

(92)
<스프링 Spring> 페이징 + 검색 기능 구현 - 페이징 기능에 사용되는 컴포넌트 : 백엔드 - Controller, Service, Repository, Mapper.xml, VO, Pager / 프론트엔드 - JSP, JS, CSS 1) 페이징 기능 구현을 위해, VO 객체 외에도 페이징을 구현할 변수가 따로 필요하다. 이는 클래스 Pager를 생성하여 만든다. Pager 클래스에 담길 변수(필드)는 다음과 같다. 전체 글의 갯수 totalCount 전체 페이지의 수 totalPage 페이지당 글의 수 perPage 전체 블럭의 수 totalBlock 페이지당 블럭의 수 perBlock 현재 블럭 번호 curBlock 게시판 테이블의 컬럼 kind 검색어 search 페이지 시작번호 startNum 페이지 끝번호 lastNum 마지막 블럭 조사 ..
<스프링 부트 Spring boot> 게시판 구현 - 글 목록 조회 - 게시판 글 목록 조회 기능 스프링보다 훨씬 간편하게 글 목록 조회 기능 구현이 가능하다. 순서는 다음과 같다. 1) Controller에 글 목록 조회 시 실행되는 메서드를 만든다. 매핑은 Get으로 한다. @GetMapping("list") public ModelAndView getList(ModelAndView mv, NoticeVO noticeVO) throws Exception{ List list = noticeService.getList(noticeVO); mv.addObject("noticeList", list); return mv; } VO 객체를 통해 글 목록에 대한 정보를 담아 Service로 보낸다. Service로부터 받아온 데이터는 다시 List 타입의 list 변수에 담아 Mo..
<자바 Java> 추상클래스 - 추상클래스 생성의 목적 개발 프로젝트에서 코드를 설계하는 사람과 코드를 직접 작성하는 사람이 따로 있다고 가정했을 때, 설계하는 사람은 코드를 작성하는 사람에게 클래스의 구조가 어떠해야 하는지 설명해야 한다. 이 때 보다 분명하고 확실하게 지침을 전달하기 위해 코드를 작성하는 사람이 만들어야 할 많은 클래스들 중 공통된 특징을 추려내어 추상클래스를 만들어서 전달해 줄 수 있다. 이렇게 하면, 클래스들 간의 공통되는 특징들 만큼은 정해진 규격을 따라 코드를 작성할 수 있기 때문에 여러모로 편리해진다. 이 때 추상클래스의 추상(abstract)이란, 실체 간에 공통되는 특성을 추출한 것을 뜻하는 단어로서 이처럼 클래스들 간의 공통되는 특징을 추출하여 만든 클래스를 추상클래스라고 한다. - 추상클래스의 특..
<스프링 부트 Spring boot> Ajax 아이디 중복확인 기능 구현 - 아이디 중복확인 Ajax를 통해 페이지 이동 없이 해당 페이지 내에서 아이디 중복확인만 실행이 가능하다. 순서는 다음과 같다. 1) 회원가입 폼에 아이디 입력 후 아이디 중복확인을 할 수 있는 버튼을 만든다. 아이디 중복확인 이 때, 버튼을 만들되 버튼에 속성값으로 type="button"으로 한 번 더 명시해준다. 일반적으로 버튼은 submit의 기능을 포함하고 있기 때문에, 이 속성값을 설정하지 않으면 회원가입 폼의 전체 내용을 submit 하는 마지막 회원가입 버튼과 기능이 혼재되어 나타날 수 있기 때문이다. 따라서 submit이 중첩되지 않게, 아이디 중복확인의 버튼에는 submit 기능이 포함되지 않고 오직 button 기능만 할 수 있도록 해당 속성값을 추가해준다. 추가적으로 css는 다음..
<스프링 Spring> 회원가입 시 이메일 주소 가져오기 - 회원가입 시 입력된 이메일 주소 가져오기 이메일을 3개의 칸(사용자 이메일의 아이디, @, 도메인 주소)으로 나누어 입력하면 해당 정보를 가져와 DB에 1개의 이메일 주소로 합쳐서 저장할 수 있는 방법이다. 여러 자료를 찾아보니 이 기능에 관련된 자료는 없는 것 같아 직접 코드를 작성해보았다. 순서는 다음과 같다. 1) 회원가입 폼에 다음과 같이 코드를 만든다. 이메일 @ 이메일 칸을 3개로 구분지어 만든다. 첫번째는 사용자의 이메일 주소 중 아이디를 넣을 수 있는 칸(id="user_email"), 두번째는 태그 사이에 들어가는 span태그로, @ 기호만 html로 입력해준다(사용자 입력X). 세번째는 사용자의 이메일 주소 중 도메인 주소를 넣을 수 있는 칸(id="email_address")이다...
<스프링 부트 Spring boot> 회원가입 기능 구현 - 회원가입 기능 스프링 부트에서 회원가입 기능을 구현할 때, 보통 Security를 이용하여 구현하는데 이번 경우에는 Security 없이 구현하였다. 따라서 로그인 기능 구현 코드와 크게 다르지 않다. 구현 순서는 다음과 같다. 1) 회원가입 페이지인 jsp에 태그로 사용자에게서 입력받은 정보를 서버(컨트롤러 서블릿)으로 보낸다. - method : post 방식으로 서버에 전송한다. - action : 'join'으로 매핑된 컨트롤러의 메서드로 보낸다. 아이디 비밀번호 2) 회원가입 클릭 시 Controller는 웹 브라우저의 요청을 GetMapping으로 받고 Post에서 작업을 처리한다. 회원가입 폼에서 입력한 사용자의 정보는 VO 객체로 받고, 이를 Service의 메서드 호출과 동시에 매개변..
<스프링 부트 Spring boot> 로그인, 로그아웃 기능 구현 1. 로그인 기능 순서는 다음과 같다. 1) 로그인 페이지인 login.jsp에 태그로 사용자에게서 입력받은 정보를 서버(컨트롤러 서블릿)으로 보낸다. - method : 웹 브라우저에서 서블릿으로 정보를 전송하는 방법. GET과 POST 방식이 있다. - action : 사용자에게서 입력받은 정보를 보낼 서블릿이다(구체적으로는 서블릿에 매핑된 이름을 작성한다). - name : input 태그의 name 속성은 DB에서 가져온 데이터와 매칭할 수 있도록 DB의 컬럼명, 그리고 VO의 멤버변수명과 동일한 값으로 지정해야 한다. - submit : 최종적으로 form에서 입력받은 정보를 서블릿으로 전송하는 속성이다. 아이디 : 비밀번호 : 2) 정보를 전달받은 Controller는 Service의 객체를 ..
<CSS> 레이아웃 (3) - 포지셔닝 - 포지셔닝이란? 앞서 배운 CSS 레이아웃의 기본 토대가 되는 박스 모델을 바탕으로, 웹 문서의 화면을 각 위치에 맞게 구성하는 것을 말한다. 박스 모델을 원하는 위치로 움직여 포지셔닝할 수 있는 속성들은 아래와 같다. 1) box- sizing박스 너비의 기준을 정한다. 기본적으로 width 속성은 박스 모델 요소 중 콘텐츠 영역에 해당하는 가로 길이를 나타낸다. 따라서 박스 너비를 지칭할 때, 가로 길이를 콘텐츠 영역까지만 지정한다면 box-sizing에 content-box(기본값)를, 테두리 영역까지 포함한다면(padding 영역을 포함) border-box를 넣어 설정할 수 있다. - box-sizing: content-box / box-sizing: border-box /* 테두리까지 박스인..
<CSS> 레이아웃 (2) - 박스 구성 요소 - 박스 구성 요소 1) border border는 테두리라는 뜻으로, 박스에서는 핵심적인 부분인 콘텐츠를 둘러싼 테두리다. 테두리에 적용할 수 있는 스타일 속성으로는 다음과 같은 것들이 있다. - border-style : 테두리 선의 스타일 지정 ex. none, solid(실선), dotted(점선), double(이중선) - border-width : 테두리 선의 두께 지정. thin-medium-thick이나, 구체적인 수치로 설정할 수 있음 - border-color : 테두리 선의 색상 지정 - border-radius : 박스 모서리를 둥글게 설정. 테두리의 모서리 부분에 원이 하나 있는 것처럼 원의 반지름(radius) 값을 설정. - border 스타일 묶어서 표현 : border *속..
<자바 Java> 컬렉션 프레임워크(Collection Framework) (2) - Set - Set 컬렉션 Set 컬렉션은 List 컬렉션과 달리 순서를 저장하지 않는다. 그리고 중복을 허용하지 않는다. 수학의 집합, 그리고 구슬 주머니라고 할 수 있다. 동일한 객체를 두 개 이상 저장할 수 없으며, 들어가고 나오는 순서가 매 번 같지 않기 때문이다. Set 컬렉션도 List 컬렉션과 마찬가지로 제네릭 타입을 가지며, 객체 구현 시 구체적인 타입을 결정한다. 또한 객체 추가는 add(), 삭제는 remove() 메서드를 사용하는데 List 컬렉션과 같다. 주의할 점은 앞서 설명한 바와 같이 List 컬렉션과 다르게 객체 저장에 순서가 없다는 것이다. 따라서 객체를 꺼내오려면 반복자(Iterator)의 메서드를 사용해야 한다. - Iterator 인터페이스 Set 컬렉션에는 순서가 없기 때문에..