Modern JavaScript概観、そしてElectronへ | さにあらず
この一か月分の学習成果を整理したリポジトリを作ったので、その成果についてまとめておく。 作ったサンプルプロジェクトだけを手軽に欲しければ、このリポジトリを clone してほしい。 taichi/js-boilerplatemaster ブランチには、ミニマムな JavaScript 開発環境がサンプルコード付きで入っているfrontend ブランチには、React/Redux/webpackなウェブアプリケーション用の開発環境が入っているデフォルトブランチにしてある electron ブランチには、frontend ブランチの内容に加えてElectronでアプリケーションを開発するための環境が入っているはじめに#最近の JavaScript について#僕は仕事として JavaScript を書いている訳ではないけども、この半年くらいの間にちょっとしたツールならいくつか作った。どちらも便利
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で何ができるかをみてください） なぜ重要？ 一般に、デスクトップアプリケーションは各オペレ
そのReactほんとに必要ですか？～もうすぐElectronで使えるようになるWeb Componentsの世界～ - SourceChord
この記事はelectronアドベントカレンダー 2016 21日目の記事です。 遅くなってしまい申し訳ありません。。。 ※アドベントカレンダーのリンクが間違っていたので修正しました・・・汗 前置き ↓去年はこんな記事を書いていました。 このCSS Grid Layout Module Level1ですが、少しずつ仕様の策定が進み、とうとう勧告候補の段階まできました。 CSS Grid Layout Module Level 1 CSS Grid Layout Module Level 1 （日本語訳） CanIUseを見ると、もうすぐFirefoxとChromeでの対応が行われるようです。 http://caniuse.com/#search=grid https://developer.mozilla.org/ja/Firefox/Releases/52 未来は意外と早く来るもんですね。
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プログラミング入門 — インストールからミニブラウザ構築まで
Electronプログラミング入門 — インストールからミニブラウザ構築まで 古川陽介 Electronとは、デスクトップクライアントを作るためのフレームワークです。クロスプラットフォームで動作することをサポートしているため、Electronで作ったアプリケーションはMac、Windows、Linuxの環境でも動作します。Atomと呼ばれる GitHub社製のエディタがあります。 ElectronはAtomを作る際にフレームワークとして作られました。以前はAtomShellと呼ばれていましたが、Electronとして名前を変更し、2016年にはversion 1.0がリリースされるまでに成長しました。 ElectronはJavaScript / HTML / CSSを使ってクライアントアプリケーションを作成します。中のアーキテクチャはChromiumとNode.jsで作られており、Web開
Webデザイナーの仕事が広がる！ElectronとReactでデスクトップアプリ開発
WebデザインとJavaScriptの技術があれば、デスクトップアプリも自在に作れる時代です。ElectronとReactを使って、SoundCloudの音楽を自由に再生できるデスクトップアプリを作ってみました。 本記事はMark Brown、Dan Prince、Bruno Motaが査読を担当しています。最高のコンテンツに仕上げるために尽力してくれたSitePointの査読担当者のみなさんに感謝します。 GitHubが開発したElectronは、Webデザインのスキルを存分に活用し、クロスプラットホームで軽快に動くデスクトップアプリを作成できます。この記事では、ElectronをReact、ES6、SoundCloud APIと組み合わせて、デスクトップでお気に入りの曲を流せるスタイリッシュな音楽ストリーミングアプリを作る方法を紹介します。また、この音楽ストリーミングアプリをパッケージ
旧・Macの手書き説明書 - FC2 BLOG パスワード認証
ブログ パスワード認証 閲覧するには管理人が設定した パスワードの入力が必要です。 管理人からのメッセージ https://mac-tegaki.comへ移転中 閲覧パスワード Copyright © since 1999 FC2 inc. All Rights Reserved.
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(
JVN#00324715: Electron における Node モジュール読み込みに関する問題
Electron には、Node モジュール読み込みのパスを適切に制限していない問題が存在します。その結果、任意の JavaScript を実行される可能性があります。 Electron は、HTML、CSS、JavaScript with Chromium や Node.js のようなウェブテクノロジを使ったクロスプラットフォームのデスクトップアプリケーションを開発するためのソフトウエアフレームワークです。Electron は、Atom エディタ、Microsoft Visual Studio Code などのアプリケーションで利用されています。Electron には、Node モジュールを読み込む際の検索パスに問題があります。この問題は、require 関数の処理を行う際、モジュールが存在するディレクトリの親ディレクトリをすべて検索パスに加えてしまうことに起因しています。攻撃者によって
Electronでアプリケーションを作ってみよう - Qiita
はじめに Electronをご存知でしょうか. Electron(旧称: Atom-Shell)は, Atomエディタを開発するために生まれたクロスプラットフォームデスクトップアプリケーションエンジンです. Node.js + Chromiumをランタイムとしており, Atomだけでなく, Slackや先日のBuildで発表されて話題となったVisualStudio CodeもElectronで実装されています. いわゆるWeb系の技術, Node.js + HTML + CSSでアプリケーションを作成できるのが特徴です. 類似した思想のフレームワークとして, node-webkit(NW.js)もありますが, アプリケーションのエントリポイントの考え方等が異なります. このエントリでは, Electronの使い方をサンプルアプリを実装しながら説明していきます. お題 このエントリのお題と
Electron + React + Redux - KAYAC Engineers' Blog
JSで書くデスクトップアプリが熱い Electron 熱いです。 Atom を始め、Qiita の Kobito や Slack など、 十分に実用できるアプリケーションが登場しはじめています。 なにかと話題のRPGツクールMVは、NW.js（旧node-webkit）ですが、これもJSで書かれていますね。 NW.js は、その他、女の子といちゃこらする系のゲームでも使われています。 JS でデスクトップアプリを書いて、うん千万売り上げるのも、もはや絵空事ではありません。 今回は、Electron と Redux、React の組み合わせで、 デスクトップアプリを作るまでの、簡単なチュートリアルを書きます。 登場人物紹介 Electron Github が開発してる、JS でデスクトップアプリが書けるすごいやつ NW.js より活発そうですごい React Facebook 製のすごいやつ
Electronアプリをプロダクトとして「正しく」リリースするために必要な3つのこと | 株式会社ヌーラボ(Nulab inc.)
Typetalkデスクトップアプリ 先日、弊社チャットサービスTypetalkのデスクトップアプリをリリースしました。おそらくTypetalk.appのパッケージを覗いてElectronの痕跡を見つけ出した方もいらっしゃると思いますが、その通りElectronをベースに実装しています。 ElectronはHTML、JavaScript、CSSなどWebの技術を使用してデスクトップアプリを開発できます。GitHub社のAtomエディタをはじめとして、今では非常に多くのアプリがElectronベースで公開されており、実装方法についても既に多くの記事が書かれています。 ただし、正式にアプリを公開する場合には、コードサイニングなどを行うなど、考慮が必要なポイントがいくつかあります。そこで本記事では正式にElectronアプリをWindows/Mac向けにリリースするにあたって必要だった3つのことを
Electron入門サイト〜開発経験者が解説する導入手順と魅力 - ICS MEDIA
Electron (エレクトロン)はウェブの技術でデスクトップアプリケーションを開発できる人気のフレームワーク。HTML5とCSS3とJavaScriptで開発できるため、ウェブ開発者であれば手軽に導入できます。それもクロスプラットフォームなので、ワンソースでWindowsとmacOS向けのソフトウェアが作れることが利点です。 GitHub社の「Atom」やMicrosoft社の「Visual Studio Code」もこのElectronを使って開発されているなど、大手企業が採用していることでも人気の高さがうかがえます。この入門サイトでは、開発環境のセットアップからサンプル・アプリケーションの作り方を解説します。 Electron入門編 最新版で学ぶElectron入門 - ウェブ技術でPCアプリを開発しよう Electronの導入手順を解説。ゼロからアプリケーションのビルドまでの手順を
Electronを使ってJavaScriptでデスクトップアプリを作る
はじめに こんにちは。デスクトップアプリケーションを手軽に作りたいと思ったことはないでしょうか？ 普段Webアプリケーションを開発している場合、 デスクトップアプリケーションを作ろうとすると、開発言語やライブラリがWebアプリケーションとは違うので、別な知識が必要になるのと複数のプラットフォームで動くものを作ろうとすると大変ですね。 そこで、今回はWebアプリケーションのKPTBoardのJavaScriptとCSSのコードを一部流用と修正して、Electronで動かしてみました。 Webアプリケーション版のKPTBoardと違う点 今回はWebアプリのデスクトップクライアントアプリではなくて、単体で動くデスクトップアプリとして作ってます。 複数人には対応してないです。 投稿した内容は、データーベースではなくてアプリのlocalStorageに保存されます。 Electronとは http
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.
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
GitHub、HTML5/CSS/JavaScriptによるアプリ開発フレームワーク「Electron 1.0」 
Build cross-platform desktop apps with JavaScript, HTML, and CSS | Electron
DeNA Engineering - DeNAエンジニアのポータルサイト
Learn Web Frontend with Electron