일렉트론(Electron) 소개 및 사용법

By우 푸

tistory-image

일렉트론(Electron)은 Node.js를 기반으로 javascript, html, css를 사용하여 데스크탑 애플리케이션을 만드는 플랫폼입니다.
이것은 GitHub에서 모던 에디터인 Atom 에디터를 만들면서 공개한 오픈소스입니다.

웹개발자의 입장에서 보면 데스크탑 APP을 개발하는데 있어서 진입장벽이 낮을 뿐만아니라 크로스플렛폼까지 지원하여 윈도우즈, Mac OS X, 리눅스 등 다양한 OS에서 동일하게 사용할수 있는 장점이 있어서 인기가 많습니다.

일렉트론(Electron)은 간단하게 생각하면 웹브라우저 안에 Node.js를 포함시킨 것이라고 보시면 됩니다. 그래서 웹브라우저로 화면을 표시하고 Node.js로 OS의 파일시스템 등에 접근하여 작업을 수행 할 수 있게 되는 것입니다.

Atom 에디터나 VS Code를 써보면 알겠지만 상당히 완성도가 높은 것을 알 수 있습니다. 일렉트론(Electron)으로 개발한 APP은 이것 말고도 GitHub Desktop,Slack, WordPress 등 다양한 종류가 있으며 일렉트론(Electron) 홈페이지에서 더 확인을 할 수 있습니다.

좀 더 자세한 내용은 일렉트론(Electron) 홈페이지 에서 확인하세요.

Similar Posts

  • win10에서 hosts파일 수정하기

    By우 푸

    개발을 하다보면 임의로 hosts파일을 변경해야 하는 경우가 있습니다. 이럴경우 Windows 7 버전 이하는 관리자 권환으로 쉽게 수정이 가능한데 windows10버전에서는 관리자권한으로 작업을 한다고 해도 쉽게 수정이 되지 않습니다. 더욱이나 64비트인경우는 그냥 수정이 되지 않습니다. === 이럴경우 아래와 같이 수정하시면 수정이 가능합니다. 안전모드 부팅 hosts파일을 관리자권한으로 수정 재부팅 완료 그럼 좀더 자세히 작성을 해보도록 하겠습니다. 안전모드 부팅 […]

  • HTML5 태그의 블록 요소와 인라인 요소

    By우 푸

    HTML의 태그는 크게 블록 요소(block element)와 인라인 요소(inline element)로 나누어 집니다. 이 부분을 명확히 이해하고 있어야 CSS를 사용하는데 어려움이 없습니다. 이 각각의 요소에 적용되는 CSS가 별도로 존재하기 때문에 CSS를 적용해 놓고도 “왜 적용이 되지 않지?” 라는 상황이 발생할 수 있습니다. 예를들면…. 인라인 요소는 height가 적용되지 않는다. 인라인 요소는 width가 적용되지 않는다. 블록 요소는 vertical-align 이 […]

  • 스마트폰으로 시놀로지 OpenVPN 서버 접속하기

    By우 푸

    스마트폰으로 시놀로지 VPN 서버에 접속하는 방법은 이전에 포스팅을 헀으니 참고하세요. 스마트폰으로 시놀로지 VPN 서버에 접속하기 이번에는 OpenVPN으로 접속하는 방법입니다. 이전 포스팅에 시놀로지에 OpenVPN 서버를 설정하는 방법도 포스팅을 했으니 참고하세요. 시놀로지 VPN 서버와 VPN PLUS은 무엇이 다른것인가 스마트폰으로 시놀로지 OpenVPN 추가하기 OpenVPN은 오픈소스라 무료로 사용할 수 있고 현재 많은 VPN 업체에서도 사용하고있는프로토콜입니다. 비교적 안전하고 속도도 괜찮은 […]

  • 두개의 텍스트, 이미지, PDF, 엑셀, 폴더를 비교할 수 있는 Diffchecker 웹서비스

    By우 푸

    두개의 텍스트나 이미지, PDF, 엑셀, 폴더를 비교할 수 있는 웹서비스를 소개합니다. 간단한 비교는 무료로 이용할 수 있어서 갑자기 필요할 경우 요긴하게 사용할 수 있습니다. https://www.diffchecker.com 텍스트 비교 Original Text에 원본 텍스트를 넣고 Changed Text에 변경된 텍스트를 넣은 후 Find Difference 버튼을 클릭하면 2개의 문서를 비교해 줍니다. 2개의 문서 중 다른 부분을 표시해서 보여줍니다. 이미지 비교 […]

  • 내가 방문한 비밀스러운 기록을 제거하는 방법 (feat. 윈도우10)

    By우 푸

    나를 잘 알고 내가 원하는 것을 미리 제공해 준다는 것은 매우 편리한 기능임에는 분명합니다. 하지만 그 이 면에는 내 정보를 그만큼 많이 가져가서 분석 했다라고 할 수도 있습니다. 그리고 불안한건 이 걸 어디에 어떻게 사용하는지는 우리가 모른다는데 있습니다. 이런한 편리한 기능이 때로는 우리를 압박하는 불필요한 기능이 될 수 있습니다. 내가 컴퓨터로 사용한 폴더와 파일이 무엇인지 […]

  • Angular의 개요

    By우 푸

    Angular에 대한 세부적인 포스팅을 하기 전에 먼저 간단하게 개요를 정리 합니다. Angular란? 구글에서 만든 open-souce web application SPA(Single Page Application) 개발이 가능 다양한 플랫폼에 맞게 개발 가능 유지보수, 개발 속도 향상 (데이터 바인딩, 템플릿 등의 문법 제공 ) 아키텍쳐 Angular의 구성요소 Angular2를 구성하는 요소는 크게 4가지 입니다. 컴포넌트 (Component) 모듈 (Module) 서비스 (Service) 지시자 (Directive) […]

답글 남기기

이메일 주소는 공개되지 않습니다. 필수 필드는 *로 표시됩니다