반응형 JavaScript11 [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. [Firebase] Functions private key 에러(deploy 실패) 문제 발생 firebase functions deploy에 실패했습니다. firebase deploy --only functions --debug 원인을 알기 위해 debug 모드로 Firebase Functions를 배포해봅니다. Function failed on loading user code. This is likely due to a bug in the user code. Error message: Provided module can't be loaded.\nIs there a syntax error in your code?\nDetailed stack trace: Error: Failed to parse private key: Error: Invalid PEM formatted message.\.. 2023. 12. 11. [NestJS]TypeORM과 DB 컬럼 명명 규칙 기존 Entitynotice.entity.ts@Entity() export class Notice extends BaseEntity { @PrimaryGeneratedColumn() wr_no: number; @Column() wr_category: string; @Column() wr_subject: string; @Column() wr_content: string; @Column() wr_hit: number; @ManyToOne((type) => Member, (wr_writer) => wr_writer.mb_boards, { eager: false, }) wr_writer: Member; @Column() wr_date: Date; }간단한 게시판 Entity를 만들었습니다 TypeORM을 사용해.. 2023. 9. 21. [Javascript] 원시타입 & 참조타입 (Primitive & Reference) 비교 var value1 = 1234; // Primitive data type - 변수에 값이 그대로 저장 var array1 = [1, 2, 3]; // Array, Object는 변수에 reference가 저장 Primitive data type과 Reference data type라는게 있습니다. Primitive data type var name1 = '김'; var name2 = name1; // 복사 name1 = '박'; name1에 값을 넣고 name2 = name1을 하면 name2에도 같은 '김'이라는 데이터가 들어가겠죠 이때 name1을 '박'으로 바꾸고 name1과 name2를 모두 출력 해보겠습니다. name1은 마지막에 '박'으로 값을 바꿔서 '박'이라고 출력되는데 name2는 값을.. 2023. 2. 17. summernote.js 용량 제한 수정 callbacks : { onImageUpload: function (files) { /** upload start */ var maxSize = 5 * 1024 * 1024; // limit =5MB // TODO: implements insert image var isMaxSize = false; var maxFile = null; for (var i = 0; i maxSize) { isMaxSize = true; maxFile = files[i].name; break; } //sendFile(files[i], this); } if (isMaxSize) { // 사이즈 제한에 걸렸을 때 alert('[' + maxFile +.. 2023. 1. 9. [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. Javascript array 조작 (Firebase) function getSentence(data) { return new Promise(resolve => { const charData = []; db.collection(data).orderBy('ch_name').limit(25) .get() .then((r) => { r.forEach((doc) => { charData.push(doc.data().ch_sentence) }) resolve(charData); }) .catch(error => { res.send(error.message) }) }) } charData가 push로 합쳐지지만, 각각 foreach문을 거칠 때마다 새로운 배열이 생성된다 function getSentence(data) { return new Promise(resolve.. 2022. 11. 7. 카카오 파이어베이스 커스텀토큰 로그인(팝업O) https://fpem3309.tistory.com/128 카카오토큰 파이어베이스 커스텀 로그인(팝업x) https://fpem3309.tistory.com/127 [Vue]카카오 로그인 액세스 토큰 발행 https://injekim97.tistory.com/137 [2021.03.17] 인턴 +16 카카오 로그인(REST API) - 정리 완료 [2021.03.17] 인턴 +16 카카오 로그인(REST API) - 정리 완료 fpem3309.tistory.com 지난번 했던 것 보다 훨씬 간단하다 진작 팝업으로 할걸 그랬다 /functions/index.js const functions = require('firebase-functions') const admin = require('firebase-a.. 2022. 10. 17. 카카오 파이어베이스 커스텀토큰 로그인(팝업x) https://fpem3309.tistory.com/127 [Vue]카카오 로그인 액세스 토큰 발행 https://injekim97.tistory.com/137 [2021.03.17] 인턴 +16 카카오 로그인(REST API) - 정리 완료 [2021.03.17] 인턴 +16 카카오 로그인(REST API) - 정리 완료 developers.kakao.com/docs/latest/ko/ka.. fpem3309.tistory.com 이어서 엑세스 토큰으로 Firebase Functions를 사용해서 커스텀 토큰을 만들고 로그인 firebase-functions 설정 /functions/index.js const functions = require('firebase-functions') const admi.. 2022. 8. 3. [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 다음 반응형
