글을 잠깐 혼자 써봤던 진성 프로그래머 글을 잠깐 혼자 써봤던 진성 프로그래머

거의다 cookies 설정이 vue 3.0 이전 버전으로 올라온게 많아서 글을 작성하게 되었습니다. import { createApp } from 'vue' import App from './App.vue' import router from './router' import VueCookies from "vue-cookies" import globalMethods from "./globalMethods" createApp(App) .use(VueCookies,{ expireTimes: "30d", secure: true, }) .use(globalMethods) .use(router) .mount("#app") 참고자료 https://reactgo.com/vue-set-cookie/

앱을 개발하다보면 session의 유효기간을 설정할 필요가 있다. 아래와 같이 설정이 가능하다. var hour = 3600000 req.session.cookie.expires = new Date(Date.now() + hour) req.session.cookie.maxAge = 100 * hour 참고사이트 및 문서 https://stackoverflow.com/questions/46630368/how-to-extend-express-session-timeout http://expressjs.com/en/resources/middleware/session.html 도움 되셨다면 하단의 광고 클릭한번 부탁드립니다~

사용자들이 공통적으로 자주 요청하게 되는 end-point의 데이터는 미리 Cache해놓으면, 다음번에는 더 빠르게 데이터를 응답해줄 수 있습니다. 그럼 Express에서는 Caching을 어떻게 진행할까요? Redis를 사용하여 진행합니다. Redis? Redis는 Remote Dictionary Server의 약자로, "key-value" 구조의 데이터를 저장하고 관리하는 비관계형 데이터베이스 관리 시스템입니다. 메모리에서 데이터를 처리하기 때문에 속도가 상당히 빠릅니다. 그래서, 이번 포스트에서는 Redis에 데이터를 저장하고 캐싱해보겠습니다. Redis 설정하기 redis 설치하기 이 부분은 인터넷 검색으로 하실 수 있으니 대체. redis 패키지 설치 yarn add redis 혹은 npm in..

const emailRex = /^([\w\.\_\-])*[a-zA-Z0-9]+([\w\.\_\-])*([a-zA-Z0-9])+([\w\.\_\-])+@([a-zA-Z0-9]+\.)+[a-zA-Z0-9]{2,8}$/; const emailValue = document.querySelector("#input-email-span").textContent; if(self.emailValue != null && self.emailValue.length > 1){ if(!emailRex.test(self.emailValue)){ self.emailCheck = false; emailSpan.style.color = 'red' emailSpan.textContent = "올바른 이메일을 입력해주세요." } } //..

개발중에 console.log를 사용했던것 들을 개발이 끝난뒤 일일히 지우기가 매우 번거로워 처음부터 전역 함수로 만들어서 사용하기로 하였습니다. 생성 방벙에 대해 적어보겠습니다. - 개발환경 (vue 3.0 with vue@Cli) 1. js 파일을 생성(파일명은 자유로이) const methods = { console_log(str){ console.log(str) } } export default { install(Vue) { Vue.config.globalProperties.$log = methods.console_log; } } 2. main.js 파일에서 생성한 파일 글로벌 선언하기 import { createApp } from 'vue' import App from './App.vue' im..

관련 링크 첨부합니다. https://stackoverflow.com/a/68561753 Vue 3 – renders non-element root node that cannot be animated App.vue has a transition tag to fade the pages out and in.

사용자 정의 지시자 생성 (설명 : https://kr.vuejs.org/v2/guide/custom-directive.html) // v-lazyload Vue.directive('lazyload', { mounted(el) { }, }); IntersectionObserver API 구현 (설명:https://velog.io/@katanazero86/Intersection-Observer-API) mounted(el) { function imageLoad(targetElement) { const imgElement = targetElement; // data-lazy 에 지정된 이미지 경로를 에 셋팅 합니다. imgElement.setAttribute('src', imgElement.getAttrib..

Laravel 7.0 > version 부터 composer require brozot/laravel-fcm 이 안되는것같다. 구글링 결과 https://github.com/brozot/Laravel-FCM/issues/175 Laravel 7 support · Issue #175 · brozot/Laravel-FCM Problem 1 - Conclusion: remove brozot/laravel-fcm 1.3.1 - Conclusion: don't install brozot/laravel-fcm 1.3.1 - Conclusion: don't install laravel/framework v7.0.2 - Conclusion: don't ins... github.com 참고자료를 찾아냈다. https:/..