Til

[TIL] JSP 웹페이지 만들기(MyBatis, Member)

✍ Today I Learned 지금까지 JSP의 기능에 대해 공부했다면, 이번엔 제대로 웹페이지를 만들어보자. 기본 게시판 기능, 로그인/로그아웃 기능, 파일 업로드 기능, 댓글 기능 등이 포함될 예정이다. MyBatis 프레임워크를 사용할 것이다. [환경 설정] New → Dynamic Web Project로 새로운 프로젝트를 생성한다. (Generate web.xml deplyment descriptor 체크 필수) 기본으로 생성되던 주석을 삭제한다. Window → Prefernces → Java → Code Style → Code Templates에서 Code에 있는 주석 부분을 전부 지워준다. [web.xml 설정] WEB-INF 폴더에 web.xml 파일을 만들고 다음과 같이 작성한다. 이번..

[TIL] JSP 세션(session)으로 로그인/로그아웃 구현

✍ Today I Learned 톰캣 서버에 올라가 있는 프로젝트를 remove 하고, 02 프로젝트를 복사한 session 버전 프로젝트를 톰캣 서버에 add 한다. 충돌 방지를 위해 web.xml에 있는 display-name을 프로젝트와 같은 이름으로 바꿔준다. [세션 Session] 세션(session)이란? 서버와 클라이언트의 연결을 유지시켜주는 방법이다. 쿠키는 클라이언트 브라우저에 생성되고 저장이 된다면, 세션은 웹서버 쪽 웹 컨테이너에 생성되고 저장이 된다. http 프로토콜은 브라우저에 어떤 요청을 하고 서버에서 응답을 하고 나면 해당 연결을 해제하는데, 쿠키와 세션을 이용해 해당 정보를 저장하면 연결을 유지시킬 수 있다. 세션은 웹 브라우저를 종료하거나, 프로그래밍적으로 세션을 종료하기..

[TIL] JSP로 CRUD 구현2

✍ Today I Learned [Detail(SelectOne)] List에서 ename을 클릭하면 Detail을 볼 수 있도록 a 태그를 이용해 "detail.em"으로 쿼리 스트링에 empno를 실어 요청한다. 이때 EL태그를 이용하면 훨씬 효율적이다. ${evo.ename} 클릭한 데이터의 empno 정보를 가지고 다음과 같은 순서로 요청한다. Controller → Action(여기까진 request객체) → Service → DAO → 데이터베이스에서 empno로 Select 후 EmpVO 객체를 다시 detail.jsp까지 전달한다. list와 마찬가지로 JSTL을 이용하여 datail.jsp를 작성한다. Action에서 setAttribute를 evo로 설정했기 때문에 jsp에서도 evo로..

[TIL] JSP로 CRUD 구현

✍ Today I Learned [Log 템플릿 설정] SLF4J로 로깅하기 위해 다음의 코드를 템플릿으로 설정한다. Window → Prdferences → Java → Code Style → Code Templates → Code New Java files → Edit ${filecomment} ${package_declaration} import org.slf4j.Logger; import org.slf4j.LoggerFactory; ${typecomment} ${type_declaration} Class body → Edit private static Logger log = LoggerFactory.getLogger(${type_name}.class); Java 파일을 생성하면 다음과 같이 템플릿..

[TIL] JSP 개발 환경 설정

✍ Today I Learned 본격적으로 jsp 웹페이지를 만들기 전에 개발 환경 설정을 해주었다. jsp는 다양한 방식으로 개발하기 때문에 개발자마다 아키텍처는 다를 수 있다. [환경 설정] 이클립스의 Workspace를 jsp 폴더로 변경한다. 가장 먼저 인코딩 설정을 한다. Window → Preferences → encoding 검색 → Workspace와 CSS Files, HTML Files, JSP Files 전부 utf-8로 변경 웹브라우저 설정을 해준다. General → Web Browser → Use external web browser 선택, Chrome 선택 컴파일러 버전을 맞춰준다. Java → Compiler → 1.8로 변경 톰캣을 연결해준다. Server → Runtime..

[TIL] MySQL 내장함수, GROUP BY, HAVING

✍ Today I Learned 날짜 함수 관련해서는 정답이 없다. 어떤 포맷팅으로 기록하고, 무엇을 기록할 것이냐에 따라 달라진다. 모든 걸 DB에서 처리할 수 없고, 오히려 속도는 프로그래밍에서 하는 게 빠르지만 문제는 트래픽 양이다. 트래픽 양 = 호스팅 비용 = 돈 이기 때문에.. MySQL의 IFNULL() 함수는 Oracle의 NVL() 함수와 동일하게 작동한다. (nvl = null value) ADDDATE() vs DATE_ADD() 차이점은? ADDDATE()는 두 번째 인수로 INTERVAL value addunit 대신 추가할 일수만 지정하는 days를 사용할 수 있다! 즉 ADDDATE(date, 3) 이런 식으로 사용 가능하다. 참고자료 CASE문 뒤쪽으로 비교할 value를 넣..

[TIL] JS 클래스, JSON

✍ Today I Learned 스스로 하지 않으면 발전은 없다! 분발하자! [Style Guide] operator 양쪽에 공백 두기 변수 이름 시작에 숫자나 대문자 X 달러($) 기호로 이름을 시작하지 않기 파일명은 소문자로 하는 것을 추천 [Best practices] 전역 변수, new, ==, eval() 가급적 사용하지 않기 변수는 상단에 선언하고, 선언하면서 초기화 객체, 배열 선언은 const 자바스크립트는 자동형변환 되는 경우가 많으므로 언제나 데이터 타입에 유의하기 switch 문은 언제나 default로 끝내기 eval() 함수 사용하지 않기 [Mistakes] = 할당 연산자와 == 비교 연산자 헷갈리지 말기(할당은 할당 값을 반환) switch문은 타입까지 비교하는 엄격한 비교를 ..

[TIL] JS 퀴즈 파티

✍ Today I Learned [travel 링크 이동 없이 이미지 바꾸기] document에 addEventListner를 걸었을 경우, 페이지 내 어떤 곳이든 클릭될 수 있기 때문에 조건문으로 범위를 잡아줘야 한다. contains() 메서드는 class에 해당 값이 존재하는지를 true or false로 반환한다. let targetCls = e.target.classList.contains('click'); // true or false 반환 [퀴즈 1 영화 제목 입출력하기] 입력하자마자 바로 출력(HTML에 결괏값 데이터 쌓기) -> innerHTML로 배열[배열.length-1] 버튼뿐만 아니라 입력 창도 disabled HTMLElement.focus() 메서드는 지정된 요소로 포커스를 설..