99duuk

기본 방식과 Vue Query 사용의 차이점그냥 쓴 것과 Vue Query를 사용한 것의 주요 차이는 캐싱과 리페칭임기본 방식 (그냥 쓴 것):서버에서 데이터를 가져오면: 컴포넌트가 만들어질 때 서버에서 데이터를 직접 가져옴데이터 캐싱이 없음: 데이터가 컴포넌트에 로드될 때마다 서버에 다시 요청해야 하며, 캐싱을 위한 별도의 처리 없이 API가 매번 호출됨리페칭 없음: 데이터 변경이나 네트워크 상태 변화를 자동으로 반영하지 않습니다. 수동으로 다시 데이터를 가져오는 로직을 추가해야 함  Vue Query를 사용한 방식:자동 캐싱: 데이터를 한 번 가져오면 캐시에 저장되며, 동일한 데이터를 여러 번 요청할 필요가 없음자동 리페칭: 데이터가 변경되거나, 브라우저 포커스가 다시 맞춰지거나, 네트워..

재미로 만들던 메모 api의 화면을 vue로 만들어봤음시간이 없어서 대충 지난번에 리액트로 만들었던 프로젝트처럼라우팅은 어떻게 api 호출은 어떻게 컴포넌트는 어떻게 무슨 문법은 저렇게? 대충 스윽 훑고 간다는 느낌으로 돌아가게만 만들었고 전체 메모 리스트 api만 붙혔다.디렉터리 구조는 대충 이렇게 했고 import axios from 'axios'const API_URL = 'http://localhost:80/api/memos'export default { AddMemo(memo) { return axios.post(`${API_URL}/add`, memo) }, ModifyMemos(memo) { return axios.patch(`${API_URL}/mo..

리액트와 비슷하게 작업 디렉토리에서 npm run serve 하면 실행된다.   사진 사이즈는 뻔하게 처럼 css로 줄일 수 있고 또  v-bind를 사용해 적용할 수도 있다. 여기에 동적 스타일을 적용하면  짜잔 로 버튼을 클릭할 때 이미지 사이즈가 변경된다.