분류 전체보기108 [Next.js] Hydration와 use client 하이드레이션(hydration)이란?서버에서 렌더링된 HTML을 클라이언트 측에서 React의 상태와 이벤트 핸들러와 결합하는 과정을 말하며, 이를 통해 페이지는 초기 로드 시 빠르게 표시되며, 이후 클라이언트 측에서 동적인 동작이 가능해진다. 동작 과정아래의 과정을 통해 서버에서 렌더링된 HTML을 빠르게 클라이언트에 표시하면서, 클라이언트에서 React 애플리케이션의 상호작용을 활성화할 수 있다. 서버 사이드 렌더링────────────────────────────────────────────────────────────────────────서버1. React 애플리케이션 렌더링 -> HTML 생성 -> HTML 전달───────────────────────────────────────────────.. 2024. 7. 22. TypeScript CLASSES AND INTERFACES - 노마드코더 Chapter 4 Class타입스크립트에서는 객체 지향 프로그래밍을 지원하는 기능을 제공하고 있다. 추상 클래스와 상속을 통해 코드의 재사용성을 높이고, 구조화된 방식으로 프로그램을 설계할 수 있다. 접근 제한자를 사용하여 클래스의 속성과 메서드의 접근 범위를 제어할 수 있으며, 이를 통해 코드의 캡슐화를 구현할 수 있다.실습하기// 'Words' 타입 정의: 문자열 키와 문자열 값을 가지는 객체 타입type Words = { [key: string]: string; // 인덱스 시그니처: 키는 문자열, 값은 문자열};// 'Dict' 클래스 정의class Dict { private words: Words; // private 속성 'words', 'Words' 타입 사용 constructor() { .. 2024. 7. 21. TypeScript Functions - 노마드코더 Chapter 3 Call Signature함수의 타입을 정의하는 방법 중 하나로, Call Signature는 함수가 어떤 매개변수를 받아 어떤 타입의 값을 반환하는지 명확히 설명해준다. 이는 인터페이스 또는 타입 별칭을 사용하여 정의할 수 있도록 도와준다. Call Signature의 장점명확한 타입 정의: 함수의 입력과 출력 타입을 명확히 정의하여, 함수 사용 시 타입 안전성을 보장한다.코드 재사용성: 동일한 시그니처를 가진 여러 함수를 정의할 때 일관성을 유지할 수 있다.타입 체크: 함수 타입을 미리 정의함으로써, 함수 호출 시 올바른 타입의 매개변수를 전달하도록 강제할 수 있다.// 함수 타입 별칭 'Multiply'를 정의, // 이 타입은 두 개의 숫자 매개변수를 받아 숫자를 반환하는 함수 타입을 나타낸다.t.. 2024. 7. 20. TypeScript의 타입들 - 노마드코더 Chapter 2 타입 별칭(alias)과 선택적 프로퍼티(optional properties)타입 별칭 (Type Alias)타입 별칭은 특정 타입에 이름을 붙여 코드에서 반복해서 사용할 수 있게 해주는 기능이다.. 이는 코드의 가독성을 높이고, 타입을 재사용할 수 있도록 도와준다. 타입 별칭은 기본 타입뿐만 아니라 복잡한 객체 타입에도 사용할 수 있다. 선택적 프로퍼티 (Optional Properties)선택적 프로퍼티는 객체의 특정 프로퍼티가 필수적이지 않고 선택적으로 포함될 수 있음을 나타낸다. 선택적 프로퍼티는 타입 정의에서 프로퍼티 이름 뒤에 물음표(?)를 붙여 표시하여 사용할 수 있다. Flutter에서 Modal 클래스와 Nullable 객체 처리하였던 기억이 났다 :)type Age = number; .. 2024. 7. 20. 이전 1 2 3 4 5 6 7 8 ··· 27 다음