if 구문은 {#if 조건} 콘텐츠 {/if} 형태로 사용합니다. {#if} 안의 조건식이 참이면 블록 안의 콘텐츠가 돔에 렌더링됩니다.

브라우저를 열어서 svelte.dev 웹 사이트의 REPL 도구를 실행하고, 간단한 예제를 작성하면서 확인을 해보겠습니다.

프로젝트를 생성하여 코드를 작성하는 방법도 좋지만, 간단하게 문법을 확인하고 싶을 때나 별도의 도구를 사용하지 않고 브라우저에서 빠르게 결과를 보고 싶을 때는 https://svelte.dev/에서 REPL을 사용하는 게 편리합니다.

예제에서 짧은 코드로 문법을 확인할 때는 되도록 REPL을 사용하겠습니다. REPL 실행은 2.1 REPL로 시작해보기를 참고하세요.

svelte.dev 웹 사이트에서 REPL의 App.svelte 기본 코드는 다음과 같습니다.

REPL의 App.svelte

<script>
    let name = 'world';
</script>

<h1>Hello {name}!</h1>