Log

태초에는 콜백지옥(callback hell)이 존재했다고 한다. 간단하게 설명해보자면 아래와 같다. 1초가 지날 때마다 setTimeout() 작업을 계속 호출한다. 끊임없이 계속 setTimeout()을 호출하게 되면 가로로 엄청나게 길어진 코드를 볼 수 있을 것이다. 이런 콜백지옥에서 탈출하기 위해 Promise 객체가 나타나게 됐다. Promise 란? 비동기 작업이 맞이할 미래의 완료 또는 실패와 그 결과 값을 나타낸다고 한다. Promise에게는 3가지의 상태가 있다. 대기(pendding) : 이행상태도 거부상태도 아닌 초기 상태 이행(fulfilled) : 연산이 성공적으로 완료된 상태 거부(rejected) : 연산이 실패한 상태 Promise 객체 사용해보기 let promise1 = n..

Semantic 이란 HTML5의 가장 큰 특징 중 하나로, 사전적인 의미로는 '의미가 통하는' 이라고 할 수 있다. 사전적 의미와 같이 특정 tag로 해당 tag가 어떤 의미를 갖는지 알 수 있게 하는 방식을 말한다. 이 방식을 통해 기계가 쉽게 해석하고 분석 할 수 있게되어, 웹사이트를 검색엔진이 좀 더 빠르게 검색할 수 있도록 한다. Semantic tag 종류 tag 설명 헤더(머리말) 지정. 문서 간의 네비게이션(상단 메뉴) 지정. 본문 이외의 내용 표시. 본문의 여러 내용(article)을 포함. 본문의 주 내용을 포함 제작정보와 저작권 표시등 포함. HTML5 구조

선택자 : HTML 문서에서 CSS 규칙을 적용할 타겟. 1. 일반 선택자 선택자 의미 사용법 전체 선택자 HTML 문서 내 모든 Element 선택 * { } 타입 선택자 매칭되는 태그 Element 선택 div { } 또는 h2, h3 { } 클래스 선택자 class 속성 값과 매칭되는 Element 선택 .class이름 { } ID 선택자 ID 속성 값과 매칭되는 Element 선택 #id이름 { } 우선 순위 : 전체 < 타입 < 클래스 < ID 여러 개의 Element를 선택하려면? 타입 선택자 : , 로 구분 클래스 선택자 : 공백으로 구분 2. 복합 선택자 선택자 의미 사용법 하위 선택자 하위 모든 Element를 선택(자손들까지) E1 E2 { } 자식 선택자 바로 직속 하위의 Elemen..

1. 태그 img 태그의 속성 속성 속성값 설명 src 이미지경로 삽입할 이미지의 경로를 지정한다.(상대경로, 절대경로, url 가능) alt 텍스트 이미지를 표시할 수 없을 때 대체되는 텍스트이다. width 숫자 이미지의 가로길이 (CSS로 적용 가능) height 숫자 이미지의 세로길이 (CSS로 적용 가능) 이미지를 띄우기를 실패했으므로 alt 속성에 의해 대체 텍스트가 보여진다. 2. 태그 Anchor 태그, 하나의 문서에서 다른 문서로 연결하기 위해 사용된다. (하이퍼링크) 태그는 서로 중첩해서 사용할 수 없다. 속성 속성값 설명 href 이동할 문서의 경로 하이퍼링크를 클릭했을 때 이동할 문서의 상대, 절대경로나 url를 지정한다. 같은 페이지의 특정 요소 선택자 #을 통해 같은 페이지의 특..

Java Python JavaScript 목록형을 요소를 가장 간단하게 말한다면 위와 같은 예시를 말할 수 있다. 목록 tag는 하나 이상의 하위 tag를 포함해야하고, 목록을 번호 또는 심볼을 이용해서 표현한다. tag 설명 unordered list, 번호 없는 목록을 표시하며 심볼로 구분한다. ordered list, 번호 있는 목록을 표시하며 숫자, 알파벳, 로마숫자로 구분한다. 목록 tag의 하위 tag 용어 정의와 설명에 대한 내용을 목록화해서 표시한다. 용어 목록의 정의 부분을 표시한다. 용어 목록의 설명 부분을 표시한다. 1. 사용 Java Python JavaScript C++ Swift 위의 코드를 실행하면 다음와 같은 결과를 얻을 수 있다. 만약에 심볼을 바꾸고 싶다면 css를 적용해..