류하을 개발

EL태그 란? Expression Language는 글자 그대로 표현 언어이며, JSP위에서 표현(출력?)에 관한 일을 수행한다. JSP2.0 버전에서 새로 추가되었으며, EL(Expression Language)는 과 를 ${abc}로 간단하게 사용할 수 있게 해주는 태그이다. 또한 간단한 비교, 논리, 수치 연산도 태그안에서 가능하다. JavaScript ES5버전 이상에서 Template literals(Template strings)을 사용할 수 있는데, 여기에서도 ` `태그안에 EL을 사용이 가능하게 구현되어있다. 즉, 간편하게 출력하기에 최적화 된 태그라고 볼 수 있다. 기존 JSP와 EL 사용 비교 기존 JSP Code EL을 이용한 Code request.getParameter("name"..

JSP 란? Java Server Page의 약자이며, 글자 그대로 자바 서버 페이지 이다. JSP는 "HTML코드 내에 script로 작동하며, 웹서버에서 동적으로 웹페이지를 생성하여 웹브라우저에 돌려주는 웹어플리케이션 도구." 라고 볼 수 있다. 즉, JSP가 실행되면 Java에서 Servlet으로 변환되고, 웹 어플리케이션 서버(WAS)에서 동작되면서 필요한 기능을 수행하며, 생성된 데이터를 클라이언트로 응답하는 기능을 수행한다. 또한, 웹환경에서 Java를 쉽게 사용 할 수 있도록 만들어진 Java 기반의 script 언어이기 때문에, 자바의 기능을 그대로 사용할 수 있으며, Java와 동일하게 운영체제를 가리지 않는다는 장점이 있다. 위 그림은 JSP 동작 순서를 보여주고 있다. client에서..

JSON이란? Java Script Object Notation 의 약자이며, 직역하면 자바스크맆트 객체 표기법 이다. JSON 표기법은 사람과 기계 모두 이해하기 쉬우며 용량이 작다는 장점이 있다. JSON의 구조는 Array(배열)와 흡사하며, 2차원 배열 이라고 이해하면 쉽게 이해할 수 있다. Array[Number][KEY] 형태로 보면 "몇번째 어떤키값"으로 데이터를 찾을 수 있어 상당히 직관적인것이 장점이다. 구두로 말을 뱉음과 동시에 어떠한 데이터인지 명확하게 알 수있다. "몇번째에 있는 어떤 데이터를 찾고 싶은가?" JSON 작성방식 []괄호 안에 {}괄호가 하나의 객체(row)이며, 하나의 객체(row)는 KEY와 VALUE를 PAIR를 이루어 필드값으로 존재 한다. 쉽게 말해 2차원 배..

이전 글에서 XML의 개념을 정리하고, JavaScript에서 XMLHttpRequest 객체와 DOMParser 객체를 알아 보았다. JAVA에서도 XML파일을 FileReader로 읽어들여 DOMParser와 같이 접근하는 방법이 있다. 아래의 코드를 확인해보자. package main; import java.io.FileReader; import javax.xml.parsers.DocumentBuilderFactory; import org.w3c.dom.Document; import org.w3c.dom.Element; import org.w3c.dom.NodeList; import org.xml.sax.InputSource; public class mainClass { public static v..

XML 이란? XML은 eXtensible Mark-up Language 의 약자로써 직역을 하면 확장가능한 마크업 언어로 해석할 수 있으며, html과 거의 흡사하다. 다만 사용목적이 html과는 다르다. W3C에서 정보를 쉽게 교환하기 위하여 만든 포멧이며, 데이터를 설명하는 tag를 사용자 마음데로 정의가 가능하다. 다른 마크업언어를 생성할 수도 있으며, 텍스트로 구성되어있기 때문에 하드웨어나 소프트웨어에 제한을 받지 않는다. 태그자체가 확장성이 있기 때문에 어떤분야의 데이터로 정확하게 기술 할 수 있다는 장점이 있다. 즉, DB를 통하지 않고 xml 문서를 통해 택스트만으로 쉽게 정보 교환이되는것이 장점이다. XML 파일 구조 아래와 같이 HTML과 동일하게 tag를 사용할 수 있지만 예약어가 존..

JQuery란? JQuery란? JavaScript으로 만들어진 라이브러리중 하나이며, Vue와 react도 JavaScript라이브러리에 속한다. JQuery의 문법은 JavaScript의 문서객체모델(DOM) 찾기, 이벤트제어, 애니메이션만들기, Ajax 개발을 쉽게 할 수 있도록 개발 되었다고한다. $로 시작을하며, CSS의 id, class 명명법을 동일하게 사용 한다. JQuery 적용. JQuery의 사용 JQuery의 객체 접근 방법 JQuery에서 선택자로 접근하는 방법은 CSS와 거의 동일하다. Selector JQuery ALL Selector $("*") Element Selector $("elementName") ID Selector $("#idName") Name Selector ..

DOM이란? DOM은 BOM(:Browser Object Model)에 속해있는 구조이며, Document Object Model로 풀어 쓸 수 있으고, 직역을 하면 문서 객체 모델이라고한다. BOM(:Browser Object Model)의 최상위 객체는 window라는 객체이며, DOM은 window객체의 하위 객체 이기도 하다. 즉, HTML문서를 객체화 하여 구조로 만들고 접근할 수 있는 방법을 제공한다. DOM의 구조는 Tree 형식의 자료구조를 따라가며, 하나의 root node에서 퍼져나가는 방식이므로 tree 자료구조를 이해한다면 쉽게 이해 할 수 있다. DOM의 목적 DOM을 사용하게되면 문서를 객체화하여 구조를 이해할 수 있어 쉽게 접근이 가능하게되고, 해당 객체에 접근을 하게되면 수정..

CSS 기본구조 및 id class 사용 HTML에 CSS를 적용하기 위해서는 해당 스타일을 지정해줄 태그를 선택후 적용하게된다. 그러기 위해서는 태그명, 또는 해당 태그 id 또는 class 를 지정 및 선택하여 스타일을 지정해 줄 수있다. p tag 입니다 p tag id는 p1 입니다. h3 tag id는 p1 입니다. p tag class는 p2 입니다. h3 tag class는 p2 입니다. CSS 문자크기 주로 사용하는 문자크기 단위는 em, %, px를 주로사용한다고 하며, 해당 단위는 주위하며 봐두면 좋다. p tag 글자크기 defalut입니다. p tag 글자크기 단위는 1mm 입니다. p tag 글자크기 단위는 1pt 입니다. p tag 글자크기 단위는 1pc 입니다. p tag 글자..

CSS란? 종속형 시트라고 하며, Cascading Style Sheets 의 약자이다. HTML과 같이 사용하며, HTML이 정보를 표현한다면, CSS는 HTML의 정보를 시각적으로 꾸며주는 역할을 한다. 즉, HTML의 style 부분을 담당하고 있다고 생각하면 쉽고 간단하다. CSS 작성방식 CSS 작성방식에는 총 3가지가 있다. 방식 직역 우선순위 External 외부 스타일 시트 3 Internal 내부 스타일 시트 2 Inline HTML 안에 스타일지정 1 External 방식은 적용 우선순위가 제일 낮으며, 제일 먼저 적용이 된다. 즉, 가장 먼저 적용이 되기때문에 다른 작성방식에 의해 덮어씌워질 수 있다. 아래는 CSS 파일이 프로젝트 내에 외부 파일이 있을때에 적용하는 코드이다. Int..

이클립스에서 Window - Preferences 로 들어간다. Server 메뉴에 Runtime Environments 로 이동하여 Add 를 누른다. 해당 Tomcat 버전을 선택하고 Next > 를 누른다. Tomcat이 설치된 디렉토리를 설정하고 JRE 부분에는 jre또는 Jdk 해당 버전을 추가하고 Finish를 누르면 설정끝. Dynamic Web Project를 생성할때 해당부분에 Tomcat이 걸려있는지 확인.