일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | ||||||
2 | 3 | 4 | 5 | 6 | 7 | 8 |
9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 | 17 | 18 | 19 | 20 | 21 | 22 |
23 | 24 | 25 | 26 | 27 | 28 |
- maven
- 무한
- Short
- wrapper
- 자동형변환
- 컬렉션
- Jenkins
- 클래스
- 루프
- 언박싱
- 싱글턴
- https://start.spring.io
- 인텔리제이
- 제너릭
- 빌드
- Scanner
- boxing
- bootstrap
- dependency
- 콜렉션
- 내장객체
- 스프링
- 박싱
- unboxing
- suvlet
- 메소드
- start.spring.io
- 싱글톤
- Java
- 제네릭
- Today
- Total
목록K-DigitalTraining 강의 (333)
Developer Gonie
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/bG9zIt/btrG3KwgQtP/MfTtgGibR4iOoPW3kw4kOk/img.png)
* 특정 요소에 사용자가 입력한 값이 request 객체에 담기게 하려면 꼭 name 속성을 사용해야 해야 한다.(id 속성은 불가) * request 객체에서 내용을 꺼내쓸 한글데이터가 있다면 그 전에 한글을 위한 인코딩을 지정해줘야 한글이 깨지지 않는다. JSP의 내장객체 request 웹 브라우저의 요청 정보를 저장하고 있는 객체로, HTTP Header와 HTTP Body으로 구성되어 있다고 함. 태그의 자식으로 text 타입의 요소가 있는 상태에서 사용자 입력후 submit 타입의 버튼을 누를시, 브라우저는 form 태그의 action 속성에 지정된 파일을 서버에 요청하는데, request 객체는 요청을 보내는 바로 이 시점에 사용자 입력을 담아 생성된다. 이렇게 만들어진 request 객체는 ..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/GDUrI/btrG8Jh4uAm/pArjojSXi9oCL7ax0LATY1/img.png)
* 내장객체 'out' - JSP의 것으로 웹 브라우저와의 스트림을 담당하는 객체로, 이 객체의 print() 메소드를 사용하면 콘솔이 아닌 브라우저 화면영역에 출력하는 것으로 javascript의 document.write()과 유사 예시1(if문) 예시2(for문) 예시3(while문) 예시4(좀 더 복잡한 for문)
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/3yYZI/btrG3JRCLsc/ct8DBsiGZf63q4GLuX4LB1/img.png)
* Ex07_center.jsp 파일에서 Ex07_top.jsp 파일의 코드와 Ex07_bottom.jsp 파일의 코드를 각각 위 아래에 위치하도록 가져다 사용하는 것인데, 지시어는 다른 파일의 코드를 그대로 옮겨두기 위해 사용한다. * Ex07_bottom.jsp 파일은 name 변수가 존재하지 않아 단독으로 실행될 수 없었지만, Ex07_center.jsp 에서는 위 아래의 코드가 연결되기 때문에 Ex07_bottom.jsp 코드부가 정상작동할 수 있다. 지시어의 동작원리 Ex07_top.jsp Ex07_center.jsp Ex07_bottom.jsp
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/cb0cEe/btrG3qxZ3KD/EnDill2q3MZkJhs5QyKB81/img.png)
JSP의 일반 태그들 사용 용도 1. '스크립트릿' 태그라고 부르며, 일반적인 자바 코드를 작성할 때 사용함 2. '표현식' 태그라고 부르며, 변수 출력 혹은 리턴값이 있는 메서드의 반환값을 출력할 때 사용함 3. '선언문' 태그라고 부르며, 메서드를 정의할 때 사용함 4. '주석' 태그라고 부르며, JSP 코드 부분을 통으로 주석처리할 때 사용함. (단, java 코드 영역에서는 java 주석을 그대로 사용) 5. '지시어' 태그라고 부르며, 다양한 용도로 사용된다. : 속성을 이용하여 현재 JSP 페이지의 처리 방법을 컨테이너에게 통보, java 클래스 import도 여기서 함 : 다른 파일의 코드를 해당위치에 그대로 복사 붙여넣기 할 때 사용한다. : 아직 사용해보지를 않아서 잘 모르겠음. JSP의..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/dC3hNY/btrG4H6Ti8W/q4k7zFtVASkqQa14HxNMyk/img.png)
맨 윗줄에 뜨는 에러 제거 / 라이브러리 자동완성 기능 동작하게 하기 * 맨 위에 자동으로 추가되어 있는 라인에 오류가 뜨는데, 이건 무시해도 되는 에러이지만 해결하는 방법은 아래와 같다. * JSP파일 에서는 이걸 해줘야 라이브러리 자동완성 기능을 사용할 수 있고, JSP 코드에서 불필요한 에러도 사라진다. 톰켓 폴더안에 있는 servlet-api.jar 파일을 프로젝트 폴더 안에서 WEB-INF 폴더 아래 위치한 lib 폴더에 이 파일을 복붙하면된다. 코드 대부분에 에러가 발생하는 경우 아래와 같이 해결가능
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/caRHxq/btrHiYy9JQU/fUJRetjVUBFNspJK0NtTF1/img.png)
* $( ) 내부에 선택자로 document랑 this를 사용할 때는 따옴표를 사용하지 않는다. 여러 함수들 1) .each(function(){ $(this). }) 선택자에 의해 지정된 모든 요소들( 문자 영역 )을 하나씩 꺼내서 $(this)로 접근할 수 있게 해준다. java에서의 확장 for문과 기능이 비슷하다. 배열에 대해서도 이를 적용할 수 있는데, 배열에 대해 사용할 때는 배열변수명에 ' ' 를 사용하지 말아야함 => $(배열변수명) 배열에 대해서 each 함수를 적용하면 자동으로 index, value를 인자쪽 변수로 전달해주며, index 만 전달받을 수도 있다. $(function(){ var fruits = ["apple", "banana", "orange"]; //변수나 배열을 작..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/emiABZ/btrGQaWarhF/7sG1AZdCuB0bcNP0dLnK70/img.png)
여러 함수들 1) .addClass() 지정한 요소들에 class 속성을 추가한다.(css 코드가 상단에 작성되어 있어야 css 적용까지 됨) ex) $('p').addClass('red') ex) $('p').addClass('red').addClass('under'); ex) $('p').addClass('red under'); // 나열해서 한번에 두 개 이상 추가하는 것도 가능 2) .removeClass() 지정한 요소들에서 해당 class 속성을 제거한다 ex) $('p').removeClass('red') ex) $('p').removeClass('red').addClass('under'); ex) $('p').removeClass('red under'); // 나열해서 한번에 두 개 이상 ..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/zASmf/btrGY2BLptN/i0aJ9GwIs47FPzGCbCklkk/img.png)
* JQuery에서는 보통 $('객체로 만들 대상').메소드() 이런식의 문법이 사용되며, 아래의 코드가 정상적으로 실행되면 준비가 잘 된것이다. * 로드하는 부분과 라이브러리를 사용하는 코드 작성부를 따로 작성하고, 로드는 코드 작성부 전에 위치해야 오류가 나지 않는다. * document, this를 객체로 만들 대상으로 사용할 때는 ' ' 를 감싸지 않는다. * 아래의 방법1, 방법2 는 body 태그에 붙을 수 있는 onLoad속성, window.onload = function() {}보다 먼저 실행되며 body 태그에 붙을 수 있는 onLoad속성, window.onload = function() {} 에서 둘 중 하나만 사용할 수 있었던것과 달리 방법1, body 태그에 붙을 수 있는 onLo..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/dq9eSl/btrGRkdFRlN/iFVuzRKFzSYo9kn6ODUZMK/img.png)
JQuery란? Javascript 언어로 만들어진 오픈소스 라이브러리로, Document Object Model(DOM) 요소들을 효율적으로 선택할 수 있으며 선택된 요소들에 대해 CSS를 적용하거나, 이벤트를 처리하거나, 애니매이션을 적용하거나, Ajax 를 사용할 수 있다. 그런데, 최근 추세를 보면 JQuery의 점유율이 점점 낮아지는 추세이다. 그 이유는 '가상DOM' 이라는 개념이 나왔기 때문인데, 트위터, 페이스북 같은 서비스들을 생각해보자. 스크롤바를 내릴 때 마다 수 많은 데이터가 추가되는데 이럴 때 마다 전체 DOM 요소들을 다시 그려낸다면 이를 처리해야 하는 브라우저에 부하가 걸릴 것이다. 언제나 그랬듯 효율적인 처리를 위해 나온 개념이 '가상DOM' 개념이고, 이는 메모리상에 가상D..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/cnbcRt/btrGQEC3HQl/EkgXUKgr5PFKPX9UFKE8LK/img.png)
* 이외에도 추가적인 것들이 많은데 그것은 강의의 pdf 파일을 참고하자 * 정규 표현식 '/ ~ /' 을 복사해서 다음의 사이트에 넣고 실행하면 정규표현식에 어떤게 입력가능한지 그림으로 보여준다. https://regexper.com/ * 정규표현식 작성시 / / 사이에 작성한다. * 정규표현식과 입력한 문자열을 비교할 때는 search() 메소드를 사용한다. \d : 십진수 숫자 1개 // 십진수 숫자 1개 입력가능 \d /\d/ // 실제 사용시 입력해야 하는 형태 {n} : 앞에 위치한 요소를 N개 입력가능하게 함 // 십진수 숫자 5개 입력가능 \d{5} /\d{5}/ {n1, n2} : 앞에 위치한 요소를 최소 n1개~ 최대 n2개 입력가능하게 함 // 십진수 숫자 최소1개~ 최대5개 입력가능..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/JCUUG/btrGUrIpNzH/Lklo7AiWXvpcT25Co6NBE0/img.png)
회원가입 폼 유효성검사 * 전송 전에 유효성 검사를 해주려면 버튼에 onClick 속성을 추가해 유효성을 검사하는 함수를 호출하고, 그 함수의 리턴값에 따라 form 요소의 action 속성에 명시된 url로 이동할 수 있게 해야한다. onClick="return 함수명()" 핵심1. 요소에 대한 유효성 검사 사용자가 요소에 값을 입력하지 않은 경우 false를 return 하게 해야하는데, 사용자가 입력한 값을 가져올 땐 DOM을 이용해 입력된 value를 가져오고 이 값의 길이를 비교한다. if(myform.id.value.length == 0){ // myform.id.value == "" 이것도 가능 alert("아이디가 누락됐습니다."); myform.id.focus(); // 포커스를 이동시켜..