문서 보기문서 편집수정 내역 Electron(프레임워크) (덤프버전으로 되돌리기) ||<-2><table width=350><table align=right><table bordercolor=#2f3241><colbgcolor=#2f3241><colcolor=#9FEAF9><table bgcolor=#fff,#191919> {{{+1 '''일렉트론'''}}}[br]Electron || ||<-2><height=80> [[파일:Electron(프레임워크) 로고.svg|width=90%]] || || '''종류''' ||[[GUI]] [[프레임워크]] || || '''라이선스''' ||[[MIT 라이선스]] || || '''개발''' ||[[GitHub]][br]OpenJS Foundation[br][[https://github.com/zcbenz|Cheng Zhao]] 및 Electron 기여자들 || || '''버전''' ||25.4.0 (2023년 8월 2일)|| ||<-2><bgcolor=#fff,#191919><color=#373a3c,#dddddd> [[https://www.electronjs.org|[[파일:홈페이지 아이콘.svg|width=24]]]] | [include(틀:GitHub 로고,링크=electron,크기=24)] | [include(틀:트위터 로고,링크=electronjs,크기=24)] || [목차] [clearfix] == 개요 == OpenJS Foundation에서 개발, [[GitHub]]에서 유지보수하고 있는 앱 프레임워크이다. 이름의 유래는 바로 그 [[전자]]이다.[* 참고로 전자의 영문 이름 [[일렉트론|electron]]은 고전 그리스어로 [[호박(보석)|호박]]을 뜻하는 'ἤλεκτρον'로부터 파생되었다. [[전자|해당 문서]]에서 그 기원을 살필 수 있다.] 후술하듯이, Electron은 원래 [[Atom(에디터)|Atom]]을 위한 platform이었던 Atom shell이 발전한 것으로[[https://www.electronjs.org/blog/electron|#]], atom shell, 즉 [[전자껍질|원자 껍질]]이 무엇으로 이루어져 있는지 생각해 보면 적절한 이름이 붙은 셈이다. [[The Chromium Projects|크로뮴]]과 [[Node.js]]에 기초하여, [[HTML]], [[CSS]], [[JavaScript]]를 이용하여 웹 앱을 제작하듯 데스크톱용 앱을 제작할 수 있다. 덕분에 반대로 웹 버전을 데스크톱 버전과 거의 동일하게 만드는 것도 용이하다. [[Discord]] 웹 버전이 대표적인 예시. 개발자와 사용자로부터 찬사와 증오를 동시에 받는 프레임워크이다. 옹호하는 측에서는 데스크톱 어플리케이션 개발을 쉽고 빠르게 할 수 있다는 점과 크로스플랫폼 지원을 거의 공짜에 가깝게 할 수 있다는 점을 내세우며 비판하는 쪽에서는 높은 자원 사용량을 거론한다. 높은 자원 사용량은 일렉트론이 기반하고 있는 [[The Chromium Projects|크로뮴]]의 단점과 상통하는 부분인데, 일반적으로 일렉트론으로 만들어진 앱들은 각자 다른 버전의 일렉트론을 사용하기 때문에 각각의 앱들이 크로뮴 엔진을 따로 구동하는 형태로 구성되는 경우가 많고 이는 더더욱 높은 메모리 사용량으로 이어진다. 그 외에 백엔드 구동에 사용되는 [[Node.js]] 런타임의 메모리 사용량도 무시할 수 없는 수준이다. Windows의 경우 7 이상에서만 사용 가능하다. 한때 Node.js 6.1.0, 크로뮴 50.0 기반으로 XP용으로 포팅된 버전이 있었으나 언제부터인가 깃허브에서 내려갔다. == 개발 비화 == --[[http://cheng.guru/blog/2016/05/13/from-node-webkit-to-electron-1-0.html|원문]]--(삭제됨) [[https://web.archive.org/web/20180413035206/http://cheng.guru/blog/2016/05/13/from-node-webkit-to-electron-1-0.html|아카이브]] [[https://web.archive.org/web/20180309093817/http://blog.hazard.kr/archives/696|번역본 아카이브]] 원 개발자인 Cheng Zhao는 당시 [[인텔]] 주도 하에 개발된 [[Node.js]] 기반의 크로뮴 프레임워크인 node-webkit(현 [[https://github.com/nwjs/nw.js|nw.js]]) 개발에 참여하게 된다.[* nw.js 와 Electron 모두 중국인 손에 태어난 프로젝트이다.] 인턴 시절의 개발자에게는 많은 관심이 있던 프로젝트였기에 많은 개선과 기여, 그리고 홍보까지 열심히 하였으나, 조직에서 인정받지 못하였다. 때마침 [[GitHub]]에서 유사한 프로젝트 개발자를 채용해서 여기에 지원하였고, 이 node-webkit를 포크 및 재구성하여 완전히 독립된 하나의 프레임워크로 탄생시켰다. 이게 바로 Atom Shell의 시작이다. 이후 2016년 5월 11일 에디터 [[Atom(에디터)|Atom]]과 함께 Atom Shell도 오픈소스화되면서 Electron으로 이름이 변경되었으며 2019년 12월 이후로는 관리 주체가 [[GitHub]]에서 OpenJS Foundation으로 변경되었다.[[https://www.electronjs.org/blog/electron-joins-openjsf/|#]] == Electron을 사용하는 소프트웨어 == ## 오름차순으로 정렬, 자주 쓰이는 대표적인 앱들은 볼드로 표시. * [[http://1clipboard.io/|1Clipboard]] * [[1Password]] * '''[[Atom(에디터)|Atom]]''' - Electron(구 Atom shell)이 이 에디터를 개발하기 위해 시작된 프로젝트이다. 현재는 개발이 중단되었다. * [[https://avocode.com/|Avocode]] * [[https://www.axosoft.com/|Axosoft]] * [[https://basecamp.com/|Basecamp 3]] * [[https://beakerbrowser.com/|Beaker Browser]] * [[Bitwarden]] * [[https://getbrandy.io/|Brandy]] * [[https://www.cacher.io/|Cacher]] * [[https://sindresorhus.com/caprine/|Caprine]] * [[https://caret.io/|Caret]] * [[https://cashnotify.com/|CashNotify]] * [[https://catlight.io/|Catlight]] * [[https://cleavr.io/|Cleavr]] * [[https://www.cocos.com/|CoCos]] * [[https://www.crashplan.com/en-us/|CrashPlan]] * ~~[[https://crypto.cat/|CryptoCat]]~~(개발 중단) * [[https://gillesdemey.github.io/Cumulus/|Cumulus]] * [[Discord]] PC 앱 * [[https://dynobase.dev/|Dynobase]] * [[https://www.balena.io/etcher/|Etcher]] * [[Evernote]] * [[https://www.exodus.com/|Exodus]] * [[엔트리(교육 플랫폼)|엔트리]][* 처음에 node-webkit 로 제작하였으나 얼마 안 돼 Electron 으로 전환. ] * [[https://www.fatpick.com/|Fatpick]] * [[https://getfenet.re/|Fenetre]] * [[피그마(프로그램)|Figma]] * [[https://freeter.io/|Freeter]] * [[https://freetubeapp.io/|FreeTube]] * [[GitHub]] [[https://desktop.github.com/|Desktop]] * [[https://www.gitify.io/|Gitify]] * [[https://www.gitkraken.com/|GitKraken]] * [[https://hackolade.com/|Hackolade]] * [[Hyper]] * [[https://www.inkdrop.app/|Inkdrop]] * [[https://joplinapp.org/|Joplin]] * [[https://getkap.co/|Kap]] * [[https://keybase.io/|Keybase]] * [[https://lbry.com/|LBRY]] * [[http://lighttable.com/|LightTable IDE]] * [[https://getlotus.app/|Lotus]] * [[https://www.mapbox.com/mapbox-studio/|Mapbox]] * [[https://mattermost.com/|Mattermost]] * [[https://getmedis.com/|Medis]] * [[Messenger|Facebook Messenger]] PC 앱 * [[Microsoft Teams]] * [[https://minbrowser.org/|Min Browser]] * [[https://mingo.io/|Mingo]] * [[https://mockitt.wondershare.com/mockingbot-is-upgraded-to-mockitt.html|Mockitt]] * [[https://mockoon.com/|Mockoon]] * [[MongoDB]][[https://www.mongodb.com/products/compass|Compass]] * [[https://datensen.com/|Moon Modeler]] * [[https://nota.md/|Nota]] * [[Notion]] * [[Obsidian(앱)|Obsidian]] * [[https://pingendo.com/|Pingendo]] * [[https://www.postman.com/|Postman]] * [[https://prepros.io/|Prepros]] * [[Proton#s-3.1|Proton Mail]] - [[https://proton.me/blog/2022-roadmap|데스크톱 앱 개발 중]] * [[https://quasar.dev/|Quasar]]: [[Vue.js]] 기반 프레임워크로, 데스크톱 빌드가 내부적으로는 일렉트론을 사용하도록 나온다. * [[https://rememberapp.co.kr/home|리멤버]] * [[https://screensquid.com/|ScreenSquid]] * [[https://tryshift.com/|Shift]] * [[https://signal.org/|Signal]] * [[https://simplenote.com/|SimpleNote]] * [[Skype]] * [[Slack]] * [[https://github.com/zz85/space-radar|Space Radar]] * [[https://www.spreaker.com/|Spreaker]] * [[https://www.stremio.com/|Stremio]] * [[https://symphony.com/|Symphony]] * [[https://tabby.sh/|Tabby]] - 확장 가능한 일렉트론 터미널 에뮬레이터라는 점에서 Hyper와 비슷하다. * [[https://www.taskade.com/|Taskade]] * [[https://tidal.com/|Tidal]] * ~~[[Twitch]] PC 앱~~(서비스 종료) * [[https://www.typetalk.com/|TypeTalk]] * [[Typora]] * [[리디]] PC 앱 * KBS 콩[* 2017년 후반부 이후 버전만 해당한다. 그 이전에는 [[MFC]]로 제작되었다.] * [[http://pad.haroopress.com/|Haroopad]][* 한국인 개발자가 만든 마크다운 편집기. 처음에 node-webkit 로 제작하였으나 얼마 안 돼 Electron 으로 전환.] * [[Vampire Survivors]] * '''[[Visual Studio Code]]''' * ~~[[https://sync.wantedly.com/|Wantedly Chat]]~~(서비스 종료) * [[WhatsApp]] * [[https://webtorrent.io/|WebTorrent]] * [[https://wexond.net/|Wexond Browser]] * [[https://wire.com|Wire]] * [[WordPress]] [[https://apps.wordpress.com/desktop/|데스크톱 앱]] * [[Microsoft Yammer|Yammer]] == 유사 프로젝트 및 소프트웨어 == === NW.js === [[https://github.com/nwjs/nw.js|nw.js]] 당시 전신이었던 프로젝트. Electron 메인 개발자도 참여한 이력이 있었고, ~~한국을 제외하고~~Electron 이전에 웹 기술을 데스크탑 앱으로 이식 가능하기에 주목받았던 프로젝트였으며, 초기 시절 프로젝트명은 node-webkit 였다. [[인텔]] 주도로 시작되었으나 현재는 독립되었다. Electron과는 차별화된 특징으로, Javascript 및 node.js 위주의 개발자가 아닌 주로 웹 게임 등의 다른 분야 개발자 기준으로 접근성이 좋은 편이어서[* 기술적으로 설명하자면, Electron 은 백엔드와 프론트엔드 레이어가 분리되어 있으나, nw.js 는 분리하지 않았다.] 주로 node.js 가 터치하지 않는 프론트엔드 위주의 앱으로 쓰이고 있다. 가장 대표적인 사용 케이스로 [[RPG Maker MV]] 의 웹 게임 프론트엔드가 이걸 기반으로 되어 있으며, 그밖에 환경에서도 웹 게임을 앱으로 이식할 때 두루두루 쓰이고 있다. 한때 몇몇 [[랜섬웨어]]에서 프론트엔드 앱을 이걸로 사용하는 바람에 몇몇 백신에서 걸러지기도 하여 랜섬웨어 프레임워크로 [[https://www.computerworld.com/article/3018972/ransom32-first-of-its-kind-javascript-based-ransomware-spotted-in-the-wild.html|오명을 받기도 하였다]]. 최근 인텔 사의 독립 이후, Electron 개발자인 Chang Zhao가 과거 인텔 인턴 시절에 기여하고 현재에도 기여하고 있어서 기여자 목록에 메인 개발자 다음으로 포함되었다. Electron을 사용하는 국내 개발자 커뮤니티 중 일각에서는 종료된 라이브러리, 사장된 라이브러리라고 주장하는데, '''지금도 Electron 다음으로 업데이트와 커뮤니티가 많이 활성화되고 있는 프로젝트'''이며, [[Node.js]] 위주가 아닌 단순 프론트엔드 및 웹 게임 등의 개발자 층에서 Electron 대비 쉬운 접근성을 이유로 많이 사용하고 있는 프로젝트이다. ~~한국에서만 사장된 프로젝트.~~ === --brackets-shell-- === [[https://github.com/adobe/brackets-shell|brackets-shell]] [[Adobe]] 주도의 [[Brackets]] 프로그램 백엔드 프레임워크였으나 2021년 9월 앱과 같이 종료되었다. [include(틀:상세 내용, 문서명=Brackets)] === 기타 === * ~~[[http://appjs.com/|AppJS]]~~: node-webkit 초기 시절 같이 태어난 프로젝트였으나 개인 프로젝트란 특성의 한계로 node-webkit 사용을 권장하면서 프로젝트가 중단되었다. * [[http://www.ultralig.ht/|Ultralight]](구 Awesomium): 크로뮴 웹 브라우저를 앱 내에 쉽게 탑재하도록 해주는 상용 개발 도구이며 다양한 프로그램 API를 사용하는 앱 프레임워크. [[NC소프트]] 등의 게임사에서 게임 내 브라우저 용도로 활용 중이며, 구 Awesomium 시절 유료로만 운영했으나 현재 인디 개발사 및 개인에게 무료 제공. * [[https://sciter.com/|Sciter]]: 위 nw.js와 같이 역사가 꽤 된 네이티브 방식의 독점 형식 상용 개발 도구. [[삼성]] 등의 하드웨어 업체의 관리 프로그램 및 [[어베스트]]사 등의 백신 프로그램에서 사용하고 있다. 아래 프로젝트를 제외하고 네이티브 바인딩이 직접 지원되는 제품인 데다가 브라우저 엔진까지 자체적으로 개발하여 제공하는 유일한 상용 제품이다. * [[https://tauri.studio/|Tauri]]: [[Rust(프로그래밍 언어)|Rust]]를 백엔드로 둔 상태이며, 나머지는 일렉트론과 굉장히 유사하다. 크로뮴이 아닌 각 OS에 포함된 시스템 웹뷰 (리눅스의 경우 webkitgtk) 를 사용하며 Rust로 백엔드를 작성하기 때문에 일렉트론의 고질적인 메모리 사용량과 관련된 문제들을 해결할 것으로 주목받는 프레임워크이다. --여담으로 자체 웹뷰 이름이 [[WRY]]다 [[https://github.com/tauri-apps/wry|공식 저장소]]에도 [[로드롤러다!|로드롤러]]가 있는 걸 볼 때 노린 거다-- == 여담 == 상기 모 프로젝트였던 nw.js가 악성 코드로 오해받은 역사가 Electron 에서도 반복되었다. [[마이크로소프트 디펜더]]가 [[https://www.bleepingcomputer.com/news/microsoft/microsoft-defender-falsely-detects-win32-hivezy-in-google-chrome-electron-apps/|Electron 기반 앱을 악성 코드로 오진하는 사태(영문 기사)]]이 있었으며 마이크로소프트의 발빠른 업데이트로 소동은 금방 일단락되었다. [[https://blog.ssogari.dev/13|한국어 요약 글]] [각주] [include(틀:문서 가져옴, title=The Chromium Projects, version=411)] [[분류:GitHub]][[분류:프레임워크]]캡챠되돌리기