VamosDev의 개발 브이로그

취지 보안과 안정적 통신 preload.js의 역할 1. 보안을 유지하면서 Node.js 기능 사용 가능 Electron에서는 렌더러 프로세스(브라우저 환경)에서 require, fs, path 등 Node API를 직접 사용하는 건 매우 위험해요 (XSS, remote code injection 등의 보안 위협).그래서 일반적으로 nodeIntegration: false, contextIsolation: true로 설정함➡ 이때 preload.js는 Node.js와 브라우저의 중간 지점 역할// preload.jsconst { contextBridge, ipcRenderer } = require('electron');// 렌더러에서 electron 객체를 사용할 수 있게 함contextBridge.e..

1. .on() - 기본적인 이벤트 리스너 - 이벤트를 수신하기 위해 대기 상태로 유지되기 때문에 불필요한 메모리 소모가 발생할 수 있음 - removeAllListener를 return 하여 이벤트 리스너를 정리해주는 것이 좋음 2. .once()- 호출 시 이벤트 수신 기능이 작동하면 1회 수신 시 Electron이 알아서 리스너를 정리함.- removeAllListener를 따로 return 할 필요가 없음 * 참고- 비동기 이벤트의 return 값을 return하기 위해서는 반드시 Promise 객체를 생성해야 함.

1. main.js- 백엔드, 기능 구현 2. index.js- 프론트 엔드, dom 요소로 페이지를 직접 그리거나 router 등을 적용 1) .on('이벤트명', callBack함수) - 해당 이벤트명의 이벤트를 수신함. 수신되면 정해진 callBack 함수를 실행함. 2) .send('이벤트명', data) - 해당 이벤트명의 이벤트를 발신함. 발신 시 데이터를 보냄. 예) main.js > index.js >

1. require()  - Node.js 환경에서 모듈을 가져오는 CommonJS 방식 - Node.js 환경에서는 require()를 사용하여 파일이나 패키지를 가져올 수 있음const fs = require("fs"); // Node.js의 파일 시스템 모듈 불러오기const express = require("express"); // npm 패키지 가져오기const app = express();// require("express")는 node_modules에서 express 패키지를 찾아서 가져옴  2. require vs import (ES Module) 1) CommonJS (require)Node.js에서 사용되는 모듈 시스템module.exports와 함께 사용비동기 import()와 다르게..

Audio 객체 생성 후 사용 시 장점!  1. javascript로 세밀하게 조작이 가능함.const introSound = new Audio("intro.mp3");introSound.play(); // 재생introSound.pause(); // 일시 정지introSound.currentTime = 10; // 특정 시간으로 이동introSound.volume = 0.5; // 볼륨 조절  2. DOM을 직접 조작할 필요 없음 - 태그를 사용하면 HTML에서 오디오 요소를 찾고(document.querySelector) 조작해야 함.  => 코드가 더 깔끔해// audio 태그 사용// Audio 객체 생성하여 접근const introSound = new Audio("intro.mp3");intr..

const countDownRef = React.useRef>();ReturnType는 제네릭 유틸리티 타입으로, 함수 T의 반환타입을 추출하는 역할// 1.unction myFunction() { return 42;}type MyReturnType = ReturnType; // number를 가져옴// 2.const value = "Hello";type ValueType = typeof value; // string을 가져옴  * typeof - JavaScript에서 변수나 값의 타입을 가져오는 연산자인데, TypeScript에서는 타입 추론용 키워드로 사용됨. typeof를 ReturnType과 함께 사용하면, 특정 함수의 반환 타입을 안전하게 가져올 수 있음.(typescript에서는 그냥 세트..