728x90

분류 전체보기 117

JSP - JSTL

JSTL이란 자바서버 페이지 표준 태그 라이브러리(JavaServer Pages Standard Tag Library)이며 Java EE 기반의 웹 애플리케이션 개발 플랫폼을 위한 컴포넌트 모음이다. JSTL은 JSP 페이지 내에서 자바 코드를 사용하지 않고 태그 내에 로직을 내장하는 효율적인 방법을 제공하며 표준화된 태그 셋을 사용하여 코드의 유지보수성을 높여주고 보다 완벽한 MVC 구조를 구축 가능하게 해 준다. 태그 라이브러리 지시어로 사용하며 다음과 같이 사용할 수 있다. forEach (반복문) var = " 변수명 " , items = "${가져올 데이터}" out (출력문) value = "출력할 값" escapeXml = " false " -> true로 설정할 경우, 출력 문자열에 포함된..

web 2022.08.16

태그핸들러클래스 기반의 커스텀태그

태그 핸들러 클래스는 .java 파일로 만들어지며 태그 라이브러리 기술자(작성자)는 .tld 파일(.xml 파일)로 만들어지며 태그 파일과 같이 WEB-INF 하위에 tld 폴더를 만들어 관리한다. tld 파일은 xml파일 생성 시 Next -> Create file using a DTD or XML Schema file -> Select XML Catalog entry 이후 플러그인에서 j2ee/web-jsptaglibrary를 선택한 후 j2ee의 Prefix를 지우고 no prefix로 생성한다. tld 파일은 다음과 같은 형태로 작성된다. 커스텀태그명 패키지경로명.핸들러클래스명 태그바디의 형태 태그 바디의 형태 자리에 들어갈 수 있는 것들로는 empty, JSP, tagdependent 등이 있다..

web 2022.08.14

태그 파일 기반의 커스텀태그

태그 파일들은 Dynamic Web project의 WEB-INF의 tags 폴더에 저장, 관리하며 .tag 파일 기반의 커스텀 태그이다. 예를 들어 아래와 같은 형태의 print.tag 파일을 만들었을때 커스텀태그입니다. HELLO! :D 다음과 같이 커스텀 태그명을 지정해주고 해당 태그의 파일명을 불러와 사용 가능하다. 실행 결과 또 다른 예시로 다음과 같은 Test.java 클래스 파일을 만들었다. package test; // 예시를 위해 만들었기 때문에 setter는 생략 import java.util.Arrays; public class Test { private String[] datas = {"apple","banana","kiwi"}; private int num1=10; private ..

web 2022.08.13

커스텀 태그

커스텀 태그란 사용자(개발자)가 작성한 태그로 장점으로는 View에 존재하는 로직 코드(java)를 분리할 수 있으며 해당 로직코드를 캡슐화(모듈화)하여 보다 완벽한 MVC 구조가 구축 가능하다. 커스텀 태그는 태그 파일 기반의 커스텀 태그와 태그 핸들러 클래스 기반의 커스텀 태그가 있으며 태그 파일 기반의 커스텀 태그는 주로 프로젝트의 규모가 작거나 간단한 기능을 구현할 때 사용하며 태그 핸들러 클래스 기반의 커스텀 태그는 프로젝트의 규모가 크거나 배포(공개, 공유)를 하는 것이 주된 목적일 때 사용된다. 태그는 주로 쌍으로 이루어져 있으며 태그바디를 비울 경우(사용하지 않을 경우) 와 같이 태그를 닫는 것을 권장한다. 또한 속성값들을 작성할 때에는 " "를 사용하여 해당 값들을 묶어주는 것을 ..

web 2022.08.12

표현언어, EL식

표현 언어, EL 식은 View 즉, 사용자에게 보여지는 브라우저, .jsp, .html과 같은 곳에서 활용되며 ${표현식}, ${변수명}, ${객체명.멤버변수}, ${컬렉션 객체[인덱스]} 과 같은 형태로 사용된다. View에서 EL식을 사용하기 위해서는 사전에 Controller에서 request, session, application과 같은 scope 내장객체에 setAttribute()하여 정보를 전달해 주어야 한다. ${숫자} ${문자열} ${boolean} ${null}과 같은 상수값도 작성 가능하며 기본 연산도 가능하다. 예를 들어 아래와 같이 form 태그 내부에서 하나의 값을 선택해 select에게 value값을 주었을 때 apple banana kiwi 정보를 받는 곳에서는 sel이라 ..

web 2022.08.12

DOM & BOM

