기본 구성

예약 파일

+page.svelte

접근할 때

+layout.svelte

레이아웃 파일. +page.svelte을 감싸는 레이아웃

+page.js

서버에서 유저에게 데이터를 전송할 때 사용

+page.svelte 로드 시 +page.js 실행

+page.svelte 내부에 script 태그에서 export 해주면 됨

page, layout 컴포넌트들은 load 함수 사용 가능

컴포넌트 생성 전에 실행 - 컴포넌트 생성 전에 데이터를 fetch할 수 있음

  1. 서버의 쿠키에 액세스할 수 있다.
  2. HTTP 호출을 발행하지 않고 앱의 자체 엔드포인트에 대해 요청할 수 있다.
  3. 사용시 hydration을 위해 response의 복사본을 만들어 초기 페이지 로드에 포함해서 보낸다.

+page.server.js

서버 사이드 렌더링 시 사용

+app.html

+server.js

예약 함수 GET, POST, PUT, DELETE를 통해 http 메서드 별 라우터 구현

매개변수로 {fetch, request} 등 사용

src/hook.server.ts

[~]

동적 라우팅 시 사용

_, .

파일이나 폴더 이름에 언더바나 온점이 들어가면 해당 파일/폴더는 라우팅되지 않음

Untitled

중단원

Untitled

+layout.svelte 파일 내부에 페이지(+page.svelte)를 표시할 영역을 slot 태그로 나타내야 함

<slot />

RequestHandler 타입 레퍼런스

  1. 공식 문서
  2. 스택오버플로우
  3. 참고한 영상

팁 / 내가 싸운 에러 목록

satisfies operator