[JavaScript] 자바스크립트 Paging (페이징에 필요한 데이터) 변수 포함
·
FrontEnd/JavaScript
페이징에 필요한 데이터(변수 포함) curPage current Page 의 약자 현재 페이지 번호, 브라우저에서 선택한 페이지의 번호 totalCount 총 게시글 수 DB에서 조회된 전체 행의 수 listCount 한 페이지 당 보여질 게시글의 수 직접 설정할 수 있게 만든다 totalPage 총 페이지 수 전체 목록을 표현하기 위해 필요한 총 페이지 수 계산으로 알아낸다 pageCount 한 화면에 출력될 페이지네이션의 개수 직접 설정할 수 있게 만든다 startPage 화면에 보이는 페이지네이션의 시작 번호 계산으로 알아낸다 endPage 화면에 보이는 페이지네이션의 끝 번호 계산으로 알아낸다 startNo 화면에 보여지는 게시글의 시작 번호 계산으로 알아낸다 endNo 화면에 보여지는 게시글의 ..
[jQuery] 제이쿼리 jQuery 라이브러리를 이용한 Ajax 사용 방법에 대하여
·
FrontEnd/jQuery
jQuery 라이브러리를 이용한 Ajax 사용 방법에 대하여 XHR 객체를 이용한 순수 자바스크립트 AJAX 는 크로스 브라우징이 지원되지 않는다 XHR 객체를 이용한 코드 작성이 불편하다 jQuery Ajax API 는 크로스 브라우징이 지원된다 jQuery DOM을 이용하여 응답데이터를 손쉽게 적용할 수 있다 jQuery Ajax API 종류 $객체.load(url, [data] [complete]); $객체.get(url, [data] [success] [dataType]); $객체.ajax(url, [settings]); $객체.ajax(settings); jQuery Ajax API 01 - $객체.load(); $객체.load(url, [data] [complete]) AJAX 요청의 결과로 ..
[JavaScript] 자바스크립트 JSON, JavaScript Object Notation
·
FrontEnd/JavaScript
JSON, JavaScript Object Notation 자바스크립트 객체 표기법 JSON 한국어 홈페이지 통신을 할 때 데이터를 전달하기 위한 데이터 표기법으로 사용된다. 통신에 참여하는 모든 시스템(각종 프로그래밍 언어)들이 공통적으로 이해할 수 있는 데이터타입 표기법으로 자바스크립트 객체 표기법을 사용하는 것 JSON의 데이터 표현 방식 객체, Object 클래스, 구조체, Map, HashTable 등을 표현할 때 사용함 { } 로 감싸서 객체를 표현한다. 프로퍼티는 name : value 형태의 쌍으로 표현한다. name 은 문자열로 표현, value는 어떤 타입이든지 허용 여러 개의 프로퍼티를 표현할 때 각 프로퍼티들을 ',' 로 구분한다. ex) 빈 객체 - { } ex) {..
[JavaScript] 자바스크립트 Ajax XMLHttpRequest 객체
·
FrontEnd/JavaScript
XHR 객체 XMLHttpRequest AJAX 통신을 하기위한 자바스크립트 기본 내장 객체 IE 예전 버전에는 존재하지 않는 객체이며 AJAX 기술은 ActiveX 를 이용해 구현된다. 크로스브라우징 처리가 필요하다. XHR 객체 속성(property) readyState XHR 객체는 준비 - 전송 - 완료 단계를 거친다. (LifeCycle) readyState 는 각 단계를 표현하는 속성 0 : UNSENT : open() 호출 전 (XHR 객체를 생성한 단계) 1 : OPENED : open() 호출 후 2 : HEADERS_RECEIVED : send() 호출 후 응답을 받기 전까지 3 : LOADING : 다운로드 중(response 메시지를 받는 중) 4 : DONE : XHR 동작 완료(..
[JavaScript] 자바스크립트 Ajax 란
·
FrontEnd/JavaScript
AJAX, Asynchronous JavaScript With XML XML을 이용한 비동기식 자바스크립트 통신 HTTP 통신을 자바스크립트를 이용하여 비동기식으로 수행하는 것 자바스크립트 코드로 HTTP 요청을 보내고 XML파일 형식의 응답을 비동기적으로 받아서 처리하는 기술 최근 들어와서는 응답데이터를 XML 로 사용하지 않고 JSON 을 사용한다. 자바스크립트의 내장 객체인 XMLHttpRequest 객체를 사용한다. XMLHttpRequest 객체는 줄여서 XHR 로 부른다 보여지고 있는 웹페이지의 새로고침(페이지이동) 없이 서버에 요청을 보내고 응답을 받아야 할 때 사용한다 서버의 데이터베이스 정보가 필요할 때
[Java] 자바 getSession() 메소드 두가지
·
BackEnd/Java
getSession() 메소드 두가지 getSession() HttpSession : 객체가 이미 존재할 경우 현재 HttpSession 객체를 반환 HttpSession : 객체가 존재 하지 않으면 (첫 접속이면) 새로운 세션 객체를 만들어서 반환한다. getSession(boolean create) true : getSession() 과 똑같은 동작(없으면 새로 생성) false : HttpSession 객체가 존재하지 않으면 Null 을 반환한다. 예를 들어 BoardWriteController (게시글 작성 컨트롤러) 를 개발하는데, if(req.getSession(false) == null) { // 세션 정보가 없으면 게시글을 작성하지 못하도록 막기 resp.sendRedirect("/boar..
[Java] 자바 무상태 프로토콜, Stateless Protocol
·
BackEnd/Java
무상태 프로토콜, Stateless Protocol 쿠키(Cookie)와 세션(Session)에 대하여 통신 상태 정보를 저장하지 않는 프로토콜 통신 정보 : 서버 - 클라이언트 간의 통신 정보 새로운 요청이 발생하면 서버는 이전에 왔던 요청의 같은 클라이언트인지 구분하지 않는다. 웹(HTTP)에서는 요청마다 독립적인 통신으로 판단한다. 프로토콜만으로는 동일한 사용자의 연속된 요청인지 판단할 수 없다. 그러므로 상태관리 메커니즘(기술)이 필요하다. 상태관리 메커니즘 사용자(Client)의 정보를 관리(유지)하는 기술 쿠키, Cookie 서버의 정보를 클라이언트(브라우저)에 저장하는 기술 세션, Session 서버 - 클라이언트 간의 정보를 교환하는 기술 서버 - 클라이언트 연결 상태를 유지하는 기술
[Java] 자바 서블릿 필터, Filter
·
BackEnd/Java
서블릿 필터, Filter 클라이언트와 서버프로그램 사이에서 요청(request)과 응답(response)을 이용해서 추가작업을 할 수 있도록 만들어진 요소 요청 정보의 한글 인코딩을 설정 POST 전달 파라미터 설정 응답 정보의 한글 인코딩을 설정 응답 메세지의 ContentType을 설정 로그인 정보 검사 ex) 관리자인지 일반사용자인지 구분 ex) 등급별 사용자 구분
[Java] 자바 COS 라이브러리 파일 업로드
·
BackEnd/Java
COS 라이브러리 파일 업로드 com.oreilly.servlet.MultipartRequest 객체를 이용한다. 객체의 생성자를 통해서 업로드 설정을 한다. MultipartRequest 클래스의 생성자 public MultipartRequest() { HttpServletRequest request, // 요청 객체 String saveDirectory, // 파일 저장 위치 int maxPostSize, // 업로드 제한 사이즈 String encoding, // 인코딩 FileRenamePolicy policy // 중복된 파일이름 처리할 정책 } throws IOException MultipartRequest 의 주요 메소드 String getParameter(String name); 요청 파라..
[Java] 자바 파일업로드(FileUpload)
·
BackEnd/Java
파일 업로드 클라이언트(브라우저)가 전송한 파일을 웹 어플리케이션에서 받아들이는 것 서버에서 파일 업로드 라이브러리를 이용하여 업로드된 파일을 처리한다. commons-fileload 라이브러리 COS 라이브러리 업로드 하는 인코딩형식(encType)을 multipart/form-data로 설정해야 한다. 데이터를 전송하는 기본 형태(인코딩방식)는 "application/x-www-form-urlencoded" 인코딩 방식이다. 위의 방식은 전달 파라미터를 쿼리스트링으로 보낸다. 쿼리스트링으로는 파일의 내용물(컨텐츠)을 전송할 수 없다. 파일의 내용물을 전송할 수 있는 인코딩 방식 "multipart/form-data" 로 태그에 설정해주어야 한다. multipart 인코딩은 전송할 각 데이터를 boun..
[Java] 자바 JSTL Format 태그
·
BackEnd/Java
JSTL Format 태그 http://java.sun.com/jsp/jstl/fmt" %> formatNumber 문자열을 숫자형식으로 서식화하는 태그
[Java] 자바 JSTL, JSP Standard Tag Library
·
BackEnd/Java
JSTL, JSP Standard Tag Library JSP 에서 사용 가능한 표준 태그 라이브러리 JSP 코드의 가독성이 좋아진다. 자바코드를 작성할 상황을 최소화 시켜준다. 추가 라이브러리 파일이 필요하다 JSP 페이지에서 taglib 지시자를 이용하여 활성화해주어야 한다 JSTL 이 제공하는 5가지 커스텀 태그 core 논리 판단(조건문), 반복문 등의 제어문을 지원하는 태그 다른 JSP 호출하는 기능의 태그도 포함 format 날짜, 숫자, 시간 데이터의 서식을 지정하는 태그 sql 데이터베이스 처리 xml XML 문서에 대한 처리 functions 문자열 처리 함수를 사용할 수 있게 해주는 기능 단독 태그로 사용하지 않고 EL 과 함께 사용한다. JSTL taglib 지시자 JSTL 태그 라이..
[Java] 자바 EL, Expression Language
·
BackEnd/Java
EL, Expression Language basic Tag - action Tag - EL JSP 에서 값을 출력하는 코드를 쉽게 사용할 수 있도록 만들어진 문법 표현식(Expression Tag, ) 과 비슷한 역할을 수행한다. 주로 컨텍스트 정보를 다루거나 출력할 때 사용한다. JSTL 과 함께 사용하기에 적합하다. EL 구문 형식 ${ } ( $( ) - jQuery 와 헷갈리면 안된다. ) ex) ${10+20} => 30이 브라우저 화면에 출력된다. EL 연산자 산술 +, -, *, /, div, %, mod 관계 ==, eq, !=, ne, , gt, =, ge 조건 (조건식)? data1: data2 논리 &&, and, ||, or, !, not null검사 연산자 ex) ${empty ..
[Java] 자바 JSP 액션 태그, Action Tag
·
BackEnd/Java
JSP 액션 태그, Action Tag JSP 의 문법 요소 중 하나 JSP 페이지에서 특정 동작을 수행하도록 만든 태그 페이지와 페이지 사이의 제어, 이동 등의 기능을 제공한다. 형식 기본적으로 태그로 이루어져 있기때문에 여는태그, 닫는태그 모두 사용해야한다. 자바빈(JavaBean) 생성 JSP 페이지에서 사용할 JavaBean 객체를 생성하고 지정한 scope 영역의 컨텍스트 정보로 저장한다. scope 영역을 지정하지 않으면 page 영역에 저장된다. scope : page(기본값) | request | session | application JavaBean 프로퍼티에 값을 설정한다. DTO 클래스의 setter 를 실행한다. JavaBean 프로퍼티 값을 가져온다 DTO 클래스의 getter 를..
[Java] 자바 JSP 컨텍스트 영역에 대해서
·
BackEnd/Java
컨텍스트영역에 대해서 컨텍스트 영역의 유효범위(Scope) 웹 어플리케이션의 정보(변수)가 영향을 미치는 범위 사용할 수 있는 영역 page 영역 논리적으로 가장 좁다 하나의 JSP를 처리하는 동안 유지되는 영역 pageContext 내장객체를 이용하여 컨텍스트영역의 정보를 다룬다. 해당 파일 안에서만 사용 가능한 변수를 만들때 Page를 사용하면 된다. request 영역 HttpServletRequest - URL, Method, Parameter 를 관리하고 사용하는 객체 req.getParameter 하나의 요청(Request)을 처리하는 동안 유지되는 영역 HTTP Request(요청)이 처리되어 HTTP Response(응답)이 이루어질 때 까지 EmpListController 기준이면 Req..
헌일
오늘 할 일은 내일로 미루고 내일 할 일은 생각하지 말자