까먹기 위해 기록하는 것이다

1. 게시판 구현 1. 회원 기능 구현 1. 요청 별 method 타입 get 요청으로 가는 경우 브라우저 주소창에 주소를 입력할 때 a태그 클릭해서 링크로 이동할 때 form의 method 속성이 get으로 설정되어 있을 때 redirect로 다른 요청 url을 호출할 때 ajax의 type이 get으로 설정되어 있을 때 post 요청으로 가는 경우 form의 method 속성이 post로 설정되어 있을 때 ajax의 type이 post로 설정되어 있을 때2. get과 post 사용 get 요청은 데이터의 목록을 조회하거나 화면으로 이동할 때 주로 사용 post 요청은 데이터의 입력, 수정, 삭제, 특정 데이터 조회 등에서 주로 사용 3. Ajax(Asynchronous Javascript And Xm..

1. 게시판 구현 1. 회원 기능 구현 1. 요청 별 method 타입 get 요청으로 가는 경우 브라우저 주소창에 주소를 입력할 때 a태그 클릭해서 링크로 이동할 때 form의 method 속성이 get으로 설정되어 있을 때 redirect로 다른 요청 url을 호출할 때 ajax의 type이 get으로 설정되어 있을 때 post 요청으로 가는 경우 form의 method 속성이 post로 설정되어 있을 때 ajax의 type이 post로 설정되어 있을 때2. get과 post 사용 get 요청은 데이터의 목록을 조회하거나 화면으로 이동할 때 주로 사용 post 요청은 데이터의 입력, 수정, 삭제, 특정 데이터 조회 등에서 주로 사용 3. Ajax(Asynchronous Javascript And Xm..

1. SpringFramework 1. AOP 1. DB 연동 방식(JDBC/DBCP/JNDI) JDBC(Java DataBase Connectivity): 자바에서 제공해주는 DB 연결 표준 API. DB 연결 요청이 올 때마다 Web Application이 커넥션을 계속해서 생성하는 방식. 많은 사용자가 동시에 DB 접속을 요청하면 커넥션의 개수가 증가하여 DB 서버 과부하나 메모리 부족을 야기할 수 있다. 비효율적인 방식이어서 현재는 많이 사용되고 있지 않다. DBCP(DataBase Connection Pool): Web Application에서 지정한 개수만큼의 DB Connection을 미리 만들어놓고 DB 접속 요청이 올 때마다 만들어놓은 DB Connection을 대여하는 방식. 초기 Co..

1. SpringFramework 1. 웹 개발의 역사 1. Servlet의 등장 전 초창기 웹은 html, css 파일(정적파일)만 주고받고 할 수 있는 형태의 웹 DB에 있는 데이터를 가져와서 동적으로 표시할 방법이 없는 문제점이 발생 -> 개발자들이 동적 데이터를 표시할 방법을 찾기 시작 2. CGI 프로그램 CGI(Common Gateway Interface): 동적 데이터 처리에 대한 규약 클라이언트(사용자)가 요청을 보내면 Web서버에서 CGI프로그램을 호출하여 동적 데이터를 처리하는 방식. CGI프로그램은 요청당 하나의 프로세스를 생성하여 동적데이터에 대한 처리를 하였다. 대형 사이트들이 등장하면서 다수의 사용자에 대한 처리에서 문제가 발생했다. CGI 프로그램이 프로세스 기반이었기 때문에 ..

1. Event 1. JqueryEvent Jquery의 이벤트도 자바스크립트와 마찬가지로 사용자 동작에 매핑돼서 실행될 기능들을 미리 구현해 놓는 것. 이벤트 등록 방식 선택자.이벤트(click, dblclcik, load, ready, ...)(콜백함수); $("선택자").click(() => { alert("클릭"); }); 선택자.on("이벤트", 콜백함수); $("선택자").on("click", () => { alert("클릭"); }); 동적으로 생성되는 태그들에는 위 이벤트 등록방식은 먹히지 않는다. 동적 태그의 이벤트 등록방식은 $(document).on("이벤트", "선택자", 콜백함수); let htmlStr = ` 버튼 ` $("body").append(htmlStr); $("#btn..

1. method 1. 객체 조작 메소드 객체 조작 메소드 DOM 객체에 접근해서 태그를 삭제, 추가 또는 내용들을 추가/삭제 그리고 속성값들을 가져오거나 변경할 수 있는 메소드. html(): 순수 자바스크립트의 innerHtml과 매핑되는 메소드. 선택자.html(): 선택한 태그의 모든 하위태그들을 문자열로 반환 선택자.html("새로운 태그 문자열"): 선택한 태그의 모든 하위 태그들을 삭제하고 새로운 태그를 생성. text(): 순수 자바스크립트의 innerText와 매핑되는 메소드. 선택자.text(): 선택한 태그의 텍스트 반환 선택자.text("새로운 문자열"): 선택한 태그의 텍스트를 모두 삭제하고 새로운 텍스트 추가. css(): 순수 자바스크립트의 선택자.style.속성과 매핑되는 메..

1. Selector 1. 직접 선택자 전체 선택자: DOM의 모든 태그 선택. $("*") 아이디 선택자: 해당 아이디명을 가지고 있는 태그 선택. $("#아이디") 클래스 선택자: 해당 클래스명으로 되어있는 태그 선택. $(".클래스명") 태그 선택자: 해당 태그들 모두 선택. $("태그명") 그룹 선택자: 여러 개의 선택자를 묶어서 선택. $("선택자1, 선택자2, ..., 선택자n"). 선택자n에는 아이디, 클래스, 태그 선택자 등 다양한 선택자들을 넣을 수 있다. 2. 관계 선택자 선택자.parent(): 선택자의 부모 요소 선택 $("기준 선택자"): 기준이 되는 태그의 모든 하위 태그 중에 선택자에 해당되는 태그들 모두 선택 선택자.children(), $("기준 > 선택자"): 기준이 되는..

1. Jquery 1. Jquery Jquery는 자바스크립트의 DOM 객체 조작을 도와주는 라이브러리 선택자부터 이벤트, 애니메이션 등 DOM객체를 선택하거나 DOM객체에 이벤트를 만들고 애니메이션 효과를 추가할 때 순수 자바스크립트보다 편하게 구현할 수 있다. //순수자바스크립트 선택자 const box = document.getElementById("box"); const box = document.querySelector("#box"); //jquery 선택자 const box = $("#box"); Jquery의 장점 DOM객체를 조작하는 것이 순수 자바스크립트보다 편하고 간단하며 코드가 짧다. Jquery로 구성된 라이브러리들이 다양해서 달력이나 시계 등 순수 자바스크립트로 구현하는 것보다 훨..

1. ES6(Ecma Script 6) 1. const, let의 등장 var 변수는 중복 선언이 가능하고 블록단위 변수가 아니며 호이스팅이 가능한 문제점이 존재하여 ES6부터는 let, const라는 변수 선언 방식이 등장했다. 블록단위 변수 let let은 중복선언 불가능하고 블록단위이며 호이스팅 불가능한 var의 대체 변수 상수를 선언하는 const const변수는 상수를 선언할 때 사용하여 선언과 동시에 초기화가 일어나야 한다. const도 let과 동일하게 블록단위 변수이며 호이스팅 불가능 const는 상수이기 때문에 값의 재할당 불가능 기본적으로 const로 변수를 선언하되 변경될 경우가 있는 변수만 let으로 선언한다. const와 객체 const 변수로 객체를 선언하게 되면 객체안의 속성들..

1. 메소드와 이벤트 1. 메소드(함수, 기능, 펑션) 메소드는 기능을 정의해 놓은 코드 블록 메소드의 선언 //ES5 function 메소드명(파라미터(파라미터도 타입 지정하지 않음)) { 기능정의; } //ES6 const 메소드명 = (파라미터) => { 기능정의; }; ``` 3. return; : 아무것도 반환하지 않는 리턴문을 사용할 수 있다. 메소드의 종료를 의미한다. 특정 조건이 충족됐을 때 함수를 종료시켜야 한다면 return;으로 종료시킨다. 4. 지역변수와 전역변수 - 자바스크립트에서 지역변수는 중괄호 블록('{}')으로 감싸진 블록 안에 선언된 변수를 의미. - 전역변수는 script 태그 안에서 바로 생성한 변수를 전역변수라고 부른다. 전역변수는 해당 html 페이지가 로드되면 생..