끵뀐꿩긘의 여러가지

Event 브라우저에는 많은 이벤트가 발생합니다. 브라우저 화면의 크기를 마우스로 조절할 때도, 스크롤을 할 때도, 마우스로 이동하거나 무언가를 선택할 때도 이벤트가 발생합니다. 이벤트를 브라우저가 발생시켜주니, 우리는 그때 어떤 일을 하라고 할 일을 등록할 수가 있습니다. 다시 말해, HTML엘리먼트별로 어떤 이벤트(주로 키보드나 마우스 관련)가 발생했을 때 특정 행위를(어떤 일) 하고 싶다면, 대상엘리먼트를 찾고 어떤 일을 등록하면 된다. 그것을 자바스크립트로 구현할 수 있습니다. 이벤트 등록 이벤트 등록 표준방법입니다. 1 2 3 4 var el = document.querySelector(".outside"; el.addEventListener("click".fuction(){ //do somth..

함수의 기본 형식 1 2 3 4 function 함수명( [인자...[,인자]] ){ 코드 return 반환값 } cs 함수는 function 뒤에 함수의 이름이 오고, 소괄호가 따라온다. 소괄호에 인자라는 값이 차례로 들어오는데 이 값은 함수를 호출할 때 함수의 로직으로 전달될 변수다. 인자는 생략 할 수 있다. 함수를 호출 했을 때 실행하게 될 부분이 중괄호 안쪽에 온다. ex) 1~9까지의 숫자를 출력해주는 JS코드 1 2 3 4 5 6 7 8 function numbering(){ i = 0; while(i

조건문 1.if...else문 특정 조건이 참인 경우 문장을 실행하기 위해 if 문을 사용합니다. 또한 선택적으로 조건이 거짓인 경우 문장을 실행하기 위해서는 else 절을 사용합니다. 1 2 3 4 5 if (condition) { statement_1; } else { statement_2; } cs 2.switch문 Switch문은 프로그램이 표현식을 평가하고 값을 조건과 비교합니다. 만약 값이 일치한다면, 프로그램은 각 조건의 하위 문장을 실행합니다. 1 2 3 4 5 6 7 8 9 10 11 12 switch (expression) { case label_1: statements_1 [break;] case label_2: statements_2 [break;] ... default: state..

웹 프로그래밍에서 동적인 부분을 담당하는 친구인 자바 스크립트의 변천사와 간단한 자료형을 알아보도록 하겠습니다. 자바스크립트란 무엇인가? 자바스크립트의 버전 자바스크립트 버전은 ECMAScript(줄여서ES)의 버전에 따라서 결정되고, 이를 자바스크립트 실행 엔진이 반영합니다. ES5, ES6(ES2015).. 이런 식으로 버전을 일컫습니다. 2018년을 중심으로 ES6를 지원하는 브라우저가 많아서 몇 년간 ES6 문법이 표준으로 쓰이고 있습니다. ES6는 ES5문법을 포함하고 있어 하위호환성 문제가 없습니다. 다만 feature별로 지원하지 않는 브라우저가 있을 수 있어 조심해야 합니다. 변수와 연산자, 데이터 타입 변수 변수는 var, let, const 로 선언할 수 있습니다. 어떤 것을 사용하는가..

DB 연결 및 웹 앱이라는 두번째 파트가 시작되었습니다. 아래의 목표를 차례차례 달성해가며 계속해서 공부해보겠습니다. JavaScript의 기본문법을 이해한다. DOM, Browser Event, Ajax이 각각 무엇인지 이해하고, 이를 활용해 웹화면을 제어할 수 있다. JSP의 라이프사이클을 이해하고 redirect & forward 와 scope를 이해하고 사용할 수 있다. JSTL과 EL을 사용할 수 있다. 데이터베이스를 설치하고 간단한 SQL을 사용할 수 있다. Maven을 이해하고 Maven을 이용한 웹 어플리케이션을 작성할 수 있다. JDBC 프로그래밍을 할 수 있다. Web API를 이해한다.

요청과 응답 WAS는 웹 브라우저로부터 Servlet요청을 받으면, 요청할 때 가지고 있는 정보를 HttpServletRequest객체를 생성하여 저장합니다. 웹 브라우저에게 응답을 보낼 때 사용하기 위하여 HttpServletResponse객체를 생성합니다. 생성된 HttpServletRequest, HttpServletResponse 객체를 서블릿에게 전달합니다. HttpServletRequest http프로토콜의 request정보를 서블릿에게 전달하기 위한 목적으로 사용합니다. 헤더정보, 파라미터, 쿠키, URI, URL 등의 정보를 읽어 들이는 메소드를 가지고 있습니다. Body의 Stream을 읽어 들이는 메소드를 가지고 있습니다. HttpServletResponse WAS는 어떤 클라이언트가 ..

1.자바 웹 어플리케이션(Java Web Application) WAS에 설치(deploy)되어 동작하는 어플리케이션입니다. 자바 웹 어플리케이션에는 HTML, CSS, 이미지, 자바로 작성된 클래스(Servlet도 포함됨, package, 인터페이스 등), 각종 설정 파일 등이 포함됩니다. 자바 웹 어플리케이션의 폴더 구조 이클립스에서 Dynamic Web Project의 servlet을 실행하면, 해당 프로젝트가 이클립스가 관리하는 .metadata 폴더 아래에 자바 웹 어플리케이션 폴더 구조로 만들어져 실행됩니다. 이클립스의 저장장소에서 확인할수 있습니다. C:\Users\user\eclipse-workspace 보통 위의 주소에 저장되어있습니다. 2.서블릿이란? 웹프로그래밍에서 클라이언트의 요청을..

HTML의 여러 태그들의 기능을 알아보았듯이 CSS의 여러 속성들을 알아보겠습니다. width, height 속성 margin, padding 속성 display 속성 float 속성 position 속성 width, height 속성 width와 height 속성은 각각 가로 길이, 세로 길이를 의미합니다. 값을 정의 할때는 “100px” 처럼 숫자 뒤에 단위를 표시하여 적습니다. (px는 픽셀 이라는 의미의며 ‘50%’ 처럼 ‘%’ 단위를 사용 할 수도 있음) ex) #box{ width: 100px; height: 60px } margin, padding 속성 margin과 padding 속성은 각각 바깥쪽 여백, 안쪽 여백을 의미합니다. width, height 속성과 마찬가지로 숫자 뒤에 단위를..