일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 | 29 | 30 |
- jsp
- 가상클래스 선택자
- ES6
- 속성 선택자
- 서블릿
- 즐거운 자바
- 즐거운자바
- 김성박
- optgroup
- vmax
- vmin
- 보충필요
- EDWITH
- 다시보자
- HTML Templating
- nth-child()
- 복합 선택자
- datalist
- 부정 선택자
- 깃헙
- 상속
- 웹개발
- 소스트리
- 자바
- nth-of-type()
- 가상요소 선택자
- JavaScript
- spring
- 부스트코스
- 다시볼 것
- Today
- Total
목록ALL (85)
기억의 DataBase
Framework란? Framework는 반제품이라고 생각하면 쉽게 이해 (모든 원재료를 처음부터 조립하는 것이 아니라, 기본적인 틀이 잡혀있는 상태의 반제품) Spring이란? Spring의 모듈들(약 20개) 규모가 있는 엔터프라이즈급 Application을 구축할 수 있는 가벼운 Framework솔루션으로, 원하는 부분만 가져다 사용할 수 있도록 Module화가 잘 되어있음 ※ Framework와 Library의 비교 프레임워크 : 작성자(프로그래머)가 쉽게 접근가능하고 만들 수 있는 기본 토대 및 환경(골격) 라이브러리 : 작성자가 어떤 로직이나 원하는 연산결과를 얻을 수 있도록 제공하는 함수 또는 그런 기능(도구)
Ajax 동기식(synchronous) 비동기식(Asynchronous) 출처 : http://huns.me/development/1291 비동기식(Asynchronous)으로 서버로부터 Data를 가지고 오는 기술 전체 페이지를 갱신하지 않고, 필요한 부분만 변경이 가능해짐 JSON Ajax를 위한 대표적인 Data 포맷 네트워크 상으로 객체(Object)를 주고 받을 수는 없으므로, 문자열(String)을 주고 받게 되는데 이러한 문자열을 JSON Object로 변환( JSON.parse() )하여서 사용 XMLHttpRequest Ajax 통신을 위해 사용하는 API XMLHttpRequest 객체.open("전송 방식", "URL", "True(비동기식/기본값) or False(동기식/비추천)")..
HTML Templating이란? 반복적인 HTML부분을 template로 만들어두고, 서버에서 온 데이터(주로JSON)을 결합해서 화면에 추가하는 작업 상품의 이미지, 이름, 가격 등의 Data들을 서버에서 받아온 후 웹 상의 정해진 틀에 맞게 Data를 보여주는 것 배열로 된 복수의 JSON Data를 가지고, 가로로 List객체 나열하기(for, forEach, Arrow) 템플릿 HTML(Data가 보여지는 틀)을 한줄의 문자열로 요소들을 나열하면, 가독성이 떨어져 세로로 정렬 (문자열들을 세로로 정렬할 경우 "+"기호로 연결해줘야 함) 배열의 형태로 복수개의 Object를 가지는 JSON data (data[0].title >> Front-End) 배열로 된 JSON Data이므로 length로..
입출력 문제 next()로 받기 next() 로 받으면 nextInt()의 '입력받은 숫자 +\n'에서 \n을 받지 않음 (next()는 개행문자, 공백은 무시하고 문자를 입력받음) nextLine()로 받기 sc.nextLine();을 한번 위에서 해줘야, sc.nextInt로 인해 발생하는 개행문자을 받아서 처리 (nextLine은 한줄단위로 입력받기 때문에 개행문자도 한줄로 인식) 공백으로 구분 + print(String+숫자+숫자) 공백으로 받는 경우 split 조건을 "띄어쓰기"로 하면된다. 결과값 출력에 있어서 문자열과 함께 출력될 경우 숫자도 문자로 취급되서 연산이 되지 않으므로 연산한 결과값을 출력해야 한다. (String+숫자+숫자) >> (String + String + String)
각 image마다 li 태그로 되어있는 상태 >> 각 이미지를 클릭할 때 마다, 발생하는 event를 처리하고 싶다면? for문으로 각각의 li Node들을 선택하고 addEventListener를 추가해주면 됨 >> li가 계속 늘어나서 10개 100개가 된다면, 모든 li에 이벤트 리스너를 추가하는 것은 비효율적 ul > li > img로 포함되어 있음 img를 클릭해도 ul에 있는 이벤트리스너가 작동함 (각각의 Node에 이벤트리스너를 추가할 필요가 없어졌음) 이와 같은 동작을 Event Bubbling이라고 함 (클릭한 지점이 하위엘리먼트라고 하여도, 그것을 감싸고 있는 상위 엘리먼트까지 올라가면서 이벤트리스너가 있는지 찾는 과정) 출처 : https://www.grapecity.com/en/bl..
브라우저의 실행과정 DOM Tree 분석 > DOM ContentLoaded > 렌더링(화면표시 - 이미지 다운로드) > Load Load 이후에 JS가 실행되면 이미지가 다 다운로드되고 그려진 상태이므로 조작하는 과정에서 로딩성능이 불리함 렌더링이 다 끝나지 않아도, DOM Tree가 다 만들어지면 DOM API를 통해서 DOM에 접근할 수 있으므로 이 시점(DOM Tree 분석완료와 렌더링 사이)에 JS를 실행시키는 것이 가장 성능이 좋음 이 시점이 DOMContentLoaded 위와 같이 DOMContentLoaded 시점에 init() 함수를 실행시켜서, 초기화에 필요한 서비스들을 작성하는게 효율적