builderscon tokyo 2018『Electronによるアプリケーション開発事情2018』
Electronによるアプリケーション開発事情2018 / builderscon2018 - Speaker Deck
builderscon tokyo 2018『Electronによるアプリケーション開発事情2018』
ElectronでPC画面上にコメントが流せるデスクトップアプリを作ってみた - Qiita
はじめに PC画面上にコメントが流せるデスクトップアプリをElectronで作ってみました。 名前は、「wakaba」です。 コメントはTwitterから特定のキーワードを含むツイートを取得して流します。 イベントやライブコーディングの時に使うと面白いかもしれません。 コンポーネントの部分は、Reactではなく、Riotを使いました。 動作 PC画面上にコメントが流せるデスクトップアプリをElectronで作りました。 Twitterからツイートを取得して、コメントを流しています。 GitHub: https://t.co/v8OKRqf0It ダウンロード: https://t.co/ScVcy1HaLS pic.twitter.com/o6S3FBGZK3 — yuki540 (@eriri_jp) 2017年3月19日 使い方 ダウンロード ダウンロードしたものが動かない問題解決しま
Modern JavaScript概観、そしてElectronへ | さにあらず
この一か月分の学習成果を整理したリポジトリを作ったので、その成果についてまとめておく。 作ったサンプルプロジェクトだけを手軽に欲しければ、このリポジトリを clone してほしい。 taichi/js-boilerplate master ブランチには、ミニマムな JavaScript 開発環境がサンプルコード付きで入っている frontend ブランチには、React/Redux/webpackなウェブアプリケーション用の開発環境が入っている デフォルトブランチにしてある electron ブランチには、frontend ブランチの内容に加えてElectronでアプリケーションを開発するための環境が入っている はじめに 最近の JavaScript について 僕は仕事として JavaScript を書いている訳ではないけども、この半年くらいの間にちょっとしたツールならいくつか作った。
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
仕事中に閲覧できるTwitterクライアント「Worc」を作った - The future starts today
この記事は Electron Advent Calendar 2016 の9日目の記事です。 作ったもの github.com GitHubで公開しています。Releaseページから最新バージョンの「worc-darwin-x64.zip」というリンクからダウンロード可能です。 以下のランディングページからダウンロードできます。（追記：2017/2/17） shibe97.github.io ※未署名のため、ダウンロード後は「右クリック」→「開く」という手順で開く必要があります。 動機 Twitterは情報収集のツールとして非常に優秀だと思っていて、特にTech系の情報はTwitter経由が一番速くつかみやすいです。 界隈で強い方々はよくTwitter使って発信しているイメージがあります。 世の中には非常に多くのTwitterクライアントが存在しているのですが、個人的にしっくりくる物がない
Essential Electron : Electronの簡潔・平易な概要 | POSTD
Electronとは？ Electronは JavaScript、HTML、CSS を使ってデスクトップアプリケーションを作ることができる ライブラリ です。作ったアプリケーションはMac、Windows、Linuxで動かせます。 次は： なぜ重要？ 定義： JavaScript、HTML、CSS はWeb用の言語で、Webサイトの基本的な構成要素です。Chromeなどのブラウザは、コードをふだん目にするグラフィックに変えて表示します。 Electronはライブラリです Electronはコードですが、再利用でき、自分で書き起こす必要がありません。ユーザはその上にプロジェクトを構成します。 参考資料 Apps built on Electron Electron API Demos （Electronで何ができるかをみてください） なぜ重要？ 一般に、デスクトップアプリケーションは各オペレ
Evolution of Electron（日本語）
（このトークは @kohei-takata が通訳しました。） 皆さんこんにちは。今日、私は、どのように Electron が生まれ、有名になっていったかについて話したいと思います。 Kohei TAKATAさんにトークの内容を翻訳してもらったので、私は日本語でこのトークを行う（おこなう）ことができます。ありがとうございます。 はじめに、自己紹介をしたいと思います。私は3つの名前を持っています。中国では、 ちょうせい と呼ばれています。アメリカでは、 Cheng Zhao と呼ばれています。これは、英語表記の名前です。しかし、日本では私の名前は ジャオ チェン になります。これは英語名のカタカナ表記になります。このように、私は同じ意味の3つの名前を持っています。 私は Electron の作者（さくしゃ）です。今は GitHub で働いています。今も Electron の開発を続けています
Electronでwebfont変換ツールを作ってみた話 - Qiita
Electronさわってみました アイコンフォントを作り直す案件があり、位置調整やサイズ感の確認のたびにコマンド叩くのも、（リモートの）デザイナーさんとやりとりするのも大変だなということで、デザイナーさん向けの検証用のツールを作りました。 ゴール: GUIでSVGからwebfontに変換できるようにする github: svg2webfont に置いてます。 ツールとしては、ブラウザ上で使えるIcoMoon や fontello に近いものです。 もちろんこれで不便なければこちらを使えば良いのですが、 unicodeとアイコン名が対応しているjsonファイルが欲しい web上のサービスに依存するのが怖い（手元でやりたい） 一度作ってしまえばどのプロジェクトでも使いまわせそう Electronで何か作ってみたかった（重要） ということで、お試しでつくってみました。 Electronを使う利点
ElectronアプリのXSSでrm -fr /を実行する - Qiita
Electronアプリでxssを発生させると任意のコードが実行できるらしいのでrm -fr /を試してみます。 想定 web版とelectron版のあるチャットアプリケーションという設定です。攻撃者が用意したリンクをクリックすると、PC内のすべてのファイルを消し去るというシチュエーションを考えてみます。 用意 環境はホストmac OSX、ゲストにubuntu14.04環境をvagrantを利用し用意しました。 expressでリストとフォームからなる脆弱性のあるチャットをつくります。エスケープ処理をしてないので、任意のコードが実行できる状況です。 'use strict'; const path = require('path'); const express = require('express'); const app = express(); const ejs = require(
Welcome | Lektor Static Content Management System
A flexible and powerful static content management system for building complex and beautiful websites out of flat files — for people who do not want to make a compromise between a CMS and a static blog engine. Getting your ideas implemented is as easy as frying an egg. Full of Features Deploy Anywhere Because Lektor builds out 100% static HTML you can deploy them to any host (including S3, GitHub P
Electronでアプリを書く場合は、気合いと根性でXSSを発生させないようにしなければならない。 - 葉っぱ日記
そのうちもう少しきちんと書きますが、とりあえず時間がないので結論だけ書くと、タイトルが全てでElectronでアプリを書く場合は気合いと根性でXSSを発生させないようにしなければならない。 これまでWebアプリケーション上でXSSが存在したとしても、影響範囲はそのWebアプリケーションの中に留まるので、Webアプリケーションの提供側がそれを許容するのであればXSSの存在に目をつむることもできた。しかし、ElectronアプリでDOM-based XSSが一か所でも発生すると、(おそらく)確実に任意コード実行へとつながり、利用者のPCの(そのユーザー権限での)全機能が攻撃者によって利用できる。 そのため、Electronでアプリケーションを作成する開発者は気合いと根性でXSSを完全につぶさなければならない。 nodeIntegration:falseやContent-Security-Pol
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アプリをプロダクトとして「正しく」リリースするために必要な3つのこと | 株式会社ヌーラボ(Nulab inc.)
Typetalkデスクトップアプリ 先日、弊社チャットサービスTypetalkのデスクトップアプリをリリースしました。おそらくTypetalk.appのパッケージを覗いてElectronの痕跡を見つけ出した方もいらっしゃると思いますが、その通りElectronをベースに実装しています。 ElectronはHTML、JavaScript、CSSなどWebの技術を使用してデスクトップアプリを開発できます。GitHub社のAtomエディタをはじめとして、今では非常に多くのアプリがElectronベースで公開されており、実装方法についても既に多くの記事が書かれています。 ただし、正式にアプリを公開する場合には、コードサイニングなどを行うなど、考慮が必要なポイントがいくつかあります。そこで本記事では正式にElectronアプリをWindows/Mac向けにリリースするにあたって必要だった3つのことを
Electron の開発環境を gulp + babel で整える - Qiita
概要 Electronとは、JavaScriptでデスクトップアプリが作れるツールです。 詳しくは前回の記事「30分で出来る、JavaScript (Electron) でデスクトップアプリを作って配布するまで」をご覧くだい。 これまではElectronを使ったアプリ開発方法について書いてきました。 今回はコードをガリガリ書いていく前に、開発環境を整えたいと思います。 今回はElectronの開発を ES6 + React でしたいと思いました。 そのための開発環境を gulp + babel を使って整えていきます。 この辺りは他の記事をかなり参考にしました。既に同じようなことをやっている方がたくさんいらっしゃいますが、個人的なメモも兼ねてまとめます。 参考記事 ぼくのかんがえたさいきょうのElectron 何がしたいか まずは何がしたいか、というところから話します。 JavaScrip
Electronでデスクトップウィジェットを作るまで - Qiita
はじめに HTML/CSS/JSを使ってデスクトップアプリケーションが作成できるElectron。 本記事ではデスクトップウィジェット作成するまでの流れを、簡単な時計アプリを題材として解説します。 ※ この時計アプリのソースコードとパッケージは、GitHubにて公開しています。 GitHub: SallyAcolyte/tutorial_clock 対象読者 HTML/CSS/JSで簡単なアプリは作れるが、Electronは初心者な方 Electronで透過ウィンドウ/フレームレスウィンドウを扱う際のポイントが知りたい方 自分好みなデザイン/機能を持つウィジェットを作成したい方 ※ Windows環境を前提としていますが、基本的な流れは他環境でも同様です。 チュートリアル Electronの入手 Electronの本体は、以下からダウンロードできます。 Releases · atom/el
ぼくのかんがえたさいきょうのElectron - Qiita
はじめに ElectronはNode.js + HTML5フロントエンドのいいとこ取りな開発が行えるのが特徴です。その分、開発環境もElectronならではの考慮・工夫が必要になります. 今回のエントリでは, Electronアプリを快適に開発するための開発環境Tipsを書いていきます. そもそも「Elecronってなんぞや？」とか「どういう風にアプリを作るの？」という方については, 手前味噌で恐縮ではありますが, Electronでアプリケーションを作ってみよう を目を通すことをオススメします. また, 今回のエントリの元として、Quramy/electron-jsx-babel-boilerplate のレポジトリが出来上がっています. React + Bable + Sass + Livereload + Platform用Packaging 入りのBoilerplateですので,
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
DeNA Engineering - DeNAエンジニアのポータルサイト
[PDF] Electronの倒し方
30分で出来る、JavaScript (Electron) でデスクトップアプリを作って配布するまで - Qiita
GoでGitHub通知をデスクトップ通知として取得するアプリを書いた - Qiita
