반응형
안녕하세요 요즘 나날이 물가가 많이 올라서 밖에서 밥 한번 사먹기도 힘든 시기 입니다. 그래서 왠만하면 회사에서도 도시락을 들고 가거나, 퇴근 후에도 집에서 먹으려고 하려고 하는데요. 쿠팡와우와 쿠팡 프레시 제품들을 자주 배송시켰습니다. 하지만 이번 달 쿠팡와우 결제 된걸 보니... 로켓와우 회비가 처음에는 2900원 이였는데... 약 10년 정도 잘 애용하던 쿠팡인데... 쿠팡도 기나긴 적자를 끊내고 흑자로 돌아섰는데 제가 쿠팡한테 적자를 당하네요 처음에는 2900원이면 한달에 한번은 무조건 시키니깐 이런 마음으로 가입했는데 점점 가격이 올라서 이제 4990원까지 올랐습니다. 그래서 이번에 쿠팡과는 헤어짐을 결심하고 쿠팡 와우를 해지하였습니다. 쿠팡와우를 해지하고 쿠팡 대체제를 찾아 보았습니다. 쿠팡 ..
안녕하세요 픽업 게임이나, 게스트 농구 경기를 참가하게 되면 순번을 정해서 뛰는 경우가 많습니다. 한 팀에 5~8명 정도 1번부터 8번까지 순서를 정합니다. 각 순서대로 5명씩 경기를 뛰게 됩니다. 1쿼터 1,2,3,4,5 2쿼터 6,7,8,1,2 3쿼터 3,4,5,6,7 ... 이렇게 경기를 뛰게 됩니다. 하지만 경기를 뛰다보면 순간적으로 다음 차례가 기억이 나지 않는 경우가 있어서 프로그램으로 한번 만들어 보았습니다. + 버튼을 누르면 선수를 추가할 수 있고 다음 버튼을 누르면 다음 차례에 뛸 선수들을 표시 합니다. 필요하신 기능이나 문제점이 있으시면 댓글로 부탁드립니다. 감사합니다. https://powerku.github.io/today-basketball/
Vuex란? Vuex는 전역 상태(global state)를 관리하는 라이브러리입니다. 지역상태 vs 전역상태 상태는 Local State와 Global State가 있습니다. 지역 상태(local state) 전역 상태(global state) 하나의 컴포넌트에서 영향을 줌 전체 앱 또는 다수의 컴포넌트에 영향을 줌 ex) 입력 요소에 의해 사용자가 값을 입력, show / hide 를 결정하는 값 ex) 유저 권한 상태, 장바구니 Vuex는 하나의 컴포넌트가 아닌 여러 컴포넌트들 또는 전체 앱에서 사용하는 데이터들의 값을 관리하기 위해서 사용하는 라이브러리입니다. Vuex는 언제 사용해야 할까? Vue를 처음 사용하실 때는 Vuex에 대해서 이해하기가 쉽지 않습니다. 충분히 Vue를 사용하고 경험해보..
문제 사항 nvm use를 실행하고 node -v를 하면 node 버전이 변경돼야하는데 변경이 되지 않는 경우가 있습니다. nvm use {version} nvm use 16 node -v // not 16 해결방법 1. 명령 프롬프트를 관리자 권한으로 실행 하고 다시 명령어를 입력해봅니다. 1번 방법도 안되면 2번 방법으로 넘어갑니다. 2. C:\Program Files\nodejs 폴더를 삭제합니다. 기존 nvm을 이용해서 설치한 node가 아니라, node 단일 버전을 설치한 경우 nvm 을 사용해도 node 버전이 변경이 되지 않는 경우가 있습니다. 해당 폴더 삭제 이후 nvm use를 다시 해보시길 바랍니다. nvm 설치 방법 자주 사용하는 명령어 사용법 프론트엔드 개발할 때 필수적으로 설치해야..
담배 끊는 방법에 대해서 이야기하려고 합니다. 요즘에는 담배 피우는 사람들이 많이 적어지기는 하였습니다. 제가 대학교 1학년 입학했던 시절에는 남학생들은 거의 대부분 담배를 피웠던 것으로 기억합니다. 안 피우는 애들이 좀 이상하게 보는 경우가 있었습니다. 안 피우는 남학생들한테 "넌 왜 담배 안 피워?" 이렇게 물어보곤 했었습니다. 현재는 6년 동안 금연하고 있습니다. 아직도 1년에 1~2번 정도는 흡연 욕구가 강하게 들 때가 있기는 합니다. 술 마시다가 주위 사람들이 담배를 피운다던지, 스트레스를 강하게 받는 경우 하지만, 금연 이후 담배가 너무 득보다는 실이 많다고 느껴서 피우지 않습니다. 금연하는 방법 1. 본인의 확고한 금연 의지가 있어야 합니다. 본인이 금연을 하겠다는 생각이 강력하게 있어야 합..
provide, inject를 사용하는 이유 Vue에서 데이터 전달을 위해서 props를 많이 사용합니다. 하지만 props를 사용할 때, 자식 컴포넌트의 계층이 깊다면 여러 컴포넌트를 거쳐서 데이터가 전달되게 됩니다. 데이터가 필요가 없는 컴포넌트인데도 props를 통해서 전달해야 하고, 번거로움이 있습니다. provide, inject를 사용하게 되면 부모 컴포넌트에서 데이터를 제공하게 되고 모든 하위 컴포넌트에서 inject를 통해서 데이터를 받을 수 있습니다. 지금부터 사용방법에 대해서 알아보겠습니다. provide inject 사용하기 // 부모 컴포넌트 export default { provide() { return { value: this.value }; }, } 부모 컴포넌트에서 provi..
안녕하세요 요새 Chat GPT가 워낙 다양하게 사용이 많이 되고 있습니다. 그래서 티스토리 블로그에서도 글쓰기 에디터에서 AI를 이용해서 자동으로 글을 써주고, 어떻게 글을 쓸지 모를 때는 추천해 주면 어떨까?라는 생각이 들었습니다. 그래서 인터넷을 검색해 보니 실제로 그런 서비스들이 있었습니다. 제가 소개시켜드릴 사이트는 뤼튼이라는 사이트입니다. 광고, 협찬 아닙니다. https://wrtn.ai/ wrtn 챗gpt보다 나은 한국형 gpt-4 이미지 생성 무제한 무료 Gen AI 챗봇 - 나만의 AI를 직접 만들수도 있습니다 wrtn.ai 뤼튼 사이트에 접속하시고 로그인하시면 이용하실 수 있습니다. 블로그 포스팅 자동으로 쓰는 방법 상단에 툴 ➡️ 긴 블로그 포스팅에 들어갑니다. 그러면 주제를 작성하..
안녕하세요 요즘 인공지능을 활용해서 코딩하시는 분들이 많은 것 같습니다. 저는 Chat GPT에게 물어보면서 도움 되는 정보를 많이 얻어 갑니다. AI 이전 개발하는 방법 AI가 나오기 전에는 "구글이 선생님이다." "구글한테서 배웠다" 이런 이야기를 많이 했었습니다. 모르는 것이 있을 때, 구글에서 검색을 해서 많이 찾았습니다. 검색을 통해서 내가 필요한 자료를 찾고 레퍼런스를 빠르게 읽는 것이 능력이었습니다. 그래서 개발할때, 공식 문서나, 유용한 자료들은 영어로 되어 있는 경우가 많았습니다. 영어를 읽을 수 있는 능력도 개발에서 필수였습니다. 요즘은 구글 번역이 워낙 잘되어있어서 영어를 몰라도 크게 어려움이 없습니다. AI 이전 개발할때 프로세스 모르는 것이 생긴다 ➡️구글 검색을 한다 ➡️ 자료를..
Vue에서 부모에서 자식으로 데이터 전달, 반대로 자식에서 부모로 데이터 전달이 가능합니다. 부모에서 자식으로 데이터 전달은 Props를 이용해서 전달하고, 자식에서 부모 데이터 전달은 $emit 이벤트를 이용하여 데이터를 전달합니다. 간단한 예시로 알아보겠습니다. 아래 글은 Options API 방식 입니다. Composition API 방식은 다음 글을 참조 바랍니다. Vue3 Props와 Emit 이벤트 이용해서 부모에서 자식 데이터 주고 받기Composition API Vue는 부모 자식 컴포넌트 간의 데이터를 서로 전달할 수 있습니다. 양방향 데이터 바인딩이 가능한 장점이 있습니다. 부모에서 자식으로는 Props 옵션을 이용해서 전달하고, 자식에서 부모는 Emit powerku.tistory.c..
Vue에서 동적으로 스타일과 Class를 추가하면 편리하게 사용할 수 있습니다. 1. Class 추가하기 v-bind:class 또는 :class를 이용해서 추가합니다. active 클래스를 isActive 데이터가 true이면 추가하게 됩니다. Hello, Vue! 2. 배열로 Class 추가하기 2개 이상의 클래스를 동적으로 추가할 때, 배열을 사용합니다. isActive, isHighlighted 값이 true 이면 각각 active, highlight 클래스를 추가합니다. Hello, Vue! 3. 조건에 따라서 Class 추가하기 삼항연산자를 이용해서 클래스를 추가할 수 있습니다. 4. 스타일 추가하기 v-bind:style 또는 :style를 이용해서 스타일을 추가할 수 있습니다. 스타일을 동..