지역별 맛집을 검색해서 리스트를 출력해 주는 기능을 만들어 보자. 아래처럼 키워드를 입력하고 검색 버튼을 누르면 그 아래 영역에 검색 결과를 출력할 것이다. 1. 검색 결과 리스트와 수를 출력할 mapper 코드를 작성한다. mapper.xml LIKE문을 사용할 때 작은 따옴표(')와 | 기호를 써야 하는 점에 유의한다! SELECT fno, name, score, poster, type, address, num FROM (SELECT fno, name, score, poster, type, address, rownum as num FROM (SELECT fno, name, score, poster, type, address FROM food_location WHERE address LIKE '%'||..

이제 게시글의 상세페이지에서 볼 수 있는 댓글 기능을 만들어 보자. 우선 댓글의 정보를 담아 줄 VO를 생성한다. 자유게시판의 댓글 기능을 만드는 것이지만, 추후 공지사항이나 묻고 답하기 등 다른 게시판에서의 확장성을 고려하여 table_name이라는 항목도 생성한다. ReplyVO.java //Getter, Setter는 편의상 생략 package doodoo.vo; import java.util.*; public class ReplyVO { private int no, bno, type; private String id, name, msg, dbday, table_name; } 댓글 쓰기 위처럼 게시글 아래에 댓글 창을 만들고! 추가시 덧글 목록을 출력하도록 만든다. 입력창에 내용을 입력 후 댓글 쓰..

회원가입 기능을 만들었으니... 이제 아래와 같은 로그인 모달을 띄워서 로그인 처리를 해 보자! 로그인 처리는 어떻게 해야 하는가? 지금까지처럼 request에 로그인 정보를 저장하면, 사용자가 페이지를 이동할 때마다 로그인 정보를 request 에 담아 보내줘야 하기 때문에 매우 비효율적이다. 따라서 사용자가 로그인한 상태인지 아닌지에 대한 정보는 session에 저장한다. 세션은 서버에 저장되기 때문에 사용자가 로그아웃을 하거나 브라우저를 종료하기 전까지는 이 정보가 유지된다! 또한 미로그인/로그인 상태에 따라 로그인 아이콘을 변경하고, 일반 회원이냐 관리자 회원이냐에 따라 보이는 메뉴의 종류를 달리 할 것이다. 가보자고~ 로그인 모달 띄우기 / 로그아웃 처리하기 ajax 팝업 라이브러리 중 하나인 ..

이제 회원가입이다! 아래와 같은 폼을 구성한 후 기능을 만들어 보자. 우선 데이터를 받아주고 관리하기 위해 아래와 같은 MemberVO를 생성한다. 동일한 형태로 Oracle 데이터테이블도 생성한다. MemberVO package doodoo.vo; public class MemberVO { private String id, pwd, name, sex, birthday, email, post, addr1, addr2, tel, content, admin, login; private String tel1, tel2; //받을 때는 tel1, tel2 따로 받고 묶어서 한번에 처리할것임 private String msg; } 폼에서 보이듯 010은 고정되어 있고 이후 뒷자리를 입력받도록 만들어져 있다. 따라..

상세 페이지에서 만들었던 수정/삭제 버튼을 클릭했을 때의 기능을 만들어 보자. 글 삭제 기능 삭제 기능은 아래와 같은 흐름대로 처리하게 구현할 것이다. (1) detail.jsp에서 "삭제"버튼을 클릭하면 나타나는 입력칸에 비밀번호를 입력하고 버튼을 클릭하면! → detail.jsp의 ajax 코드에 의해 "../freeboard/delete.do?no=1&pwd=1234"와 같은 요청을 전송한다. (2) Model에서 delete.do를 인식하여 no와 pwd를 받아 DAO의 메서드를 호출한다. (3) DAO의 boardDelete()에서 비밀번호가 맞으면 게시글을 삭제하고 yes, 틀리면 no를 result에 담아 리턴한다. (4) Model에서 result를 request의 res에 담아 delet..

DOMScript DOM(Document Object Model) 웹페이지에서 자바스크립트로 요소들을 제어하는 데 사용된다. 웹 개발에서 사용되는 documnet 객체 또한 브라우저에서 제공하는 window객체의 한 요소다. 그리고 그 DOM, window.document 내에 HTML을 구성하는 하나하나의 요소가 담겨 있다. jQuery는 그 요소들을(HTML DOM Tree) 간단하게 제어하여, 쉽게 이벤트를 처리할 수 있게 돕는 javascript의 라이브러리! 보통 태그 내에서 $ 기호를 사용하면 거의 jQuery라고 보면 된다. 즉 document.querySelector("")를 $("")처럼 간단하게 나타낼 수 있도록 해 주는 게 jQuery! jQuery를 사용하기 위해서는 JSP 페이지 ..

이제 MyBatis와 MVC를 모두 활용한 게시판을 한 번 만들어 보자. 전체적인 로직 흐름을 파악하는 데 중점을 두고 가보자고~ 이번에도 main.jsp에서 header와 footer, 그리고 출력할 화면을 include하여 제어할 것이다! 아래와 같은 FreeBoardVO에 게시판과 관련된 정보를 저장할 것이다. package doodoo.vo; import java.util.*; public class FreeBoardVO { private int no, hit, rcount; private String name, subject, content, pwd, dbday; private Date regdate; } 글쓰기 아래같은 화면에 값을 넣어 주면, 그 값을 받아 데이터베이스에 INSERT할 것이다..

함수 자바스크립트에서도 사용자 정의 함수를 만들 수 있다. 매개변수와 리턴형을 반드시 가지지는 않으며 둘 다 없어도 가능하다. 자바와 달리 리턴형과 매개변수의 타입을 표기하지 않는다. 매개변수O, 리턴형O : function func_name(id, pwd){ return value; } 매개변수O, 리턴형X : function func_name(id, pwd){} 매개변수X, 리턴형O : function func_name(){return value;} 매개변수X, 리턴형X : function func_name(){} → 함수는 기능 처리를 위해 이용되며 태그에서 많이 호출한다. //함수 정의는 세 가지 형태로 가능하다. function func_name1(매개변수){ return 값; } let fun..

자바스크립트 (스크립트: 단순한 프로그램) : 브라우저에서 프로그램을 동적으로 처리하는 언어 사용법) ***내부 자바스크립트 => 한 파일에서만 적용 ***외부 자바스크립트 : 여러 파일에서 공통으로 적용 (파일 확장자가 .js) 인라인 자바스크립트 위와 같이 한 개의 태그에서만 제어한다. 1) 변수 : 한개의 데이터 저장 공간 자동 지정 변수 (var,let,const) 자바와 달리 변수 타입을 지정하지 않아도 자동으로 인식하여 지정된다. → let (ES6) : 사용범위가 명확하다 → var(ES5) : 지역변수의 범위가 명확하지 않다 javascript java let i = 10; int i = 10; let i = 10.5; double i = 10.5; let i = 'Hello'; Strin..

MyBatis는 태그 형태의 코드로 간단하게 데이터베이스와 연결해 주도록 돕는 라이브러리이다! 사용해 보자. https://github.com/mybatis/mybatis-3/releases 위 링크에서 zip파일 다운로드 zip파일의 압축을 풀고 파일 내의 모든 jar파일을 프로젝트 lib에 복사해 준다. Eclipse의 상위 탭에서 "Help > Eclipse MarketPlace" → MyBatis 검색 및 설치 일반 xml파일로 Config.xml 을 만들고, MyBatis XML Mapper 파일로 board-mapper.xml을 만든다. Config.xml은 데이터베이스와 연결하고 어떤 값을 어떻게 가져올 것인지 설정하는 파일, board-mapper.xml은 실행할 쿼리 문장을 저장하는 곳이..