Dog foot print

Basic Syntax [1] Go의 템플릿은 변수와 함수로 이루어진 HTML입니다. GO의 템플릿에서 변수와 함수를 사용하기 위해서는 다음의 {{ }} 를 사용 합니다. Access a Predefined Variable (사전 정의 변수 사용하기) 현재 스코프에 존재하는 사전 정의된 변수를 사용하거나, 변경된 변수를 사용 할 수 있습니다. Note : .Title === predifend Variable Note : $address === custom Variable {{ .Title }} {{ $address }} 함수의 파라메터에 전달인자를 넣는 방법은 공백을 이용하는 것입니다. {{ FUNCTION ARG1 ARG2 }} 아래의 함수는 add 함수를 이용하여, 1과 2의 결과를 리턴하는 예제 입..

Quick Start Note 이 문서는 Hugo의 공식문서를 번연하여 편집한 글입니다. 오타나 수정사항이 존재하면 언제든지 댓글로 말씀 부탁드립니다. Hugo Insatall On Mac Note : Hugo를 Mac에 설치하려면 Mac OS package Manager인 brew 혹은 MacPorts를 먼저 설치해야 합니다. Note : [Homebrew](The Missing Package Manager for macOS (or Linux) — Homebrew) $ brew install hugo Note : [Macport](The MacPorts Project — Home) $ port install hugoHugo create a New site $ hugo new site newSiteNam..

Learn D3 : 소개 Note : 이 시리즈는 D3의 introduction을 번역한 시리즈 입니다. 서론 시작하기 전에, 우리는 이것을 신중히 고려해볼 가치가 있습니다. 왜 d3를 귀찮게 배워야하며, 왜 Obsevable 에서 배워야 할까요 ? 첫번째 D3는 유명하며, 현재 80M의 다운로드 수와 90K 이상의 사람들이 주시합니다. 여기에는 예제, 비디오, 학습반, 그리고 책을 포함하여, 커뮤니티에서 개발한 많은 리소스가 있습니다. 그리고 d3팀은 fork가 가능한 예제와 생산성과 학습을 도와주는 예제를 백개나 보유하고 있습니다. 두번째 D3는 유연합니다. D3의 가장 큰 장점은 당신이 무엇을 원하든 만들 수 있도록 도와주는 힘입니다 ! D3는 갤러리는 treemap, hierarchical edg..

{@html} {post.title} {@html post.content} 일반 텍스트를 표현할 때 문자 은 &gt 혹은 &lt로 변경됩니다. 그러나 @html에서는 이를 그대로 렌더링 합니다. {@html ""} hello svelte {@html ""} //it's not work위와 같이 {@html value}를 통해 div를 렌더링 하는 방법은 작동하지 않습니다. 또한 스벨트는 HTML을 사전 점검하여, 위험한 스크립트나, 잘못된 태그를 가려 보여주지 않습니다. 이를 방지하기 위해 source를 검사하거나, 믿을 만한 사람에게서 이 데이터를 받아야 합니다. #svelte

{#key} {#key expression}…{/key}key블럭은 특정 값이 변경 될때마다, 삭제와 생성을 반복합니다. {#key value} {value} {/key} key블럭은 값이 변경되었을 때 transition을 새롭게 시작하는데 유용합니다. key값이 변경된다면, 새롭게 스벨트 컴포넌트를 인스턴스화하고 생성자함수를 실행합니다. #svelte

{#each…} 스벨트는 반복 가능한 데이터 구조에 한하여, 컴포넌트에 데이터를 전달하여 렌더 할 수 있습니다. {#each expression as name}...{/each} {#each expression as name, index}...{/each} {#each expression as name (key)}...{/each} {#each expression as name, index (key)}...{/each} {#each expression as name}...{:else}...{/each}Shopping list {#each items as item} {item.name} x {item.qty} {/each} 반복 가능한 배열은 각 블럭마다 반복 횟수에 맞는 index를 가진 값을 사용 할 ..

Comment Hello worldHTML에서 사용되는 주석 방식을 컴포넌트 내부에서 사용 가능합니다. 만약 주석이 svelte-ignore와 사용된다면 다음 HTML요소에 관한 경고를 사용 할 수 업게 됩니다. 보통 경고 문구를 해제하기 위해서 사용 되니, 적당한 사유와 동반하여 사용 하시면 됩니다. #svelte

Attributes and props can't touch this 기본적으로 svelte 에서 element에 attribute 를 적용하는 것은 일반 HTML와 동일합니다. HTML에서 attribute에 전달하는 값은 문자열일 필요는 없습니다. page {p} ...attribute value는 javascript 표현식을 사용 할 수 있습니다. 혹은 문자열 보간법을 이용하지 않고, 자바사크립트 표현식을 바로 사용 가능합니다. This div has no title attributeboolean 형식의 attribute는 전달되는 값의 형태에 따라 truthy혹은 falsy로 분류되어 boolean값으로 전달 됩니다. 다른 모든 속성들은 nullish하여, null 혹은 undefined를 ..