Song Minu

빌더 패턴이란? 복잡한 객체의 생성을 단순화하는 생성 디자인 패턴으로, 단계별로 객체를 만들 수 있다. 복잡한 객체를 만들 때 가독성과 일반적인 개발자 사용성이 크게 향상된다. 어떨 때 사용하면 좋은가? 빌더 패턴의 장점을 살릴 수 있는 가장 명확한 상황은 인자의 목록이 길거나, 많은 복잡한 매개변수를 입력으로 사용하는 생성자가 있는 클래스이다. 일반적으로 이러한 종류의 클래스들은 모두 완전하고 일관된 상태의 인스턴스를 만들기 위해, 너무 많은 매개변수들을 필요로 하기 때문에 고려해볼 필요가 있다. 문제의 클래스 예시 class Boat { constructor( hasMotor, motorCount, motorBrand, motorModel, hasSails, sailsCount, sailsMateri..

defineEmits를 따로 import 하지 않아도 된다. defineEmits에 사용할 이름?을 배열로 먼저 담아두고 필요한 부분에 사용하면 된다. https://vuejs.org/guide/typescript/composition-api.html#typing-component-emits TypeScript with Composition API | Vue.js Join in-person 1-3 November 2022, Toronto, Canada Join the Vue community ONLINE at VueConf Toronto from 1-3 November 2022! Use the code VUEJS to get 25% off on tickets! vuejs.org

나는 코딩이 재밌다. 아니 재미있었다. 5년이 넘는 기간 동안 코딩을 하면서 재미있다와 재미없다의 수많은 반복이 있었고, 지금은 살짝 다시 “재미없다”가 찾아온 것 같다. 보통 재밌을 때는 생각한걸 코딩을 했을 때 막힘없이 또는 막혀도 금방 해결해서 얻는 성취감으로 인해 재미있다. 특히 이게 될까? 하는 막연한 생각으로 시작해서 이게 되네?가 되면 정말 재밌다. 재미없을 때는 막힌 게 내가 해결하기엔 너무 큰 벽이 느껴지고 아무리 방법을 고민하고, 구글링을 해도 해법을 못찾는게 하루이틀이 넘어가기 시작하면 점점 재미가 없어지는 이유 중 하나였다. 물론 이러다 갑자기 또 무슨 아이디어가 떠올라서 해보니 돼서 해결되면 마냥 재밌다. 하지만 지금 재미가 없는건 그리고 최근 이런 저런 일들을 겪다 보니 현타가 ..

최근 vue2 버전의 vue-cli와 vuetify를 이용해 프로젝트를 하나 만들어야 할 일이 생겼었다. 기존에 만들어 두었던 vue2의 vue-cli는 너무 오래전에 만들어 둔 거라 새로 만들고 싶었다. 그동안 vue2는 nuxt가 편해서 사용했었고 vue3는 vite를 이용해서 프로젝트를 만들었어서 별 생각 안 했었는데 오랜만에 vue-cli와 vuetify를 사용하려고 하니 생각이 나지않아 기록해둔 원노트와 노션을 봤지만, 옛 버전의 내용들이라 제대로 구현이 안 되는 상황이 발생해서 최신 날짜로 작성하고자 블로그에 글을 남기기로 했다. vue-cli 설치 먼저 @vue/cli를 설치한다. npm i -g @vue/cli 전에는 이 @vue/cli가 @붙은 건 vue3, @가 안 붙은 건 vue2로 ..

process.nextTick() 현재 진행 중인 작업의 완료 시점 뒤로 함수의 실행을 지연시킨다. 콜백을 인수로 취하여 대기 중인 I/O 이벤트 대기열의 앞으로 밀어 넣고 즉시 반환한다. 현재 진행중인 작업이 제어를 이벤트 루프로 넘기는 즉시 콜백이 실행된다. process.nextTick()으로 지연된 콜백은 마이크로태스크라 불리며, 현재의 작업이 완료된 후에 바로 실행되며 다른 I/O 이벤트가 발생하기 전에 실행된다. 이미 예정된 I/O 보다 먼저 실행되기 때문에 재귀 호출과 같은 특정 상황에서 I/O 기아(starvation)을 발생시킬 수 있다. setImmediate()와 setTimeout() process.nextTick()과 목적은 유사하지만 그 의미는 다르다. 이미 큐에 있는 I/O 이..

이벤트 디멀티플렉싱 대부분의 운영체제는 논 블로킹 리소스를 효율적인 방법으로 처리하기 위한 기본적인 메커니즘인 동기 이벤트 디멀티플렉서, 이벤트 통지 인터페이스를 제공한다. 멀티플렉싱은 전기통신 용어로 여러 신호들을 하나로 합성하여 제한된 수용범위 내에서 매개체를 통하여 쉽게 전달하는 방법을 나타낸다. 디멀티플렉싱은 신호가 원래의 구성요소로 다시 분할되는 작업이다. 동기 이벤트 디멀티플렉서는 여러 리소스를 관찰하고 이 리소스들 중에 읽기 또는 쓰기 연산의 실행이 완료되었을 때 새로운 이벤트를 반환한다. 그리고 이점은 동기 이벤트 디멀티플렉서가 처리하기 위한 새로운 이벤트가 있을 때까지 블로킹된다는 점이다. watchedList.add(docketA, FOR_READ); // (1) watchedList...

작년인가 친한 동생에게 추천을 받아서 샀었다. 읽기 시작한건 아마 12월말 쯤부터 읽기 시작한 것 같다. 1판은 예제 소스가 자바고 2판은 자바스크립트라는 데 개인적으로 자바스크립트를 더 선호하는 편이라 2판으로 구매를 했다. 어제 시점으로 다 읽었고, 책이 그렇게 두껍진 않은데 다 읽는데 참 오래 걸렸다. 띄엄띄엄 보기도 했고, 야근했다고 안보기도 했고, 주말에 그냥 쉬거나 다른 거 한다고 안보기도 했고, 그냥 안 보던 날도 있고... 이러다간 읽어야할 다른 책들도 있는 데 이것부터 다 못볼것 같아서 늦게 일어나는 게 아니라면 평일엔 출근 전 30~40분씩 읽고, 주말에도 따로 무슨 일이 있는 게 아니라면 일정 시간 정해서 무조건 봤다. 아마 그냥 읽기만 하면 더 빨리 봤을 것 같긴했지만, 예제 코드도..

현재 메모와 정리, 문서화를 목적으로 원노트와 노션을 사용하고 있다. 기억력이 좋지 않기도 해서 가능하면 항상 메모를 하고 나중에 다시 찾아보는 데 시간을 줄이기 위해서 사용하기 시작한 게 어느덧 5년이 넘는 시간을 사용했다. 현재 원노트는 17년도부터 사용했고, 작년 말부터는 노션을 추가로 사용하기 시작했다. 원노트 처음 회사에 입사했을 때 회사에서 에버노트를 사용했어서 나도 에버노트를 써봤었는데 개인적인 이유로 마음에 들진 않았다. 지금도 그런진 모르겠지만 내가 사용할 당시를 기준으로 무료 버전은 기기 연동 수 제한, 용량 제한도 있고, 메모하는 데 있어 뭔가 내가 생각할 때 좋다는 느낌은 없었다. 그래서 에버노트 말고 다른게 뭐가 있을까 하고 찾아보다 원노트를 알게 되었다. 마이크로소프트 계정 1개..

작업한 깃 주소 https://github.com/smw0807/nuxt_chatting_room GitHub - smw0807/nuxt_chatting_room: vue2 기반 nuxt와 socket.io nuxt-socket-io를 이용한 채팅방 vue2 기반 nuxt와 socket.io nuxt-socket-io를 이용한 채팅방. Contribute to smw0807/nuxt_chatting_room development by creating an account on GitHub. github.com 개인적으로 모르는거나 새로운걸 습득하기 위해 보다보면 한 번에 이해가 되는 것들이 있고, 한 번에 안돼서 몇 번 더 보면 이해가 되는 것들도 있는 데 종종 이상하게 아무리 몇 번을 봐도 이해가 안 되..

vuetify를 이용해 채팅창을 구현 중에 필요해서 찾았는 데 찾는 데 생각보다 시간이 걸린 김에 블로그에 작성... 정확한 이유를 모르겠는데. vuetify 컴포넌트에 ref 값을 주고 this.$refs.로 scrollHeight를 가져오는 게 안 된다. 다른 컴포넌트들 모두 테스트를 해보진 않았지만... 일단 v-card에서는 안됐다. 처음엔 ref를 사용하면 될 것 같아서 v-card에 ref="msgCard"를 넣고, watch 에서 메세지 데이터를 받을 때마다 스크롤 높이를 체크하면서 처리하려고 했었다. 하지만 계속 undefined가 떠서 찾아보니 id 값을 주고 처리해야 됐다. 이렇게 id 값을 넣어주고, 아래와 같이 작성하면 된다. vuetify 컴포넌트 말고 기본적으로 제공되는 html..