스벨트 킷 저도 한번 써봤습니다 (1.0)

안녕하세요!

최근에 Svelte Kit 1.0 이 나왔다고 해서 스벨트 설치 및 사용해봤는데요

진짜로 React 이딴 거 이제 갖다 버려도 되는 느낌??? 비슷하게 들기 시작한 거 같네요

 

Svelte 가 뭐냐? 하면 저도 정확히는 답을 못 드리고 많은 분들은 컴파일러에 가까운 거라고 정의하더라구요

react , view 같은 것들은 여러분의 코드를 짠다고 그게 다가 아니라 React 기반 코드를 실행하기 위해서 react 코드를 들고 와야 해서 로딩 시간이 느려지는데 ( 근데 사실 사람이 느끼기에는 영상 이런거 불러오는 게 아닌 이상 큰 차이 없구요 )

 

그러니까..

 

REACT

<여러분이 짠 코드>

<REACT .js >

 

Svelte

<여러분이 짠 코드>

 

이런 식으로 동작한다고 하네요 ( 바닐라 js와 동일 성능 )

 

이 스벨트라는 건 다른 npm 라이브러리 처럼 nodejs 설치 후에 Npm을 통해서 동작하는 기능을 하는데

https://nodejs.org/ko/

Node.js

가서 Node.js latest 받은 다음 설치하고

https://svelte.dev/

npm create svelte@latest myapp
cd myapp
npm install
npm run dev

스벨트 공식 사이트에서 제공하는 코드 그대로 갖다가 실행하면 되구요

( npm run dev 치기 귀찮으니까 그냥 bat 파일에 집어넣어도 어찌어찌 돌아갑니다 ??? )

 

설치 끝나면 나머지는 건들지 말고

 

src -> Routes 로 가면 +page.svelte 이런 게 있습니다

이거 열고 그냥 HTML 코딩 한 다음 터미널에 떠있는 localhost: ( 포트 ) 주소로 가면 됩니다

 

Routes 페이지는 Nodejs Express 기준 " / " 페이지고

여기에 New 라는 폴더를 만들고 +page.svelte 만든 다음

 

localhost:(포트번호)/New 가면 자동으로 New 폴더 안에 있는 Page.svelte로 라우팅해줍니다 

( 이제 그지같은 라우팅을 안 해도 된다구요..! >< )

 

그리고 이게 진짜 편한 게

<SCRIPT>

      let date = " 11 " ;

</SCRIPT>

<h1>지금 몇일?<h1>

<h6>오늘 {date} 일 이야! <h6>

이래도 문제 없이 돌아갑니다 (신기..)