KDT 핀테크 프론트엔드 개발자 과정

2022.03.29git 복습practice (1)( . . . )

2022-03-30

2022-04-04 HTML (Hyper Text Markup Language) 페이지의 제목 문단 표 이미지 동영상 등 웹의 구조를 담당 CSS (Cascading Style Sheets) 실제 화면에 표시되는 방법(색상, 크기, 폰트, 레이아웃 등)을 지정해 콘

파일만 생성하면 프로젝트가 시작되지 않음 폴더를 만든 후, 폴더 선택Auto Rename TagBeautifyVSCode 공식 한글 패치Live Sever! + Tab Keyimg + Tab key빈 태그HTML5에서는 혼용 가능표준 문법적으로는 문제가 없지만 하나의

2022-04-06 블록(상자) 요소 가로 세로 값 지정 가능, 여백 사용 가능 div 특별한 의미가 없는 구분을 위한 요소 h1~6 제목을 의미하는 요소, 숫자가 작을수록 더 중요한 제목을 정의 p 문장을 의미하는 요소 ul(Unordered List) 순서가 필요없는 목록의 집합을 의미 li 목록 내 각 항목 인라인(글자) 요소 왼쪽에서 오른쪽으로...

선택자 {속성: 값} 선택자 스타일(CSS)을 적용할 대상(selector) 속성 color 같은 스타일의 종류를 입력 값 blue 같은 스타일의 값을 입력 `선택자 {속성: 값; 속성: 값;} ` 중괄호를 이용해 스타일 범위의 시작과 끝을 지정한다 *

width, height요소의 가로/세로 너비기본 값 auto 브라우저가 너비를 계산단위 px, em, vwmax-width, max-height요소가 커질 수 있는 최대 가로/세로 너비기본 값 none 최대 너비 제한 없음단위 px, em, vwmax-width,

box sizing요소의 크기 계산 기준을 지정기본값 content-box 요소의 내용(content)으로 크기 계산border-box 요소의 내용 + padding + border로 크기 계산overflow요소의 크기 이상으로 내용이 넘쳤을 때, 보여짐을 제어하는 단

border: 선-두께 border-width 선-종류 border-style 선-색상 border-color요소의 테두리 선을 지정하는 단축 속성, 선의 크기에 따라 요소의 크기도 커짐border-width요소 테두리 선의 두께medium 중간 두께thin 얇은 두께

position요소의 위치 지정 기준기본값 기준 없음, staticrelative 요소의 자신을 기준absolute 위치 상 부모 요소를 기준 (위치 상 부모 요소를 꼭 확인)fixed 뷰포트(브라우저)를 기준sticky 스크롤 영역 기준z-index요소의 쌓임 정도를

display:flex 가 부여된 요소는 Flex Container가 되고, Flex Container의 자식 요소는 Flex Items가 된다.이때 Flex Items는 수평으로 쌓이게 된다. displayFlex Container의 화면 출력(보여짐) 특성flex

2022-04-19 transition: 속성명 지속시간 타이밍함수 대기시간; 요소의 전환(시작과 끝) 효과를 지정하는 단축 속성 transition-property 전환 효과를 사용할 속성 이름을 지정 기본값 all 속성이름 전환 효과를 사용할 속성 이

따옴표를 사용함정수 및 부동소수점 숫자를 나타냄true, false 두 가지 값밖에 없는 논리 데이터값이 할당되지 않은 상태를 나타냄어떤 값이 의도적으로 비어있음을 의미여러 데이터를 Key:Value 형태로 저장함여러 데이터를 순차적으로 저장함데이터를 저장하고 참조(사

특정 동작(기능)을 수행하는 일부 코드의 집합(부분)function

for (시작조건; 종료조건; 변화조건) {}출력 결과list-1list-2list-3

() => {} vs function () {}화살표 함수는 return과 그 뒤에 단순 실행문만 있을 때 아래와 같이 축약할 수 있음화살표 함수의 축약형으로 객체 데이터를 반환할 때는 소괄호로 한 번 감싸줘야한다.

코드가 실행되기 전에 변수나 함수 선언이해당 스코프 최상단으로 끌어 올려진 것 같은 현상을 말함.자바스크립트 엔진은 코드를 실행하기 전에실행 가능한 코드를 형상화하고 구분하는 과정(실행 컨텍스트를 위한 과정)을 거친다.자바스크립트 엔진은 코드를 실행하기 전에실행 컨텍스

2022-04-29파라미터로 함수를 전달하는 함수콜백함수란 파라미터로 함수를 전달받아, 함수의 내부에서 실행하는 함수이다.콜백함수는 이미 우리의 코드 속에서 자주 사용되고 있다.예를 들어, forEach함수의 경우 함수 안에 익명의 함수를 넣어서 forEach문을 동작

2022-05-02함수 생성자는 여러 프로그래밍 언어에서는 '클래스'와 동의어다.어떤 경우 사람들은 참조 타입(Reference Types), 클래스, 데이터 타입, 아니면 간단하게 생성자라고 부른다.클래스에 아직 익숙하지 않다면, 어떤 속성과 행동을 정의하도록 해주고

클래스는 객체를 생성하는 일종의 템플릿이다. 클래스는 데이터를 압축한다. 자바스크립트의 클래스는 prototype에 기반하지만, ES5의 클래스 같은 시맨틱과 공유되지 않는 문법과 시맨틱을 가진다.함수 표현식과 함수 선언식을 선언하는 것처럼 클래스는 사실 '특별한 함수

다들 알고 있겠지만 변수에 값을 할당한다는 것은 값의 메모리의 주소를 가리키는 것(참조) 하는 것임을 유의하며 살펴보자.위의 구문은 'hello world!'라는 값이 메모리에 생성되고, a라는 변수가 이 메모리의 주소를 가리키도록(참조하도록) 하였다.불변성(Immut

MDN 정의에 따르면 배열이나 객체의 속성을 해체하여 그 값을 개별 변수에 담을 수 있게 하는 JavaScript 표현식js 뿐만 아니라 C언어에도 있는 문법인 것 같다예시를 살펴보자.MDN에 따르면 변수에 기본값을 할당하면, 분해한 값이 undefined 일 때 그

ECMAScript6(2015)에서 새로 추가된 전개 연산자(Spread Operator)란 객체나 배열의 값을 하나 하나 넘기는 용도로 사용할 수 있다. 전개 연산자를 사용하는 방법은 점 세개(...)를 붙이면 된다.ES5 에서는 배열의 내용을 합쳐 새로운 배열을 만

정규식, Regular Expression문자 검색(search)문자 대체(replace)문자 추출(extract)https://regexr.com/

모든 Vue 앱은 Vue 함수로 새 Vue 인스턴스를 만드는 것부터 시작한다.뷰 인스턴스에는 다양한 옵션들(전체 옵션 목록)이 있습니다. 이 튜토리얼에서는 모든 옵션들은 다루지 못하지만 많이 사용되는 옵션들에 대해 설명할 것입니다. 그리고 이 포스팅에서는 data에 대