현고미 노트(H-gomi's Note)

Svelte홈페이지의 REPL탭에서 간단하게 import를 연습해보자 Svelte홈페이지의 REPL탭에 대해서 모르겠다면?? 2022.06.12 - [Svelte] - [Step 01.] Svelte홈페이지에서 REPL사용하기 우선 App.svelte 컴포넌트 옆에 'Name.svelte'컴포넌트를 생성해서 내용을 입력해보자 이름을 입력한 컴포넌트 Name.svelte를 생성하였다. 이제 이 컴포넌트를 App.svelte에서 import를 통하여 불러올 것이다. Svelte에서 import하는 방식은 아래와 같다. (정말 간단한 코드를 입력하는 것만으로 다른 컴포넌트를 불러올 수 있다. ) 입력 예시) 불러온 컴포넌트는 단태그 혹은 쌍태그로 태그이름으로 입력하여 호출할 수 있다. 단태그 방식을 이용 : ..

node 설치하기 node.js홈페이지에서 LTS버전으로 node.js를 설치한다. 최신버전으로 설치해도 문제없지만 안정화된 버전으로 설치하는게 오류가 발생할 확률을 줄일 수 있다. (글쓰는 날짜(2022.06.12)를 기준으로 LTS 는 16.15.1버전이다.) npm을 통해서 svelte를 설치한다. npx degit sveltejs/template (프로젝트폴더 이름) cd (프로젝트폴더 이름) npm install npm run dev 파일을 설치한 폴더로 이동하면 Svelte가 설치된 것을 확인할 수 있다. 참고 페이지 node.js 홈페이지 : https://nodejs.org/ko/ Node.js Node.js® is a JavaScript runtime built on Chrome's V8..

스벨트 홈페이지 상단에 REPL메뉴를 활용하면 간단하게 Svelte 코드를 작성하고 편집할 수 있다. (홈페이지는 아래 적어둔 페이지로 접속하면 된다.) Svelte(스벨트) 홈페이지 링크 : https://svelte.dev Svelte • Cybernetically enhanced web apps Svelte is a radical new approach to building user interfaces. Whereas traditional frameworks like React and Vue do the bulk of their work in the browser, Svelte shifts that work into a compile step that happens when you build you..

SVELTE(스벨트) 란? "2016년 출시한 새로운 접근방식의 오픈소스 Front-End Framework" 특징은? Write Less Code! 높은 가독성 유지 개발 시간 단축 쉬운 리팩토링 쉬운 디버깅 더 작은 번들(SPA 최적화) 낮은 러닝 커브 Svelte는 Vue, React와 비교하면 같은 기능을 구현하는데 약 40%정도 적은 코드로 구현할 수 있다는 특징이 있다. 이러한 이유로 짧은 코드를 통해 높은 가독성과 개발시간을 줄일 수 있다. 또한, 적은 코드는 리팩토링이 용이하고 버그가 발생할 확률을 높일 수 있다. 코드가 짧아서 번들이 간결해지기 때문에 SPA 최적화에 도움이 된다. 코드가 간결하다는 것은 학습에 용이하다는 장점이 있다. No Virtual DOM No Diffing No ..