우든이 블로그

:D Route Matching tanstack Router는 Route Tree에 정의된 순서와 상관없이 아래와 같은 순서로 라우트 매칭을 정렬한다. Index RouteStatic Route (most specific to least specific)Dynamic Route (longest to shortest)Splat/Wildcard Routes  :D Outlets 중첩 라우트에서 컨텐츠를 어디에 렌더링 할지 알려주기 위한 방법이다. 즉, 아웃렛 컴포넌트는 매칭될 수 있는 자식 라우트를 렌더링 하는 데 사용한다. 라우트 트리 내 어디서든 렌더링 될 수 있으며, 매칭되는 자식 라우트가 없는 경우 null을 렌더링한다.import { createRootRoute } from '@tanstack/re..

:D Tanstack Router Modern and scalable routing for React applicationsA fully type-safe React router with built-in data fetching,stale-while revalidate caching and first-class search-param APIs.  Tanstack Router는 Typescript의 타입 시스템을 활용하여 라우팅을 관리하며 타입 안전성을 보장하는 것을 목표로 설계되었다. 즉, 개발자가 런타임 오류를 사전에 방지하고 코드를 더욱 안정적으로 유지할 수 있게 한다.  :D Code Splitting(코드 분할) Tanstack Router는 Code Splitting을 통해 애플리케이션 성능 ..

인터페이스(Interface) 란, > 타입 체크를 위해 사용됩니다. > 클래스와 유사하지만 인스턴스 생성이 불가능합니다. > 인터페이스의 메서드는 모두 추상 메서드입니다. Typescript에서 인터페이스 사용해보기! 예제 01. 변수 타입으로 사용하기 먼저, 다음과 같이 User라는 이름의 인터페이스를 정의합니다. ++ 인터페이스의 프로퍼티 이름 끝에 ? 를 붙여 선택적 프로퍼티임을 표시하여 줍니다. interface User { userName : string; userEmail? : string; } 변수 user의 타입을 User 인터페이스로 선언한 후에 user 변수에 값을 넣어줄 때에는 User인터페이스를 준수하여 값을 작성해주어야 합니다. let user : User; user = {use..

# 타입스크립트(TypeScript) 타입스크립트란, Microsoft에서 개발한 자바스크립트의 슈퍼셋 프로그래밍 언어입니다. .ts확장자를 사용합니다. # 자바스크립트와 타입스크립트 비교하기 타입스크립트는 자바스크립트보다 엄격히 타입의 사용을 명시하기 때문에 자바스크립트를 사용했을 때보다 버그를 최소화할 수 있습니다. 아래 예시는 각각 자바스크립트와 타입스크립트를 사용하여 더하기 연산을 수행하는 함수를 작성한 코드입니다. 자바스크립트에서 add함수에 인자로 문자열을 넣어주어도 오류가 발생하지 않고 문자열을 연결하여 값을 출력해줍니다. //Javascript functiona add(a, b){ return a + b; } console.log(add('1', '4')); // 출력 : 14 하지만, 타..