본문 바로가기

전체 글

 (15)
가상 DOM(Virtual DOM)은 무엇인가? 가상 DOM은 실제 DOM보다 빠른가? 가상 DOM(Virtual DOM)은 무엇인가?  가상 DOM은 실제 DOM보다 빠른가?DOM이란?The Document Object ModelHTML, XML 문서의 프로그래밍 interface 이다. DOM은 문서의 구조화된 표현(structured representation)을 제공하며 프로그래밍 언어가 DOM 구조에 접근할 수 있는 방법을 제공하여 그들이 문서 구조, 스타일, 내용 등을 변경할 수 있게 돕는다.// DOM을 조작하여 [id="test"]인 요소를 찾아 새로운 HTML 값으로 렌더링document.querySelector('#test').innerHTML = 'TEST2';Virtual DOM이란?Virtual DOM(가상 DOM)은 진짜 DOM을 추상화한 개념으로, 실제 DOM의 ..
깊은 복사와 얕은 복사와 Spread Operator(...object)에 대해 알아보자 깊은 복사와 얕은 복사와 Spread Operator(...object)에 대해 알아보자 JavaScript로 코드를 짜다보면 객체의 사용이 매우 빈번하게 발생한다. 우리가 매번 보는 DOM 구조도 Document Object Model 의 약자로 Object 형태이고, JavaScript의 Array도 까보면 객체라는걸 알 수 있다. Object 형태의 자료 구조를 계속해서 사용하다보면 얕은 복사, 깊은 복사 그리고 Spread Operator 에 대해서 듣고 사용하게 되는데 오늘 각각 말하는게 무엇인지 알아보도록 하자. 깊은 복사 깊은 복사란 말 그대로 깊게 복사하는 것이다. 무슨 말인고 하니 객체의 모든 계층을 그대로 복사해서 새로운 객체에 복사하는 것. for문을 통해 재귀적으로 모든 값들을 일일..
[vue3] input radio 컴포넌트로 만들기 [vue3] input radio 컴포넌트로 만들기 vue3 composition api의 setup 문법일 때 사용할 수 있는 방법이다. 부모컴포넌트와 자식컴포넌트를 생성해줍니다. ParentComponent.vue 파일 부모 컴포넌트 쪽은 이렇게 작성해줍니다. 여기서 중요한것은 v-model과 value 값을 모두 작성해주는건데요. value 값에는 해당 radio 를 선택했을 때 v-model에 있는 변수에 들어갈 값을 입력해줍니다. ChildComponent.vue 파일 자식 컴포넌트에는 이렇게 작성해줍시다. props로는 modelValue 값을 넘겨주고요, id 값은 랜덤하게 일단 설정해둡니다. 자식 컴포넌트의 input 태그 속성값들을 보면 v-bind="$attrs" 가 있는데요. 이렇게 ..
[vue3] input checkbox 컴포넌트로 만들기 [vue3] input checkbox 컴포넌트로 만들기 vue3 composition api의 setup 문법일 때 사용할 수 있는 방법이다. 간단하게 이렇게 부모컴포넌트와 자식컴포넌트를 만들어두고 해봅시다. ParentComponent.vue 파일 부모 컴포넌트 쪽은 이렇게 해두는데, 먼저 자식컴포넌트를 불러와서 v-model로 값을 넘겨줍니다. ChildComponent.vue 파일 이어서 자식컴포넌트 쪽에는 이렇게 입력해주시면 되는데요 부모에서 v-model 로 받은 값이 props의 modelValue로 넘어오게 됩니다. 이후에 input checkbox에서 @input 이벤트가 일어날 때 emit으로 update:modelValue 를 해주고, 값으로 $evnet.target.checked 값..
express session cookie 값이 넘어오지 않을 때 개발 환경일 때, https 를 사용하지 않고 http를 사용할 때 쿠키가 넘어오지 않는 현상이 나타날 때가 있다. const expressSession = require('express-session'); app.use( expressSession({ secret: 'secret', resave: false, saveUninitialized: false, store: sessionStore, name: 'connect.sid', rolling: true, cookie: { httpOnly: true, // secure: true, 이 부분을 true로 할 경우 https에서만 쿠키를 전달함 maxAge: 1000 * 60 * 60 * 24, }, }) ); 위 소스처럼 express session의 c..
.bat 파일, 배치파일(batch) 안 보이게 실행시키기 보통 이렇게 다들 적어놓던데 Set WshShell = CreateObject("WScript.Shell") WshShell.Run chr(34) & ["실행시킬 배치 스크립트 파일등의 전체경로"] & Chr(34), 0 Set WshShell = Nothing이렇게 하면 물론 되지만 동적으로 파일 경로를 설정해야 하는 경우가 있다. 현재 폴더의 service.bat 파일을 숨김 상태로 실행시키려면 이렇게 하면 된다. Set WshShell = CreateObject("WScript.Shell") Path = WScript.ScriptFullName Path = Left(Path, InStrRev(Path, "\")) WshShell.CurrentDirectory = Path WshShell.run Ch..
NSIS StrContains 해당 문자가 있는지 확인 참조 https://nsis.sourceforge.io/StrContains String에 해당 문자가 있는지 확인하기 Function Code ; StrContains ; This function does a case sensitive searches for an occurrence of a substring in a string. ; It returns the substring if it is found. ; Otherwise it returns null(""). ; Written by kenglish_hi ; Adapted from StrReplace written by dandaman32 Var STR_HAYSTACK Var STR_NEEDLE Var STR_CONTAINS_VAR_1 Var ST..
flutter windows 관리자 권한 획득 방법(feat. LNK1327 에러) 어제 하루를 flutter windows 빌드 에러 삽질로 날렸다. flutter 프로그램으로 서비스 시작, 정지를 하려고 하는데 그러려면 관리자 권한을 받아와야 했다. 그때 발생한 에러. 분명히 디버그 모드로 켜놓고 핫리로드로 개발할 때는 잘 되었었는데, 빌드할 때는 안 되더라. 디버그 종료하고 다시 디버그를 하니 동일 증상 발생.. flutter 윈도우 빌드할 때 생기는 오류인데 아무리 구글링을 해보고 찾아봐도 나오지가 않음.. C++ 에러다 보니까 더 안되고 미쳐버리겠는 상황이었는데 드디어 답을 찾았다. 해당 버그는 관리자 권한을 요청하려고 할 때 생긴 버그인데, 처음 flutter에 관리자 권한을 주려고 구글링해서 찾아보니 이런 답을 발견했다. https://github.com/flutter/fl..

티스토리툴바