🆚 value와 defaultValue의 차이 defaultValue: input tag에서 처음 보여줄 값 value: input tag에서 계속 보여줄 값 따라서 defaultValue를 지정해주고 input 창에 입력을 하게되면 값이 수정되지만, value를 지정해주고 input 창에 입력하게되면 입력이 되지않고 지정해준 value 값만 보여주게 된다. ❓ input 창이 변경되고, 초기화되도록 value 값에 data를 지정해주려면? input 창의 value를 입력 후 초기화해주려면, state 값을 초기화해주면 된다. 예) onChange 이벤트로 작성된 state 변수 writer const [writer, setWriter] = useState('') const onChangeWriter ..
예시 interface export interface IProfile { name: string age: number school: string hobby?: string } 1. Partial 타입 interface 내 변수를 모두 ?: 로 바꾼다. type a = Partial 2. Required 타입 interface 내 변수를 모두 : 로 바꾼다. type b = Required 3. Pick 타입 interface 내 변수 중 원하는 변수를 골라서 객체를 만든다. type c = Pick 4. Omit 타입 interface 내 변수 중 원하는 변수를 제외하고 객체를 만든다. type d = Omit 5. Record 타입 type e = "철수" | "영희" | "훈이" // Union 타입..
🆚 rest-api vs graphql rest-api: 타입스크립트를 적용하게 되면 수동으로 만들어줘야 한다. graphql: graphql-codegen을 이용해 명령어 하나로 만들어준다. 📌 graphql-codegen 세팅 graphql-codegen 사이트에 접속하여 installation 명령어 복사 후 실행 yarn add -D @graphql-codegen/cli yarn add -D @graphql-codegen/typescript codegen.yml 파일 추가 schema: graphql 주소 generates: ./src/commons/types/generated/types.ts: plugins: - typescript config: typesPrefix: I 명령어로 codegen..
✏️ 정의 자바스크립트의 타입을 강제시키는 언어 변수의 자료형을 지정해주기 때문에 재할당이 불가능하다. 📌 컴파일 or 트랜스파일 컴파일: 하나의 언어가 다른 언어로 변경되는 작업 트랜스파일: 하나의 언어가 같은 언어의 다른 버전으로 변경되는 작업 타입스크립트는 실행시에 자바스크립트로 변경되어 실행된다. ❓ 타입스크립트 사용 이유 자바스크립트는 타입이 엄격하지 않아, 변수나 상수를 만들면 처음에 문자를 넣었다가 나중에 숫자를 넣는 등 자유자재 변환이 가능하다. 이로인해 자바스크립트는 큰 서비스를 운영할 때, 버그가 발생할 수 있는 취약점이 있다. 따라서 타입스크립트를 사용하여 안정성을 높여주는 것이다. 🔎 타입스크립트 설치 및 세팅 타입스크립트 홈페이지 접속하여 installation cli 명령어를 c..
