JavaScript

[Electron] require is not defined 해결 방법

Electron openDevTools 를 이용하여 F12 메뉴를 보는데 require is not defined 경고를 만났다. 이 에러는 main.js의 webPreferences에 아래 두 코드를 입력해주면 해결 가능하다. nodeIntegration:false contextIsolation : false

[Electron] Electron을 사용하여 Destktop Todo App 만들기( 2 ) - Preferences, Todo CRUD

Preferences const { app, BrowserWindow, ipcMain } = require('electron') const path = require('path') const createWindow = () => { // Create the browser window. const mainWindow = new BrowserWindow({ width: 800, height: 600, webPreferences: { preload: path.join(__dirname, 'preload.js') }, }) mainWindow.removeMenu(); // remove Menu // and load the index.html of the app. mainWindow.loadFile('index...

Electron 시작하기

Electron 공식문서를 번역한 내용을 참고하여 작성된 내용입니다. What is Electron? Electron은 자바스크립트, HTML, CSS를 사용하여 데스크톱 애플리케이션을 만드는 프레임워크이며 네이티브 애플리케이션입니다. Node.js와 OS의 이벤트 루프를 합쳐 네이티브 UI를 제어하며, Chromium을 사용해서 HTML, CSS, 자바스크립트를 이용해 애플리케이션을 만들 수 있도록 해줍니다. 그리고 Electron을 이용해 작성한 앱은 Mac, Windows, 리눅스용으로 패키지 할 수 있습니다. Quick Start 이 가이드에서는 electron/electron-quick-start처럼 Electron에서 Hello world앱을 만드는 과정을 안내합니다. 이 튜토리얼이 끝나면 실..

[ JavaScript ] 간단한 Todo List 구현

간단한 ToDO List를 구현해보자 My ToDos Create To Do html, body { height: 100%; margin: 0; padding: 0; overflow: hidden; } ul, li { list-style: none; } body { background-color: beige; } #main_menu { display: block; } #create_menu { display: none; } .background { width: 50vw; height: 80vh; background-color: white; margin: 0 auto; margin-top: 30px; border-radius: 5px; } .title { text-align: center; } .creat..