Younho9 Notes2022-09-21
TODO
- obsidian iCloud 동기화
- 동기화 방법
- 개인 맥북 : iCloud 저장소 + git으로 업로드
- 회사 맥북 : git으로 업로드
- iOS 기기 : iCloud 저장소
- 플러그인
- iOS 기기 : 플러그인 사용하지 않기
- 동기화 방법
Learning
Design Token Community Group(DTCG)
제품과 디자인 도구가 디자인시스템의 스타일 조각을 대규모로 공유하기 위해 의존할 수 있는 표준을 제공하는 것을 목표로 하는 커뮤니티 그룹
- DesignTokens.org: 디자인 토큰 커뮤니티 그룹의 공식 홈페이지
- design-tokens/community-group (GitHub): DTCG의 디자인 토큰 사양을 위한 공식 GitHub 레포지토리
- w3.org/community/design-tokens: W3C의 DTCG 공식 홈페이지
- Design Tokens Technical Reports: 디자인 토큰 기술 보고서
FormData
- FormData - Web APIs | MDN (mozilla.org)
- TypeScript에서 좀 이상한 듯.
Vue 3
setup
setup()은 어떠한 라이프사이클보다도 먼저 실행된다.
Reactive Proxy vs. Original
reactive()는 Proxy를 리턴하기 때문에, 원본 객체와 같지 않다.
js
const raw = {};
const proxy = reactive(raw);
// proxy is NOT equal to the original.
console.log(proxy === raw); // false
const raw = {};
const proxy = reactive(raw);
// proxy is NOT equal to the original.
console.log(proxy === raw); // false
오직 프록시만이 반응성이다. 원본 객체를 변경하는 것은 업데이트를 트리거하지 않는다. 따라서, Vue의 반응성 시스템으로 작업하는 가장 좋은 방법은 상태의 프록시 버전만을 사용하는 것이다.
프록시에 대한 일관된 접근을 보장하기 위해, reactive()를 호출하면 항상 같은 프록시 객체를 리턴한다.
js
// calling reactive() on the same object returns the same proxy
console.log(reactive(raw) === proxy); // true
// calling reactive() on a proxy returns itself
console.log(reactive(proxy) === proxy); // true
// calling reactive() on the same object returns the same proxy
console.log(reactive(raw) === proxy); // true
// calling reactive() on a proxy returns itself
console.log(reactive(proxy) === proxy); // true
이 규칙은 중첩 객체에도 동일하게 적용된다. 깊은 반응성에 기반하여, 반응성 객체 내부의 중첩 객체도 프록시이다.
js
const proxy = reactive({});
const raw = {};
proxy.nested = raw;
console.log(proxy.nested === raw); // false
// proxy: Proxy {nested: {…}}
// proxy.nested: Proxy {}
// raw: {}
const proxy = reactive({});
const raw = {};
proxy.nested = raw;
console.log(proxy.nested === raw); // false
// proxy: Proxy {nested: {…}}
// proxy.nested: Proxy {}
// raw: {}