Next.js 버전 15의 핵심 변경 사항 - 기본적으로 비활성화된 라우팅 및 데이터 캐싱

Next.js 버전 15의 핵심 변경 사항 - 기본적으로 비활성화된 라우팅 및 데이터 캐싱v15의 파괴적 변경 사항 개요캐시 설정의 파괴적 변경Data Cache의 비활성화Router Cache의 비활성화왜 이 시점에서 변경되었을까?v15 이후 Next.js의 설계 사상요약Next.js의 App Router는 종종 어렵다는 평가를 받습니다. 이는 React의 새로운 기능인 Server Components와 같은 Server First 패러다임 전환을 요구하고, 기본 캐시 동작이 초보자들에게 혼란을 줄 수 있기 때문입니다. Server Components나 Server Actions와 같은 React의 새로운 기능은 초보자를 위한 에러 힌트 및 수정을 돕는 설계가 되어 있으며, 많은 문서와 기사가 공개되어..

• format_list_bulleted Javascript
• · 2024. 5. 25.
• textsms

자바스크립트 배열 완전 정복: 희소 배열부터 다양한 메서드 활용까지

희소배열과 반복문(Sparse Arrays and Loops)for-in 문은 프로퍼티를 반복하기 때문에, for-in 문을 사용하여 희소 배열(sparse array)을 반복할 때 프로퍼티가 없는(빈) 인덱스는 건너뜁니다.공통된 3가지 for 문 특징 부분에 두 개 이상의 문(statement)이나 선언을 작성하려면 블록 문({ ... })을 사용해 하나의 문으로 묶어야 합니다.for (...) {console.log("Hello");console.log("World");}하나의 문만 작성할 때도 블록 문을 사용할 수 있습니다.for (...) {console.log("Hello");}for 문 자체는 하나의 문이므로 문이 기대되는 곳에 작성할 수 있습니다.for 문을 중첩해서 사용할 수 있습니다.fo..

• format_list_bulleted Javascript
• · 2024. 5. 17.
• textsms

TypeScript 고급 타입 마스터하기 - 객체 키 추출부터 infer 활용까지

TypeScript의 고급 타입 마스터하기다룰 개념객체의 키를 얻기객체의 키 필터링클래스를 다루기문자열 조작하기infer를 사용해 기존 타입에서 타입 추출하기요약TypeScript의 고급 타입 마스터하기지난주에 TypeScript의 3가지 황금 규칙(독자적인 해석)에 대해 설명했습니다. 그 중 세 번째 규칙인 "타입의 파생을 우선한다: 범용 타입(제네릭)"은 특히 구현하기 어려운 부분입니다. 타입 시스템이 효과적으로 기능하는 이유는 그 정의가 정확하기 때문입니다. 하지만 정확할수록 타입의 중복이 늘어나고, 코드가 유지보수 불가능해질 위험이 커집니다. 이에 대한 해결책은 파생(=다른 타입에서 타입을 정의하는 것)을 활용하는 것입니다. 하지만 이는 간단하지 않습니다. 그래서 오늘은 타입을 최적으로 설정하기 ..

• format_list_bulleted Javascript
• · 2024. 5. 15.
• textsms

TypeScript의 효율적인 타입 관리 - any 없이 타입 정의, 타입 파생 및 제네릭 마스터하기

1. 필요한 경우에만 타입을 정의한다as const2. any를 절대 사용하지 않는다3. 타입의 파생을 우선한다범용 타입(제네릭)요약  최근 TypeScript를 업무에서 항상 사용하고 있습니다. 기본적으로 React & Next.js와의 조합이 주요 활용 방법입니다. 그러나 본격적으로 이야기하기 전에, 평소 TypeScript를 어떻게 사용하고 있는지 소개할 필요가 있습니다. 제게 있어 TypeScript로 작성된 코드베이스가 건전하다는 것은 무엇을 의미할까요? TypeScript가 부담을 늘리는 것이 아니라 도움이 되도록 설정해야 할 규칙은 무엇일까요? 이 글은 제 스스로의 생각과 해석을 섞은 글이 될 것입니다. 이 글을 읽으려면 TypeScript를 조금 다뤄본 경험이 필요할지도 모릅니다. 하지만 ..

• format_list_bulleted Javascript
• · 2024. 5. 15.
• textsms

TypeScript 제네릭 패턴과 활용법 - 클래스, 함수, 메서드 완벽 분석

제네릭이란?언제 유용할까?배열에서 다루는 타입을 지정하고 싶을 때함수나 메서드의 인수에 범용성을 부여하고 싶을 때보충 설명: 인수의 수가 다른 오버로드제네릭을 클래스 타입으로기본응용: 여러 개의 타입 인수 지정타입 인수 기본값 설정타입 인수에 제약을 두기제네릭 메서드  제네릭이란?Java에서는 제네릭스(Generics)라고 불리기도 합니다. 언어마다 이 용어의 표현이 다르죠. TypeScript에서도 제네릭스나 제너릭스라고 불리기도 합니다. 제네릭은 "총칭형(総称型)"이라고도 불리며, 임의의 클래스나 메서드에 대해 임의의 타입을 연결할 수 있는 구조입니다. 자세한 내용은 여기와 여기에서 확인할 수 있습니다.언제 유용할까?배열에서 다루는 타입을 지정하고 싶을 때예를 들어 배열 변수를 정의할 때, 이 배열이..

• format_list_bulleted Javascript
• · 2024. 5. 15.
• textsms

TypeScript 4.5 이상 버전에서 추가된 TSConfig 옵션 살펴보기

tsconfig.json에는 많은 옵션이 존재합니다. 최근 2년 동안 TSConfig에 새롭게 어떤 옵션들이 추가되었는지 궁금해졌습니다. TypeScript 4.5의 릴리스가 2021년 11월 즈음이었으므로 약 2년 전이니, TypeScript 4.5 이후에 추가된 TSConfig 옵션들을 조사해보았습니다.버전 4.5 이후 새로 추가된 옵션 목록옵션추가된 버전preserveValueImports4.5moduleSuffixes4.7moduleDetection4.7allowArbitraryExtensions5.0allowImportingTsExtensions5.0customConditions5.0resolvePackageJsonExports5.0resolvePackageJsonImports5.0verbati..

• format_list_bulleted Javascript
• · 2024. 5. 12.
• textsms