BirdSpring

AI, 개발, 생산성을 다루는 기술 블로그. Claude·GPT 등 AI 도구 활용법, 실전 개발 노하우, 최신 AI 트렌드를 실무자 관점에서 전합니다.

Vue.js 3 에서 모듈간의 데이터 통신

Vue.js 3 에서 모듈간의 데이터 통신

Vue.js 에서 모듈간의 데이터 통신 방법은 세가지가 있다.이벤트 버스 사용하기이벤트 버스는 어플리케이션 전역에서 이벤트를 발생하고 수신할 수 있도록 하는 기능으로 이벤트 버스를 이용하여 모듈간의 데이터 통신을 할 수 있다.// 이벤트 버스 객체 생성 const eventBus = new Vue() // 모듈 A에서 이벤트를 발행하는 코드 eventBus.$emit('event-name', data) // 모듈 B에서 이벤트를 수신하는 코드 eventBus.$on('event-name', (data) => { //...

vue3 로 코드를 작성할 때, 체크박스를 원래의 기능과 다르게 작성하는 법
Vue3 Vuejs checkbox

vue3 로 코드를 작성할 때, 체크박스를 원래의 기능과 다르게 작성하는 법

Vue 3에서 체크박스의 기본 동작을 변경하려면, v-model 디렉티브와 함께 사용하는 computed 속성을 사용하여 체크박스의 값(checked)을 수동으로 조작할 수 있다.<template> <div> <input type="checkbox" v-model="myCheckbox"> </div> </template> <script> import { computed } from 'vue'; export default { name: 'MyComponent',...

타입스크립트 제너릭 활용
Typescript 제너릭

타입스크립트 제너릭 활용

프로젝트를 진행하다가 아래와 같은 함수를 만들었는데,T를 K의 타입으로 지정하고 싶었다.private updateValue = <K extends keyof SearchParam, T> (key : K, value : T) : void => { //... } 주로 자바로 코딩을 하는데 제너릭을 저렇게 복잡하게 짜본적도 없고, 지원이 되는지도 모르겠지만 타입스크립트에서는 가능하다.private updateValue = <K extends keyof SearchParam, T extends...

CDN 사용시 크로스도메인 문제 해결
문제해결 cdn 크로스도메인

CDN 사용시 크로스도메인 문제 해결

CDN 업체를 이용시 우리 사이트와는 다른 도메인으로 서비스를 제공해줍니다. 물론 우리 도메인을 사용할 수도 있습니다. 하지만 인증서 관리를 비롯하여 귀찮은 문제들이 발생할 수가 있어서 CDN업체가 제공하는 도메인을 사용할 수 있습니다. 이럴때 크로스도메인이 문제가 될 수 있는데요. 이는 보안상의 이유로 발생하는 문제이며, 서로 다른 도메인 간의 리소스를 공유하는 것을 제한하기 때문입니다.크로스 도메인 문제를 해결하기 위해서는 다음과 같은 방법을 사용할 수 있습니다.CORS (Cross-Origin Resource Sharing)...