Electron製動画再生プレイヤー「DMM Player v2」 - DMM inside｜DMM inside
Electronによるアプリケーション開発事情2018 / builderscon2018 - Speaker Deck
builderscon tokyo 2018『Electronによるアプリケーション開発事情2018』
electronでリリース用パッケージを作る - PartyIX
先日書いたとおり，electronでMastodonクライアントを作ったのだが，パッケージ化に関してかなり迷走したので，最近のelectron事情を書いておく． electronに関しては，「ほら，こうしたら簡単に作れるでしょ？」といういわゆるHello World系の記事が非常に多く，細かい困りごとやリリースに必要な情報はあまり出てこない． また，2015年くらいの，electronが流行り始めた時期の記事は結構あるものの，最近はそこまで記事が多くないこともあり，最近のリリース事情がよくわからなかった． アイコンを作る アイコンは，どのようなビルド手段を使うにしてもおそらく同じセットが必要になる． これに関してはあまり変更されておらず，古い記事でもかなり役に立った． とりあえず大本となるpng画像かなにかを手元に用意しておく． Mac icnsファイルを用意し，それをelectron-b
Electronの複数ウィンドウ間で共通のVuex Storeを扱う - Qiita
"dependencies": { "electron": "1.4.15", "vue": "2.1.10", "vuex": "2.1.2" } 複数のBrowserWindowを持ったアプリケーション Electronで複数のBrowserWindowが連携するアプリケーションを作る場合、メインプロセスを中継してお互いにデータをやりとりする場面が多々存在する。 しかし正直言ってWebアプリケーションと同じノリで書きたい身としては、中継部分を細かく管理するのは避けたい。そのため、処理を一度書くだけでなんとかなる構造を以下二種類紹介する。 1. メインプロセスを汎用的な中継として扱う メインプロセスを何も考えないDispatcherとして考える。 それぞれのRendererをコンポーネントとして扱い、ipcMainとipcRendererでメインプロセスに渡されたイベントをそのまま全ての
Electron アプリをつくる時に便利なパッケージ - はやくプログラムになりたい
この記事は Electron アドベントカレンダー2016 の13日目の記事です． 本記事では，僕が Electron アプリをつくる上で便利だったり，ほしかったのでつくったりしたパッケージを7つほど紹介します． electron-about-window electron-dl electron-in-page-search electron-window-state menubar node-auto-launch electron-mocha electron-about-window electron-about-window は 'このアプリについて' ウィンドウを簡単にクロスプラットフォームにつくるためのパッケージです．下記のように関数を1つインポートして呼び出すだけで「このアプリについて」ウィンドウを生成することができます．（example） import openAbout
ElectronでのOAuth - Qiita
Electronからtwitter APIを叩こうとして少しハマったのでメモ. ElectronにおけるOAuthのログイン処理関連の話なので, 別にTwitterだけに限った話ではないはず。 ハマった内容 遭遇した問題としては, ElectronからTwitterのAPIを叩こうとしたのだけど, oauth_verifierが上手く取得できない, という内容だ. 最初, oauthのcallbackに 'file://' + __dirname + 'redirect.html'のようにファイルスキーマのURLを指定してみたのだけど, 下記のようにエラーが表示されてしまった. Not allowed to load local resource: file:///(中略)/redirect.html?oauth_token=...&oauth_verifier=... ログから, oau
Vue.js + ElectronでTwitterクライアントを作った - razokulover publog
Vue.jsとElectronでシンプルなTwitterクライアントを作った。 vue-twitter-client きっかけとしては一言で言うとフロントエンド周りの勉強。 2017年1~3月の振り返りにも書いた通り。 自分はモダンなフロントエンドの開発に疎かったので重い腰を上げてそろそろやるかという気持ちになって3月中頃くらいからはじめた。 Vue.jsについては2,3週間前くらいから触りはじめている。 Vue.jsはちゃんとしたSPAからフォームにちょいと味付けみたいな使い方もできたり小回りがきく。 個人的にはReactでの開発よりやりたいことが直感的に書ける気がしてるので使いやすいという印象。 とりあえず最初はTODOアプリやAPIを叩く小さなフィードを作って、次にNuxt.jsでSSRできるミニサイトを作ったりで大体使い方は覚えてきたというステータス。 ライブラリでいうとvuex,
Electron と React でPomodoro Timerアプリを作ってみる - Qiita
はじめに React.js, JSX, ElectronでPomodoro Technique（ポモドーロテクニック）を実践できるタイマーアプリを作ってみました。 https://github.com/massa142/pomodoro 作った理由 PHPカンファレンス2015でのKenji Akiyamaさんの発表資料を見て、「Electron面白そう！ちょっと試してみよ」となったためです。 Electronからクロスプラットフォーム・アプリケーションの歴史を考える ただ作りたいものがパッと思いつかなかったので、Akiyamaさんと同じPomodoro Technique用のタイマーアプリをReact.jsで作ってみることにしました。 Pomodoro Techniqueとは 1.達成しようとするタスクを選ぶ 2.キッチンタイマーで25分を設定する 3.タイマーが鳴るまでタスクに集中する
Electron, Reactでタブブラウザを作ってみた - Qiita
知人がesaのデスクトップクライアントを使わなくなった理由が、複数タブが開けなくて不便だったと聞いた。 確かに「Electronのアプリでも複数タブが使えるといいな」と思ったのでさくっと作ってみました。 作ったもの タブ周りの処理を中心に書いた。ブラウザというよりただのQiitaリーダ。 環境 MacOS X 10.10.4 Node.js v.4.1.1 electron v.0.34.3 準備 Electron環境の導入が必須。 30分で出来る、JavaScript (Electron) でデスクトップアプリを作って配布するまでがとても参考になります。 今回はReactをES6で書くのでbabel+webpack+gulpの設定を書いておきます。 gulpfile.js webpack.config.js npmで必要なパッケージをインストールし、gulpでビルド用のタスクを起動すると
Electron で Markdownプレゼン作成ツールを作って公開するまで - Qiita
Markdown でスライドを作るためのツールを漁っていたのですが、なかなか自分好みのものが無く、Electron の勉強を兼ねて作ってみた話です。 追記 (2018/12/10): その後の進捗はこちら Puppeteer & Carlo を Markdown スライド作成 CLI ツール (Marp CLI) で活用する - Qiita 成果物 今回作ったプレゼンツールは、以下にてプレリリース版を公開しています。 Marp - Markdown presentation writer https://yhatt.github.io/marp/ (旧称 mdSlide) 追記 (2016/07/13 19:42) ＿人人人人人人人人人人人人人人＿ ＞ 突然のGithubトレンド入り ＜ ￣Y^Y^Y^Y^Y^Y^Y^Y^Y^Y^Y^Y^Y￣ Markdown スライドツール比較表 私の欲
【Electron + react + flowtype】TweetDeckライクなpixivクライアントPixivDeckをつくった - Qiita
【Electron + react + flowtype】TweetDeckライクなpixivクライアントPixivDeckをつくったflowpixivReactElectronredux electron + react + flowtype + styled-components + webpackでpixivのデスクトップアプリを書いた。 前半にアプリについて、後半に技術的なことを書くので、どんな技術を使ったかのみ知りたい人は前半飛ばしてください。 GitHub - akameco/PixivDeck: TweetDeck like pixiv client for desktop ダウンロードページ スクリーンショット TweetDeckライクなpixivイラストビューア スクロール(IntersectionObserverで画像の遅延読み込み) カラムの移動(react-sort
Electron + Vue + flowtypeで最高の画像を収集するためのTwitterクライアントを作った - Qiita
Electron + Vue2 + Vuex + Flow + BootStrap4 + AWS RekognitionのスタックでTwitterクライアント書きました。 本アプリは【Electron + react + flowtype】TweetDeckライクなpixivクライアントPixivDeckをつくった - Qiita に思想・設計共に大きく影響を受けて作りました。本当にありがとうございます。 Github - yuki-ycino/imecoletter: 最高の画像を集めるためのTwitterクライアント 諸事情（というか実装の都合上AWSの請求が大変なことになるため）バイナリの配布はできません。 簡単にビルドできるようにはしてあるのでもし興味がある方がいれば使ってみてください。 スクリーンショット TwitterのTLから画像ツイートのみを表示 Twitterから画像ツイ
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
Photon
The fastest way to build beautiful Electron apps using simple HTML and CSS Powered by Electron Underneath it all is Electron. Originally built for GitHub's Atom text editor, Electron is the easiest way to build cross-platform desktop applications. If you can write a bit of HTML, CSS, and JS, you can build full featured applications. Companies like Microsoft, Facebook, and Slack are using it – why
Electronでメディアファイル用のファイルブラウザ「BlackAlbum」を作った - joker1007’s diary
Electronで動作する動画ファイル及びJPG in Zip向けのファイルブラウザを作ってみました。 構成としてはElectron+React+Reduxで、gulpfile以外はbabelを使って書いてます。 そこそこ今風な感じを目指して、一部flowtypeとかも取り入れてますが、割と適当な感じで使ってます。 実は以前Node.jsで同じもの作ってたんだけど、せっかくちゃんとデスクトップアプリとして作れるようになったしReactにも慣れたのでElectronと今の技術で作り直してみたのがこれです。名前も同じだったりする。 https://github.com/joker1007/blackalbum https://github.com/joker1007/blackalbum/releases/download/v0.2.0/BlackAlbum-darwin-x64-0.2.0.
Electronアプリをプロダクトとして「正しく」リリースするために必要な3つのこと | 株式会社ヌーラボ(Nulab inc.)
Typetalkデスクトップアプリ 先日、弊社チャットサービスTypetalkのデスクトップアプリをリリースしました。おそらくTypetalk.appのパッケージを覗いてElectronの痕跡を見つけ出した方もいらっしゃると思いますが、その通りElectronをベースに実装しています。 ElectronはHTML、JavaScript、CSSなどWebの技術を使用してデスクトップアプリを開発できます。GitHub社のAtomエディタをはじめとして、今では非常に多くのアプリがElectronベースで公開されており、実装方法についても既に多くの記事が書かれています。 ただし、正式にアプリを公開する場合には、コードサイニングなどを行うなど、考慮が必要なポイントがいくつかあります。そこで本記事では正式にElectronアプリをWindows/Mac向けにリリースするにあたって必要だった3つのことを
Photon - Electron開発者要注目のOS X風UIツールキット | ソフトアンテナ
元々GitHubのAtomエディタのために開発されたデスクトップアプリ作成用フレームワーク「Electron」。HTML/CSSといったWeb系技術を使って、クロスプラットフォームのデスクトップアプリを開発可能なため、多くの開発者の注目を集めています。 本日紹介する「Photon」は、このElectron用の便利なコンポーネントを多数収録したUIツールキットです(GitHub、Hacker News)。 ツールバー、タブ、ナビゲーション、リスト、ボタン、フォーム、テーブルといった、GUIアプリ作成に必要なさまざまなコンポーネントを、アプリケーションに素早く組み込むことができます。コンポーネントの見た目もOS X風でクールです。 以下ご紹介。 バー ヘッダーとフッターを組み込むことができます。 バーとアクション バーにボタンを設置してアクションを定義することもできまうｓ． バーとタブ タブを
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Deep dive into Electron’s main and renderer processes
Electron で Evernote クライアントを作った話について発表した - 暇人じゃない
Learn Web Frontend with Electron
