일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |
- 자스민
- 이종호
- 자바스크립트
- react
- Svelte
- 호키도키
- javascript
- TDD
- 비동기
- SWIFT
- hokeys
- 개발
- 자바스크립트 자료구조
- 자료구조
- Hitit
- jest
- data structure
- 계명대
- 리액트 예제
- hokidoki
- 스위프트
- 스벨트
- 호키스
- HTML
- 힛잇
- 리액트
- queue
- IOS
- 계명대 이종호
- 개발자
- Today
- Total
목록자스민 (37)
Dog foot print
Basic Syntax[2] Pipes Go 템플릿의 가장 강력한 구성요소 중 하나는 작업을 차례대로 쌓는 기능입니다. 이것은 pipe에 의해 완료됩니다. 파이프라인의 출력은 다음 파이프라인의 입력이 되기 때문에 가능합니다. Go 템플릿의 문법이 쉬운 이유는 파이프가 필요한 함수를 체인형식으로 호출하기 때문입니다. 파이프의 한가지 한계는 한가지 값에 의해 실행되고, 이 값은 다음 파이프의 다음 파이프의 마지막 인자가 됩니다. 다음 예제는 파이프를 이용하고, 사용하는데 도움이 될 것입니다. shuffle 다음 두개의 예제는 동일합니다. {{ shuffle (seq 1 5) }}{{ (seq 1 5) shuffle }}index 다음 예제에서는 페이지 파라메터로 “disqus_url” 을 전달 하였고, HT..
Directory structure Hugo new site [name] 명령어로 생성된 프로젝트는 다음과 같은 폴더 구조를 가지고 있습니다. ├── archetypes ├── config.toml ├── content ├── data ├── layouts ├── static └── themesDirectory Structure Explained 이 문서는 대략적으로 각 폴더에 대해서 리뷰한 글입니다. 각 폴더의 자세한 내용을 보고 싶다면, 링크되어 있는 회고 문서를 읽어주세요 . Archetypes Hugo에서는 Hugo new커맨드를 입력하는 것으로 새로운 컨텐츠 파일을 만드는 것이 가능합니다. Hugo는 새로운 컨텐츠를 만들때, date , title와 draft=true 형태를 포함하는 파일을 만..
{@html} {post.title} {@html post.content} 일반 텍스트를 표현할 때 문자 은 > 혹은 <로 변경됩니다. 그러나 @html에서는 이를 그대로 렌더링 합니다. {@html ""} hello svelte {@html ""} //it's not work위와 같이 {@html value}를 통해 div를 렌더링 하는 방법은 작동하지 않습니다. 또한 스벨트는 HTML을 사전 점검하여, 위험한 스크립트나, 잘못된 태그를 가려 보여주지 않습니다. 이를 방지하기 위해 source를 검사하거나, 믿을 만한 사람에게서 이 데이터를 받아야 합니다. #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를 가진 값을 사용 할 ..
태그는 모든 컴포넌트가 인스턴스되었을 때 실행되는 것이 아닌 처음 script를 읽혔을 때 실행 됩니다. 보통의 script태그와 마찬가지로 변수를 선언 가능합니다. context="module" 속성을 가진 script 내부에서 export 키워드를 통하여, 모듈을 방출 할 수 있으며 컴파일 되었을 때, 모듈화 됩니다. export default는 사용 할 수 없습니다. 이유는 해당 파일에서 기본 방출 되는 것은 스벨트 컴포넌트이기 때문입니다. Note : 에서는 반응성을 구현 할 수 없습니다. 만약 다양한 컴포넌트에서 반응성을 필요로 한다면 store를 생성하는 것을 고려하세요 .
테스트를 진행 하기 전 테스트를 위한 설정을 해주거나, 테스트가 종료된 이후에 설정을 변경해야 할 때가 종종 있습니다. 제스트는 이를 위해서 유용한 함수들을 제공합니다. Repeating Setup For Many Tests 만약 테스트가 종료된 후, 반복해야 할 코드가 존재할 때 `beforeEach` 또는 `afterEach`를 이용해 반복을 줄일 수 있습니다. 예를 들어, 테스트 마다 각 도시의 데이터베이스와 통신해야 한다고 가정하겠습니다. 개발자는 `initializeCityDatabase()`를 가지고 있고, 이는 테스트 전에 항상 호출 해야합니다. 또한 `clearCityDatabase()`를 테스트가 종료 될 때 마다 호출해야합니다. beforeEach(() => { initializeCit..
서론 Jest 시작하기 시리즈 문서들은 TEST 도구인 JEST의 공식 홈페이지 문서를 번역하고 설명을 덧 붙인 문서입니다. 설치 * Yarn 을 이용한 설치 * $ Yarn add —dev jest * Npm 을 이용한 설치 * $ npm install —save-dev jest Note : 이 문서는 yarn command를 사용하지만, npm 또한 동일하게 동작합니다. JEST 실행하기 ./sum.js function sum(a,b){ return a + b; } ./sum.test.js const sum = require("./sum"); test("adds 1 + 2 to equal 3",()=>{ expect(sum(1,2)).toBe(3); }) ./package.json { ... "scr..
서론 지난 포스팅에 이어 마지막 DIP 에 대해서 포스팅 하겠습니다. DIP :(Dependency Inversion Principle) 의존관계 역전 원칙 의존성 역전 원칙에서 말하는 "유연성이 극대화된 시스템"이란 소스코드가 추상에 의존하며 구체에는 의존하지 않는 시스템을 의미한다. 추상 인터페이스에 변경이 생기면 이를 구체화한 구현체들도 따라서 수정해야 한다. 반대로 구체적인 구현체에 변경이 생기더라도 그 구현체가 구현하는 인터페이스는 항상 변경될 필요가 없다. 따라서 인터페이스는 구현체보다 변동성이 낮다. 즉 안정된 소프트웨어 아키텍처란 변동성이 큰 구현체에 의존하는 일은 지양하고, 안정된 추상 인터페이스를 선호하는 아키텍처라는 뜻이다. 이 원칙을 구체적인 코딩 실천법으로 요약 하면 다음과 같다...