Electron+ReactなサンプルアプリをES6で作成する - Qiita
JavascriptはES6以前、ES6(ECMAScript2015)で書き方が違うので、Electronを紹介するサイトによって結構差異があります。サーバーサイドばかりでこのあたり詳しくなく、どっちが新しいの？と混乱しながらサンプルを作っていました。。。 また、Reactも頻繁に新しい機能が追加されるので、ReactDOMを使わずに書いてる古い形式も混在してたりカオスな状態です。なので現時点(2015/02/24)で、調べた限りで新しいスタイルで記述してみました フロントエンド技術に詳しくないため、間違った記述等あればプルリク・コメントお待ちしています！ リポジトリ : https://github.com/kegamin/electron_test アプリの機能 HelloWorld的な機能のみです. Reactを使った画面表示 ボタンクリックを認識して、コンソールログにクリックカウ
Electronでよく使いそうなネタの覚え書き - Qiita
win = new BrowserWindow({ webPreferences: { nodeIntegration: false, } }); というか、zepto.jsのような互換ライブラリを使った方が楽。 複数インスタンス起動を禁止する app.makeSingleInstanceでできる。 リンクをデフォルトブラウザで開く webContents.new-windowイベントを引っかけてURLを取得し、shell.openExternal()で開く
ElectronでOS固有のファイルパスを得る app.getPath()の出力まとめ - Qiita
ドキュメントにはふわっとしか載っていなかったのでここにまとめます。 https://github.com/atom/electron/blob/master/docs/api/app.md#appgetpathname Electron v0.34.3 Windows console.log(app.getPath('home')); // -> C:\Users\【ユーザー名】 console.log(app.getPath('appData')); // -> C:\Users\【ユーザー名】\AppData\Roaming console.log(app.getPath('userData')); // -> C:\Users\【ユーザー名】\AppData\Roaming\【パッケージ名】 console.log(app.getPath('temp')); // -> C:\Use
Electron 開発で得た知見まとめ - Qiita
はじめに Electron + Riot + Redux でアプリケーションを作って得た知見まとめです。 制作物は Twitter の収録再生プレイヤー。 録画や録音しておいた Twitter 連動番組などを再生する際、放送当時のツイートをリアルタイムっぽく表示させる品です。 midnightSuyama/tweet-rec 実装 electron atom/electron Twitter の収録はウインドウ有無に依存しないよう main プロセスで行い、renderer プロセスでは表示に専念する方針とした。 ウインドウを閉じても常駐するタイプのアプリケーション。 ウインドウの表示 BrowserWindow を使用。 ウインドウサイズについて、大概の場合はコンテンツ領域を基準に考えるはずなので useContentSize は忘れずに。 ウインドウを閉じた際には解放しておきたいので
electron で webpack とか使ってアプリ作った - Qiita
electron の clipboard API 使ってクリップボードを監視するアプリ作りました クリップボード監視先輩 zaftzaft/cbsnpi 使ったもの ビルドツールには webpack タスクランナーは gulp プリプロセッサ類は CoffeeScript, Jade, Stylus それらに Vue.js を加えてモダンな感じにしました。 ディレクトリ構成 src/ プリプロセッサ系 coffee/ jade/ stylus/ dist/ ファイルの出力先 build/ 中間ファイル置き場 dist/ release/ 最終的な生成物 v0.0.1/ release ディレクトリは、win32-x64.zip など配布物の出力先に使用します 一応バージョンごとに切っておきます 全体の流れ インストール electron の動作環境を作る http://electron.a
Electron + React + Redux でボイラープレート作ってみた - Qiita
先日、React+Redux入門 - Qiita という記事を書きました。さて、React+Reduxと同じように流行っているイケているフレームワークと言えば、Electronですよね。Electron + React + Reduxのボイラープレートを作ってみましたので、今日はその解説をいたします。 erukiti/tpl-electron-react-redux: Electron + React + Redux のボイラープレート 内容 Visual Studio Codeでなるべくいい感じに開発出来るように目指したもので、内容としては単純なカウントアップのサンプルコードになっています。Electronの弱点である配布ファイルがでかくなりすぎる問題の対応のためファイル結合をwebpackで行っています。webpackではSassやJSONなど様々なファイルを結合することができます。
ぼくのかんがえたさいきょうのElectron - Qiita
はじめに ElectronはNode.js + HTML5フロントエンドのいいとこ取りな開発が行えるのが特徴です。その分、開発環境もElectronならではの考慮・工夫が必要になります. 今回のエントリでは, Electronアプリを快適に開発するための開発環境Tipsを書いていきます. そもそも「Elecronってなんぞや？」とか「どういう風にアプリを作るの？」という方については, 手前味噌で恐縮ではありますが, Electronでアプリケーションを作ってみよう を目を通すことをオススメします. また, 今回のエントリの元として、Quramy/electron-jsx-babel-boilerplate のレポジトリが出来上がっています. React + Bable + Sass + Livereload + Platform用Packaging 入りのBoilerplateですので,
Electron + Travis で楽々ビルド・リリースする最強のデスクトップアプリ開発 - Qiita
この記事は古いです。 ぼくが考えた最強のデスクトップアプリ開発環境 Web技術でデスクトップアプリ書いて push するだけの環境を作る。 主に利用するのは Electron + Travis + GitHub の3つ。 Electron でデスクトップアプリ書いて、push するだけでビルドしてリリースまで完結するデスクトップアプリ開発ができる。 もっと簡単に言うと 「ローカルで開発→push」 だけで GitHub Release に自動でリリースできる。 アプリのビルド自体もTravis内で行えるため、開発環境のOSに依存しない開発が可能。 以下は OS X 環境を前提として説明するが、クロスプラットフォームのためのビルドはTravis内で行うため OS は何でも良い。 念のため各種サービス・フレームワークの説明 簡単に説明すると以下。どれもすごく便利。 Electron: みんな大
Electronアプリのクロスプラットフォームなメニュー設計 - Qiita
Electronでアプリを作っていると、意外なところでネイティブ的な挙動をさせるために工夫しなければいけないポイントがあります。この記事ではマルチウインドウなアプリで自然なメニューを実現するための設計方法について、代表的なElectronアプリであるAtomの実装を例に説明したいと思います。 実際の設計を見て行く前に、考慮すべきElectron特有の仕様や制約について見ていきます。 Electronに関する前提知識 Menuクラスの基本的な使い方 Electronではプラットフォームをまたいでメニュー機能を実現するために、Menuというクラスが提供されています。 ElectronはOS X, Windows, Linuxをサポートしていますが(参考: Supported Platforms)、 OS XだけはWindows, Linuxとメニューの考え方が異なります。Windows, Li
npm install -g electron はしない方が良いのではないか、という話 - Qiita
Electron の入門記事で $ npm install -g electron する手順が載っていますが、複数プロジェクトに関わる可能性がある場合は、この手順を実行しない方が良いと思われます。これは、使用している electron のバージョンの違いから、余計なトラブルを招く可能性があるからです。 もちろん、入門記事では、話を単純にするためにこのように説明している可能性が高いのですが。 例えば、古い electron を使用して開発されているプロジェクトは $ electron . で起動できない場合があります。 そのような場合でも package.json の "devDependencies" に electron-prebuilt が指定されていれば、$ ./node_modules/.bin/electron . で起動する場合があります。 あるいは、$ npm start で
Electronのカレンダー | Advent Calendar 2015 - Qiita
URLYou can post either your article on Qiita or your blog post. About reserved postingIf you register a secret article by the day before the same day, it will be automatically published around 7:00 on the same day. About posting periodOnly articles submitted after November 1 of the year can be registered. (Secret articles can be registered anytime articles are posted.)
Electron App の作り方
#html5jplat で発表したElectorn App の話です。
Photon kitを使ってネイティブっぽい綺麗なUIを試した - Qiita
Electronを使って簡単にデスクトップアプリを作成できるようになったのはいいんですが デスクトップアプリのUIが劣化してしまうのはユーザーとしてはきっと辛いはず そこでPhotonKit(以降はPhoton)ならOSXのネイティブっぽいUIを提供してくれます。 OSXユーザーなら親しみやすくWindowsユーザーも「あっiTunesっぽい」と思ってくれるのではないかなと思います。 ダウンロード PhotonのGetting startedの右側にあるDownloadからzipをダウンロードします ダウンロードしたPhotonのフォルダー構成は以下のようになっています。(v0.1.2の時点では) photon/ ├── css/ │ ├── photon.css │ ├── photon.min.css ├── fonts/ │ ├── photon-entypo.eot │ ├── p
Electron入門 (全20回) - プログラミングならドットインストール
JavaScript/HTML5でデスクトップアプリを作ることができるElectronについて基本的な使い方を見ていきます。
Electronで作るはじめてのGUIアプリ PDF差分比較アプリを作ってみた // Speaker Deck
づや会vol.4の登壇資料です。GraphicsMagickを利用したElectronによるGUIアプリを作ってみました。 ブログで更に詳しい情報を掲載しています: Web制作者視点で理解するソフトウェアテスト | デザインとWeb開発とその他諸々。 MEDIA-MASSAGE http://media-massage.net/works/docs/learning_software_test_from_web_production_side/ このスライドのライセンス: CreativeCommons Attribution-NonCommercial 4.0 International http://creativecommons.org/licenses/by-nc/4.0/
Electron 周りの個人的ブックマーク等整理 - Qiita
テキストエディタ Atom や Visual Studio Codeで採用されている Electron に関するブックマークを整理していきます。 Upstreams Electron - Build cross platform desktop apps with JavaScript, HTML, and CSS. Node.js 日本のユーザーグループ Node.js 日本ユーザグループ セキュリティ関係 Security, Native Capabilities, and Your Responsibility | Electron Electronの倒し方 Electronのセキュリティその後 Electronのセキュリティは難しい？ — Mobage Developers Blog Node.js のバージョン切替 marcelklehr/nodist: Natural node
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
https://github.com/yujakudo/glasspot/blob/v_0.1.2/docs/ja/dev/securityChecklist.md
[PDF] Electronの倒し方
Electron を試す 7 - Electron v1.0 対応 - アカベコマイリ
electron/docs/api/browser-window.md at main · electron/electron
