1. 설치하기 npx create-react-app . npm i @types/react 통합적으로 npx create-react-app . --template typescript 설치가능 2. .ts 와 .tsx .ts파일은 pure typescript 파일 .tsx 파일은 typescript의 react문법을 담아내기 위한 확장자(jsx+ typescript) 3. src 디렉토리 1) index.tsx 1: 메인 엔트리 파일 2: React.Dom.render 수행 3: pwa(프로그레시브 웹 앱 = HTML, CSS, JavaScript와 같은 웹 기술로 만드는 앱)를 위한 서비스 워커 등록 작업 2) index.css 글로벌 스타일 작성(프로그래밍적으로 제한되지 않음) 3) App.tsx App..
alias(별칭) 타입 - 재사용에 좋음 / 변수에 할당하는 방식 type Age = number; type Name = string; type Player = { readonly name:Name, age?:Age // optional } const playerMaker = (name:string) : Player => ({name}); const suuun = playerMaker("seon"); suuun.age = 32; //suuun.name="dddd"; //readonly가 있으면 읽기 전용이므로 최초 선언 후 수정 불가 const playersuuun:Player = { name:"seon" } 함수의 리턴값에 타입을 지정하는 방식 - 위의 화살표 함수와 같음 function playerM..
#배경 javascript는 클라이언트 측 언어로 도입되었는대 node.js개발로 인해서 서버측 기술로도 활용하기 위해 만들었음 그러나 소스코드가 더 복잡해 지고 유지관리 및 재사용이 힘들며 type검사 및 컴파일 시 오류 검사의 기능을 수용하지 못하는 단점이 발생하여 typescript가 제시 됨 #typescript란? -자바스크립트에 타입을 부여한 언어(자바스크립트의 확장된 언어) -타입스크립트를 브라우저에서 실행하기 위해 자바스크립트로 컴파일(파일변환) 해주어야 함 #type system -개발환경에서 에러를 잡을 수 있음(오직 개발환경에서만 활성화 됨) -type annotations를 사용해서 코드를 분석할 수 있음(변수나 상수의 생성 시 데이터 타입을 지정해주는 것) *변수명, 함수명, 객체..
