JudithHopps JudithHopps

bind란? bind자체의 의미는 '뭔가를 엮는다'라는 뜻이다. 함수 객체의 bind 함수를 호출하면 함수 내의 this가 변경된 새로운 함수를 만들 수 있다. setState란? state를 바꿔야 할 때 사용해야 한다. ※ 리액트는 state 함수를 사용하면 state의 값이 변경된 것을 모르기 때문이다.

변경 후 코드 {this.state.subject.title} {this.state.subject.sub} 1. 함수 뒤에 .bind(this) 추가하기 2. this.setState함수 호출해서 변경하기 변경 전 코드 {this.state.subject.title} {this.state.subject.sub}

props VS state 차이점 props state 차이점 읽기 전용(read only) 상위 컴포넌트가 하위 컴포넌트에게 어떤 데이터를 전달할 때 사용 수정가능 (setState) 컴포넌트 명령 상위 컴포넌트가 하위 컴포넌트에게 명령할 때는 props를 이용하고, 하위 컴포넌트가 상위 컴포넌트에게 명령할때는 이벤트를 쓴다.

TypeScript의 Typeof 유형 1. string String String 타입은 텍스트 데이터를 나타낼 때 사용합니다. String은 16비트 부호 없는 정수 값 "요소"로 구성된 집합으로, 각각의 요소가 String의 한 자리를 차지합니다. 첫 번째 요소는 인덱스 0에, 그 다음 요소는 인덱스 1, 그 다음은 2, ...입니다. String의 길이는 그 안의 요소 수와 같습니다. 2. number Number 타입은 배정밀도 64비트 이진 형식 IEEE 754 값(-(2^53 − 1)부터 2^53 − 1까지의 수)입니다. Number 타입은 부동소수점 숫자 외에도 +Infinity, -Infinity, NaN("Not a Number") 세 개의 상징적인 값을 가집니다. 3. bigint Bi..

TypeScript 추천 강의 TypeScript를 쓰는 이유와 핵심 문법에 대해 알 수 있다. 단 10분의 강의이므로 꼭 들어보길 바란다. https://www.youtube.com/watch?v=xkpcNolC270&t=307s TypeScript 추천 사이트 https://www.typescriptlang.org/docs/handbook/intro.html Handbook - The TypeScript Handbook Your first step to learn TypeScript www.typescriptlang.org TypeScript 관련 handbook 사이트이다. 웬만한 문법은 다 담겨져 있으므로 이 사이트를 보고 TS에 대해 알아가면 좋을 것 같다. TypeScript 관련 도서에서 좋..

TypeScript란? 자바스크립트의 슈퍼셋인 오픈소스 프로그래밍 언어이다. TypeScript는 실행 전에 프로그램에 오류가 있는지 확인하고 값의 종류에 따라 수행 하는 정적 유형 검사기 입니다. 확장자는 ts입니다. TypeScript 설정 node.js를 설치한다(최신버전 추천) 터미널에 아래 구문을 입력해준다. npm i -g typescript TypeScript 간단 예제 VS Code를 열어 ex.ts 파일을 생성해준다. 아래 코드를 입력한다. let Name :string = 'you'; tsconfig.json 파일을 생성한 후 아래 코드를 입력한다. { "compilerOptions" : { "target": "es5", "module": "commonjs", } } 터미널 > 새 터미..

카카오 계정으로 로그인하기 카카오 개발자 센터에 접속한 다음 회원가입해주세요 '내 어플리케이션' 클릭 '어플리케이션 추가하기' 클릭 어플리케이션을 생성한 후 클릭 플랫폼 등록을 해준 후 web에 사이트 도메인을 넣어줍니다. 이후 아래 기록 사항을 따라해주세요. 카카오 로그인 사용 시 Redirect URI를 등록해야 합니다.등록하러 가기 제품 설정>카카오 로그인>동의항목 에서 프로필 정보를 필수 동의로 설정합니다. 내 애플리케이션>제품 설정>카카오 로그인>동의항목 에서 카카오 이메일을 선택 동의로 설정합니다. VS Code를 열어 public/index.html 파일을 열어 아래 코드를 추가합니다. main.js 파일을 열고 제일 하단에 window.Kakao.init("3fd5dc287ce0db6920..

컴포넌트 화면을 구성할 수 있는 블록(화면의 특정 영역)을 의미합니다. 화면을 여러 영역으로 쪼개서 활용할 수 있는 형태로 관리하여 코드를 재사용할 수 있어 사용합니다. 부모 컴포넌트란? 상위 컴포넌트와 동의어이며, 컴포넌트를 등록한 것 import childComponent를 입력된 컴포넌트 자식 컴포넌트란? 하위 컴포넌트와 동의어이며, props로 부모 컴포넌트로 전달받은 데이터를 저장한다. 부모 컴포넌트에서 자식 컴포넌트의 데이터 옵션 값 직접 변경하기(실습) 1. src/views/ChildComponent.vue를 생성해주고 아래 코드를 입력합니다. click 2. src/views/ParentComponent.vue를 생성해주고 아래 코드를 입력합니다. 3. src/router/index.js..