전체보기
-
Vue.js) global(전역) 함수 만들어서 콘솔 로고 사용하기Programing Language/Vue.js 2021. 11. 3. 13:51
개발중에 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..
-
Vue.js) Component inside <Transition> renders non-element root node that cannot be animated. 에러 해결Programing Language/Vue.js 2021. 11. 2. 15:06
관련 링크 첨부합니다. 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.
-
Ngnix)nginx 같은 포트에서 각기 다른 파일 보여주기Programing Study/네트워크 2021. 10. 28. 15:34
이번에 학교 인프라 데이터를 관리해주는 프로그램을 3개 만들어서 하나의 서버에 업로드를 해주었다. 프로젝트를 간단히 A,B,C 라고 부르도록 하겠다. A프로젝트에 접근하는 방식은 domain.com B프로젝트에 접근하는 방식은 domain.com:81 C프로젝트에 접근하는 방식은 domain.com:82 각기 이런 방식으로 접근을 하도록 nginx 파일을 설정해주었다. 하지만 접근 url뒤에 저런식으로 port 번호를 유저가 직접 입력을해서 접근해야만 하는 방식이 마음에 들지 않았다. 여러 도메인을 사용해서 같은 주소, 같은 포트번호로 접근을 하여도 각기 다른 파일을 보여줄순 없을까? 라는 궁금증이 들었고, 그동안 nginx 를 그저 사용만 할 줄 알았지, 조금더 구체적으로 어떤 방식으로 동작하는지를 공..
-
Vue) 사용자 지정 디렉티브 사용하여 image lazy loading 구현하기Programing Language/Vue.js 2021. 10. 25. 00:11
사용자 정의 지시자 생성 (설명 : 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) fcm 메세지 전송하기(composer require brozot/laravel-fcm이 안 될경우)Programing Language/PHP 2021. 10. 19. 17:33
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:/..
-
Javascript) 웹 과 각 네이티브(Android,iOS) 통신하기(Bridge)Programing Language/JavaScript 2021. 10. 19. 16:49
Javascript var isMobile = { Android: function () { return navigator.userAgent.match(/Chrome/) == null ? false : true; }, iOS: function () { return navigator.userAgent.match(/iPhone|iPad|iPod/i) == null ? false : true; }, any: function () { return (isMobile.Android() || isMobile.iOS()); } }; try{ if(isMobile.any()) { if(isMobile.Android()) { window.fcmRegister.getUserEmail(user_info.user_email); ..
-
FFmpege) FFmpeg란 무엇인가요?Programing Study/E.T.C 2021. 10. 15. 15:38
FFmpeg 이란? FFmpeg (www.ffmpeg.org) 은 비디오, 오디오, 이미지를 쉽게 인코딩 (Encoding), 디코딩 (Decoding), 먹싱 (Muxing), 디먹싱 (Demuxing) 할 수 있도록 도움을 주는 멀티미디어 프레임워크입니다. 참고로 FFmpeg 홈페이지에도 다음과 같이 FFmpeg을 소개하고 있습니다. FFmpeg is the leading multimedia framework, able to decode, encode, transcode, mux, demux, stream, filter and play pretty much anything that humans and machines have created. It supports the most obscure anci..
-
프로그래밍에서의 Cold Start와 Warm StartE.T.C 2021. 10. 14. 10:34
Cold와 Warm은 온도를 나타내는 단어인데, 종종 컴퓨터 분야에서 사용되는걸 볼 수 있다. 직역하자면 Cold는 낮은 온도라서 기계 입장에서는 부담되는 가혹한? 조건이고, Warm은 어느정도 따뜻하며 온화한 수준이 되겠다. 그러면 컴퓨터에서는 Cold와 Warm을 어떻게 구분해야 할까...? 우선 브라우저 프로세스 테스팅 관점에서 살펴보면... (참고 : http://www.howtocreate.co.uk/browserSpeed.html) 1. Cold start This is the time it takes to do a cold load. I log out then in, and then once all background processes have completed, I run the brows..