웹사이트는 크게 HTML, CSS, JS(javascript) 세 가지로 구성되어 있다고 할 수 있다. HTML은 웹페이지의 제목, 이미지, 표 등을 정의하고 구조와 의미를 부여하는 정적언어로 웹의 전체적인 구조를 담당하고 있으며 CSS는 HTML이 실제 표시되는 방법, 색상, 레이아웃, 크기, 폰트 등을 지정하여 시각적인 표면을 담당하고 JS는 HTML의 정적이고 단조로운 한계를 극복하기 위해 만들어진 언어로 웹문서에서 동적인 처리들이 가능하도록 한다. 정리하자면 HTML로 뼈대를 만들고 CSS로 옷을 입히고 JS로 기능을 추가한다고 할 수 있다. 그렇다면 어떻게 JS는 확장자가 다른 HTML과 CSS 파일의 내용을 읽고 수정할 수 있는가 하면 그 답은 DOM에 있다. DOM(Document Objec..

Study 2022.08.10

JSP - session 객체를 이용해 장바구니 만들기

1. index.jsp 간이로 만든 로그인 페이지로 아이디 입력값만을 받는다. 로그인 버튼 클릭 시 action 태그에 지정한 파일로 form 태그 안에서 입력된 정보가 전달된다. 유효성 검사는 진행하지 않았다. 2. main.jsp 메인 페이지(상품 선택 페이지)로, 원하는 옵션을 선택 후 추가 버튼을 눌러 해당 정보를 add.jsp로 전달한다. request 객체를 이용해 로그인 페이지에서 받은 정보(유저의 로그인 아이디)를 session에 저장한다. 구매하기 클릭 시 장바구니 정보를 출력해주는 result.jsp로 이동한다. 님, 반갑습니다! :D // index.jsp에서 넘어온 정보 연필 샤프 샤프심 지우개 볼펜 구매하기 3.add.jsp 메인 페이지에서 받은 정보(선택한 옵션)를 장바구니에 넣..

web 2022.08.02

JSP 기본 문법

1) 에러 페이지 처리 주로 발생하는 에러로는 404 에러와 500 에러가 있으며 404 에러의 경우 주로 클라이언트의 문제로 없는 페이지를 요청했을 때 발생된다. 해결 방법으로는 존재하는 페이지의 요청을 하거나 서버 측에서 페이지를 생성하여 해결한다. 500 에러의 경우 주로 서버의 문제로 로직상에서 발생하는 모든 문제에 대해 500 에러를 발생시킨다. 에러 페이지 처리의 경우 page 지시어 isErrorPage와 errorPage 속성을 통해 설정이 가능하다. 2) include 지시어 include 지시어는 여러 페이지에 공통으로 들어가는 내용을 관리할 때 유용하며, 공통으로 들어가는 페이지를 한 번 만들어두면 다른 페이지에서 필요한 경우에 include 해서 사용이 가능하다. 공통 내용의 페이지..

web 2022.08.02

JSP를 이용한 서버 프로그래밍

서버(server)는 서비스를 제공하는 곳으로 즉, 요청을 받아서 서비스를 제공(응답)하는 곳이라고 할 수 있으며 클라이언트(client)는 서비스를 이용하는 곳 즉, 사용자(브라우저)가 서버에게 요청을 시도하는 곳이라고 할 수 있다. HTTP의 명령 방법으로는 GET, POST 두 가지 방법이 존재하며 GET 방식의 경우에는 URL에 정보가 노출되어 보안에 불리할 수 있으며 전달할 수 있는 데이터 크기에 제한이 있다. R(데이터를 로드) 작업 즉, 서버에서 정보를 가져오려고 사용하는 방법(SELECT)에 많이 활용되며 URL? 매개변수=값 & 매개변수 = 값과 같은 형태로 나타난다. POST 방식의 경우 URL에 값이 표시되지 않으며 요청 헤더에 데이터를 넣어 전송하기 때문에, 데이터 크기에 제한이 없..

web 2022.08.01

CSS - 기본 문법

width: 넓이 (가로) 설정 height: 높이 (세로) 설정 color: 글자 색 background: 배경 색 display: 요소를 어떻게 표시할지 선택 (1) inline - 요소를 inline 요소처럼 표시되고 줄바꿈이 되지 않음. (2) block - 요소를 block 요소처럼 표시되고 줄바꿈이 됨. (3) none - 박스가 생성되지 않고 공간을 차지하지 않음. (4) inline-block - 요소는 inline인데 내부는 block 처럼 표시하고 박스 모양이 inline 처럼 옆으로 늘어섬 :hover : 요소에 마우스를 올려놓았을 때의 설정 list-style-type: list의 스타일 형태 설정 (none 설정 시 점이 사라짐) text-decoration: 글자에 밑줄이나 윗줄..

web 2022.07.28
728x90