Electron 길보 보고 앱을 만들어 보았다! 라는 이야기 조금이라도 건강해지는 시스템 개발할 수 없을까~라고 생각하고, 길보를 전사에서 기뻐하기 위한 앱을 개발했습니다. 개발 한계가 이틀 밖에 없었기 때문에, 만들지 않았습니다. (그 중 하루는 어떤 음악이 텐션 오르는지에 지출했습니다.) 채팅 워크에 메시지를 보내면 Mac을 연결하고 있는 모니터에 텐션이 오르는 음악과 함께 길보가 보고됩니다. ※본래라면, 텐션이 오르는 음악이 흐릅니다. 이 구성은... FirebaseElectron자바스크립트Node.jsChatwork Electron+Vue에서 가상 화폐의 판 정보 보기 이번에는 구현 자료로 가상 통화의 판 정보를 표시하고 싶습니다. Eletron이란, 다시 말하면, Windows/macOS/Linux에서 실행할 수 있는 데스크탑 앱을 HTML+CSS+JavaScript와 같은 Web 기술로 개발할 수 있는 프레임워크입니다. 프런트 엔드는 Vue.js를 사용하여 만들고 싶으므로 Electron에 Vue.js가 들어있는 보일러 플레이트 를 사용하여 프로젝트를 ... 가상 통화ElectronVue.jsbitflyerNode.js Electron 앱을 TypeScript 및 React로 작성 node.js (ver12.13.0) electron (ver13.1.8) typescript (ver 4.0.2) 버튼을 클릭하면 카운트 업하는 간단한 electron 앱을 구축 TypeScript로 작성된 앱 코드에서 중단 점을 설정하여 Chromium 내장 디버거에서 중지 할 수 있는지 확인 react developer tools는 react component tree를 Chromium... ElectronReactMacTypeScript Electron+React에서 Hello world Electron의 UI를 React로 만들어 보겠습니다. 다음 단계로 만들어 갑니다. React 앱을 create-react-app로 만듭니다. 만든 React 앱을 Electron으로 불러오기 표시한다. 구그하면 localhost:3000에서 시작한 React 앱을 로드하는 예가 많습니다만, 여기서는 빌드한 것을 로드하기로 합니다. ※환경: Windows 10 Home, Node.js v1... ElectronReact Electron을 움직여보세요 (참고한 Qiita 기사) main.js index.html index.html과 같은 디렉토리에 저장된 이미지 파일 (afoguard.png) Terminal에서 electron 실행 Terminal ( 열린 화면 ) Terminal Cannot compute electron version from installed node modules 오류 발생 다음 해결책을 사용해보십시오. · (참고... MacOSXelectron-builderElectron Electron : ver12의 contextBridge와 ipcRenderer.invoke 본 기사에서는, Electron의 Ver.12 이후로 시큐어에 모듈을 사용할 때에 망설이기 쉬운 「ContextBridge.ipcMainWorld」와 「ipcRenderer.invoke」에 대해 해설합니다! 게다가 구체예에 SlackAPI에 의한 메세지의 송신을 사용하는 것으로, 함께 사용법을 기억해 버리는 혼담입니다! 비프로그래머의 독학&첫 투고가 되기 때문에 아무쪼록 손 부드럽게. 라는 ... Electron자바스크립트초보자Node.js슬랙 【Node.js & Windows10】프로그레스 바 첨부의 토스트 통지를 표시한다 Node.js를 통해 Windows 10 진행률 표시 줄이있는 토스트 디스플레이를 표시합니다. 다음 모듈이 설치되어 있다고 가정합니다. @nodert-win10-rs4/windows.ui.notifications @nodert-win10-rs4/windows.data.xml.dom 이번은 nodert-win10-rs4로 테스트하고 있습니다만, nodert-win10-20h1 등, 다른 버젼에... UWPWindows10ElectronNode.js ESP32의 보안 프로토 타이핑 환경을 만들었습니다 (클라이언트) 독학하고 있는 IoT 시큐리티에 대해서, 집대성의 의미를 담아 현재 이상이라고 생각하는 시큐어인 프로토타이핑 환경을 구축했습니다. 디바이스, 서버, 클라이언트 앱의 요소 기술 공부를 포함하여 비망록으로 분산하여 기록해 갑니다. ,이 프로젝트의 이름을 rainbowtype. 구성은 상기가 되어, 이번은 클라이언트측의 구현을 검토해 보겠습니다. rainbowtype client는 개발자의 Win... ElectronReact보안IoTESP32 Atom 코드 재사용을 위한 최신 버전의 사양 조사 은 플러그인 기구나 키 커스터마이즈 기구 등의 실현을 위해서 Atom의 소스 코드를 일부 유용하고 있다. 새로운 버전을 개발함에 있어서, 전회의 조사로부터 2년 정도 지나므로 다시 조사 사용할 수 있는 곳은 사용해 간다. MIT 그대로. 고맙습니다. 이것 v8 snapshot 만들고 있다··! ! 시작 매우 빠릅니다. 흉내내고 싶다. 스스로 npm install 그러면 node의 버젼이 맞지... ElectronATOM Intellij에서 electron 디버깅 설정 이 기사는 Mac 환경의 Intellij에서 Electron을 디버깅하는 방법을 요약합니다. Electron에는 Main과 Renderer의 두 가지 프로세스가 있지만 둘 다 디버깅 할 수 있습니다. 이번 설정을 한 환경은 다음과 같습니다. node v12.4.0 electron v7.1.3 이번에 사용한 소스 코드는 Run/Debug configuration 에 설정을 작성하면 쉽게 디버깅... IntelliJElectron자바스크립트 Parallels에서 Electron에서 개발 한 앱의 표시가 이상해지는 것을 방지하는 방법 --disable-gpu 옵션을 부여하고 시작하면 잘 작동합니다. .zash 등에 별칭으로 등록하거나 Automator 등으로 스크립트화하면 좋다. Chrome도 VSCode도 하드웨어(GPU) 가속을 OFF로 하는 기능이 있으므로 그것을 OFF로 하는 편이 빠를지도 모릅니다. 2021년 3월 15일 현재, VSCode의 UI 혼란은 아무것도하지 않고 해소되는 것처럼 보입니다 (Paralle... ChromeElectronVSCode vue-cli3 + TypeScript + Electron으로 앱 개발 Vue.js와 TypeScript 및 Electron에서 데스크톱 애플리케이션을 개발할 때 필요한 단계를 잊어 버린 것으로 작성합니다. 프로젝트를 만들기 전에 @vue/cli를 전역 설치합니다. 2.x계를 사용하고 있는 분은 일단 언인스톨하고 나서 인스톨 해 주세요. 현재 디렉토리에 my-app라는 디렉토리가 작성됩니다.my-app 부분을 원하는 이름으로 변경하십시오. 이후는 여기에서 작성한... Electronelectron-builderVue.jsTypeScript NW.js를 사용하여 웹 앱을 데스크톱 앱으로 이식 NW.js는 JavaScript를 사용하여 데스크톱 앱을 만들 수 있는 프레임워크입니다. 처음에는 electron을 검증하고 있었지만, NW.js 쪽이 소스의 은폐가 가능하다는 것으로, 이쪽도 검증해 보기로 했다. 다만 NW.js도 단지 패키지화했을 뿐이라고 간단하게 해석되어 버리는 취지의 기술을 잘 보기 위해, 이쪽은 후일 조사. 다음 구성으로 디렉토리를 만듭니다. package.json이... 패키징ElectronNW.js자바스크립트멀티 플랫폼 [참고] GitHub Actions를 사용하여 Electron multi-platform-build 수행 최근 개인적으로 Electron에서 작은 앱을 만들 기회가 있었지만, 공개할 때 빌드 -> Release의 흐름을 자동화하고 싶었다. 당초 TravisCI 를 사용하고 있었지만, 이 기회에 GitHub Actions 를 사용해 보았으므로 그 때의 메모. 성공하면 태그 이름의 Release (draft)를 만들고 빌드된 아티팩트(e.g., .exe .dmg ) 파일을 만든 Release Ass... ElectronGitHubGitHubActions시Node.js Vue.js로 만든 마크다운 편집기 앱을 Electron으로 데스크톱 앱으로 만들기 이 기사에서는 Electron을 사용하여 데스크톱 응용 프로그램을 만들려고합니다. 이 기사에서는 이전 기사에서 만든 클라이언트를 Electron을 사용하여 데스크톱 앱으로 만듭니다. Vue.js 프로젝트는 2 명령을 실행하기만 하면 Electron화할 수 있습니다. 사전 준비: Vue.js 프로젝트 만들기 의 순서를 따릅니다. 에 액세스 하면 다음과 같은 화면이 표시되는 상태로 합니다. El... ElectronVue.jsMarkdown electron-nuxt를 사용하여 데스크톱 애플리케이션 만들기 Nuxt.js Advent Calendar 2019 의 기사입니다. Nuxt.js에서 조금 떨어져 버립니다만 이번은, 전부터 신경이 쓰이고 있던 electron-nuxt를 사용해 데스크탑 어플리케이션을 만들어 보았던 기사를 쓰려고 생각합니다. 이번 기사에서는 아키텍처의 이야기 등, 세세한 부분에 관해서는 하지 않을 예정이므로 양해 바랍니다. vue가 들어 있지 않은 분은 먼저 vue-cli를... Electronnuxt.jselectron-nuxt electron 앱에서 초기 메뉴를 지우는 방법 웹사이트를 여는 간단한 샘플 앱을 만들고 있고, 초기 메뉴를 지우는 방법을 찾고 있었지만 정답까지의 노이즈가 많아 수고했기 때문에. electron 버전 구구라고 나오는 메소드는 모두 오래된 것 같았습니다. 이하, 효과가 없는 메소드 electron은 흐름이 빠르거나 파괴적인 변경이 많은지는 잘 모르겠지만, 공식 docs가 이치반( )이라고 하는 것은 잘 알았습니다. 메뉴 없이 Google을... Electron MacBook Pro 충전기 정보를 메뉴바에 표시하는 Electron 앱을 만들었다 MacBook Pro에서 사용되는 Type-C의 충전은 조건에 따라 충전 속도가 달라집니다. 예를 들어, 제 경우 RAVPower의 Type-A와 Type-C 모두 사용할 수 있으며 최대 60W까지 공급할 수 있는 충전기를 평상시 사용하고 있습니다. 충전기, 케이블, PD 대응 등, Type-C 관련은 사양이 지나치게 복잡하기 때문에, 연결해 보지 않으면 정직 알 수 없습니다. 충전할 수 있... Node.jsElectron자바스크립트Mac 단지 local 환경에서 json 파일을 만들면 모의 서버(Mockup Server)를 시작할 수 있는 앱을 개발했습니다. 프론트엔드와 백엔드를 동시에 개발하는 경우, 백엔드의 api와 데이터명 등이 맞지 않을 때가 많습니다. 하지만 Mockup Server를 사용하면 Local 환경에서 쉽게 Directory와 Json 파일을 만들고 서버를 시작할 수 있습니다. 작성한 것을 Git로 관리하면 프런트 엔드와 백엔드 개발자가 행복하게 개발할 수 있습니다. Mockup 서버화를 위한 Directory를 작성. 1번부... ElectronReactTypeScriptVue.js자바스크립트 macOS용으로 Electron 어플리케이션의 서명(code signing)·공증(notarization)을 한다 Electron 애플리케이션의 macOS 버전을 배포하는 데는 두 가지 방법이 있습니다. 2)의 방법으로 배포하는 경우, 서명(code signing) 및 공증(notarization)이 필요합니다. 이 기사에서는 실제로 Electron 애플리케이션을 출시한 경험을 바탕으로 필요한 설정에 대해 설명합니다. 내가 개발한 Electron 어플리케이션( )에서는, 다음의 상태·조건으로부터, 릴리스... codesigningElectronelectron-buildernotarizationmacos Electron 7.0.x에서 webContents.printToPDF ()가 promisification되었지만 문서 예제가 고쳐지지 않았습니다. Electron 7.0.x가 출시됨에 따라 즉시 업데이트 해 보았습니다. 한층 더, promisification 가 진행되고 있는 것 같습니다. 또한 promisification 되어, Promise 를 Return 하게 되었습니다. 에 webContents.printToPDF() 의 설명이 있습니다만, 메소드의 설명 그 자체는 갱신되고 있습니다만, 코딩 예가 갱신되고 있지 않습니다. 다음과... Electron자바스크립트 Electron에서 작업하는 동안 사용할 수있는 앱을 만들면 잔상이 남은 이야기 display를 none으로 한 요소의 그림자가 붙은 채로 되어 잔상이 남아 버리고 있었다(Mac만의 증상) 했지만, ↓dislpay:none; 잔상이 남아있다! 이것은 곤란했습니다 (수수께끼) 조사해 보자마자 해결할 수 있었습니다. Window 객체의 hasShadow라는 속성이 기본적으로 true로 설정되어 잔상이 나타납니다. false로 설정하면 잔상이 사라집니다. 했어. 조사해 보면,... Electron자바스크립트MacNode.jsHTML5 React + Electron으로 스크래핑하기 일본어 자료 밖에 조사하고 있지 않지만, 외부 사이트로의 스크래핑을 하기 위해서 필요한 HTTP 리퀘스트의 코드가 찾아내지 않았기 때문에, 써 보았습니다. js 초보자도 있고 소스 코드가 더럽습니다. 원하는대로 변경하십시오. 프로젝트의 구성은 다음과 같습니다. src 디렉토리에 util.js를 배치하십시오. 모듈 내용 src/main.js public/index.html usage.js... Electron스크래핑React Electron 앱을 windows10기로 디지털 사이니지할 때 하는 것이 좋다 또한 알림 등도 표시되지 않도록 설정해야 합니다. 응용 프로그램은 전체 화면을 표시하고 일반 사용자는 화면 터치로 조작합니다 전시하는 머신은 windows10 Pro 전시기는 windows10 Pro를 사용한다. Windows10 Home에서는 설정할 수 없는 항목이 있다 여기에서는 Windows 10 Pro 1903에 대해 설명합니다. 버전이 변경되면 항목 이름과 설정 위치가 변경될 수 있... Electron전시회디지털 사이니지Windows10 Electron으로 만든 화면의 자동 조작 Electron을 사용하면 node.js를 사용하여 멀티 플랫폼 화면을 만들 수 있습니다. 이번에는 이 Electron으로 작성된 화면의 자동 조작에 대해 생각해 봅시다. 다음과 유사한 파일을 만듭니다. package.json app.js index.html index.js 이러한 파일을 패키징합니다. 다음 페이지를 참고하십시오. Electron: 앱 실행 및 exe 만들기 작성된 Exe는 ... Electron파이썬셀레늄Node.jsUiPath 다시 한번 블록 체인을 사용하여 뭔가 할 수 없는지 생각해 보았습니다. 되돌아보면 요즘보다 실장력은 엄청 오른 것 같은 생각이 든다.) Ethereum 사용하면 마이닝 필수가 되므로, 아무래도 사내 툴이라든가 프라이빗 체인에 사용하면 「계정 만들어 주면 우선 100년분 토큰 배부해 두면 좋을까」 같은 적당한 운용이 되는 것이 키모이고, 이후 KVS 이상의 용도가 떠오르지 않았던 것도 있고. 그리고 상당한 시간이 지난 곳에서 우연히 HyperLedger로 포인트제... ElectronHyperledger-fabric스마트 계약 .NET Core 3.0의 Blazor + Electron으로 GUI 앱 개발 ※본 기사는 에 쓴 것의 야키와와시입니다. 을 사용하여 .NET Core 3.0의 Blazor를 Electron에서 실행하려고했습니다. 이번 환경은 이쪽 .NET Core 3.0.100 Nodejs 12.10.0 ElectronNET.API 5.22.14 ElectronNET.CLI 5.22.14 다음 명령으로 Blazor 프로젝트를 만듭니다. 프로젝트에 ElectronNET.API 의 Pa... Electron.NETCoreBlazor 【오류 대처】Electron에서 렌더러 프로세스 require를 할 수 없다 를 참고로, 우선 써 흉내 드리면서 쓰는 방법을 공부하고 있었습니다. 그러나 "앱처럼" index.js 그런데 const electron을로드하지 못했습니다. Electron의 메인 프로세스 측면에서 main.js nodeIntegration 속성을 true로 설정하면 제대로 HTML로 읽은 index.js에서 require 할 수있었습니다. 잘 작동하지 않는 이유는 Electron의 메커니... Electron자바스크립트Node.js 편리한 TweetDeck 뷰어를 만들어 보았습니다. 작업 중도 TweetDeck보고 싶지요? 나는 보고 싶다. 그래서 작업을 방해하지 않고 TweetDeck을 보는 Viewer를 만들어 보았습니다. 본체는 에 둡니다. 짹짹 TweetDeck를 항상 맨 앞에 표시하는 앱입니다. (주의) 현재는 macOS 만 지원합니다. 쉬운 소개 미니 사이즈 창 프레임리스 항상 맨 앞면 표시 표시 붕괴 없이 스케일링 가능 일반 TweetDeck과 같은 사용감 ... Electrontweetdeck 이전 기사 보기
길보 보고 앱을 만들어 보았다! 라는 이야기 조금이라도 건강해지는 시스템 개발할 수 없을까~라고 생각하고, 길보를 전사에서 기뻐하기 위한 앱을 개발했습니다. 개발 한계가 이틀 밖에 없었기 때문에, 만들지 않았습니다. (그 중 하루는 어떤 음악이 텐션 오르는지에 지출했습니다.) 채팅 워크에 메시지를 보내면 Mac을 연결하고 있는 모니터에 텐션이 오르는 음악과 함께 길보가 보고됩니다. ※본래라면, 텐션이 오르는 음악이 흐릅니다. 이 구성은... FirebaseElectron자바스크립트Node.jsChatwork Electron+Vue에서 가상 화폐의 판 정보 보기 이번에는 구현 자료로 가상 통화의 판 정보를 표시하고 싶습니다. Eletron이란, 다시 말하면, Windows/macOS/Linux에서 실행할 수 있는 데스크탑 앱을 HTML+CSS+JavaScript와 같은 Web 기술로 개발할 수 있는 프레임워크입니다. 프런트 엔드는 Vue.js를 사용하여 만들고 싶으므로 Electron에 Vue.js가 들어있는 보일러 플레이트 를 사용하여 프로젝트를 ... 가상 통화ElectronVue.jsbitflyerNode.js Electron 앱을 TypeScript 및 React로 작성 node.js (ver12.13.0) electron (ver13.1.8) typescript (ver 4.0.2) 버튼을 클릭하면 카운트 업하는 간단한 electron 앱을 구축 TypeScript로 작성된 앱 코드에서 중단 점을 설정하여 Chromium 내장 디버거에서 중지 할 수 있는지 확인 react developer tools는 react component tree를 Chromium... ElectronReactMacTypeScript Electron+React에서 Hello world Electron의 UI를 React로 만들어 보겠습니다. 다음 단계로 만들어 갑니다. React 앱을 create-react-app로 만듭니다. 만든 React 앱을 Electron으로 불러오기 표시한다. 구그하면 localhost:3000에서 시작한 React 앱을 로드하는 예가 많습니다만, 여기서는 빌드한 것을 로드하기로 합니다. ※환경: Windows 10 Home, Node.js v1... ElectronReact Electron을 움직여보세요 (참고한 Qiita 기사) main.js index.html index.html과 같은 디렉토리에 저장된 이미지 파일 (afoguard.png) Terminal에서 electron 실행 Terminal ( 열린 화면 ) Terminal Cannot compute electron version from installed node modules 오류 발생 다음 해결책을 사용해보십시오. · (참고... MacOSXelectron-builderElectron Electron : ver12의 contextBridge와 ipcRenderer.invoke 본 기사에서는, Electron의 Ver.12 이후로 시큐어에 모듈을 사용할 때에 망설이기 쉬운 「ContextBridge.ipcMainWorld」와 「ipcRenderer.invoke」에 대해 해설합니다! 게다가 구체예에 SlackAPI에 의한 메세지의 송신을 사용하는 것으로, 함께 사용법을 기억해 버리는 혼담입니다! 비프로그래머의 독학&첫 투고가 되기 때문에 아무쪼록 손 부드럽게. 라는 ... Electron자바스크립트초보자Node.js슬랙 【Node.js & Windows10】프로그레스 바 첨부의 토스트 통지를 표시한다 Node.js를 통해 Windows 10 진행률 표시 줄이있는 토스트 디스플레이를 표시합니다. 다음 모듈이 설치되어 있다고 가정합니다. @nodert-win10-rs4/windows.ui.notifications @nodert-win10-rs4/windows.data.xml.dom 이번은 nodert-win10-rs4로 테스트하고 있습니다만, nodert-win10-20h1 등, 다른 버젼에... UWPWindows10ElectronNode.js ESP32의 보안 프로토 타이핑 환경을 만들었습니다 (클라이언트) 독학하고 있는 IoT 시큐리티에 대해서, 집대성의 의미를 담아 현재 이상이라고 생각하는 시큐어인 프로토타이핑 환경을 구축했습니다. 디바이스, 서버, 클라이언트 앱의 요소 기술 공부를 포함하여 비망록으로 분산하여 기록해 갑니다. ,이 프로젝트의 이름을 rainbowtype. 구성은 상기가 되어, 이번은 클라이언트측의 구현을 검토해 보겠습니다. rainbowtype client는 개발자의 Win... ElectronReact보안IoTESP32 Atom 코드 재사용을 위한 최신 버전의 사양 조사 은 플러그인 기구나 키 커스터마이즈 기구 등의 실현을 위해서 Atom의 소스 코드를 일부 유용하고 있다. 새로운 버전을 개발함에 있어서, 전회의 조사로부터 2년 정도 지나므로 다시 조사 사용할 수 있는 곳은 사용해 간다. MIT 그대로. 고맙습니다. 이것 v8 snapshot 만들고 있다··! ! 시작 매우 빠릅니다. 흉내내고 싶다. 스스로 npm install 그러면 node의 버젼이 맞지... ElectronATOM Intellij에서 electron 디버깅 설정 이 기사는 Mac 환경의 Intellij에서 Electron을 디버깅하는 방법을 요약합니다. Electron에는 Main과 Renderer의 두 가지 프로세스가 있지만 둘 다 디버깅 할 수 있습니다. 이번 설정을 한 환경은 다음과 같습니다. node v12.4.0 electron v7.1.3 이번에 사용한 소스 코드는 Run/Debug configuration 에 설정을 작성하면 쉽게 디버깅... IntelliJElectron자바스크립트 Parallels에서 Electron에서 개발 한 앱의 표시가 이상해지는 것을 방지하는 방법 --disable-gpu 옵션을 부여하고 시작하면 잘 작동합니다. .zash 등에 별칭으로 등록하거나 Automator 등으로 스크립트화하면 좋다. Chrome도 VSCode도 하드웨어(GPU) 가속을 OFF로 하는 기능이 있으므로 그것을 OFF로 하는 편이 빠를지도 모릅니다. 2021년 3월 15일 현재, VSCode의 UI 혼란은 아무것도하지 않고 해소되는 것처럼 보입니다 (Paralle... ChromeElectronVSCode vue-cli3 + TypeScript + Electron으로 앱 개발 Vue.js와 TypeScript 및 Electron에서 데스크톱 애플리케이션을 개발할 때 필요한 단계를 잊어 버린 것으로 작성합니다. 프로젝트를 만들기 전에 @vue/cli를 전역 설치합니다. 2.x계를 사용하고 있는 분은 일단 언인스톨하고 나서 인스톨 해 주세요. 현재 디렉토리에 my-app라는 디렉토리가 작성됩니다.my-app 부분을 원하는 이름으로 변경하십시오. 이후는 여기에서 작성한... Electronelectron-builderVue.jsTypeScript NW.js를 사용하여 웹 앱을 데스크톱 앱으로 이식 NW.js는 JavaScript를 사용하여 데스크톱 앱을 만들 수 있는 프레임워크입니다. 처음에는 electron을 검증하고 있었지만, NW.js 쪽이 소스의 은폐가 가능하다는 것으로, 이쪽도 검증해 보기로 했다. 다만 NW.js도 단지 패키지화했을 뿐이라고 간단하게 해석되어 버리는 취지의 기술을 잘 보기 위해, 이쪽은 후일 조사. 다음 구성으로 디렉토리를 만듭니다. package.json이... 패키징ElectronNW.js자바스크립트멀티 플랫폼 [참고] GitHub Actions를 사용하여 Electron multi-platform-build 수행 최근 개인적으로 Electron에서 작은 앱을 만들 기회가 있었지만, 공개할 때 빌드 -> Release의 흐름을 자동화하고 싶었다. 당초 TravisCI 를 사용하고 있었지만, 이 기회에 GitHub Actions 를 사용해 보았으므로 그 때의 메모. 성공하면 태그 이름의 Release (draft)를 만들고 빌드된 아티팩트(e.g., .exe .dmg ) 파일을 만든 Release Ass... ElectronGitHubGitHubActions시Node.js Vue.js로 만든 마크다운 편집기 앱을 Electron으로 데스크톱 앱으로 만들기 이 기사에서는 Electron을 사용하여 데스크톱 응용 프로그램을 만들려고합니다. 이 기사에서는 이전 기사에서 만든 클라이언트를 Electron을 사용하여 데스크톱 앱으로 만듭니다. Vue.js 프로젝트는 2 명령을 실행하기만 하면 Electron화할 수 있습니다. 사전 준비: Vue.js 프로젝트 만들기 의 순서를 따릅니다. 에 액세스 하면 다음과 같은 화면이 표시되는 상태로 합니다. El... ElectronVue.jsMarkdown electron-nuxt를 사용하여 데스크톱 애플리케이션 만들기 Nuxt.js Advent Calendar 2019 의 기사입니다. Nuxt.js에서 조금 떨어져 버립니다만 이번은, 전부터 신경이 쓰이고 있던 electron-nuxt를 사용해 데스크탑 어플리케이션을 만들어 보았던 기사를 쓰려고 생각합니다. 이번 기사에서는 아키텍처의 이야기 등, 세세한 부분에 관해서는 하지 않을 예정이므로 양해 바랍니다. vue가 들어 있지 않은 분은 먼저 vue-cli를... Electronnuxt.jselectron-nuxt electron 앱에서 초기 메뉴를 지우는 방법 웹사이트를 여는 간단한 샘플 앱을 만들고 있고, 초기 메뉴를 지우는 방법을 찾고 있었지만 정답까지의 노이즈가 많아 수고했기 때문에. electron 버전 구구라고 나오는 메소드는 모두 오래된 것 같았습니다. 이하, 효과가 없는 메소드 electron은 흐름이 빠르거나 파괴적인 변경이 많은지는 잘 모르겠지만, 공식 docs가 이치반( )이라고 하는 것은 잘 알았습니다. 메뉴 없이 Google을... Electron MacBook Pro 충전기 정보를 메뉴바에 표시하는 Electron 앱을 만들었다 MacBook Pro에서 사용되는 Type-C의 충전은 조건에 따라 충전 속도가 달라집니다. 예를 들어, 제 경우 RAVPower의 Type-A와 Type-C 모두 사용할 수 있으며 최대 60W까지 공급할 수 있는 충전기를 평상시 사용하고 있습니다. 충전기, 케이블, PD 대응 등, Type-C 관련은 사양이 지나치게 복잡하기 때문에, 연결해 보지 않으면 정직 알 수 없습니다. 충전할 수 있... Node.jsElectron자바스크립트Mac 단지 local 환경에서 json 파일을 만들면 모의 서버(Mockup Server)를 시작할 수 있는 앱을 개발했습니다. 프론트엔드와 백엔드를 동시에 개발하는 경우, 백엔드의 api와 데이터명 등이 맞지 않을 때가 많습니다. 하지만 Mockup Server를 사용하면 Local 환경에서 쉽게 Directory와 Json 파일을 만들고 서버를 시작할 수 있습니다. 작성한 것을 Git로 관리하면 프런트 엔드와 백엔드 개발자가 행복하게 개발할 수 있습니다. Mockup 서버화를 위한 Directory를 작성. 1번부... ElectronReactTypeScriptVue.js자바스크립트 macOS용으로 Electron 어플리케이션의 서명(code signing)·공증(notarization)을 한다 Electron 애플리케이션의 macOS 버전을 배포하는 데는 두 가지 방법이 있습니다. 2)의 방법으로 배포하는 경우, 서명(code signing) 및 공증(notarization)이 필요합니다. 이 기사에서는 실제로 Electron 애플리케이션을 출시한 경험을 바탕으로 필요한 설정에 대해 설명합니다. 내가 개발한 Electron 어플리케이션( )에서는, 다음의 상태·조건으로부터, 릴리스... codesigningElectronelectron-buildernotarizationmacos Electron 7.0.x에서 webContents.printToPDF ()가 promisification되었지만 문서 예제가 고쳐지지 않았습니다. Electron 7.0.x가 출시됨에 따라 즉시 업데이트 해 보았습니다. 한층 더, promisification 가 진행되고 있는 것 같습니다. 또한 promisification 되어, Promise 를 Return 하게 되었습니다. 에 webContents.printToPDF() 의 설명이 있습니다만, 메소드의 설명 그 자체는 갱신되고 있습니다만, 코딩 예가 갱신되고 있지 않습니다. 다음과... Electron자바스크립트 Electron에서 작업하는 동안 사용할 수있는 앱을 만들면 잔상이 남은 이야기 display를 none으로 한 요소의 그림자가 붙은 채로 되어 잔상이 남아 버리고 있었다(Mac만의 증상) 했지만, ↓dislpay:none; 잔상이 남아있다! 이것은 곤란했습니다 (수수께끼) 조사해 보자마자 해결할 수 있었습니다. Window 객체의 hasShadow라는 속성이 기본적으로 true로 설정되어 잔상이 나타납니다. false로 설정하면 잔상이 사라집니다. 했어. 조사해 보면,... Electron자바스크립트MacNode.jsHTML5 React + Electron으로 스크래핑하기 일본어 자료 밖에 조사하고 있지 않지만, 외부 사이트로의 스크래핑을 하기 위해서 필요한 HTTP 리퀘스트의 코드가 찾아내지 않았기 때문에, 써 보았습니다. js 초보자도 있고 소스 코드가 더럽습니다. 원하는대로 변경하십시오. 프로젝트의 구성은 다음과 같습니다. src 디렉토리에 util.js를 배치하십시오. 모듈 내용 src/main.js public/index.html usage.js... Electron스크래핑React Electron 앱을 windows10기로 디지털 사이니지할 때 하는 것이 좋다 또한 알림 등도 표시되지 않도록 설정해야 합니다. 응용 프로그램은 전체 화면을 표시하고 일반 사용자는 화면 터치로 조작합니다 전시하는 머신은 windows10 Pro 전시기는 windows10 Pro를 사용한다. Windows10 Home에서는 설정할 수 없는 항목이 있다 여기에서는 Windows 10 Pro 1903에 대해 설명합니다. 버전이 변경되면 항목 이름과 설정 위치가 변경될 수 있... Electron전시회디지털 사이니지Windows10 Electron으로 만든 화면의 자동 조작 Electron을 사용하면 node.js를 사용하여 멀티 플랫폼 화면을 만들 수 있습니다. 이번에는 이 Electron으로 작성된 화면의 자동 조작에 대해 생각해 봅시다. 다음과 유사한 파일을 만듭니다. package.json app.js index.html index.js 이러한 파일을 패키징합니다. 다음 페이지를 참고하십시오. Electron: 앱 실행 및 exe 만들기 작성된 Exe는 ... Electron파이썬셀레늄Node.jsUiPath 다시 한번 블록 체인을 사용하여 뭔가 할 수 없는지 생각해 보았습니다. 되돌아보면 요즘보다 실장력은 엄청 오른 것 같은 생각이 든다.) Ethereum 사용하면 마이닝 필수가 되므로, 아무래도 사내 툴이라든가 프라이빗 체인에 사용하면 「계정 만들어 주면 우선 100년분 토큰 배부해 두면 좋을까」 같은 적당한 운용이 되는 것이 키모이고, 이후 KVS 이상의 용도가 떠오르지 않았던 것도 있고. 그리고 상당한 시간이 지난 곳에서 우연히 HyperLedger로 포인트제... ElectronHyperledger-fabric스마트 계약 .NET Core 3.0의 Blazor + Electron으로 GUI 앱 개발 ※본 기사는 에 쓴 것의 야키와와시입니다. 을 사용하여 .NET Core 3.0의 Blazor를 Electron에서 실행하려고했습니다. 이번 환경은 이쪽 .NET Core 3.0.100 Nodejs 12.10.0 ElectronNET.API 5.22.14 ElectronNET.CLI 5.22.14 다음 명령으로 Blazor 프로젝트를 만듭니다. 프로젝트에 ElectronNET.API 의 Pa... Electron.NETCoreBlazor 【오류 대처】Electron에서 렌더러 프로세스 require를 할 수 없다 를 참고로, 우선 써 흉내 드리면서 쓰는 방법을 공부하고 있었습니다. 그러나 "앱처럼" index.js 그런데 const electron을로드하지 못했습니다. Electron의 메인 프로세스 측면에서 main.js nodeIntegration 속성을 true로 설정하면 제대로 HTML로 읽은 index.js에서 require 할 수있었습니다. 잘 작동하지 않는 이유는 Electron의 메커니... Electron자바스크립트Node.js 편리한 TweetDeck 뷰어를 만들어 보았습니다. 작업 중도 TweetDeck보고 싶지요? 나는 보고 싶다. 그래서 작업을 방해하지 않고 TweetDeck을 보는 Viewer를 만들어 보았습니다. 본체는 에 둡니다. 짹짹 TweetDeck를 항상 맨 앞에 표시하는 앱입니다. (주의) 현재는 macOS 만 지원합니다. 쉬운 소개 미니 사이즈 창 프레임리스 항상 맨 앞면 표시 표시 붕괴 없이 스케일링 가능 일반 TweetDeck과 같은 사용감 ... Electrontweetdeck 이전 기사 보기