반응형 JavaScript/Vue.js4 [Vue] Vite 환경 변수 + axios전역 설정으로 개발/배포 URL 구분하기 Vite Proxy https://ko.vitejs.dev/config/server-options.html#server-proxy Vite Vite, 차세대 프런트엔드 개발 툴 ko.vitejs.dev vite.config.js export default defineConfig({ plugins: [vue()], server: { proxy: { '/api': { target: 'http://localhost:8080', changeOrigin: true, } } } }) server.proxy를 사용해서 /api/~ 요청시 서버 URL로 요청하게 설정 했지만 빌드했을때는 localhost가 아닌 배포된 서버 URL로 요청해야 합니다. 그래서 Vite에서 제공하는 Proxy 방법말고 다른 방법으로 설정하.. 2024. 3. 13. [Vue] Sweet Alert2 사용하기(Javascript) alert, confirm, prompt 창도 지원하며 깔끔해서 맘에 들어서 주로 Toast 메시지 창으로 사용했습니다 index.html에 cdn으로 넣어서 사용했습니다 기본 Alert Swal.fire({ 'Alert 실행!!.', // Alert 제목 'Alert 내용이 나타나는 곳.', // 내용 'success', // icon }); 기본적으로 이런식으로 fire를 사용해서 alert창을 출력합니다. Toast 비슷한 디자인의 Toast창을 여러개 만들거라서 alert.js라는 이름으로 파일을 따로 만들어서 export하고 필요한 곳에서 import해서 사용하는 방식으로 구현했습니다. const Toast = Swal.mixin({ toast: true, position: 'bottom', /.. 2022. 11. 7. [Vue] Javascript filter - 한글 검색기능 autocomplete - 자동 완성 기능을 사용하지 않음. autocorrect - 수정기능 사용하지 않음 spellcheck - 빨간 줄 생기는 것 없애기 @input으로 searchWord라는걸 바인딩 data(){ return{ search:[data], findWord:'', } } 검색에 사용할 search에 data를 넣어주고(난 이미지) findWord는 기본값을 빈칸으로 두고 search메소드에 넣을거다 methods: { searchWord(e) { this.findWord = e.target.value } } methods안에 searchWord를 만들고 input값을 findWord값으로 지정 computed: { // this.findWord 가 변하면 그 문자가 포함된 리스트를 .. 2022. 11. 7. [Vue]카카오 로그인 액세스 토큰 발행 https://injekim97.tistory.com/137 [2021.03.17] 인턴 +16 카카오 로그인(REST API) - 정리 완료 [2021.03.17] 인턴 +16 카카오 로그인(REST API) - 정리 완료 developers.kakao.com/docs/latest/ko/kakaologin/rest-api Kakao Developers 카카오 API를 활용하여 다양한 어플리케이션을 개발해보세요... injekim97.tistory.com 공식 문서와 위 블로그를 참고했다 index.html 추가한다 src/main.js Kakao.init('JavscriptKey? REST API Key?'); REST API를 사용한게 적합한 방식이라고 하는데 어떤 부분은 JavaScript Key로.. 2022. 7. 23. 이전 1 다음 반응형
