코알라 오딧세이

오늘은 svelte 기초 3번째 시리즈를 작성해볼까 합니다. 오늘의 주제는 Reactivity입니다. Svelte에서는 Reactivity 즉, 손쉬운 반응성 구현을 내세우고 있는데요. 반응성이란 선언된 state의 상태에 따라서 특별한 호출 없이 HTML 영역 및 바라보는 변수 들의 상태가 빠르게 변경되는 것을 의미합니다. 그렇다면 바로 Svelte Reactivity에 대해서 Svelte Playground에 나온 내용을 바탕으로 기술해보도록 하겠습니다. Clicked {count} {count === 1 ? 'time' : 'times'} 위와 같이 count라는 state 함수를 태그 내에서 $state()를 활용하여 정의를 해주고 이에 따른 handle click 함수를 정의해줬을 때 bu..

이번주 Svelte 글은 다음 글을 참고하여 작성되었음을 알려드립니다. https://velog.io/@hippo9851/Svelte-Tutorial0.-%EC%8B%9C%EC%9E%91 [Svelte Tutorial]1. 시작Svelte를 사용할 일이 생겨서 학습을 위해 Svelte 공식 사이트의 Tutorial을 진행하면서 학습한 내용을 정리한 시리즈 입니다.이런 식으로 공식 사이트 옆에 학습하면서 실습해볼 수 있는 좋은 환경이velog.io 이 글에 tutorial이 아주 잘 정리되어 있어서, 이 글을 따라서 한번 공부해보고자 합니다. 이분도 아마 Svelte playground에 있는 내용을 바탕으로 작성하신 것 같습니다.  Svelte에서 하나의 App은 1개 이상의 컴포넌트로 구성되고 컴포넌트..

저는 LLM 개발자이다 보니 LLM 자체의 성능을 올리는 것에도 관심이 많지만 어플리케이션을 개발하는 것에도 관심이 많습니다. 이전에는 주로 Next.js를 활용하였으나 너무 복잡해진 느낌이 조금 있어서 최근 많이 각광 받고 있는 Svelte에 대해서 공부하고자 합니다.  Svelte는 빌드 시점에 코드를 순수한 JavaScript로 변환해 런타임 오버헤드를 줄이고 빠른 실행 속도를 자랑하는 프레임워크입니다. 간결한 문법 덕분에 개발자가 쉽게 코드를 작성할 수 있으며, 번들 크기가 작아 효율적인 리소스 관리를 할 수 있습니다. AI 애플리케이션 개발에서는 Next.js가 제공하는 서버 사이드 렌더링과 같은 부가 기능보다, Svelte의 빠른 렌더링과 단순한 구조가 개발 및 유지보수에 유리할 수 있습니다...