웹 프로그래밍/Svelte

웹 프로그래밍/Svelte
[Svelte-demo (2)] 이벤트 핸들링
Hello {name}! {isRed = !isRed}} on:mouseenter={() => {name = 'enter'}} on:mouseleave={() => {name = 'leave'}} > Box! on: (on directive)은 addEventListener에 붙일 수 있는 모든 이벤트들을 다 작성할 수 있다. {text} {text = e.target.value}} /> {text = 'duckracoon'}}> 방법1 {text = 'duckracoon'}}> 방법2 양방향 바인딩
→2021.10.06
웹 프로그래밍/Svelte
[Svelte-demo (1)] 선언적 렌더링/조건문과 반복문
조건문 사용 {toggle = !toggle}}> {name} {#if toggle} Hello {name}! {:else} No name! {/if} 반복문 사용 Hello {name}! {#each fruits as item} {item} {/each} Delete Fruit
→2021.10.06
웹 프로그래밍/Svelte
[Svelte] 개발환경
VSCode에서 환경을 만들어보려한다. Svelte를 코딩하기위해서는 Svelte Template을 개발환경으로 가져와야하는데 그러기위해서 Node.js가 설치되어야한다. v14.15.5를 사용하고 있고 npm은 v6.14.11이다. https://github.com/sveltejs/template GitHub - sveltejs/template: Template for building basic applications with Svelte Template for building basic applications with Svelte - GitHub - sveltejs/template: Template for building basic applications with Svelte github.com ht..
→2021.10.06
웹 프로그래밍/Svelte
[Svelte] Svelte를 배워보자
0. 왜 Svelte를 공부하려하는가 프론트를 좀더 공부해 보고 싶었고, 대충 고려해본 선택사항에 원래는 vue.js, react.js가 있었다. 그런데 이런 걸 보게 되었다. https://2020.stateofjs.com/en-US/technologies/front-end-frameworks/ 2019년 출시되자마자 만족도 2위를 차지했고 2020년 react를 넘어섰다. 얜뭘까하는 생각이 들어 알아봤다. Svelte? Nov 2016 1.0 Release Apr 2018 2.0 Release Apr 2019 3.0 Release - Write less code - No virtual DOM 가상 돔이 없다? Diffing, Overhead가 없다고한다. 가상돔을 생성하고 비교하는 비용이 없다는 것...
→2021.10.06

• 이전
• 1
• 다음