괘종소리 세기

Sveltekit은 프론트와 서버 모두 개발할 수 있는 풀스택 프레임워크입니다. 그래서 이번 포스팅에서는 Rest API로 프론트에서 요청을 받고 응답을 주는 서버를 만들어보도록 하겠습니다. 핸들러가 들어갈 파일의 이름은 +server.js 라고 설정해주어야 합니다. api라는 디렉토리를 하나 생성합니다. 디렉토리 이름은 아무거나 하셔도 무방합니다. 그 디렉토리 아래에 +server.js 파일을 생성해주었습니다. // +server.js export function GET() { return new Response("Hello, World!"); } 그리고 GET 요청을 받을 수 있는 핸들러를 만들어줍니다. (함수명은 고정입니다) 참고로 위 내용이 +server.js 코드의 전문입니다. 보일러플레이트가 ..

1. +page.js Sveltekit에는 각 페이지마다 환경을 할 수 있는 +page.js라는 파일을 만들 수 있습니다. schedule이라는 페이지의 컴포넌트와 같은 레벨에 +page.js를 넣어주면 되는데요, 여기서 설정할 수 있는 것들을 대표적인 것만 짧게 소개해 드리겠습니다. - SSR, CSR 방식 선택 Sveltekit은 속도를 빠르게 하기 위해 초기 페이지 렌더링 시에는 SSR, 그 후에는 CSR로 동작한다고 저번 포스팅에서 다룬 바 있습니다. 그래서 기본적으로 두 가지 방식이 모두 사용되고 있는데요, +page.js에서는 이 둘 중 하나만 사용하도록 할 수 있습니다. export const ssr = false; 간단히 위 한 줄만 입력하면 페이지를 CSR 방식으로만 동작하도록 할 수 있..

이제 Sveltekit으로 넘어오겠습니다. Svelte와 Sveltekit이 뭐가 다른지는 아래 포스팅을 보고 오시면 되겠습니다. [Svelte] Svelte와 Sveltekit의 차이점 Svelte와 Sveltekit은 어떻게 다를까? Svelte 공식 홈페이지에선 Sveltekit을 권장하고 있는데, 어떻게 다른지 알아보았습니다. 읽기 전에, SSR과 CSR에 대해 생소하시다면 아래 게시물을 읽어보시는 것을 doringri.tistory.com Sveltekit은 Next.js처럼 폴더 라우팅 방식을 사용합니다. Next.js를 다뤄보지 않으신 분들이라면 생소한 방식일 수도 있는데요, 디렉토리 구조를 통해 프레임워크에서 자동으로 페이지 라우팅을 해주는 방식입니다. Sveltekit의 경우에는 rout..

Svelte와 Sveltekit은 어떻게 다를까? Svelte 공식 홈페이지에선 Sveltekit을 권장하고 있는데, 어떻게 다른지 알아보았습니다. 읽기 전에, SSR과 CSR에 대해 생소하시다면 아래 게시물을 읽어보시는 것을 추천드립니다. [IT] SSR과 CSR의 차이점 프론트엔드 개념 중 많이 헷갈리는 SSR(Server Side Rendering)과 CSR(Client Side Rendering)에 대해 알아보겠습니다. SSR 일반적으로 MPA(Multi Page Application)에서 사용합니다. MPA는 각 페이지마다 파일이 존재하 doringri.tistory.com Svelte React와 같은 프론트엔드 프레임워크 기본적으로 CSR(Client Side Rendering) 로 동작함 ..